Projects

Travel Journal

This Travel Journal project pulls in a data file of 'trips' objects, converts them to an array of objects, and then maps each object to a TripCard() component, which ouputs trip relevant data (title, images, google maps link, and short description) in formatted HTML. The entire project was the styled with CSS.

Read more about my experience on my blog.

Movie Watchlist

This app allows a user to search for movies based on title using the OMDB API. The OMDB API returns a list of the top ten movie matches. Users can then add/remove movies from a watchlist that is saved in localStorage.

Color Scheme Generator

The app takes a seed hexadecimal color and color palette selection via a form and then requests a color palette from The Color API. The Color API returns a data object which is then used to populate the provide color palette.

Read more about my experience on my blog.

War

My first foray into API's.

This app uses the Deck of Cards API to run a simulation of the card game War.

Utilized .fetch() and .json().

Read more about my experience on my blog.

Role Playing Game

My most complex JavaScript app to date.

Simple dice based role playing game featuring multiple monsters to defeat. Utilized classes, Object. assign(), constructor, external resource files, setTimeout(), arrow functions, .map(), and .join().

BBQ Website

Responsive website featuring HTML form styling and JavaScript form submission confirmation.

Read more about my experience on my blog.

Image Carousel

Here is a skratch coded image carosel. The goal of this project was to interate forward and back through an array of images, showing only a single desired image at time.

Search Bar

This project searches through an unordered list and then hides elements that do not match the search string one by one.

This Javascript project used similar code as my simple Hide/Reveal modal here). Read more about my experience on my blog.

My Emojis

This is an emoji display app. This app allows the user to add an emoji of their choice to the beginning or end of the displayed emoji list via an input field. Emojis may also be removed from the beginning or end of a list.

This Javascript project refreshed a lot of the concepts covered in my Chrome extension (read more here). Read more about my experience on my blog.

Blackjack

Here is a simple text-based Blackjack game. The goal was to create a functioning simulation game with the ability to start a game, and add new cards. I chose to add a simple reset as well as it improves repeat gameplay. CSS and design styling of my own invention

This Javascript project was incrementally more complex in its use of arrays, conditional logic, functions, and use of Math to return random numbers. Read more about my experience on my blog.

Passenger Counter

For this project the goal was to create a website where a person could log attending visitors as they arrived. The "Increment" button works as a simple click logger while the "Save" button adds the previous "People entered:" value to a string for display below. CSS and design styling of my own invention

This is my first foray into Javascript with Scrimba. Read more about my experience on my blog.

Three Column Preview Card Component

This is my solution for the Frontend Mentor Three Column Preview Card Component" challenge.

For this project participants were instructed to build out a three column card component with active state link buttons to match provided designed images - desktop and mobile.

This is my third Frontend Mentor challange. Read more about my experience on my blog.

Stats Preview Card Component

This is my solution for the Frontend Mentor Stats Preview Card Component" challenge.

For this project participants were instructed to build out a simple card component to match provided designed images - desktop and mobile.

This is my second Frontend Mentor challange. Read more about my experience on my blog.

Order Summary Component

This is my solution for the Frontend Mentor Order Summary Component" challenge.

For this project participants were instructed to build out an order summary card to match provided designed images, including a couple hover states.

This is my first Frontend Mentor challange and I really enjoyed it.

How to Sell Clothing Online Website

"How to Sell Clothing Online" is a project I decided to implement as part of a plan to create a sandbox for exploring new ideas and technology outside of the area I typically work. The goal was to build a site and then spend time optimizing both the content and technology, while also having a project I can always go back to when I want to explore topics like graphic design, SEO, or social media marketing.

The main hurdle of this project was optimizing Wordpress. I chose a fairly inexpensive hosting plan and this ended up being problematic in terms of site speed. Ultimately I resolved the issue by switching the site theme to Astra and using the plugin AMP.

I really enjoyed learning about new-to-me subjects like Google Analytics, Pinterest marketing, and tools like CoSchedule's Headline Analyzer.