• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
tfsops

tfsops

habits

Public
Like
habits
Home
Code
4
backend
3
frontend
4
shared
1
README.md
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
index.ts
https://tfsops--02346aaa3f9c11f099fa76b3cceeab13.web.val.run
README.md

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
HTTP
  • index.ts
    tfsops--02…13.web.val.run
Code
backendfrontendsharedREADME.md
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
We’re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
Β© 2025 Val Town, Inc.