/to-do-list-review

This project is copied from the fourth project in the second module in Microverse program. It is intended for practicing code reviews & peer feedback. It should adhere to best practices in (HTML / CSS / JavaScript) & comply with (DRY / KISS / YAGNI) principles.

Primary LanguageJavaScriptMIT LicenseMIT

🏷️ To Do List Review

This is an exercise practised on the fourth project in the second module in the Microverse program.
Check the below contents for further details about this project.

📗 Contents

📖 Description

This project is copied from the fourth project which was a simple task management app with ES6 modules and bundled with WebPack. It is intended for practicing code reviews & peer feedback. It should adhere to best practices in (HTML / CSS / JavaScript) & comply with (DRY / KISS / YAGNI) principles. All project files are contained in src directory. Also config linters for (HTML / CSS3 / JavaScript) in the .github folder.

📌 Live Demo:

  • See the project live from here.

📌 Tech Stack:

  • Page strucutre is built with HTML5
  • Styling is built with CSS3
  • Dynamic content is built with JavaScript

📌 Key Features:

  • Responsive layout for all screens
  • Tasks list is loaded dynamically
  • Clear all completed tasks
  • All tasks are locally stored
  • Mark any task for completion
  • Organize tasks by drag & drop
  • Hover effect for icons & buttons
  • Refresh & reload list from storage
  • Edit any task by clicking on it & typing
  • Manually remove any task when higlighted
  • Add new tasks with maximum of 50 charaters

back to top

🛠️ Instructions

You can easily download or fork this repository and work on it immadiately!

📌 Prerequisites:

  • NodeJS for installing & running all packages

📌 Setup:

  • Install all dependencies with npm
  • For live development on localhost:8080 run:
npm run start

📌 Deployment:

  • You can deploy this project by uploading files in the dist folder to a live server.
  • Create the distribution build using this command:
npm run build

back to top

👥 Authors

📌 Mahammad:

back to top

🔭 Future

Some additional features I may implement in the project:

  • Using CSS preprocessors and their relevant loaders
  • Implement two WebPack configurations for production & development

back to top

🤝🏻 Contributions

Wish to contribute to this project?
Contributions, issues, and feature requests are more than welcome!
Feel free to check the issues page too.

back to top

⭐️ Support

Like this project? Show your support by starring!

back to top

🙏🏻 Acknowledgements

I thank everyone at Microverse for guiding me through this project.

back to top

📝 License

This project is MIT licensed.

back to top