Public
Like
untitled-4247
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.
A full-featured expense tracking application built with React, Hono, and SQLite.
- User Authentication: Sign up, log in, and log out
- Dashboard: Summary of total income, expenses, and current balance
- Transaction Management: Add income/expense entries with amount, category, date, and description
- Filtering & Search: Filter by type, date range, or category
- Monthly Budgeting: Set monthly budgets and track remaining amounts
- Data Visualization: Pie and bar charts for spending analysis
- Mobile-Friendly: Responsive design for all devices
├── backend/
│ ├── database/
│ │ ├── migrations.ts # Database schema
│ │ └── queries.ts # Database operations
│ ├── routes/
│ │ ├── auth.ts # Authentication routes
│ │ ├── transactions.ts # Transaction CRUD
│ │ ├── budgets.ts # Budget management
│ │ └── static.ts # Static file serving
│ └── index.ts # Main server entry point
├── frontend/
│ ├── components/
│ │ ├── App.tsx # Main app component
│ │ ├── Auth/ # Authentication components
│ │ ├── Dashboard/ # Dashboard components
│ │ ├── Transactions/ # Transaction management
│ │ └── Charts/ # Data visualization
│ ├── index.html # Main HTML template
│ ├── index.tsx # Frontend entry point
│ └── style.css # Global styles
└── shared/
└── types.ts # Shared TypeScript types
- Frontend: React 18.2.0 with TypeScript
- Backend: Hono framework
- Database: SQLite
- Styling: TailwindCSS
- Charts: Chart.js
- Authentication: Session-based with secure cookies
The app is automatically deployed on Val Town. Access the main endpoint to start using the expense tracker.
POST /api/auth/signup
- User registrationPOST /api/auth/login
- User loginPOST /api/auth/logout
- User logoutGET /api/auth/me
- Get current userGET /api/transactions
- Get user transactionsPOST /api/transactions
- Create transactionPUT /api/transactions/:id
- Update transactionDELETE /api/transactions/:id
- Delete transactionGET /api/budgets
- Get user budgetsPOST /api/budgets
- Create/update budgetGET /api/dashboard
- Get dashboard summary