A mix of stuff past and present.
Developed in Wordpress: ACF Pro, Tailwind CSS, lightSlider, PHP, HTML, custom post types, custom page templates. Features overlapping boxes achieved with CSS Transforms, Flexbox, and Grid. Fully editable by the client using the Wordpress Block Editor.
Development
Developed this design library which features multiple page designs. Stylesheet built using vanilla CSS, Tailwind CSS, and PostCSS. Features use of CSS Grid and CSS Animations & Transitions, scroll events (e.g., numbers counting up on scroll), use of the Intersection Observer API (e.g., image lazy loading, "slide-in" effects on scroll), and a masonry grid generated with Javascript. Uses CountUp.js, lightSlider, and lightGallery. Built in Wordpress; templates developed using HTML, TailwindCSS, PHP, and the Advanced Custom Fields plugin.
A business technology age calculator. The user estimates their business age in different categories using 7 inputs. Average business age is then updated on-the-fly and features a count-up animation (CountUp.js). Javascript, jQuery and CSS also used for some other animations. User can receive an e-mail with their business technology age results and a link to their results. Also allows user to share their results with others. Both e-mail templates developed using MJML. Form built using the Gravity Forms plugin.
Developed multiple reusable components, including animated image download buttons, color palette cards, image galleries (using lightGallery), image sliders and gallery sliders (using lightSlider), image download grids, headshot gallery, and more. Use of CSS Grid, CSS Animations, scroll effects. Allows anyone in the company to download useful graphics, get brand color information, etc.
Lead developer - Created over 15 custom page templates with custom posts, queries, multiple site searches, custom components, and blog layout—all with enhanced user-friendliness to allow non-developers to maintain site content and future design. Cross-functional web design with input from copy writers, account managers, designers, stakeholders, and project managers.
Lead developer on this 100+ page Wordpress site. Created a component/template library using Advanced Custom Fields Blocks and Tailwind CSS, which allows anybody on the team to create pages using the block editor in Wordpress. Responsible for regular maintenance and updates.
Lead developer on this 50+ page Wordpress site. Created reusable ACF Blocks for the customer's product pages, added multiple slider styles (Slick Slider), resources page, and gallery (lightGallery), all of which are fully editable and configurable by the client, who is a non-developer.
Built out this Wordpress theme and the home page and subpage templates. Given the reusable nature of the Blocks in the Blocks editor, the site was able to be completed by others on the team, who were able to build the remaining pages fully in the Wordpress Block editor.
These e-mails were made for a client with an e-commerce site running on the Pinnacle Cart CMS. They wanted an update to the standard Pinnacle Cart e-mail templates (e.g., password change e-mails, order shipped alerts, etc.) The e-mails were developed using MJML, and I integrated the HTML with Pinnacle Cart's proprietary code to ensure they pull in the appropriate data when orders are submitted, shipped, etc.
A Wordpress theme that I built in my free time to improve my skills and get more accustomed to the platform. Features use of page templates, CSS Animations, form validation using the jQuery Validation plugin, a cookie banner, and a custom CSS modal. Also uses Advanced Custom Fields.
This is my previous website, a static site not built on Wordpress It features use of CSS Animations, CSS Grid, different CSS tricks, and some presentational Javascript. The contact form was developed using PHP Mailer.
Development / Design
A Wordpress theme that I started working on, but never finished. It's just a home page for now. Features some interesting hover effects and an interesting mobile nav. Mostly, this small project provided me a chance to test out using Advanced Custom Fields Blocks in the Wordpress Block editor.
A wedding website project that I made for friends who were getting married. It's a single-page site with some CSS Animations, fade-in effects on scroll, and scroll-to-link effects. The RSVP form was made with PHP Mailer and includes form validation. Also includes a countdown timer.
An early project I made to work on my Javascript and CSS skills. Features 3 different bells, a delay timer, and an interval timer. You can set the time using the arrows. It also features 3 different stylesheets, one of which loads randomly each time you visit or refresh the page.
This is a recreation of the Simon game using HTML, CSS, & Javascript. Goes up to 20 turns, has an on/off button, strict mode, and displays how many rounds you've gone through.
A Javascript calculator that performs basic arithmetic calculations. Also has AC (All Clear) and CE (Cancel Entry) buttons. Uses CSS Grid to lay out the buttons.
Makes two API calls, one to get the user location, and then another to a weather API to get the weather for that location. The data is then processed with Javascript and the appropriate elements are updated on the front-end. Features today's weather, 5-day forecast, Fahrenheit to Celsius conversion, and some CSS animations. Also has variable styling depending on weather type and time of day.
On each button click, makes a call to a random quote API and updates the front-end. Each time the quote is updated, the color palette is randomly changed to one of a few different options. Also allows you to post the quote to Twitter.
Choose to play as X or O against the computer. You should only be able to draw or lose.
Makes a call to the MediaWiki Web API and returns the first 10 results. Also allows you to view a random article.
Pomodoro timer that allows you to customize the pomodoro time and the break time. Has a bell that sounds at the end of a pomodoro or break. Time passing is also animated inside the tomato.
Includes some simulated data from a Twitch API call and lists out the users from the data set. You can sort by "All", "Online", and "Offline". You can also search using the search bar.
