The past.

1. 01

   Astral Midnight

   VS Code · Yo Code · JSON

   Live site for Astral Midnight ↗Source code for Astral Midnight ↗

   Then · proud of

   Published my own VS Code theme, and strangers actually starred it. Dark gray, soft gradients, made for 2am.

   Now · I'd fix

   I haven't opened it in ages. Comments are a little low-contrast and there's no light variant, so I'd fix both and add proper semantic highlighting.

2. 02

   TasteExplorer

   TypeScript · React · Redux Toolkit · Tailwind · Alan AI

   Live site for TasteExplorer ↗Source code for TasteExplorer ↗

   Then · proud of

   Recipe search you could talk to. Ask Alan AI a question, it answers out loud. Felt like magic in 2022.

   Now · I'd fix

   Redux was overkill for what is really search state. That belongs in the URL. I'd fetch on the server, cache results, and handle the recipe API being down instead of showing a blank page.

3. 03

   Vibrate

   React · Redux Toolkit · Tailwind · Styled-components · Rapid API

   Live site for Vibrate ↗Source code for Vibrate ↗

   Then · proud of

   An installable music PWA. Search, stream, works on your phone. My first app that felt like a real product.

   Now · I'd fix

   It called Rapid API straight from the browser, so the key was public and rate limits broke it. I'd put a small API route in front with caching, and lazy-load the player.

4. 04

   Translucent

   React · Tailwind · Styled-components · CommerceJS

   Live site for Translucent ↗Source code for Translucent ↗

   Then · proud of

   A full food-ordering flow (menu, cart, checkout) wired to a real commerce backend.

   Now · I'd fix

   Tailwind and styled-components fighting in one codebase. I'd pick one, keep the cart server-side so it survives a refresh, and test the checkout path end to end.

5. 05

   Mindmap

   TypeScript · React · Tailwind

   Live site for Mindmap ↗Source code for Mindmap ↗

   Then · proud of

   Markdown notes with full CRUD, in TypeScript before I really understood TypeScript.

   Now · I'd fix

   Everything lived in localStorage. Clear your browser, lose your notes. I'd add auth, a database and sync, with autosave that doesn't overwrite other tabs.

6. 06

   YouTube Clone

   React · Redux Toolkit · Sass · Rapid API

   Live site for YouTube Clone ↗Source code for YouTube Clone ↗

   Then · proud of

   Got the layout so close that people asked if it was the real thing.

   Now · I'd fix

   Pixel-copying taught me CSS, not product thinking. I'd build something original, and paginate instead of loading every video at once.

Small stuff

Practice builds. One-line verdicts.

• Password GeneratorHTML · CSS · JS
  → Used Math.random(). Should be crypto.getRandomValues().
• GlossaryReact · Tailwind
  → Refetched on every keystroke. Needs a debounce and a cache.
• Speed Typing GameReact · CSS
  → Measure speed per word, not per round.
• TenziesReact · CSS
  → The game logic deserves tests.
• Meme GeneratorReact · CSS
  → Render to canvas so you can actually download the meme.
• Travel JournalReact · CSS
  → Trips were hardcoded. Make them editable.
• Mini Music PlayerHTML · CSS · JS
  → Add keyboard controls.
• Rock Paper ScissorsHTML · CSS · JS
  → Nothing. It's rock paper scissors.
• Advice GeneratorHTML · CSS · JS
  → No loading or error state. The network does fail.
• Web Service Landing PageHTML · CSS · JS
  → Check contrast and keyboard nav from day one.
• Quote GeneratorHTML · CSS · JS
  → Add sharing and an offline fallback.
• To-Do ListHTML · CSS · JS
  → Persistence and drag-to-reorder.