Claude Code Fun

Fun builds

Built for fun

These are the apps, games and sites I've made with Claude Code. Each card is a real screenshot, my own summary of what it is and why I made it, and the stack behind it a click away.

Apps

  • TL Books on a desktop: the Review queue, with date, bank account and import filters above tabs for the Sure, Maybe, Flagged and Transfers tiers, and a note that the queue is clear because everything imported is committed to the books.

    TL Books / Claude Books

    Planned with the Framework

    I built TL Books to replace QuickBooks and Xero as my accounting system of record at Three Leaf. Cash basis, Xero chart-of-accounts conventions, and I close my own books on it every month.

    Tech specs
    • Built on Next.js (App Router) with React and TypeScript, Tailwind and shadcn base-nova on Base UI, Drizzle ORM against Neon serverless Postgres, Clerk for auth, Stripe for invoicing and the Anthropic SDK for categorization.
    • Tested with Vitest against PGlite and deployed on Vercel.
  • Inside Launch Your First Project: a lesson page for The Product Requirements Document, with the steps Watch, Checkpoint, Read, Note and Do down the left, the module list beneath them, and a panel headed Where this module sits open on the right.

    Launch Your First Project

    Planned with the Framework Open the Course

    It's a tool as much as a course. I made it with Claude Code, using the same process it teaches you. By the end, you'll have run that process once, start to finish, on a project of your own.

    Tech specs
    • Next.js (App Router) with MDX lessons, Neon Postgres, Stripe for checkout, deployed on Vercel.
  • Closest Wins on a phone: a dark home screen that reads Nobody knows. Everyone guesses. Closest wins., a Play today's match button, and a number line with each player's guess marked on it.

    Closest Wins

    Planned with the Framework Open Closest Wins

    Made when I was testing the Launch Claude Code Fun tool. Since I had to go through and read everything and click everything, I just made this app. It's what spit out the other end after going through all the steps in the class! It is a daily estimation party game for one shared phone: questions nobody knows the answer to, everyone at the table guesses, closest guess wins the round.

    Tech specs
    • The whole product is a single index.html: all CSS, all JS, both fonts embedded, and the whole question bank inline, with zero external requests, so it keeps working offline after first load.
    • It's served as a static file from Vercel (no framework, no build step, no dependencies) off a private GitHub repo that auto-deploys on push, and the only network call the page can make is the email signup POSTing to FormSubmit.
  • Harmonica Tab on a desktop: a dark control panel styled like a piece of audio gear, with transport, voice, pitch, layout and display sections above an empty drop zone that reads Drop a score to begin.

    Harmonica Tab

    Open Harmonica Tab

    Online tool to convert sheet music to harmonica tab. Drag and drop function.

    Takes a little bit to scan the pdf and then build the score, but quick after it's in (faster for midi and xml files).

    Select from multiple harmonica types (chromatic and diatonic) and multiple keys of harmonicas. If the music is in the wrong key for your harmonica, change the key with a few clicks. Control panel that allows you to alter how the sheet music looks and also different skins available of the tool!

    Tech specs
    • Python with FastAPI and uvicorn.
    • A Python music notation library for MusicXML, MXL and MIDI.
    • Audiveris and Tesseract for reading PDFs.
    • A vanilla JavaScript front end rendering with OpenSheetMusicDisplay.
    • Docker on Fly.io.
    • MIT licensed.
  • Check Tally on a phone: a batch of Sunday morning pledge checks, each scanned check listed with its amount and a tick, an Export PDF button, and the batch's check count and subtotal at the foot.

    Check Tally

    Open Check Tally

    Mobile responsive web app to assist with plate counts for church.

    Scan a stack of checks at a time, label which service they were in and the OCR tech profiles how much the checks are!

    Then export to pdf to print for accountant backup.

    This saves me time every week from having to scan every check in the photocopier! Plus the OCR hardly ever makes an error.

    Tech specs
    • Next.js (App Router) with React and TypeScript, Tailwind, the Anthropic SDK for reading checks with Claude vision, jsPDF for the export, installable as a PWA, deployed on Vercel.
  • Uke Chord Finder on a phone: a dark screen with a box to type a chord name above rows of chord buttons grouped by family, major, the sevenths and minor.

    Uke Chord Finder

    Open Uke Chord Finder

    Mobile based app to help find and make chords for the ukulele fun we all have!

    Tech specs
    • Vanilla HTML, CSS and JavaScript, installable as a PWA with a service worker, chord data in a JSON file, deployed on Vercel.
  • The Three Leaf Loans sign-in page: a dark panel carrying the Three Leaf Loans shield, the line Speed to terms. Confidence to close., and a short pitch for the loan intake portal, beside a Welcome back form asking for an email address and password.

    Three Leaf Loans

    Planned with the Framework

    A test case of building a web-based platform for loan companies.

    Platform has AI driven decision engine that helps put together the deal.

    Baked into this a flexible admin portal that lets all the decision criteria and required documentation be configured by the company, so each version is custom to the debt firm.

    This is the build the Guide walks through, from its Charter to its UAT.

    Tech specs
    • Next.js (App Router) with React and TypeScript, Tailwind, Prisma against Neon Postgres, JWT role-based auth for brokers, loan officers, underwriters and the CIO, Nodemailer, deployed on Vercel.
  • Roll Call on a phone: the organizer's dashboard for a trip called Anniversary in Paradise, with a team streak card, a New Roll Call button, the Agenda with its Share agenda control and trip start date, and Recent Roll Calls listing a homegrown luau and a dinner.

    Roll Call

    Planned with the Framework Open Roll Call

    Group planning app. Cori came up with this idea while on a Cori tour in the UK. Instead of using group text to coordinate different activities for groups over a week trip, everyone has access to the schedule, and the leader of the schedule can customize each event and even add an RSVP option.

    Tech specs
    • The front end is a single-page app built with Vite, React, and TypeScript that keeps a fast local cache synced from the server.
    • The back end is a small Fastify service (Node and TypeScript, run via tsx) that serves the app plus a command API and stores all data as a single JSON file on a persistent disk, no external database.
    • It runs on Fly.io in a Docker container, with pushes to main auto-testing and deploying through GitHub Actions.
  • EV Charger Map on a phone: a dark map of Phoenix with charger pins, a filter bar for all, free and hidden chargers, a Near me control, and a Nearest chargers list beneath giving each station's distance and charging rate. The EV Charger Map link preview: EV Charger Finder, find hidden chargers near you, beside a glowing map pin carrying a lightning bolt and the car's badge, over a dark street map.

    EV Charger Map

    Open EV Charger Map

    After buying an EV car, I had a few app downloaded to find chargers, but noticed the APS free chargers and a few others were not on there. After some cursory research, found some APIs that are out there that could pull in the missing charger data. Built this so fit the chargers that fit for my EV9 and my use case!

    Tech specs
    • A single HTML page with a Leaflet map, station data from ChargePoint and the AFDC, served as a static file from Vercel.
  • MTG Card Scanner on a phone: a dark screen that reads Scan your cards into an Archidekt file, a choice between Tray, a card at a time, and Bulk, a grid at once, and a Start scanning button.

    MTG Card Scanner

    Open MTG Card Scanner

    Point a phone at a pile of Magic: The Gathering cards and get a file Archidekt can import. It recognises each card as it lands in front of the camera, or a whole grid in one photo, and builds the list while you keep feeding it.

    Tech specs
    • Next.js (App Router) with React and TypeScript, Tailwind, the Anthropic SDK for recognising cards with Claude vision, exports an Archidekt CSV, deployed on Vercel.

