Tiny Tasks

A family chores PWA for kids and parents. Kids swipe through daily chores and track weekly progress toward an allowance. Parents manage chores and kids from an admin dashboard.

Stack

• Next.js 15 — App Router, TypeScript, React Compiler
• Convex — real-time reactive backend + database
• Tailwind CSS v4 — styling
• Framer Motion — animations
• Google Fonts — Geist, Outfit

Getting Started

1. Install dependencies

npm install

2. Set up Convex

npx convex dev

This will prompt you to log in and create a Convex project on first run, then generate convex/_generated/ and print your deployment URL.

3. Configure environment

Create .env.local and add your Convex URL:

NEXT_PUBLIC_CONVEX_URL=https://your-deployment.convex.cloud

4. Run the dev server

In a separate terminal:

npm run dev

Open http://localhost:3000. Both terminals need to stay running.

Other Commands

npm run build      # Production build
npm run lint       # ESLint
npx convex deploy  # Deploy backend to Convex cloud

Adding Chore Illustrations

Drop .png files into public/chores/. They'll automatically appear in the illustration picker when creating or editing a chore — no code changes needed. The background color for each card is sampled from the image automatically.

PWA Assets

Icons and splash assets live in public/:

File	Purpose
icon.png	Browser favicon
icon-192.png	PWA home screen icon (192×192)
icon-512.png	PWA home screen icon (512×512)
apple-touch-icon.png	iOS add-to-home-screen icon (180×180)

Deployment

• Frontend: Vercel — connect the repo and set NEXT_PUBLIC_CONVEX_URL as an environment variable
• Backend: npx convex deploy — deploys Convex functions and schema to the cloud