Projects

Here you can view my completed web development projects.

(WordPress, Divi)

View Site

Performed modification of Vue.js modules used in WordPress for environmental compliance website.

Also constructed pages from mockups using the Divi page builder. 

(ReactJS, Tailwind, NextJS)

View Project

View on GitHub

Investment calculator which allows user to calculate how much a monthly investment will grow to after a number of years.

For example, user can choose to invest $100 over a 10-year period at 10% interest, and see what that amount will have grown to at 65. 

I enjoyed setting up the equations and graphs for this project. I started by working out the numbers in Excel, and then figuring out how to translate the equations to JavaScript. 📊

(HubSpot CMS)

View Site

Video Summary

Landing page developed using HubSpot CMS. A fun part of this project was developing custom modules within the HubSpot software. The HubSpot CMS allows the developer to generate modules where content can then later be added to a CMS by an admin, and that way items can be updated individually. 

This gives an effect of the CMS working like a page builder, but with the ability to easily create and add custom coded elements. 

(WooCommerce)

View Site

WooCommerce site selling preserved butterflies and insects. 

One cool project I worked on for this site was using a user ID and PHP sessions to automatically insert the address of the creator of a wish list into the buyer’s address fields. 

The client requested this feature to make it possible for the wishlist creator to share their list. This would then make it possible for the buyer to purchase the list and easily fill in the address of the wishlist creator for direct shipping.

 

(WordPress, Elementor)

View Site

Clothing brand site selling sportswear specific to different USA states and college sports teams. 

(WordPress, PHP)

View Site

WooCommerce dispensary website heavily utilizing custom PHP templates and custom PHP functionality. 

One of my favorite parts of creating this site was programming the filtering functionality for the products. We had certain products organized in multi-tier categories using custom post types, and since WP provides only single-tier filtering, I was tasked with programming a filter for multiple tiers. 

View video describing filter functionality

(ReactJS, NPM, JSON-Server)

View Site

View Video Walkthrough

Blog app created using React and “json-server” from NPM. A fun part of this project was getting the json-server to connect and display the posts properly. 

(WordPress, Elementor)

View Site

View Video Walkthrough of Table of Contents Functionality

This was a website blog template build for a site seeing 3.3k visitors/month of user traffic. I imported around 100 blog posts from an origin site, and created a template with Elementor to display the posts on the target site. 

I also devised a way to code a Table of Contents for the blog posts by using the Elementor HTML module. 

(WordPress, Elementor)

View Site

Redone blog page and fixed to portfolio pages of site, including other updates. Changes to footer and buttons styling. 

(ReactJS)

View Site

Added some functionalities to Alkali Designs using ReactJS. Made use of object structures to access data easily. 

(ReactJS, Sanity)

View Project Showcase

View Video Walkthrough

View Live Site

Ground-up rebuild of 50+ page WordPress website using ReactJS and Sanity as a headless CMS. I really enjoyed writing most of the core functionality of this project in React: Routing the data, building templates, and setting up forms and payment methods from scratch.

(WordPress, Divi)

View Site

Fixed broken navigation issues and updated styling for WordPress / Divi site for portrait photography.

(WordPress, PHP)

View Site

WooCommerce dispensary website heavily utilizing custom PHP templates and custom PHP functionality. Original site that Craft Connect (other project in this portfolio) was based on.

One of my favorite parts of creating this site was programming the filtering functionality for the products. We had certain products organized in multi-tier categories using custom post types, and since WP provides only single-tier filtering, I was tasked with programming a filter for multiple tiers. 

View video describing filter functionality

(WordPress, Divi)

View Site

Page construction for packaging blog site using Divi. 

Quick Video Showing Homepage

(WordPress, Divi)

View Site

Page construction for rental property regulation compliance service website using Divi. 

(WordPress)

View Walkthrough Video

Google Maps API integration to fetch user location on WordPress checkout page.

(WordPress, Divi)

View Site

