To-do-list

A clean and colorful to-do list web app built with React, FastAPI, and SQLite.

Project Overview

This project is a simple task management app that allows you to:

• Add new tasks
• Mark tasks as completed or pending
• Edit and delete tasks
• Filter tasks by status
• Sort tasks by newest or oldest
• Toggle between light and dark mode

Tech Stack

• Frontend: React (Create React App)
• Backend: FastAPI
• Database: SQLite
• API: REST endpoints for tasks

Folder Structure

• frontend/ - React application source code
• backend/ - FastAPI server code and dependencies

Setup Instructions

Backend

1. Open a terminal and navigate to the backend folder:

   cd backend

2. Create and activate a Python virtual environment:

   python -m venv venv
   venv\Scripts\activate

3. Install required Python packages:

   pip install -r requirements.txt

4. Start the backend server:

   uvicorn main:app --reload

5. The backend will run at http://127.0.0.1:8000.

Frontend

1. Open a terminal and navigate to the frontend folder:

   cd frontend

2. Install frontend dependencies:

   npm install

3. Start the React development server:

   npm start

4. The frontend will open at http://localhost:3000.

Usage

1. Launch the backend server first.
2. Then start the React frontend.
3. Use the app to create, complete, edit, delete, filter, and sort your tasks.

Deployment

The app is deployed on Vercel. You can access the live version at: https://to-do-list-rouge-six-65.vercel.app/

Deployment Methods

• Frontend: Deployed using Vercel for static hosting.
• Backend: The backend is currently set up for local development. For production deployment, consider platforms like Heroku, Railway, or Azure App Service.

Notes

• Make sure the backend server is running before using the frontend so API requests can connect successfully.
• The app currently uses a local SQLite database for task storage.

Enjoy building and customizing your to-do list! 🚀