Project Task Manager
Full-Stack Todo Application • React + Express + TypeScript + SQLite
Introduction
Project Task Manager is a full-stack task management application built as part of a job interview coding exercise. The project demonstrates clean CRUD operations, backend persistence, frontend state management, validation, error handling, and automated backend API tests.
The goal was not just to complete the required features, but to build the project in a professional way that is easy to review, explain, test, and extend.
Core Features
- Add new tasks
- Mark tasks complete or incomplete
- Edit existing task titles
- Delete tasks with confirmation
- Filter tasks by all, active, or completed status
- Display remaining task count
- Clear all completed tasks
- Prevent empty and duplicate task titles
- Persist task data using SQLite
System Design
The application is separated into a React frontend and an Express backend. The frontend handles task interaction, filtering, editing, and user feedback. The backend exposes a small REST API and stores task data in SQLite.
The backend is organized into routes, controllers, services, database setup, and models so each layer has a clear responsibility. This keeps the code easier to test and easier to explain during a technical walkthrough.
Testing and Validation
Backend API tests were written with Vitest and Supertest to cover core behavior and edge cases. The test suite uses a temporary SQLite database so local development data does not affect test results.
- Task creation
- Task listing
- Task completion updates
- Task title editing
- Task deletion
- Clear completed tasks
- Invalid input handling
- Missing task handling
UI Direction
The interface uses a black and green theme with off-white text. The task list is scrollable so the layout stays anchored even as more tasks are added. Completed tasks are visually distinguished with muted text and strikethrough.
Tech Stack
Status
Feature-complete for the interview exercise, with backend tests passing, frontend and backend builds passing, expanded README documentation, and design notes included for review.