An educational tool for visualizing sorting algorithms commonly taught in introductory CS courses. Implements time travel through application states using Redux. Responsive design.
A multi-user, real-time, collaborative editor for animated sprites and pixel art. Only uses functional components (to learn hooks). Implements diffing to optimize HTML canvas re-renders. Implements multi-user undo. Desktop only. My contributions: MVP, real-time client-server architecture, server design, client-side data layer design, client- and server-side performance tuning.
Socket IOHTML CanvasReactReact Hooks
A multiplayer browser game built for a three-day hackathon using Socket IO. Implements a command-pattern-based synchronization engine to remain performant with many players. Soft-launched an MVP via Reddit and tuned performance based on user feedback.
Socket IOHTML CanvasDOM manipulation
A full-featured RESTful e-commerce store built as a bootcamp learning project for the NERDS stack. Desktop only. My contributions: database design, design for the Redux store, many interactive UI components in React, design for session-based API route security, and all of the styling (in plain CSS).
A responsive static portfolio site built as a learning project for Gatsby's take on JAMstack. Builds from Markdown files queried through Gatsby's GraphQL data layer.
GatsbyReactStyled ComponentsNetlifyGraphQL
A repository built for Fullstack Academy of Code which uses test-driven learning to teach direct DOM manipulation. Students build a simple clone of Cookie Clicker, a popular browser-based game from 2013. Currently in use as part of the Fullstack curriculum. Private repository; links available upon request.
DOM ManipulationTest-Driven LearningMochaChaiJSDOMSinon