VanLife

VanLife screenshot
VanLife screenshot
VanLife screenshot
VanLife screenshot

VanLife was created as part of the Scrimba.com Front End Developer Career Path. The concept is something of a VRBO, but for Vans, rather than properties. There's a 'shopper' experience as well as a 'renter' experience. The primary goal was learning about React Router, but it also reinforced a number of different basic React concepts.

Learning Goals

  • Browser Router
  • Routes
  • Links
  • Route Params
  • Nested Routes
  • Layout Routes
  • Outlets
  • Outlet Context
  • Search / Query Params
  • Use Location (and state)
  • Router Provider
  • Loader
  • ErrorElement
  • Protected Routes
  • UseLoaderData, UseActionData
  • UseNavigation

Quizzical

Quizzical screenshot
Quizzical screenshot

Quizzical was done at the end of the React Basics course as part of the Scrimba.com Front End Developer Carrer Path. I used question components to build the quiz itself, all of the quiz data comes from the opentrivia DB.

Learning Goals

  • React
  • React Components
  • Managing State
  • Fetching Data

Tensies

Tensies screenshot
Tensies screenshot

A simple number matching game with dice that tracks the lowest score. It uses local storage to keep track of the lowest score achieved. Each of the die are React Components.

Learning Goals

  • Component Reuse (Die)
  • Arrays of Components
  • Managing Component State
  • Managing State

Logbook

Logbook screenshot
Logbook screenshot
Logbook screenshot

Created to assist the guides at Bronco Off-Roadeo. To better understand how much experience we have as guides we are required to keep logbooks of the time we spend instructing, off-roading, training etc. Also, if we want to get paid, we are required to fill out a time sheet and submit an invoice. These 3 tasks had been completely separate from one another. This litte app combines those three tasks, so as long as you fill out your logbook your invoice and timesheet are generated for you. It is intended as a mobile first experience, so that guides can quickly (30 seconds) log their work for the day when they get back to basecamp from their phones. I wrote this before I had taken any formal web dev courses, so it's an interesting mixture of things.

Learning Goals

  • Node
  • Bootstrap
  • Handlebars
  • Express
  • REST APIs

Off-Roadeo Guides

Off-Roadeo Guides screenshot
Off-Roadeo Guides screenshot
Off-Roadeo Guides screenshot
Off-Roadeo Guides screenshot

Assists past Bronco Off-roadeo guests by providing them with a way to refresh themselves after their day at Bronco Off-Roadeo. We commonly get questions about whether or not the information we go through during the day is available somewhere other than what we talke about during the day itself. This is a solution to that.

Learning Goals

  • React
  • Typescript
  • React Router

Memory Matching Game

Memory Matching Game screenshot
Memory Matching Game screenshot
Memory Matching Game screenshot

This is a classic memory game, but presented in a mobile compatible web interface. While it was initially done as part of a tutorial, it has been customized to meet the needs of my 2 year old Grandauter rather than be a general purpose game.

Learning Goals

  • React
  • Accessibility
  • Mobile First

Live Edge Wood and Epoxy Table

Live Edge Wood and Epoxy Table screenshot
Live Edge Wood and Epoxy Table screenshot
Live Edge Wood and Epoxy Table screenshot
Live Edge Wood and Epoxy Table screenshot

Yes, a real world object, not just something on the internet. From start to finish this project took roughtly 3 years. It took a little over 2 years for the wood, that when I first encountered it was in the form of a standing tree, to dry enough to use in a project. Then there was a few months working in the basement pouring a layer of epoxy, then waiting 24 hours for it to dry. Finally finishing took probably at least a few weeks starting with 40 grit sandpaper and working all the way up to 2000 grit.