Games

  • Feed Eggs on a desktop: a slate blue title screen drawn like an old computer window, with a wide-eyed egg character with its mouth open on the left, a basket of eggs on the right, the line Drag eggs from the basket into the mouth, and a Start button.

    Feed Eggs

    Open Feed Eggs

    Life changing game that has 'easter eggs' hidden along the way if you can make it!

    This was in a Tim Robinson skit and so I had to make it so my family could play it while we laughed out loud!

    Tech specs
    • A single HTML file. Drag eggs from the basket with a mouse or a finger, animation on requestAnimationFrame, the Easter egg sound embedded.
    • Deployed on Vercel.
    • Party Point Studio.
  • JeoParody on a desktop: a deep blue title screen with JeoParody! in big yellow letters, the line The Ultimate Quiz Show, a yellow New Game button, and Press space or click to begin beneath.

    JeoParody

    Open JeoParody

    Fun classic game for youth group and small groups!

    Tech specs
    • A single self-contained HTML file.
    • Deployed on Vercel.
    • Party Point Studio.
  • Christmas Family Feud on a desktop: a stage dressed in garland, red bows and lit trees around a gold Friendly Feud Holiday Special badge, a panel for naming both teams, and a yellow Build the Show button.

    Christmas Family Feud

    Open Christmas Family Feud

    Christmas themed version of the classic!

    Tech specs
    • A single self-contained HTML file: game logic, question bank, sounds, background, logo, board art and the host QR codes all embedded.
    • Deployed on Vercel.
    • Party Point Studio.
  • Deviled's TV page on a desktop: a near-black screen with a huge dim smiling devil face behind the word Deviled in yellow, graduation caps, balloons and party poppers scattered around it, and the line Click anywhere to enter fullscreen.

    Deviled

    Open Deviled

    Original game that is a spin on price is right and some favorite board games!

    Tech specs
    • A TV page plus phones joined by QR code, no app install.
    • Vercel serverless functions with Redis for game state, server-sent events to the TV, QR codes generated on the fly.
    • Party Point Studio.
  • Person, Place and Thing on a desktop: a dark screen with the title in glowing yellow, pink and blue letters over faint scattered stars, the line Press space to begin, and the Party Point Studio mark beneath.

    Person, Place and Thing

    Open Person, Place and Thing

    Original game that is a fun take on ai image creation!

    Tech specs
    • A single HTML file with AI image generation.
    • A multi-device version exists.
    • Deployed on Vercel.
    • Party Point Studio.

