Skip to content

Latest commit

 

History

History
163 lines (128 loc) · 4.5 KB

File metadata and controls

163 lines (128 loc) · 4.5 KB

TaskBoard

  FastAPI   React   TailwindCSS   Ant Design   PostgreSQL   Docker Compose

TaskBoard — веб-приложение для управления задачами. Пользователь может зарегистрироваться, войти в систему, создавать задачи, удалять их и отмечать как выполненные.

Table of Contents

About

Проект сделан как простой task manager с разделением на frontend и backend.

В приложении есть базовый сценарий работы с задачами:

  • регистрация пользователя;
  • вход в систему;
  • просмотр списка задач;
  • создание новой задачи;
  • удаление задачи;
  • переключение статуса выполнения.

Backend поднимается на FastAPI, frontend сделан на React, а данные хранятся в PostgreSQL.

Installation

Run with Docker

Клонируйте репозиторий:

git clone https://github.com/Jlychee/TaskBoard.git
cd TaskBoard

Запустите проект через Docker Compose:

docker compose up --build

После запуска сервисы будут доступны по адресам:

  • frontend — http://localhost:5173
  • backend — http://localhost:8000
  • PostgreSQL — localhost:5433

Local run

Backend

cd backend
pip install -r requirements.txt
uvicorn src.main:app --reload

Frontend

cd frontend
npm install
npm run dev

Tech Stack

  • Python 3.12
  • FastAPI
  • SQLAlchemy
  • Alembic
  • PostgreSQL
  • Passlib / bcrypt
  • React
  • Vite
  • Tailwind CSS
  • Ant Design
  • React Router
  • Axios
  • Docker Compose

Backend

Backend находится в папке backend/.

Что есть в серверной части:

  • роуты для пользователей и задач;
  • регистрация и логин;
  • создание таблиц при старте приложения;
  • CRUD-операции для задач;
  • хеширование паролей;
  • миграции через Alembic;
  • CORS для локального frontend.

Основные endpoint'ы:

  • POST /users/create_user
  • POST /users/login
  • GET /users
  • GET /users/{id}
  • GET /tasks/{id}
  • POST /tasks/create_task
  • DELETE /tasks/delete_task/{id}
  • PATCH /tasks/toggle_task/{id}

Frontend

Frontend находится в папке frontend/.

Клиентская часть включает:

  • форму регистрации;
  • форму входа;
  • контейнер со списком задач;
  • маршрутизацию между экранами;
  • контекст авторизации;
  • UI на Ant Design и Tailwind CSS.

Основные компоненты:

  • Card.jsx
  • LoginForm.jsx
  • RegisterForm.jsx
  • ToDoContainer.jsx

Project structure

TaskBoard/
├── backend/
│   ├── src/
│   │   ├── api/
│   │   ├── crud/
│   │   ├── db/
│   │   ├── migrations/
│   │   ├── schemas/
│   │   └── main.py
│   ├── Dockerfile
│   ├── alembic.ini
│   └── requirements.txt
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── App.jsx
│   │   ├── AuthContext.jsx
│   │   └── main.jsx
│   └── package.json
└── docker-compose.yml

Authors