Projects Showcase

A light blue background has the title Little Victories in dark blue centered across the top. Most of the screen is taken up by a blurred image with a small lock icon in the middle of it noting the user has completed 0 of 15 tasks, and a caption encouraging them to complete tasks to unlock the image. At the bottom of the screen you can see the last task card in the path, with the task 'leave 3 detailed comments'.

Little Victories

Nuxt

Pinia

Turso

Drizzle

Unsplash

An app to make finding your next tech role a little more rewarding, by letting the tasks you complete reward you with pictures to form a gallery of your progress.

View CodeView Site
A phone showing the Play Ball home page, which has a white background with black text. Under the Play Ball title there's a dropdown to select the teams to view, then sections with red divider lines showing games for today and ones that are upcoming. Each game is listed with the two teams playing and the date and time it starts. In the today section, the game shows that it's live now with the current score.

Play Ball

Astro

Vue

Nanostores

Postman

I wanted a way to see when my favorite baseball team was playing and how they'd done for their last few games without having to download an app for it or navigate a busy website. When a Web Dev Challenge hackathon came up inviting you to play with an API, I knew my time to build this tool had come!

View CodeView Site
A tablet showing the Brazilian Nut News page. The background of the page is bright yellow, and it has 4 links in black text underneath a black background header. The links all have upward arrows to the right of them for upvotes, with arrows pointing right on the end to signify you can click each link to visit the page.

Brazilian Nut News

RedwoodJS

React

Tailwind

Storybook

Jest

Supabase

A link aggregator site started during Amy Dutton's Freaking Fullstack workshop. I liked the design so much I kept implementing it and streamed most of my progress while doing it! It was a great way to learn some of how Redwood works and gain more practice turning a provided design into a real product.

View CodeView Site
A heading reads 'Welcome to the Arcade!' on a dark purple background. Below the heading are three tall rectangles, each with the name of a game, a screenshot of the game, and a small blurb with the game objective.

Arcade

Astro

React

JS

HTML

CSS

I love games and wanted a place to collect all the ones I make, so created this arcade! Built in Astro so I can practice in different frameworks when I want to. Some are games I created following tutorials and some are ones I created on my own.

View CodeView Site
White text across the top reads Once Human Reset Timers. The rest of the page is filled with four boxes, two per row. The top left and bottom right boxes are double the width of the other two boxes. Each box contains an icon, title, and countdown timer to show when each will reset.

Game Timers

Next

Tailwind

While playing Once Human, I got annoyed that there were a handful of daily and weekly event reset timers that were all at different times and displayed in separate menus. So I created this site to be able to see those timers at a glance.

View CodeView Site
White text on a black background shows the heading text Let's Craft in Fortnite centered across the top of the page. Below is a form showing a list of items you can craft, with a button in red to get materials and one to reset the form. A few items are checked, and below the form is a list of the materials needed to craft the selected items.

Let's Craft

Astro

Vue

Tailwind

Astra DB

When playing games like Lego Fortnite, you often need to craft lots of items, which all need different amounts of the same base materials. I created this during a Web Dev Challenge hackathon to help myself count the base materials I needed so I could gather more efficiently.

View CodeView Site
A heading bar with Do I Own This on the left, and a greeting and sign out button on the right. Then, a filter bar, showing a drop down menu and a text box with a search button. Finally, a link to add something new, and a grid view three across and multiple down showing photos of nail polishes with their name below them.

Do I Own This

Vue

VueX

Firebase

Auth0

This is the first project I built on my own. I have a ton of nail polish and got the idea to build a site that allows me to track the ones I have, so I don't buy duplicates at the store. It was a great way to learn Vue and build some chops around managing state for a site.

View CodeView Site
A light blue background with the face of a cartoon tiger centered in the middle. The tiger has round ears, small eyes, and a big smile. His name is Hobbes, from the comic strip Calvin and Hobbes.

CSS Drawings

HTML

CSS

I've loved the idea of drawing with HTML and CSS since I first discovered a set of email prompts showing how to get started. Some of these are from those prompts and some are my own ideas. Hobbes is my most liked pen on Codepen and I still love how cute he turned out!

View CodeView Site