" Time is more valuable than money. You can get more money, but you cannot get more time. " - Jim Rohn

To Do list

The project's goal is to learn how to use webpack. "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. You will build a simple website that allows for doing that, and you will do it using ES6 and Webpack!

the to-do list we're going to create has a beautiful UI, the user can add a to-do by filling the input and hit ENTER, after that he can rather check the to-do when it's done, or remove it using the delete button.

The user's to-do list is stored in the local storage, so when he refreshes the page, he can always find the list there.

screen shot of my to-do-list tool

To-DO-List Live Demo

Live demo

Built with 🔨

• HTML, CSS,
• JavaScript-ES6
• Git & Github
• github pages
• Store data with LocalStorage
• fix errors with Linters
• Features of webpack and plugins already included
  • style-loader
  • css loader
  • HtmlWebpackPlugin
  • WebPack Dev Server

Usage

• Navigate to your desired directory in your local machine using the terminal.

• Clone repository by running git clone git@github.com:Hamzaoutdoors/to-do-list.git in your local terminal

• Run the following command to install the needed dependencies npm install

• Use the following commands to npm run start to start the Webpack Dev server and serve the files from the dist directory npm run build to complile build all source files into the dist directory npm run watch to set webpack into watch mode so that the build is automatically run whenever changes are made to any of the source files.

Authors

👤 EllaouziHamza

• GitHub: hamzaoutdoors
• LinkedIn : Hamza Ellaouzi
• Twitter: Hamza Ellaouzi

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!