https://github.com/serverless-operations/todo-app-using-spec-kit

Last synced: 9 months ago
JSON representation

Host: GitHub
URL: https://github.com/serverless-operations/todo-app-using-spec-kit
Owner: serverless-operations
Created: 2025-09-11T15:15:10.000Z (9 months ago)
Default Branch: main
Last Pushed: 2025-09-11T17:36:59.000Z (9 months ago)
Last Synced: 2025-09-11T20:16:53.061Z (9 months ago)
Language: TypeScript
Size: 78.1 KB
Stars: 0
Watchers: 0
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# TODO Task Management System

A full-stack task management application with Japanese language support, built with TypeScript, React, and Express.js.

## Features

- ✅ Create, read, update, and delete tasks
- 📅 Set deadlines for tasks
- ⚠️ Visual warnings for approaching and overdue deadlines
- ✓ Mark tasks as completed
- 🇯🇵 Japanese date formatting (YYYY年MM月DD日 HH:mm)
- 📱 Responsive web interface
- 🚀 Real-time updates with React Query

### Deadline Warnings
- **Yellow highlight**: Tasks due within 3 days (期限が近づいています)
- **Red highlight**: Overdue tasks (期限を過ぎています)

## Tech Stack

### Backend
- Node.js 22
- Express.js 5
- TypeScript
- SQLite3 (better-sqlite3)
- Zod for validation
- Winston for logging

### Frontend
- React 19
- TypeScript
- React Router v7
- React Query (TanStack Query)
- Vite
- Axios

## Prerequisites

- Node.js 22.x or higher
- npm 11.x or higher

## Installation

1. Clone the repository:
```bash
git clone https://github.com/serverless-operations/todo-app-using-spec-kit.git
cd todo-app
```

2. Install dependencies:
```bash
# Install all dependencies (root, backend, and frontend)
npm run install:all
```

## Development

### Run both backend and frontend:
```bash
npm run dev
```

This will start:
- Backend API server on http://localhost:4000
- Frontend dev server on http://localhost:5173

### Run services individually:

Backend only:
```bash
npm run dev:backend
```

Frontend only:
```bash
npm run dev:frontend
```

## Building for Production

```bash
# Build both backend and frontend
npm run build

# Start production server
npm run start
```

## Testing

### Run all tests:
```bash
npm run test
```

### Run backend tests:
```bash
npm run test:backend
```

### Run frontend tests:
```bash
npm run test:frontend
```

### Test Coverage:
```bash
cd backend && npm run test:coverage
cd frontend && npm run test:coverage
```

## Project Structure

```
todo-app/
├── backend/
│ ├── src/
│ │ ├── db/ # Database initialization
│ │ ├── middleware/ # Express middleware
│ │ ├── models/ # Data models and validation
│ │ ├── routes/ # API routes
│ │ ├── services/ # Business logic
│ │ ├── types/ # TypeScript types
│ │ └── utils/ # Utility functions
│ ├── tests/
│ │ ├── contract/ # API contract tests
│ │ ├── integration/ # Integration tests
│ │ └── unit/ # Unit tests
│ └── data/ # SQLite database file
├── frontend/
│ ├── src/
│ │ ├── components/ # React components
│ │ ├── hooks/ # Custom React hooks
│ │ ├── pages/ # Page components
│ │ ├── providers/ # Context providers
│ │ ├── services/ # API services
│ │ └── types/ # TypeScript types
│ └── tests/ # Frontend tests
├── docs/ # Documentation
└── specs/ # Specifications

```

## API Documentation

See [docs/api.md](docs/api.md) for detailed API documentation.

### Quick API Reference

| Method | Endpoint | Description |
|--------|----------|-------------|
| GET | `/api/tasks` | Get all active tasks |
| GET | `/api/tasks/completed` | Get completed tasks |
| GET | `/api/tasks/:id` | Get task by ID |
| POST | `/api/tasks` | Create new task |
| PUT | `/api/tasks/:id` | Update task |
| DELETE | `/api/tasks/:id` | Delete task |
| PATCH | `/api/tasks/:id/complete` | Mark task as complete |

## Environment Variables

### Backend (.env)
```
PORT=4000
FRONTEND_URL=http://localhost:5173
```

### Frontend (.env)
```
VITE_API_URL=http://localhost:4000
```

## Database

The application uses SQLite for data persistence. The database file is automatically created at `backend/data/tasks.db` on first run.

### Database Schema

```sql
CREATE TABLE tasks (
id TEXT PRIMARY KEY,
content TEXT NOT NULL,
deadline TEXT NOT NULL,
status TEXT NOT NULL,
created_at TEXT NOT NULL,
completed_at TEXT
)
```

## Scripts

### Root package.json
- `npm run dev` - Run both backend and frontend in development mode
- `npm run build` - Build both backend and frontend
- `npm run start` - Start production server
- `npm run test` - Run all tests
- `npm run install:all` - Install all dependencies

### Backend Scripts
- `npm run dev` - Start development server with hot reload
- `npm run build` - Compile TypeScript to JavaScript
- `npm run start` - Start production server
- `npm run test` - Run tests
- `npm run db:init` - Initialize database

### Frontend Scripts
- `npm run dev` - Start Vite dev server
- `npm run build` - Build for production
- `npm run preview` - Preview production build
- `npm run lint` - Run ESLint

## Contributing

1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request

## License

This project is licensed under the MIT License.

## Acknowledgments

Built with [Spec-Driven Development](https://github.com/serverless-operations/spec-kit) methodology.

ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

https://github.com/serverless-operations/todo-app-using-spec-kit

Awesome Lists containing this project

README