https://github.com/abdulrahim-ramadan/django-react-todo-app
The Django-React To-Do App is a modern task management tool. It uses Django for the backend and React for the frontend, enabling users to create, edit, and delete tasks with real-time updates and responsive design, perfect for boosting productivity and organization.
https://github.com/abdulrahim-ramadan/django-react-todo-app
api axios bootstrap corsheaders css django django-rest-framework javascript nodejs python python3 react
Last synced: 19 days ago
JSON representation
The Django-React To-Do App is a modern task management tool. It uses Django for the backend and React for the frontend, enabling users to create, edit, and delete tasks with real-time updates and responsive design, perfect for boosting productivity and organization.
- Host: GitHub
- URL: https://github.com/abdulrahim-ramadan/django-react-todo-app
- Owner: abdulrahim-ramadan
- Created: 2024-05-29T22:15:12.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-03-05T08:25:15.000Z (3 months ago)
- Last Synced: 2025-03-30T22:51:13.325Z (about 2 months ago)
- Topics: api, axios, bootstrap, corsheaders, css, django, django-rest-framework, javascript, nodejs, python, python3, react
- Language: Python
- Homepage:
- Size: 429 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
### 📝 ToDo App Using Django RestFramework + React
![]()
![]()
This project utilizes Django RestFramework for the backend and React for the frontend, creating a seamless and efficient task management application.
#### Project Contains:
- **[Backend Repository](https://github.com/abdulrahim-ramadan/Django-React-ToDO-APP/tree/main/backend)**
- **[Frontend Repository](https://github.com/abdulrahim-ramadan/Django-React-ToDO-APP/tree/main/frontend)**## 📑 Contents
- [📸 Demo](#demo)
- [✨ Features](#features)
- [⚙️ Installation](#installation)
- [🚀 Usage](#usage)
- [🔌 API Endpoints](#api-endpoints)
- [🛠️ Technologies](#technologies)
- [🤝 Contributing](#contributing)
- [📄 License](#license)## 📸 Demo
## ✨ Features
- 🔐 User registration and login
- 📝 Create, edit, and delete
- ✅ Mark tasks as completed
- 🔄 Real-time updates
- 📱 Responsive design## ⚙️ Installation
### Tech Stack:
- Backend: Python Django, Django RestFramework
- Frontend: React, Bootstrap 5 Node.js
- Additional Technologies: CORS Headers, Axios### Backend (Django)
1. Clone the repository:
```sh
git clone https://github.com/abdulrahim-ramadan/Django-React-ToDO-APP.git
cd Django-React-ToDO-APP/backend
```
2. Create and activate a virtual environment:
```sh
python -m venv venv
source venv/bin/activate # On Windows: venv\Scripts\activate
```
3. Install dependencies:
```sh
pip install -r requirements.txt
```
4. Run database migrations:
```sh
python manage.py migrate
```
5. Start the development server:
```sh
python manage.py runserver
```### Frontend (React)
1. Navigate to the frontend directory:
```sh
cd ../frontend
```
2. Install dependencies:
```sh
npm install
```
3. Start the development server:
```sh
npm start
```## 🚀 Usage
1. Open your browser and go to `[http://127.0.0.1:8000/todo/]`.
2. Register or log in.
3. Start managing your tasks.## 🔌 API Endpoints
- `GET /api/tasks/` - List all tasks
- `POST /api/tasks/` - Create a new task
- `PUT /api/tasks//` - Update a task
- `DELETE /api/tasks//` - Delete a task## 🛠️ Technologies
- **Backend:** Django, Django REST Framework
- **Frontend:** React, Redux
- **Database:** SQLite (default), can be easily switched to PostgreSQL or MySQL## 🤝 Contributing
Contributions are welcome! Please open an issue to report bugs or suggest features. Fork the repository and create a pull request for your changes.