WordPress / Divi site construction. Animations done using jQuery and Divi animations.

(WordPress, WPBakery)

View Site

Page updates and redesigns done via WPBakery. 

(WordPress, jQuery)

View Video Explanation

Used jQuery to make certain days unselectable in a jQuery calendar module. Couldn’t get days to grey out according to standard method, so used a method that already existed in code to remove times from other days.

Selecting certain days just removes all dropdown options for “Pickup Time”, and replaces them with “Closed”.

(WordPress, PHP)

View Site

View Video Walkthrough

Website selling sports clothing. Developed with custom PHP templates for WordPress, and multi-tier product categories. 

(WordPress, Divi)

View Site

Fixed faulty image loading for this website. 

(WordPress)

View Site

Fixes to homepage and navigation bar for this website. Navigation links were not working correctly. 

Going in to WordPress theme builder settings was able to figure out that this needed to be resolved by using id’s in a unique way for this particular builder, along with sections set up via WP posts. 

(WordPress)

View Site

New features added and issues updated with membership plugin for hospice education site.

(WordPress, Divi)

View Site

WordPress / Divi site for scholarship applications for special education opportunities for K-12 students.

(WordPress, PHP, Advanced Custom Fields, Custom Post Types)

Video explaining project

View Site

Custom feature allowing Dokan vendors on WooCommerce to set their stores’ opening/closing times.

(WordPress, PHP, Advanced Custom Fields, Custom Post Types)

View Site

Designed and created a custom calendar functionality for Alchemist Farm. This calendar allowed site admin to have a different stock amount for each chick on a weekly basis. 

Chick page containing custom product calendar.

(WordPress, PHP)

View Site

Custom theme development with PHP for a cannabis sales company based in Washington D.C. 

(ReactJS, CSS, HTML)

View Project

React project adding a simple counter to a webpage. 

(WordPress, Flodesk)

View Walkthrough Video

Replaced WordPress Popup Maker popup with a popup from the 3rd party Flodesk app.

(ReactJS)

View Project

View on GitHub

ReactJS alarm clock that simply sets alarm to next :09 minute of current 10-minute block.

Great for quickly setting an alarm that ends on the 9th minute when using a time tracker that runs in 10-minute block increments. 

A fun part of this project was figuring out how to use JavaScript times and math rounding to display the :09 minute of the current 10-minute block. 

(JS, CSS, HTML)

View Walkthrough Video

USA map that shows a different image while hovering over each state. 

A fun part of this project was figuring out how to center images inside of the unusual shapes of states using Vanilla JS. 

(JS, CSS, HTML)

View Walkthrough Video

Exporting and importing selected WordPress pages/posts from one site to another.  

(Shopify, Liquid)

View Site

Shopify store for coffee. Worked on structure and styling of pages and widgets. 

(XML, WooCommerce)

View Site

Constructed an XML feed for KIR Ammo so that their stock would show up in an ammunition search engine, found on Ammoseek.com.

Also worked on product filter for KIR Ammo’s WooCommerce store.

View example search results of KIR Ammo products on Ammoseek.com

KIR Ammo shop page with product filter

(WordPress, PHP)

View Site

Custom theme development with PHP for a real estate investment company’s website. 

(Divi, WordPress, JS)

View Site

A site for booking vacation cottages. Built with Divi and custom JavaScript / HTML. 

(PHP)

Download Plugin

View on GitHub

A plugin to allow for WordPress / WooCommerce admins to remove pricing completely from their store, but still allow users to check out and order. 

This functionality can be useful if a store needs to be used to place orders for products, where payments will be handled elsewhere.

(ReactJS, Express, NodeJS, React-Bootstrap, Sass)

View Live Project

View on GitHub

An app for tracking sleeping habits, to help sleep study patients continue to track their sleep improvement progress. Working with data visualization was enjoyable, albeit a bit tricky. 

I had fun adding a “night mode” feature to this site. You can log in to try out adding data with the username “omar” and password “omar”.

