A free, open source, project based course that teaches you JavaScript from scratch with 30 lessons and 30 hands-on projects
Start Learning · View Curriculum · View Projects · Contribute
Learn JavaScript in 30 Days is a structured, beginner friendly JavaScript course built entirely with Markdown and hosted on GitHub. It is designed for people who have never written a line of JavaScript before and want a clear, daily path to becoming job ready in modern JavaScript.
Each day introduces one focused topic, explains it with correct and tested code examples, and ends with a small project you build yourself. By Day 30 you will have written 30 real projects and understand JavaScript fundamentals, the DOM, asynchronous programming, and modern ES6+ syntax well enough to start building real applications or move on to frameworks such as React, Vue, or Node.js.
This repository is intentionally 100% Markdown and plain JavaScript. No build tools, no paid content, no video paywalls. Open a lesson, read it, write the code, and move to the next one.
| This Course | Typical Tutorials | |
|---|---|---|
| Format | Structured Markdown, version controlled on GitHub | Scattered videos and blog posts |
| Practice | A real project every single day | Mostly theory, few projects |
| Navigation | Linked previous/next lessons, no rabbit holes | Hard to follow a clear order |
| Cost | Free and open source forever | Often paywalled |
| Best Practices | Based on MDN, ECMAScript specification, and Airbnb/Google style guides | Inconsistent or outdated advice |
| Depth | Fundamentals to async JavaScript and OOP | Often stops at the basics |
- Complete beginners who have never coded before
- Developers from another language who want to learn JavaScript properly
- Students preparing for technical interviews who need a structured refresher
- Bootcamp graduates who want extra project based practice
- Anyone who wants a free alternative to paid JavaScript courses
You do not need any prior programming experience. You only need:
- A computer with Windows, macOS, or Linux
- A modern web browser, such as Google Chrome or Mozilla Firefox
- A free code editor, such as Visual Studio Code
- Curiosity and roughly 30 to 60 minutes a day
This course follows a simple, predictable folder structure so you always know where you are and what to do next.
learn-javascript-30-days/
├── README.md <- you are here
├── GETTING_STARTED.md <- environment setup guide
├── CONTRIBUTING.md
├── LICENSE
├── assets/
│ └── banner.svg
├── days/
│ ├── day-01-introduction-and-setup/
│ │ └── README.md <- lesson 1
│ ├── day-02-variables-and-data-types/
│ │ └── README.md <- lesson 2
│ └── ... <- through day-30
└── projects/
├── day-01-hello-console/
│ ├── README.md <- project brief
│ ├── index.html
│ ├── style.css
│ └── script.js
└── ... <- through day-30
-
Fork or clone this repository.
git clone https://github.com/your-username/learn-javascript-30-days.git cd learn-javascript-30-days -
Open the folder in Visual Studio Code.
code . -
Start with Day 1. Open
days/day-01-introduction-and-setup/README.mdand read the lesson. -
Build the project for that day inside the matching folder in
projects/. Each project folder already contains starter files (index.html,style.css,script.js) with comments telling you exactly what to build. -
Use the navigation links at the bottom of every lesson to move to the next day, or back to the previous one. There is no need to come back to this README until you finish the course.
-
Commit your progress as you go, so you build a public history of your learning:
git add . git commit -m "Completed Day 1: Introduction and setup" git push
For detailed environment setup, including installing Node.js and a Live Server extension, see GETTING_STARTED.md.
The course is split into five stages of six days each, moving from core fundamentals to real asynchronous, object oriented JavaScript.
| Day | Lesson | Project |
|---|---|---|
| 07 | Arrays | Console Todo List |
| 08 | Array Methods | Shopping Cart Total |
| 09 | Objects | Contact Book |
| 10 | Object Methods and this | Bank Account Simulator |
| 11 | Strings in Depth | Palindrome Checker |
| Day | Lesson | Project |
|---|---|---|
| 12 | Introduction to the DOM | DOM Playground |
| 13 | DOM Events | Color Switcher |
| 14 | Forms and Validation | Sign Up Form Validator |
| 15 | Building a To-Do App | Interactive To-Do List |
All 30 projects live in the projects/ folder, one folder per day, each with its own README.md brief, starter index.html, style.css, and script.js. Projects are deliberately small, no more than a couple of hours each, so you build a daily habit instead of burning out on one big build.
Every lesson in this course is written to match real, current JavaScript standards rather than outdated tutorials. Specifically, this course:
- Uses
letandconstinstead ofvar, and explains why - Uses strict equality (
===) instead of loose equality (==) - Follows naming conventions from the Airbnb JavaScript Style Guide
- References the MDN Web Docs and the ECMAScript specification as the source of truth
- Teaches asynchronous JavaScript with Promises and
async/await, not only outdated callback patterns - Encourages small, pure, single responsibility functions
- Introduces semantic HTML and accessible form patterns alongside JavaScript
- Avoids global variables and teaches proper scope and module boundaries
Is this course really free? Yes. The entire course, including every lesson and every project, is open source under the MIT License.
Do I need to know HTML and CSS first? Basic HTML and CSS helps for the DOM lessons starting on Day 12, but Days 1 to 11 only require JavaScript running in the browser console or Node.js.
Can I use this content to teach others? Yes, as long as you follow the terms of the MIT License, which includes keeping the original copyright notice.
What if I get stuck on a project? Open an issue in this repository describing what you tried, and the community can help. You can also compare your solution against the lesson's code examples, which are all tested and correct.
What comes after Day 30? After finishing this course you will be ready to learn a frontend framework such as React or Vue, or a backend runtime such as Node.js, with a solid JavaScript foundation already in place.
Contributions are welcome and encouraged. Whether it is fixing a typo, improving an explanation, or adding a new project variation, please read the Contributing Guide before opening a pull request.
If this course helped you, consider:
- Starring this repository
- Sharing it with someone who is learning to code
- Opening an issue if you find an error, no matter how small
This project is licensed under the MIT License. You are free to use, copy, modify, and distribute this material with attribution.
Begin Day 1: Introduction and Setup →
Made for everyone learning to code. If this repository helps you, please consider giving it a star.