A comprehensive, full-stack ToDo List application designed with a mobile-first approach.
Explore the docs Β»
View Demo
Β·
Report Bug
Β·
Request Feature
Table of Contents
This repository contains the code for a comprehensive, full-stack ToDo List application. It's designed with a mobile-first approach, ensuring a seamless experience across all platforms. Users can register and log in with their unique username and password, allowing them to access their data from any device. The app offers robust user authentication, including the ability to update passwords.
demo.mp4
Key features of the ToDo List app include:
- List Management: Users can create, update, and organize lists, which serve as group units for tasks. Each list has a title and an optional description.
- Task Creation: Within each list, users can create tasks with customizable titles and descriptions.
- Due Date Functionality: Tasks can have optional due dates. When a due date passes, the task automatically enters an overdue status.
- Flexible Task Management: Users can modify task titles, descriptions, and due dates, or remove due dates entirely.
- Dashboard: A comprehensive dashboard provides an overview of the user's productivity, displaying total task count, completed tasks, pending tasks, and overdue items.
Feature Desktop Mobile Theme 

List Management 

Task Management 

Dashboard 

User Authentication 

Password Management 

Responsive Design 
This application showcases modern web development practices, incorporating React, .NET, SQL, and WebSockets. It's being developed using test-driven development (TDD) methodologies, and is fully containerized using Docker.
The ToDo List application is live and ready to use! You can access it directly at:
Simply visit the URL to start using the application. You can create an account, log in, and begin managing your tasks right away.(Due to the cost of the server, the database may need 30 seconds to wake up)
For developers interested in running the project locally:
- Git
- Docker
-
Clone the repo
git clone https://github.com/realYushi/todo-list.git
-
Navigate to the project directory
cd todo-list -
Copy the
.env.examplefile to.env
cp .env.example .env- Edit the
.envfile and replace the placeholder values with your actual configuration.Note: If you don't set up a
.envfile or don't define all variables, the project will use the default values specified in thedocker-compose.ymlfile. - Run the application using Docker Compose
make run
- Access the application in your browser(start with HTTPS)
https://localhost-
Accessing localhost with HTTPS:
-
Use Google Chrome or Microsoft Edge to access the website.
-
For Chrome: Enter
chrome://flagsin the address bar.- Enable Temporarily unexpire MXX flag
- Enable allow-insecure-localhost flag
- Enable the "Allow invalid certificates for resources loaded from localhost" option.
-
For Edge:
- Enter
edge://flags/#allow-insecure-localhostin the address bar. - Enable the "Allow invalid certificates for resources loaded from localhost" option.
- Enter
-
Restart your browser for the changes to take effect.
This step is necessary because the development server uses a self-signed certificate, which browsers typically flag as insecure.

-
Use this space to show useful examples of how the project can be used. Additional screenshots, code examples and demos work well in this space.
- User Authentication
- List Management
- Task Creation and Management
- Dashboard
- Asynchronous Updates
- OAuth2.0 Integration
- Notifications
- Tags
- Search
- AI Integration
- Collaboration Features
See the open issues for a full list of proposed features (and known issues).
Since this is a personal project, contributing is currently not open. However, any feedback or suggestions are welcome. Please feel free to reach out to me.
Distributed under the MIT License. See LICENSE.txt for more information.
Yushi Cui - realYushi@gmail.com
Project Link: https://github.com/realYushi/todo-list
Blog: https://blog.yushi91.com