
Hosted Project
JavaScript Todo App Project (Hosted on Github Pages)
Source Files
https://js-beginners.github.io/javascript-todo-project/ (Hosted on Github)
Project Objective
The objective of this JavaScript project is to create a todo application that uses local storage and allows for edits, among other things.
JavaScript Used
- DOM manipulations
- conditionals
- eventListeners
- CSS style manipulations
- functions…
- …pretty much all of the language
My Personalize Summary
Just like Mead's Note App Project, this todo app project can be found in Andrew Mead's Modern JavaScript course. As I stated previously, this is great course that I first completed in March of this year, but I wanted to go through it again so I could complete all 3 of his projects, again.
This todo application project is the project he builds to teach his students JavaScript. He builds the components during the notes app as he teaches JavaScript, and then he challenges his students to add similar features to this Todo app, which is built in conjunction.
New Things Learned or Refreshed
Again, as I stated about the notes app, going through this project again refreshed my knowledge on many things. The things that stand out are the uses of local storage, the eventlistener that the window object listens for when there is a change to local storage, the differences between the “change” and “input” event listeners, the window.location.assign method, and many, many more features of the language.
Time to Code
I can't really time this project since it was a follow-along that also including lots of stopping and starting. I just know that it was well worth my time and I'm confident that I could build it on my own if I wanted.
Your Turn!
What To Accomplish
- Download the source code from the github repository above.
- Delete the contents of the
app.js
and other JavaScript files. - Implement the JavaScript code in your own files.
- If you think you need to see a video solution first, be sure to pick up Mead's Modern JavaScript course.
- Add a link to your finished project below!
What You Should See
Visit the hosted github page to see this JavaScript Todos App in action.
Leave a Reply