Habit Tracker App

A simple habit tracking application that allows users to:

  • Create and manage daily habits
  • Track habit completion daily
  • Provide reasons when unable to complete habits
  • View habit streaks and completion history

Project Structure

├── backend/
│   ├── database/
│   │   ├── migrations.ts    # Database schema setup
│   │   └── queries.ts       # Database query functions
│   ├── routes/
│   │   └── habits.ts        # Habit-related API routes
│   └── index.ts             # Main Hono server entry point
├── frontend/
│   ├── components/
│   │   ├── App.tsx          # Main React application
│   │   ├── HabitForm.tsx    # Form for creating habits
│   │   ├── HabitList.tsx    # List of habits with tracking
│   │   └── HabitCard.tsx    # Individual habit card component
│   ├── index.html           # Main HTML template
│   ├── index.tsx            # Frontend React entry point
│   └── style.css            # Custom styles
├── shared/
│   └── types.ts             # Shared TypeScript types
└── README.md

Features

  • Habit Management: Create, edit, and delete habits
  • Daily Tracking: Mark habits as completed or missed with optional reasons
  • Streak Tracking: View current and longest streaks for each habit
  • Responsive Design: Works on desktop and mobile devices

Tech Stack

  • Backend: Hono (TypeScript API framework)
  • Database: SQLite
  • Frontend: React with TypeScript
  • Styling: TailwindCSS
  • Storage: Val Town SQLite and Blob storage