Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

A modern, full-featured To-Do application built with Node.js, Express, and a beautiful HTML/CSS frontend. This project is perfect for beginners and open source contributors who want to learn about full-stack web development without a database—data is stored in JSON files for simplicity.

Notifications You must be signed in to change notification settings

itzabhinavarya/ToDo-Application

Repository files navigation

Pro To-Do Application

A modern, full-featured To-Do application built with Node.js, Express, and a beautiful HTML/CSS frontend. This project is perfect for beginners and open source contributors who want to learn about full-stack web development without a database—data is stored in JSON files for simplicity.

🚀 Features

  • User authentication (Sign Up & Login with Name, Email, Password)
  • Session management (shows who is logged in)
  • Add, edit, delete, and toggle completion of to-dos
  • Each user has their own to-do list
  • Responsive, modern UI with floating labels and glassmorphism
  • Search, filter, and sort todos
  • All data stored in JSON files (no database required)
  • Clean code, easy to extend and contribute

🛠️ Tech Stack

  • Frontend: HTML, CSS (Poppins font, glassmorphism, responsive design), Vanilla JS
  • Backend: Node.js, Express.js, CORS
  • Other:
    • Data storage: JSON files (users.json, todos.json, sessions.json)
    • Dev tools: nodemon, supertest

📸 Project Glimpse

image image image image

📦 Getting Started

Prerequisites

  • Node.js (v14 or higher recommended)
  • npm (comes with Node.js)

Setup Instructions

  1. Fork this repo or Download ZIP.
  2. Open the folder in your favorite code editor.
  3. Install dependencies:
    npm install
  4. Start the server:
    npm start
  5. Open your browser and go to http://localhost:3000

✨ Usage

  • Sign Up: Register with your name, email, and password.
  • Login: Use your email and password to log in.
  • Manage To-Dos: Add, edit, delete, and mark to-dos as complete/incomplete.
  • Search/Filter/Sort: Use the controls to find and organize your tasks.
  • Session: The app shows who is logged in in the header.

🤝 Contributing

We welcome contributions! To get started:

  1. Fork the repository.
  2. Create a new branch: git checkout -b feature/your-feature-name
  3. Make your changes and commit: git commit -m 'Add some feature'
  4. Push to your fork: git push origin feature/your-feature-name
  5. Open a Pull Request describing your changes.

Contribution Guidelines:

  • Write clean, readable code and add comments where helpful.
  • Update documentation as needed.
  • For major changes, open an issue first to discuss what you’d like to change.
  • Be respectful and constructive in code reviews and discussions.

🧑‍💻 Author

📄 License

This project is licensed under the ISC License. See the LICENSE file for details.

🔮 Future Scope

  • Add persistent database support (MongoDB, PostgreSQL, etc.)
  • Add user profile and password reset features
  • Add due dates, reminders, and notifications
  • Add drag-and-drop for task reordering
  • Add mobile app (React Native or Flutter)
  • Add dark mode and more themes
  • Add unit and integration tests
  • Add deployment scripts for cloud platforms

⭐️ Star this repo if you found it helpful!

Happy coding! 🌟

About

A modern, full-featured To-Do application built with Node.js, Express, and a beautiful HTML/CSS frontend. This project is perfect for beginners and open source contributors who want to learn about full-stack web development without a database—data is stored in JSON files for simplicity.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

AltStyle によって変換されたページ (->オリジナル) /