Tyler Hawkins - Web Portfolio

Web Applications

JS Data Structures

npm package and learning tool complete with a playground of interactive examples.

Built with: Vanilla JavaScript, React.js, Storybook

View in GitHub

Webpack Demos

Example demos for key features in Webpack, including various loaders and plugins.

Built with: Webpack 4, Vanilla JavaScript, React.js

View in GitHub

React Concepts Demo

Example demos to illustrate different key pieces of React's functionality, including some of its newest features.

Built with: React.js, React Router

View in GitHub

Node.js Event Loop

Demo app for better understanding the Node.js event loop.

Built with: Node.js, Express, Vanilla JavaScript, Heroku

View in GitHub

Tables and Grids

Examples and guidance for building accessible tables and grids in React.

Built with: React.js, Storybook

View in GitHub

Article Recommendation Engine

Similarity search using the Pinecone SDK to find articles that are similar to ones you've read in the past.

Built with: Python, Flask, Pinecone SDK

View in GitHub

A11y Workshop

Workshop on common accessibility issues, how to identify them, and how to correct them.

Built with: React.js, React Router

View in GitHub

Accessible Tooltips

Examples and guidance for building accessible tooltips in React.

Built with: React.js

View in GitHub

Nested Interactive Content

Examples and guidance for building accessible nested interactive content in React.

Built with: React.js

View in GitHub

Card Components

Examples and guidance for building accessible card components in React.

Built with: React.js

View in GitHub

Accessible Listboxes

Examples and guidance for building accessible listboxes in React.

Built with: React.js

View in GitHub

Fun Facts SMS

App that allows users to enter their phone number to receive an SMS text with a fun fact.

Built with: Node.js, Express, Infobip API

View in GitHub

NES Games API

Simple REST API. Tests written with Insomnia and Inso. Run in a CI pipeline using GitHub Actions.

Built with: Node.js, Express, Insomnia, Inso CLI, GitHub Actions

View in GitHub

API Wrapper Demo

Demo of some concepts from Clean Code, Chapter 8. Thin layers of abstraction and API wrappers.

Built with: React.js, Moment.js, Day.js, date-fns

View in GitHub

Plagiarism Checker

Similarity search using the Pinecone SDK to find articles that contain the same or similar content as what's entered by the user.

Built with: Python, Flask, Pinecone SDK

View in GitHub

Customer Service Chatbot

Similarity search using the Pinecone SDK to find similar questions from a dataset.

Built with: Python, Flask, Pinecone SDK

View in GitHub

Readit

Reddit clone app. View subreadits, posts, comments, and users.

Built with: React.js, React Router, Apollo Client, Slash GraphQL

View in GitHub

Pokédex Slash GraphQL

Gotta catch 'em all. Mark which ones you've captured. Filter your Pokémon by type or captured status.

Built with: React.js, Material UI, Slash GraphQL

View in GitHub

Puppy Playdate

Tinder clone app, but for puppies. Find the perfect friend for your new puppy.

Built with: React.js, Apollo Client, Slash GraphQL

View in GitHub

Dad Joke "Dadabase"

Where do you keep your dad jokes? In a "dadabase" of course. Rate my jokes.

Built with: Vanilla JavaScript, Heroku, GraphQL, JSON Server

View in GitHub

HTML to PDF Demo

Demo app exploring various PDF export solutions.

Built with: Vanilla JavaScript, DocRaptor, pdfmake, jsPDF

View in GitHub

Single-SPA Demo

Simple demo app resulting from my single-spa tutorial.

Built with: single-spa, React.js, React Router, Heroku, AWS S3

View in GitHub

Unit Price Calculator

Uses seven new JavaScript features from ES2020.

Built with: Vanilla JavaScript, Heroku

View in GitHub

Pun Generator

View some terrible puns with this app. Experimental test strategy using DOM Testing Library.

Built with: Vanilla JavaScript, DOM Testing Library

View in GitHub

Totes Votes

Full stack voting app complete with authentication and CRUD API.

Built with: MongoDB, Express, AngularJS, Node.js, C3.js

View in GitHub

JavaScript 30 Challenge

30 JavaScript apps in 30 days.

Built with: Vanilla JavaScript

View in GitHub

Office Competition Ranking

Full stack app for leaderboard rankings for games like ping pong.

Built with: MongoDB, Express, Node.js, Passport, jQuery

View in GitHub

Crossy Block

HTML5 Frogger-like game.

Built with: MongoDB, Express, AngularJS, Node.js, Canvas element, requestAnimationFrame

