-The goal of this project is to build a simple HTML list of To Do tasks. The list will be styled according to the specifications listed later in this lesson. This simple web page will be built using webpack and served by a webpack dev server.
Setup your project:
- Set up a new project with webpack that is based on the webpack exercise you have already completed.
- Create an index.html file and write your HTML markup here. Create an empty To Do - - List placeholder (or
- element). The index.html file must be set as a template using the HTML Webpack Plugin.
- Create an index.js file and set an array of some simple to do tasks (array of objects). Each task object should contain three keys:
- description [string].
- completed [bool].
- index: [number].
- Write a function to iterate over the tasks array and populate an HTML list item element for each task.
- On page load render the dynamically created list of tasks in the dedicated placeholder. The list should appear in order of the index values for each task.
- Create a style.css and set rules for the To Do List. CSS must be loaded by Webpack Style/CSS Loader. Your list should be a clone of the part of the minimalist project captured in the video below.
- https://www.youtube.com/watch?v=AcUd-_Yjjqg
- JS
- HTML
- CSS
- Github
To get a local copy up and running:
- Clone this repository or download the Zip folder:
git@github.com:principles31/To_Do_List.git- Navigate to the location of the folder in your machine:
you@your-Pc-name:~$ cd <folder>👤 Author1
- GitHub: @principle31
- Twitter: @manuel31mens
- LinkedIn: emmanuel-mensah
- Contributions, issues, and feature requests are welcome!
Give a star if you like this project!
- Microverse
- Hat tip to anyone whose code was used
- Inspiration
This project is MIT licensed.