Sites

  • The Big Brother Premiere home page: a comic-style poster of the season's houseguests gathered around the host, split into Young Bloods versus Seasoned Vets, with a Scroll for the party details control at the foot. The Big Brother Premiere link preview: the same poster of the houseguests around the host, Young Bloods versus Seasoned Vets, with the show's logo in the corner.

    Big Brother Premiere

    Open Big Brother Premiere

    With digital trading cards for all the friends who are in the group!

    Tech specs
    • Static HTML pages with Vercel serverless functions for the predictions vote and results, digital trading cards, deployed on Vercel.
  • The Plan the Exit home page: a cream page with the headline If your business can't run without you, it may not be ready to sell., a Take the Readiness Assessment button, and a collage of a business owner beside handwritten notes reading Build value. Create options. The Plan the Exit link preview: a navy card reading Plan the Exit over the headline If your business can't run without you, it may not be ready to sell., with plantheexit.com at the foot.

    Plan the Exit

    Open Plan the Exit

    Site to document advice for CEOs to be able to transition their company

    Tech specs
    • Hand-written HTML and CSS, a set of article pages, a custom domain, deployed on Vercel.
  • The Vintage Box Guitars home page: a gold serif masthead over a photo of handmade cigar box guitars on a workbench in warm evening light, with the line One box. One build. One of a kind.

    Vintage Box Guitars

    Open Vintage Box Guitars

    I met Andrew at the flagstaff art festival and was impressed with the quality of how he made his cigar box guitars.

    He had a domain but no website to showcase. I took a few pics of his guitars and made this site.

    I wanted to show the nephews how fast you can make a site.

    Needless to say Andrew was surprised and a little confused why I did it, haha

    Tech specs
    • Next.js with Sanity as the content CMS, Supabase, Resend for inquiry email, styled-components and Tailwind, deployed on Vercel.
  • The Call Shotgun home page: a dark hero reading You drive. We ride shotgun. beside a photo of a black sedan at dusk with a column of data cards next to it, actually for sale, dealer listing says, price changes, suggested opening and market position, and a Buckle up, start your search button.

    Call Shotgun

    Research and due diligence on used EV car shopping. Get an industry expert with actual data feeds and real analysis to help you buy a used EV car

    Tech specs
    • Next.js (App Router) with Drizzle against Postgres, iron-session for sign-in, Vitest.