Making a Todo App From Scratch with Vanilla JavaScript

Making a Todo App From Scratch with Vanilla JavaScript

David Landup
Marcus Sanatan


If a programmer's first step is writing "Hello World" in the console, then their second step is creating a Todo application. This app generally consists of being able to save notes (something that you'll need "to do" later), displaying them, and checking off the ones you completed.

Learn about variable scope, variable mutations, hoisting, string templates, tagged templates, rendering DOM items, and styling pages with CSS - by building a Todo application using exclusively Vanilla JavaScript and CSS!

Note: This Guided Project is an entry-level project, aimed at beginners who are just starting out with JavaScript and learning the fundamentals of the language. It's part of a larger, upcoming course on Web Development with JavaScript ES6 and Beyond.


What is a Guided Project?

Turn Theory Into Practice

All great learning resources, books and courses teach you the holistic basics, or even intermediate concepts, and advise you to practice after that. As soon as you boot up your own project - the environment suddenly isn't as pristine as in the courses and books! Things go wrong, and it's oftentimes hard to pinpoint even why they do go wrong.

StackAbuse Guided Projects are there to bridge the gap between theory and actual work. We'll respect your knowledge and intelligence, and assume you know the theory. Time to put it into practice.

When applicable, Guided Projects come with downloadable, reusable scripts that you can refer back to whenever required in your new day-to-day work.

Last Updated: Apr 2022

© 2013-2023 Stack Abuse. All rights reserved.