🐾 Dog Days Pack: Three Zero-Dependency Dog Projects in One Weekend

This is a submission for Weekend Challenge: Dog Days Edition

What I Built

Three small dog-themed projects, all built from scratch within the challenge window — each one is a single self-contained HTML file with zero dependencies, zero build steps, and zero CDNs. Open the file (or the links below) and it just works, the way software for dogs should.

1. 🎴 Paw Match — Dog Breed Memory Game
A card-memory game where you flip cards to match dog breed pairs. Match a pair and a real breed fact pops up — did you know Dalmatians are born pure white and only develop spots after 3–4 weeks? Three difficulties (6/8/10 pairs), move counter, timer, star ratings, CSS 3D flip animations and confetti.

2. 📓 Paw Log — Dog Training & Care Journal
A practical training log (the brief literally suggested this one 🎯). Log walks, feedings, training sessions, vet visits, baths and playtime. Everything persists in localStorage, with daily stats (walks today, training minutes, day streak), per-activity totals with progress bars, and JSON export/import backups.

3. 🎨 Dog-o-matic — Generative Dog Art
A tiny procedural dog factory. Every click generates a unique dog face — head shape, ear type (flop/point/round/fold), coat color, chest blaze, Dalmatian spots, tongue, freckles — all random. It “identifies” the breed and always concludes the dog is a very good boy. Pure Canvas 2D, and you can save any dog as PNG or auto-breed a dozen in a row.

Demo

All three run right in your browser — no install, no login:

• 🎴 Paw Match: play it here
• 📓 Paw Log: use it here
• 🎨 Dog-o-matic: generate dogs here

Code

The entire codebase is the demos themselves: each project is one self-contained HTML file — right-click → View Source in any browser and you have the full code. No frameworks, no lockfiles, no node_modules to explain.

A GitHub repository with the full pack (plus this README) is being published and I’ll link it here before submissions close.

How I Built It

The one-file constraint was the fun part. I decided each project had to be a single HTML file that works over file:// — double-click and play, anywhere, even offline. That forced some genuinely nice engineering:

• Paw Match uses CSS 3D transforms for the flip animation (perspective + rotateY), a tiny state machine for the flip/lock/match flow, and a hand-picked fact table of 10 real breed facts.
• Paw Log is a full CRUD app in ~130 lines of vanilla JS: a single localStorage JSON document, day-keyed aggregation for the “today” view, streak calculation walking back through calendar days, and JSON backup export/import for the “data stays on your machine” promise.
• Dog-o-matic draws every dog procedurally on a <canvas>: a parameter object (coat, ear, head, muzzle, patches, spots, tongue, freckles) drives an ordered paint pass — ears behind the head, muzzle overlay, white blaze, then face details. The “breed guess” is a tiny rules engine over those parameters (ears === 'round' → "Corgi (all loaf, no legs)").

The whole pack is responsive, works on mobile, and was built in one weekend sitting — because that’s the challenge.

Made for fun. No dogs were harmed (or trained) in the making. 🦴