To-Do List App with Azure Cosmos DB Thanks for visiting the To-Do List project! This project allows users to create, manage, and delete tasks in a to-do list while integrating Azure Cosmos DB for persistent cloud storage.
This README provides a quick overview of the project features and setup instructions.
Project Overview This project is a simple to-do list application that allows users to:
Add new tasks Edit existing tasks Mark tasks as completed Delete tasks The data is stored in Azure Cosmos DB (NoSQL), allowing for easy scaling and high availability. The application is built using Node.js, Express.js, HTML, CSS, and JavaScript.
Features Cloud-Based Storage Azure Cosmos DB: Used for storing tasks in the cloud, providing scalable and persistent storage. Task Management Users can add, edit, delete, and mark tasks as completed. Data is updated in real-time and persisted in the cloud using Cosmos DB. Frontend HTML: Provides the structure for the app. CSS: Used to style the app and make it user-friendly. JavaScript: Implements the frontend logic to manage the task list. Backend Node.js & Express.js: Handle requests for CRUD operations on tasks. Azure Cosmos DB: A NoSQL database for storing tasks. Setup and Installation Prerequisites Before running the project, make sure you have the following installed:
Node.js npm (Node Package Manager) Azure Cosmos DB account Installation Steps Clone the repository:
bash Copy code git clone https://github.com/your-username/todo-list-app.git cd todo-list-app Install dependencies:
bash Copy code npm install Set up environment variables:
Create a .env file in the root of the project and add your Azure Cosmos DB credentials:
makefile Copy code COSMOS_DB_ENDPOINT= COSMOS_DB_KEY= COSMOS_DB_DATABASE= COSMOS_DB_CONTAINER= Run the app:
bash Copy code npm run dev Visit the app in your browser at http://localhost:3000.
Project Structure bash Copy code to-do-list-app/ │ ├── public/ # Contains static assets like HTML, CSS, and client-side JS │ ├── index.html # Main HTML file for the frontend │ ├── style.css # CSS file for styling │ ├── script.js # JavaScript file for frontend logic │ ├── server/ # Contains server-side code │ ├── models/ # Mongoose schemas │ │ └── Task.js # Task model schema │ ├── routes/ # Express routes │ │ └── tasks.js # CRUD routes for tasks │ ├── server.js # Main server entry point │ ├── config/ # Configuration files │ └── config.env # Environment variables (e.g., Azure Cosmos DB connection string) │ ├── azure/ # Azure-specific configurations │ ├── notification.js # Code for Azure Notification Hubs │ ├── functions/ # Optional Azure Functions (if using serverless architecture) │ └── sendReminder.js # Example Azure Function for sending reminders │ ├── .env # Environment variables for local development ├── .gitignore # Files and folders to ignore in version control ├── package.json # Node.js dependencies and scripts ├── package-lock.json # Lock file for exact dependency versions │ └── README.md # Project documentation Demonstration You can watch a video of the project in action by clicking the link below:
Project Demonstration Video
Requirements Azure Cosmos DB account for cloud-based task storage. Azure Notification Hubs (optional) for sending reminders. Contributing If you'd like to contribute to this project, feel free to fork the repository, create a new branch, and submit a pull request.
License This project is open-source and available under the MIT License.
Built With
- and
- azure-app-services-**cloud-services:**-azure-functions
- azure-sql-database
- azure-storage-**apis:**-openai-api-(for-ai-based-features)
- copilot
- css-**frameworks:**-react.js-(frontend)
- debugging
- express.js-**platforms:**-github-copilot
- github-api-**databases:**-azure-sql-database-**extensions:**-vs-code-extensions-for-linting
- html
- integration
- languages:**-javascript
- node.js-(backend)
- typescript
- visual-studio-code

Log in or sign up for Devpost to join the conversation.