A modern Todo List application built using Next.js 14, React 18, TailwindCSS, and Material UI. The goal of this project is to provide a clean task management experience while also serving as a learning-friendly open source project for developers who want to contribute and improve their full-stack skills.
This repository is intentionally structured to encourage real-world collaboration workflows, similar to how production teams operate.
| Category | Technologies |
|---|---|
| Framework | Next.js 14 |
| UI Library | React 18 |
| Styling | TailwindCSS |
| UI Components | Material UI |
| Icons | Lucide React + MUI Icons |
| Animation | Anime.js |
| Tooling | PostCSS, Autoprefixer |
Follow these steps to run the project locally.
git clone https://github.com/<your-username>/todolist.gitcd todolistnpm installnpm run devNow open:
http://localhost:3000
| Command | Purpose |
|---|---|
npm run dev |
Runs development server |
npm run build |
Builds production bundle |
npm start |
Runs production build |
npm run lint |
Runs ESLint checks |
This project welcomes contributions from developers of all experience levels. However, contributions must follow clear standards to maintain project quality.
Please read these rules carefully before submitting a pull request.
If your contribution modifies the user interface, you must:
• Include before and after screenshots in the Pull Request • Explain what UI component was modified • Describe why the change improves the UI
Example:
Feature: Improved Task Card Layout
Changes:
- Added hover animation
- Improved checkbox styling
- Updated spacing for readability
Impact:
Better visual hierarchy and improved interaction feedback
If your contribution modifies logic, state management, or APIs, you must:
• Clearly explain what was changed • Provide usage examples • Describe the impact on application behavior
Example:
Feature: Optimized Task Completion Logic
Changes:
- Updated reducer logic for task state updates
- Reduced unnecessary re-renders
Example Usage:
dispatch({
type: "TASK_COMPLETED",
payload: { month: 2, index: 4 }
})
Impact:
Improves state update performance and prevents UI flickering
All contributions must follow these rules:
✔ Use clean and readable code ✔ Follow existing project structure ✔ Avoid unnecessary dependencies ✔ Write meaningful commit messages ✔ Test your changes before submitting a PR
Pull requests that do not follow these guidelines may be rejected.
Follow this workflow when contributing.
Click the Fork button at the top right of the repository page.
This creates your own copy of the project.
git clone https://github.com/<your-username>/todolist.gitNever work directly on main.
git checkout -b feature/your-feature-nameExample:
feature/improve-checkbox-ui
Update the code, test your changes locally, and ensure everything works.
git add .
git commit -m "feat: improved checkbox UI with animations"git push origin feature/your-feature-nameGo to your fork on GitHub and click:
New Pull Request
Provide:
• A clear description of your changes • Screenshots (if UI updates) • Examples (if backend updates)
If you are new to open source, you can start with:
• UI improvements • Accessibility improvements • Performance optimizations • Code refactoring • New task management features
This project is open for contributions from developers who want to learn, build, and collaborate.
Whether you are a beginner exploring open source or an experienced developer improving the architecture, your contributions are welcome.
If you found this project helpful:
Don't just fork — star too ⭐
It helps the project grow and reach more developers.
This project is completely free for newcomers to explore the codebase, understand how things work, and build something crazy together.
Let’s learn, collaborate, and ship great software.
Happy coding 👨💻