My Portfolio
React:
MSH
NED - Sharp Power Portal
Spotify Clone
Expense Tracker - MERN Stack
Todo App
Todo App Using Context
Process-Improvement Projects:
Component Library
Dev Breakdown
Writer Time Reports
Wordpress Projects:
Customizable Theme Build
West Shore Homes
Newpro
Castle Windows
Byers
Chesmar
Windstar
Grayhawk
Intrex Aerospace
Hattricks
Queenfleet
Galaxy
KH Windows
Fulfilltopia
Durante
Southern Painting
Bathwraps Jacuzzi
PK Construction
Colorado Living
Bee Window
Rite Window
Driven Fit
Center For Cyber Safety
Captain Kidd
MSH
Technologies Used:
- React
- JSX
- ES6 JavaScript
- SCSS
- PHP
Noteworthy Elements:
- WordPress gutenberg admin blocks were built in React and JSX. This makes the admin experience seamless and superior to other WordPress experiences
- The resource library on the site is searchable and filterable using ajax
Website: msh.org
NED - The Sharp Power Research Portal
The National Endowment for Democracy was founded by Ronald Reagan. It's a private foundation that works to strengthen democratic institutions world wide.
Technologies Used:
- React
- JSX
- ES6 JavaScript
- SCSS
- PHP
Noteworthy Elements:
- WordPress gutenberg admin blocks were built in React and JSX. This makes the admin experience seamless and superior to other WordPress experiences
- Custom map was built on the homepage using the JavaScript library: amCharts. Custom geojson was used as well as custom JavaScript to feed WordPress data into the map dynamically. The map had many complexities from the data relationship of countries to each other to the custom UI overtop of the library.
- The resource library has search capability as well as filtering capability using ajax.
Website: sharppower.org
Spotify Clone
Technologies Used:
- React
- React Context
- React Component: react-spotify-api
- React Component: react-spotify-web-playback
- React Component Library: material-ui
- ES6
- HTML
- CSS
Noteworthy Elements:
- Login using Spotify authentication API to retrieve token
- Display of current user's Discover weekly playlist and other playlists
- Display of all songs within your playlists
- Song row is clickable to have it start playing
- Ability to select playback device
Expense Tracker - MERN Stack
Technologies Used:
- React
- React Context
- React Component: axios
- Mongoose
- Express
- Node
- ES6
- HTML
- CSS
Component Library
View Full Page
Technologies Used:
- Bitbucket API
- mixitup.js used for filtering
- Wordpress CMS
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Bootstrap
Project Duties:
- App: Searchable and filterable library of snippets and componenets from Bitbucket to Wordpress.
- This project was built outside of work hours in an attempt to enhance my coding skills while improving our development process. I saw that the development team was having to recreate similar code structures from scratch each time. This would allow the user to download a skeleton version that they can start from for different components such as galleries. This was also built out of necessity for better snippet searching. Bitbucket doesn't allow tagging of snippets or even searching them. This project has already saved the company 20+ hours and will continue to save time.
Noteworthy Elements:
- I created 3 buttons to run a code import (CURL Request). One for just pulling snippets, one for components and one for both. When the component button is pressed, the PHP will grab the Bitbucket API data for all repos inside the components project. For each project, it checks if a Wordpress page already exists for that repo. If no page exists then it creates a new page and fills out ACF data with the Bitbucket URL, Author, Date Added, and other info. The function also searches any images that have "screenshot" in the file name and download them temporarily and add them into ACF fields for display on the front end.
- A sorting feature was built that allows you to filter projects by Title Asc/Desc, Date Asc/Desc, and Most Liked.
- The filter on the sidebar is an extension of the mixitup.js functionality. As you check boxes or search, those values are added to the URL as parameters so you can send a link to someone with filters already set automatically.
- The code creates two separate Wordpress Custom Post Types: Components and Snippets.
- Each tile has the ability to have a slider of images in it.
- Each individual page when you click on a tile will have a zoomable fancybox gallery for the images. The page also has all associated tags, categories, and a link to view Bitbucket.
Dev Breakdown
View Full Page
Technologies Used:
- Teamwork API
- PHP
- Javascript
- jQuery
- CSS
Project Duties:
- App: Calculate project timeline and total hours by splitting it into sections.
- This project was built outside of work hours in an attempt to enhance my coding skills while improving our development process. The development manager would ask us to breakdown a project into sections and give an estimate on the project timeline. I noticed that this was difficult to do sometimes with excel so I decided to create this project.
Noteworthy Elements:
- The app first pulls in all of the available Teamwork projects in a dropdown. Once a project is selected, it will show a list of developers to choose from. Once started, the app will import all of the current tasks assigned to the developer on this project. The user then has the ability to add hour estimates to existing tasks and to also add new tasks to the project.
- Update Daily Time dropdown allows you to enter the average number of hours you expect to work on this project for each day of the week.
- Total Estimated time adds together all of the time estimates associated with the project.
- Estimated Delivery Date is calculated by taking the total estimated time and average time per day entered to set the exact date you would be able to complete the poject. This calculation also takes into consideration business days as well as hollidays.
- Once submited, the app will send a list of your tasks and estimates to the development manager and yourself. The task list is then posted to the Teamwork API to update the project with your new tasks and estimates.
Writing Reports
View Full Page
Technologies Used:
- Teamwork API
- dataTables.min.js
- PHP
- Javascript
- jQuery
- CSS
- Bootstrap
Project Duties:
- Create a dashboard for the writing manager to be able to view time tracked in different views. Pull the data from Teamwork to be able to show the time tracked in a way that's not possible in Teamwork.
Noteworthy Elements:
- Using the Teamwork API to pull in the data and then parsing and editing this data with Javascript.
- DataTable.js was extended to be able to add sub-tables. This functionality is not baked into the library.
- Data filterable by date fields at the top of the page. The data is also searchable.
- Custom export option added that uses papaparse.js to create csv files from data.
Customizable Theme Build
Theme name has been edited to prevent conflict.
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Geolocation
- Wordpress CMS
- Bootstrap
- Cookies
- ACF FLexible Content
- mmenu
- mask.js used to format phone, email, and zip form fields
- Custom Salesforce CRM Integration
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Create a reusable custom Wordpress theme that is fully flexible. This theme will need to be able to update through the admin.
- Work with one other developer on the project.
Noteworthy Elements:
- Admin is able to save sets of flexible content data as reusable templates/layouts.
- Each module within a layout has the ability to be custom or to default to the global data for that module.
- Each module is built to be flexible. If the client only has 50 trust logos vs 0 trust logos, it can handle it.
- Each module has different designs. There are 6 different hero designs to select from.
- Colors can be changed through the admin.
- HTML form shortcodes are generated by an ACF repeater in the admin.
West Shore
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Geolocation
- Wordpress CMS
- Bootstrap
- Cookies
- ACF FLexible Content
- mmenu
- mask.js used to format phone, email, and zip form fields
- Custom Salesforce CRM Integration
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js & swiper.js
Project Duties:
- Create a custom modular system using ACF flexible content field. This was done by housing all reusable modules in an options page and then giving the admin ability to pull the module data using the current page's product type, select an existing module, or create custom module content. Bake in ability to select a module and then choose for it to be a dark or light theme.
- Work with 2 other developers to create the individual modules and style them using SCSS.
- Geolocation based on IP lookup using https://ipinfo.io/ API. Diplay location information closest to user by measuring distance bettween user lat/long and each of the locations lat/long using haversine formula which takes into account the curvature of the earth.
- Use Webflow mockup to build site, converting to SCSS and mobile-first while building.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Geolocation based on IP lookup using https://ipinfo.io/ API. Diplay location information closest to user by measuring distance bettween user lat/long and each of the locations lat/long using haversine formula which takes into account the curvature of the earth.
- Locations sideways scrolling accordion that switches to a vertical accordion on mobile. This section uses slick slider, bootstrap accordion, and custom Javascript. This section is also geolocated.
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function. Images/Videos are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox and then displays the offer that matches the image (example: Window image opens form with Windows offer text).
- The forms on this site are custom HTML that is connected to Wufoo. The forms also have a custom webhook that send form submissions to Salesforce CRM.
Website: westshorehome.com
Newpro
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- Google Maps API
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Custom Improveit 360 CRM Integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch with 1 other developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Webflow mockup to build site, converting to SCSS and mobile-first while building.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Dynamic project map using Google API key. Include slider to be able to view media and content specific to each marker while controling which marker is active.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox and then displays the offer that matches the image (example: Window image opens form with Windows offer text).
- The forms on this site are custom HTML that is connected to Wufoo. The forms also send to a custom webhook that sends the lead info to Improveit 360 CRM.
- Before/After slider using twentytwenty.js inside fancybox lightbox. Can be seeon on Bathroom page.
- Custom swatch section which works as tabs on desktop and slider on mobile. Can be seeon on Bathroom page.
Website: newpro.com
Castle Windows
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site using SCSS and mobile-first development.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Hero with auto-play video that fades to image on video end by dynamically getting the length of the total video and fading it out seconds before it ends.
- Animated ink reveal of first image and last image on homepage using techniques here: https://codyhouse.co/gem/ink-transition-effect.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox and then displays the offer that matches the image (example: Window image opens form with Windows offer text).
- The forms on this site are custom HTML that is connected to Wufoo.
Website: ftwaynewindows.com
Byers
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site using SCSS and mobile-first development.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Website logos and colors change based on product-type that can be assigned to each page in the admin.
- Custom header transitions to sticky form using css transitions.
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: thatsbyers.com
Chesmar
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- Ajax
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
Project Duties:
- Jump into project to help multiple developers finish project.
- Code customer portal portion of the site.
- Code like/heart button functionality that is shown in the vue.js home search.
- Code ability to save home-buying checklist to user profile.
Noteworthy Elements:
- Login Form: Create login form that is displayed in a lightbox and creates a seamless transition once user is logged in where lightbox closes and page doesn't reload. Custom login form that uses Ajax to check if user if they enter correct cridentials. Allow user to login or register from the popup. A plugin was used for the actual registration form.
- User Portal: Create custom user profile page with favorited homes and Home-Buyers Checklist. Use WishList Member plugin for user emails and page restrictions.
- Like/Heart Button: Force user to be logged in to like houses by showing lightbox. Save the house that was clicked with cookies to add to users profile if/when they are logged in successfully. Data is saved to custom ACF fields in user admin section.
- Home-Buying Checklist: Force user to be logged in to fill out section by showing lightbox. Save the user checklist that was submited with cookies to add to users profile if/when they are logged in successfully. Data is saved to custom ACF fields in user admin section.
Website: chesmar.com
Windstar
Technologies Used:
- PHP
- Javascript
- jQuery
- CSS
- Wordpress CMS
- Bootstrap
- ACF
Project Duties:
- Build onto project that previous developer built (Ended up rebuilding most of the site).
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
Noteworthy Elements:
- Magazine showcase slider that lets you flip the pages in the browser.
- Client wanted no scrolling on this site which made for a tricky build. Everything was based off of vh to fit to each screen size. Arrows were added for moving from section to section.
- Beautiful transitions from section to section with text slowly fading in to create a luxurious feel.
Note: Website has been redesign/rebuilt since launch.
Grayhawk
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Custom fixed sidebar navigation with slideout menus for quote and contact info.
- Large text that scrolls across the screen as you scroll.
- Dynamic product-specific section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: grayhawkremodeling.com
Intrex Aerospace
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Help another developer finish project by completing sections of the site.
- Make entire site editable though Wordpress admin with ACF.
- Use Webflow mockup to build site, converting to SCSS and mobile-first while building.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- I created the text animation effect in the hero.
- 3 Tile section that focuses on hover. This turns into a slider on smaller screen sizes.
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: intrexcorp.com
Hattricks
Project Duties:
- Take over development from previous developer and finish project.
- Implement client revisions in a timely manner.
- Implement Facebook and Twitter feeds on the homepage.
Noteworthy Elements:
- Section-based website that guides the user from section to section.
- 2 Bootstrap sliders integrated with Wordpress custom post types for ease of editing by the client.
- Homepage images and content all made editable though Advanced Custom Fields integration.
Queenfleet
View Full Page
Project Duties:
- Develop pixel perfect Wordpress theme based on an in-house design.
- Create internal page design based on homepage design.
- Copy page content and SEO from previous site and implement with internal page design.
Noteworthy Elements:
- Conceptualization and implementation of sea floor video on internal pages.
- “Snap to screen” homepage with fullpage.js library
Website: queenfleet.com
Galaxy Fireworks
Project Duties:
- Create Wordpress website from the custom design
- Create Product Catalog using the Woocommerce Plugin
- Implement a countdown clock to holiday events
Noteworthy Elements:
- Store Locations - Addition and stylig of an interactive map using this plugin
- Homepage Slider - Addition and integration of a custom post type for the slides including custom fields for slide content. Autoplaying background video on slider.
- Gif Product Representation - Integrated with woocommerce a firework gif displayed when the user hovers over product with magnifying glass.
- Ajax Loading - The product catalog has an ajax loader instead of pagination to allow for optimal user experience.
- Mobile Menu - Advanced design and implementation of an app-like mobile menu
KH Windows
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Develop a system where user will see different homepage hero image depending on how many pages of a product type they've visited. (This has since been edited/removed)
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items.
- Complete client edits.
Noteworthy Elements:
- Header navigation that transforms to form sticky using css transitions.
- /windows page has custom tab animation with orange circle moving to active tab using Javascript.
- Dynamic product-specific section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox.
- The forms on this site are custom HTML that is connected to Wufoo.
Note: Sections have been added/modified since launch by another developer.
Website: khwindows.com
Fulfilltopia
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Fade-animations as user scrolls down the page.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: fulfilltopia.com
Durante
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Circle slider for current ofers. Middle slide expands as well as the image inside giving a nice transition. Uses CSS transitions.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. The gallery uses slick slider and its filter functionality.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: durantewindows.com
Southern Painting
View Full Page
Technologies Used:
- Wordpress Multisite
- Geolocation using IP-targeting
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress multisite from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Webflow mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- This site uses multisite Wordpress functionality so that each location is a sub-site.
- Custom geolocation functionality that uses IP-targeting to find the closest location. This functionality is used in the ZIP Code search as well as the forms. When a user submits a form, their Zip Code is used to find the closest location and send to their owners email.
- Custom Google Map at the bottom of the page that uses cluster functionality. The map pins link to each sub-site in the multisite.
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: southernpainting.com
Bathwraps Jacuzzi
View Full Page
Technologies Used:
- Lead Perfection CRM Integration
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a website that uses ACF Flexible Content and will have a global default layout.
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- URL parameters that check agains ACF repeater to show specific phone numbers for different marketing sources.
- Internal pages that can be created as landing pages. Custom PHP that creates an additional thank you page automatically for every page created and then displays a notification in the admin.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox.
- The forms on this site are custom HTML that is connected to Wufoo. The forms also have a custom webhook that sends data to their Lead Perfection CRM.
Website: jacuzzibathremodelpromo.com
PK Construction
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Webflow mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: pkwindowstx.com
Colorado Living
View Full Page
Technologies Used:
- Google Places API
- Google Maps API
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch with 1 other developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Webflow mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Zip code field in forms will check Wordpress data to see if zip code is in an area served.
- Address field uses Google Places API to display auto-completed addresses.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: getcoloradoliving.com
Bee Window
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch as sole developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- Custom gallery using ACF for the data. Elements include bootstrap tabs and lightbox using fancybox. Custom Javascript inserts a form into the fancybox lightbox.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: beewindow.com
Rite Window
View Full Page
Technologies Used:
- Bitbucket
- PHP
- Javascript
- jQuery
- SCSS
- Gulp
- Browsersync
- Wordpress CMS
- Bootstrap
- Cookies
- ACF
- mmenu
- mask.js used to format phone, email, and zip form fields
- Wufoo form integration
- Lazyloaded images using lazysizes.js
- Sliders using slick.js
Project Duties:
- Build a Wordpress website from scratch with 1 other developer.
- Make entire site editable though Wordpress admin with ACF.
- Move old content from original site to the new site and format this content.
- Use Photoshop mockup to build site.
- Complete QA items using BugHerd tool.
- Complete client edits.
Noteworthy Elements:
- Personalization: When you go to a service page like Windows and go back to the homepage, a Windows image and offer will be shown in the hero. This is based off cookies and will be remembered next time a user visits the site.
- Dynamic product-specific offers and section content. Product Type ACF select field that is used to categorize each page. This field is then used to change the content for the user to be specific to the product type (Example: Windows pages should have the gallery with Windows tab highlighted).
- Every element is editable in the admin through ACF. Buttons are all created by a clonable ACF group and a reusable custom PHP function.
- The forms on this site are custom HTML that is connected to Wufoo.
Website: ritewindow.com
Driven Fit
Project Duties:
- Take over development from previous developer and finish project.
- Integrate with Typeform contact forms on the website.
- Integrate with Mindbody and Healcode booking system.
- Integrate with Constant Contact.
- Implement testimonial slider on homepage.
- Develop and implement tab system for specified page templates.
- Creation of blog that integrates with social platforms.
Noteworthy Elements:
- Tabbed page templates like (Corporate Wellness) are technically tabs within tabs. Implemented with Advanced Custom Fields repeater fields.
- Multiple locations with different map icons and information using Google Maps API.
- Blog built and integrated to post to Wordpress and then to Facebook, Twitter, and Instagram.
Note: This site has since been redesigned/rebuilt
Center for Cyber Safety
Project Duties:
- Build a website using client’s existing content and branding using the Wordpress theme DIVI.
- Implement a blog/news page and a blog feed section on the homepage.
- Implement a Twitter feed on the homepage
Noteworthy Elements:
- Partners Section: Custom Post Type created for partner groups with an Advanced Custom Fields repeater field. Section defaults to a default partner group for ease of use. Section also has an option to add content through a WYSIWYG editor instead of partners like on the Partner page.
Note: This site has since been edited since launch by other developers.
Website: www.iamcybersafe.org/s/
Captain Kidds Fishing Charters
Project Duties:
- Convert static HTML site to a Wordpress theme.
- Convert unresponsive site to a fully responsive site.
Noteworthy Elements:
- Conceptualized and developed fishing hook mobile menu.
Epibolics
Project Duties:
- Optimize site User Experience including redesigning homepage.
- Create a membership system for multiple tiers of membership to access membership pages.
- Create a forum for members using bbpress.
- Create an area for higher paying members to receive access to message and send files to the client’s health professionals.
- Create an area of the website for members to view webinars posted with Youtube and Google Hangouts.
- Create a multistep form for users to create and update a membership profile.
Noteworthy Elements:
- Membership System: Membership levels created as Woocommerce products with the Woocommerce Subscriptions Add-On. The Add-On was currently being used on site for subscriptions for supplements. Buying a membership subscription simultaneously creates a membership profile and assigns a user role. Option to restrict page access added to admin using Metaboxes.
- Membership Profiles: New profile fields manually added to user profiles using functions.php. Custom forms for User Login, Update User Profile, and Register User created for membership profile information.
- Solution created for interaction between users and the health professionals using WP Support System.
Justin Roy
< Full-Stack Developer >
A solution-driven and detail-oriented web developer with over seven years of experience in website development. Advanced experience developing consumer-focused websites with an equal importance on front-end and back-end technologies. A self-sufficient employee who also knows the importance of teamwork and the power of reaching out to more experienced colleagues. Forward-thinking & willing to transfer knowledge as needed to contribute to the strength of the team.
Phone: (813) 362-4478
Email: justinroy813@gmail.com
Resume Github