(ReactJS, Express, NodeJS, React-Bootstrap, Sass)

View Live Project

View on GitHub

A fullstack React recipe collection application for a client. This app is a site for users to upload and share their recipes with others. It has been exciting and a rich learning experience to connect an Express server app with REST APIs that I created to a React frontend.

(WordPress, Elementor)

View Live Project

Artwork display and shop for client. I enjoyed working with all of the client’s beautiful artworks, and bringing her website back to life, as she had had one many years ago that had gotten hacked and was rendered unusable.

(WordPress, Elementor)

View Live Project

This was a rebuild for the client of the original site I built for her using HTML and CSS. Using WordPress is a joy, and it can often be more complicated than one would think. I enjoyed working with plugins, customizing a theme, and animating the site to produce an excellent user experience.

(CSS, HTML)

View Live Project

View on GitHub

A web logo for a client I designed and drew in Adobe Illustrator, then animated using CSS animations, as well as animations written in JavaScript. This logo was an incredibly fun challenge. The most difficult part was making the paths of the letters interact smoothly with each other, but once it was complete the client and I felt so good!

(JS, CSS, HTML, jQuery)

View Live Project

View on GitHub

This portfolio page was created using only HTML and CSS. It was a great joy to learn how to animate all of the sidebar buttons, and to add my video background.

(JS, jQuery, CSS, HTML)

View Live Project

View on GitHub

I was exited to design and create a game, and to make a movable object with JavaScript, that could interact with other moving objects. This game served as a great foundation to create even more advanced interactive coded games.

(JS, jQuery, CSS, HTML)

View Live Project

View on GitHub

This project was created to advance my knowledge of using jQuery together with JavaScript. The real challenge of the timer was making making the hours, minutes, and seconds reset at their respective intervals of 60.

(ReactJS)

View Live Project

View on GitHub

This project was created using the Unsplash API. It was a challenge to get the images to stack correctly, and to learn to implement npm packages in my React app, but this was a challenge rich in learning.

(ReactJS)

View Live Project

View on GitHub

The most challenging part about this project was creating the ability to go back to previous phases in the game. I enjoyed the challenge of creating a game history using state, and allowing the players to jump back to any point and restart.

(JavaScript, HTML)

View Live Project

Stopwatch timer created using JavaScript, HTML, CSS. Used as an example project for students when I was teaching high school web development program.

(jQuery, JS, CSS, HTML)

View Live Project

View on GitHub

A pure HTML/CSS site created for a client. When creating a site from scratch with CSS and HTML, making the site responsive may be the biggest challenge. However coding a site gives a huge amount of control. The trade-off is that it takes a huge amount of work. Nevertheless, it was cool to create a site from scratch, and especially to include PayPal functionality!

(PHP, MySQL, Bootstrap)

View Live Project

View on GitHub

This PHP project was an endeavor to be able to make a PHP controlled webpage with login and CRUD functionality. I love creating databases and using them to store and post data.

(ReactJS)

View Live Project

I enjoyed working with the country flags API, and integrating it into React. One challenging part of the project was making all of the buttons appear properly, when a new option was clicked and so forth.

(Bootstrap, Sass)

View Live Project

View on GitHub

This site was a recreation of my site, CannelleLaDemoiselle.com, except in this recreation I rebuilt a template for the site so that I could learn Bootstrap and Sass. It was a joy to learn Sass, and the power of a CSS framework and preprocessor makes development much smoother!

(JavaScript, Bootstrap)

View Live Project

View on Github

The hardest part of this todo list was creating the editing functionality for each todo item. I love manipulating the DOM and adding new elements with JS, so I had lots of fun with this project.

(PHP, HTML, CSS)

View Live Project

View on GitHub

I enjoy using PHP to interact both with the front-end and the back-end. Building a simple blog was much easier than I thought it would be.

(SASS, CSS, HTML)

View Live Project

View on GitHub

A simple color animation for a site logo.