Some Things I've Built

Check out these projects and other work I've done.

Front End Techdegree Projects

Here are the projects completed to receive Team Treehouse's Front End Web Development Techdegree.

Project 1 Icon
Personal Profile Page

In this project, I modified code to a basic webpage to add pictures, content, and a stylish design. It was a wonderful start to the basic building blocks of HTML and CSS.

  • Modified HTML to add my own images and content
  • Modified CSS to customize my own styles
  • Learned about Github and how to upload projects to it
  • Made sure photos were resized and optimized for the web
View Project One View The Code
Project 2 Icon
Mobile First Responsive Layout

In this project, I built a mobile first responsive layout using both HTML and CSS. In it I show an understanding for responsive design by accomodating small, medium, and large screens.

  • Wrote all HTML and CSS for project
  • Used media queries to create a responsive design
  • Continued to build on CSS and HTML skills developing better soft skills and habits
  • Used CSS to apply interactive states to psuedo elements
View Project Two View The Code
Project 3 Icon
An Online Registration Form

In this project, I built a mobile friendly registration from using a wide variety of HTML elements.

  • Matched mockup to desired specs for all screen sizes
  • Used HTML and CSS to craft an engaging and responsive form
  • Used CSS transitions to affect form elements in different states
  • Learned an in depth understand of HTML forms and the attributes that go along with them.
View Project Three View The Code
Project 4 Icon
Web Style Guide

In this project, I was responsible for converting CSS into a Sass document, in order to create a reusuable web style guide.

  • Learned the basic building blocks of Sass
  • Used partials and mixins to create a highly functional Sass document
  • Used the Scout App to compile Sass back into a CSS document
  • Learned all about nested selectors and variables in Sass
View Project Four View The Code
Project 5 Icon
An Interactive Photo Gallery

In this project, I used Javascript and jquery to build an interactive photo gallery.

  • Used javascript to build a working search bar that filters photos
  • Used a jquery plugin to create lighbox pop up.
  • Used CSS Flexbox to create a responsive designe for gallery page
  • Learned the basic building blocks for Javascript
View Project Five View The Code
Project 6 Icon
Game Show App

In this project, I created a browser version of “Wheel of Success”, a word guessing game where players will click letters from an onscreen keyboard to try to guess a random phrase.

  • Used javascript to create an array of random phrases and had one populate on screen
  • Used javascript to tell whether a player had won or lost the game
  • Using javascript, I allowed the game to reset and be replayable
  • Used CSS transitions to change letters as they were guessed
View Project Six View The Code
Project 7 Icon
WebApp Dashboard

In this project, I took a mockup and some icons and built a beautiful web dashboard. It is complete with javascript driven charts and graphs.

  • Learned the building blocks of SVG graphics and using them in CSS
  • Use local storage with Javascript to store the users profile settings and recall them.
  • Used javascript to create an autofill function when messaging the user
  • Learned the basics of the CSS grid system to create interesting websites
View Project Seven View The Code
Project 8 Icon
Use an API to Create an Employee Directory

In this project, I used the Random User Generator API (https://randomuser.me/) to grab information for 12 random “employees,” and use that data to build a prototype for an Awesome Startup employee directory.

  • Used fetch to request a JSON object and it's data
  • Used Javascript to create a functioning search bar
  • Used Javascript to build my own popup modal that would cycle through the employees
  • Learned the building blocks of JSON and Asynchronous Javascript programming
View Project Eight View The Code