View in GitHub

Venue Finder

App similar to Yelp to help you find great places for entertainment in any geographic location.

Built with: MongoDB, Express, AngularJS, Node.js, Yelp API

View in GitHub

MongoDBreakout

Knock-off Breakout game.

Built with: MongoDB, Express, AngularJS, Node.js, Canvas element, requestAnimationFrame

View in GitHub

Chat Sockets

WebRTC app that creates a simple chatroom. Complete with a Giphy integration.

Built with: MongoDB, Express, AngularJS, Node.js, Socket.io, Giphy API

View in GitHub

Qrappy Bird

Everyone's favorite Flappy Bird knock-off, complete with a theme song.

Built with: MongoDB, Express, AngularJS, Node.js, requestAnimationFrame

View in GitHub

Pixel Mania

Multiplayer game (WebRTC) similar to agar.io

Built with: MongoDB, Express, AngularJS, Node.js, Socket.io, Canvas element, requestAnimationFrame

View in GitHub

Corporate BS Generator

Parody app for helping you communicate with your boss.

Built with: Express, Node.js, jQuery

View in GitHub

Bubble Ball

HTML5 game in which you must dodge all the incoming obstacles to stay alive.

Built with: Canvas element, requestAnimationFrame, Vanilla JavaScript

View in GitHub

Stacks on Stacks on Stacks

HTML5 game in which you must jump on top of incoming platforms to make the tallest stack.

Built with: jQuery, CSS3 animations

View in GitHub

React+Redux Walking Skeleton

Walking skeleton of a React+Redux app built using create-react-app.

Built with: React.js, Redux

View in GitHub

Comment Board

Post a comment and your name to contribute to the discussion.

Built with: MongoDB, Express, Node.js, jQuery

View in GitHub

Markdown Previewer

App that allows you to write marked up content and see the output side by side.

Built with: React.js, Marked library

View in GitHub

Free Code Camp Leaderboard

Sortable/filterable table pulling in data from a webservice.

Built with: React.js, FreeCodeCamp API

View in GitHub

Recipe Box

App for storing your favorite recipes. CRUD API.

Built with: React.js, React Router, Local Storage

View in GitHub

Conway's Game of Life

Interactive Conway's Game of Life simulation.

Built with: React.js

View in GitHub

Dungeon Crawler

Battle enemies, find weapons, eat food, defeat the boss.

Built with: React.js

View in GitHub

Drum Machine

Click on the drum pads to hear each sound.

Built with: React.js

View in GitHub

Camera

Desktop camera app that lets you take a picture and download it using the HTML5 getUserMedia API. (Note: HTTPS is required.)

Built with: jQuery, getUserMedia API

View in GitHub

Quote Generator

Simple demo for reading JSON from a file via an AJAX request.

Built with: XMLHttpRequest, JSON

View in GitHub

Utah Weather

Simple demo for text suggestions, reading JSON from a file, and using a weather API service.

Built with: Express, Node.js, Weather API

View in GitHub

The Movie Database

Find a good movie to watch with this simple API demo with a sortable/filterable table.

Built with: jQuery, Movie Database API

View in GitHub

Wikipedia Search Engine

Search for top Wikipedia articles or find a random article.

Built with: jQuery, Wikipedia API, CSS3 Keyframe Animation

View in GitHub

Best Music

Upload your favorite songs and then vote on them.

Built with: MongoDB, Express, AngularJS, Node.js

View in GitHub

Current Local Weather

Uses your location and a weather API to find the current weather for your location.

Built with: Geolocation, Weather API

View in GitHub

Twitch TV Streamers

Simple app that uses the TwitchTV API to show which of your favorite streamers are online and which are offline.

Built with: jQuery, TwitchTV API

View in GitHub

JavaScript Calculator

Calculator UI capable of doing some simple math.

Built with: Vanilla JavaScript

View in GitHub

Pomodoro Timer

Timer UI to help keep you more productive.

Built with: Vanilla JavaScript

View in GitHub

Pokedex

Gotta catch 'em all. Keep track of your Pokemon here by adding an image and a name.

Built with: MongoDB, Express, AngularJS, Node.js, C3.js

View in GitHub

Camper News

News feed delivered to you via the FreeCodeCamp API.

Built with: jQuery, FreeCodeCamp API

View in GitHub

Firebase Chatroom

WebRTC chatroom built with a Firebase database from Google.

Built with: AngularJS, Firebase

View in GitHub

Scroll up to previous section (Web Applications)

Scroll down to next section (Microservices)