DEV Community

Cover image for International Dog Day
Dan
Dan

Posted on

International Dog Day

#devchallenge #weekendchallenge #dogdaychallenge #learngoogleaistudio

What I Built

PupPal — an interactive puppy training planner and progress tracker

PupPal helps new dog owners structure short, consistent training sessions, log progress, and generate simple, printable training cards. The goal was to make early puppy training approachable: short sessions, clear goals, and a visual record you can share with family or a trainer.

Demo

  • Live demo (local): A single-page web app where you:
    • Create a puppy profile (name, breed, age).
    • Pick training goals (sit, stay, recall, crate training, leash manners).
    • Schedule short daily sessions (5–10 minutes) and log outcomes (success, needs work, distracted).
    • View a weekly progress chart and export printable training cards for each skill.
  • How to try: Paste the code from the GitHub link below into a simple static server (or open index.html) and follow the onboarding flow.

If you want, I can adapt the demo into a small hosted version or a downloadable ZIP you can drop into your editor.

Code

Repository: github.com/yourusername/puppal

Key files:

  • index.html — single-page UI scaffold
  • styles.css — minimal responsive styling
  • app.js — core logic: profile management, session scheduler, logging, and export
  • data/storage.js — localStorage wrapper for persistence
  • print/cards.html — printable training cards template

Example snippet (session logging):

// app.js (simplified)
function logSession(puppyId, skill, result) {
  const puppy = db.getPuppy(puppyId);
  const entry = {
    id: cryptoRandomId(),
    date: new Date().toISOString(),
    skill,
    result // 'success' | 'partial' | 'needs-work'
  };
  puppy.logs.push(entry);
  db.savePuppy(puppy);
  renderProgress(puppy);
}
Enter fullscreen mode Exit fullscreen mode

How I Built It

Overview

I built PupPal as a lightweight, client-side web app so it’s easy to run locally or host as a static site. The app focuses on three things: simplicity, consistency, and visual feedback.

Tech stack

  • Vanilla JavaScript for logic and DOM manipulation (keeps the project small and easy to fork).
  • localStorage for persistence so users can try it without signing up.
  • SVG charts for the weekly progress visualization (small, dependency-free).
  • Printable HTML templates for training cards so users can print or save PDFs from the browser.

Key features and decisions

  • Short-session-first design: Training sessions are intentionally short (5–10 minutes) to encourage daily consistency. The UI nudges users to pick one skill per session.
  • Simple logging model: Each session log stores date, skill, and result. This keeps the data model tiny and easy to analyze.
  • Progress visualization: A weekly bar chart shows counts of success vs partial vs needs-work per skill. This gives a quick, shareable snapshot of progress.
  • Printable cards: Each skill has a one-page card with the skill name, step-by-step micro-goals, and a small checklist for the week. Great for sticking on the fridge.
  • Extensible design: The app is structured so you can add integrations later (e.g., voice coaching, cloud sync, or breed-specific tips).

Implementation notes

  • Data model: puppy = { id, name, breed, dob, logs: [] }. Logs are appended and the UI aggregates them by week and skill.
  • Charting: I used inline SVG to draw bars and labels. This keeps the bundle size tiny and avoids external chart libraries.
  • Accessibility: Buttons and forms use semantic HTML and keyboard focus styles. Printable cards use high-contrast colors for readability.

Prize Categories

I’m submitting this project for the Weekend Challenge: Dog Days Edition. I did not integrate Snowflake, Solana, ElevenLabs, or Google AI in this initial version, but the architecture is intentionally modular so those integrations could be added:

  • Snowflake: Could be used to store and analyze aggregated training data across many users (e.g., to surface breed-specific learning curves).
  • Solana: Could be used to mint collectible “achievement badges” as NFTs for milestones (fun for gamified training).
  • ElevenLabs: Could generate realistic voice prompts or praise lines for training sessions (e.g., a friendly voice saying “Good sit!”).
  • Google AI: Could analyze video snippets of training sessions to auto-detect successful sits or recalls and auto-log results.

If you’d like, I can add one of these integrations and show how it plugs into the existing codebase.

Quick Start (copy-paste)

  1. Clone the repo: git clone https://github.com/yourusername/puppal.git
  2. Open index.html in your browser.
  3. Create a puppy profile and start logging 5-minute sessions.

Future ideas

  • Add photo/video logging so owners can review sessions and share with trainers.
  • Add reminders and calendar integration for scheduled sessions.
  • Add community analytics to compare progress across breeds and ages (privacy-first, opt-in).
  • Add voice coaching (ElevenLabs or Web Speech API) for live praise and cues.
accounts.google.com



Good luck with the Weekend Challenge — I’d love to help polish this into a submission-ready repo and demo.

*(Reference: your DEV new-post editor tab for formatting and submission context). *

Top comments (1)

Collapse
 
dan52242644dan profile image
Dan •

International Dog Day Tribute: Featuring modern epigenetic canine age calculations (DNA methylation formula), biological superpower facts, and an interactive Snoot Booper.🐶