| Day #️⃣ | 📂 Section | 📚 Sub-Section | 📖 Topic |
|---|---|---|---|
| 1️⃣ | Foundations | 🟢 Introduction | How This Course Will Work |
| 2️⃣ | Foundations | 🟢 Introduction | Introduction to Web Development |
| 3️⃣ | Foundations | 🟢 Introduction | Motivation and Mindset |
| 4️⃣ | Foundations | 🟢 Introduction | Asking For Help |
| 4️⃣ | Foundations | 🟢 Introduction | Join the Odin Community |
| 5️⃣ | Foundations | 🟠 Prerequisites | Computer Basics |
| 6️⃣ | Foundations | 🟠 Prerequisites | How Does the Web Work? |
| 7️⃣ | Foundations | 🟠 Prerequisites | Installation Overview |
| 8️⃣ | Foundations | 🟠 Prerequisites | Installations |
| 9️⃣ | Foundations | 🟠 Prerequisites | Text Editors |
| 1️⃣ 0️⃣ | Foundations | 🟠 Prerequisites | Command Line Basics |
| 1️⃣ 1️⃣ | Foundations | 🟠 Prerequisites | Setting up Git |
| 1️⃣ 2️⃣ | Foundations | ⚫ Git Basics | Introduction to Git |
| 1️⃣ 3️⃣ | Foundations | ⚫ Git Basics | Git Basics |
| 1️⃣ 4️⃣ | Foundations | 🔴 HTML Foundations | Introduction to HTML and CSS |
| 1️⃣ 5️⃣ | Foundations | 🔴 HTML Foundations | Elements and Tags |
| 1️⃣ 6️⃣ | Foundations | 🔴 HTML Foundations | HTML Boilerplate |
| 1️⃣ 7️⃣ | Foundations | 🔴 HTML Foundations | Working with Text |
| 1️⃣ 8️⃣ | Foundations | 🔴 HTML Foundations | Lists |
| 1️⃣ 9️⃣ | Foundations | 🔴 HTML Foundations | Links and Images |
| 2️⃣ 0️⃣ | Foundations | 🔴 HTML Foundations | Commit Messages |
| 2️⃣ 1️⃣ | Foundations | 🔴 HTML Foundations | Project: Recipes |
| 2️⃣ 2️⃣ | Foundations | 🔵 CSS Foundations | Intro to CSS |
| 2️⃣ 3️⃣ | Foundations | 🔵 CSS Foundations | The Cascade |
| 2️⃣ 4️⃣ | Foundations | 🔵 CSS Foundations | Inspecting HTML and CSS |
| 2️⃣ 5️⃣ | Foundations | 🔵 CSS Foundations | The Box Model |
| 2️⃣ 6️⃣ | Foundations | 🔵 CSS Foundations | Block and Inline |
| 2️⃣ 7️⃣ | Foundations | 🔵 Flexbox | Introduction to Flexbox |
| 2️⃣ 8️⃣ | Foundations | 🔵 Flexbox | Growing and Shrinking |
| 2️⃣ 9️⃣ | Foundations | 🔵 Flexbox | Axes |
| 2️⃣ 9️⃣ | Foundations | 🔵 Flexbox | Alignment |
| 3️⃣ 0️⃣ | Foundations | 🔵 Flexbox | Project: Landing Page |
| 3️⃣ 1️⃣ | Foundations | 🟡 JavaScript Basics | Variables and Operators |
| 3️⃣ 2️⃣ | Foundations | 🟡 JavaScript Basics | Data Types and Conditionals |
| 3️⃣ 3️⃣ | Foundations | 🟡 JavaScript Basics | JavaScript Developer Tools |
| 3️⃣ 4️⃣ | Foundations | 🟡 JavaScript Basics | Function Basics |
| 3️⃣ 5️⃣ | Foundations | 🟡 JavaScript Basics | Problem Solving |
| 3️⃣ 6️⃣ | Foundations | 🟡 JavaScript Basics | Understanding Errors |
| 3️⃣ 7️⃣ | Foundations | 🟡 JavaScript Basics | Project: Rock Paper Scissors |
| 3️⃣ 8️⃣ | Foundations | 🟡 JavaScript Basics | Clean Code |
| 3️⃣ 9️⃣ | Foundations | 🟡 JavaScript Basics | Installing Node.js |
| 4️⃣ 0️⃣ | Foundations | 🟡 JavaScript Basics | Arrays and Loops |
| 4️⃣ 1️⃣ | Foundations | 🟡 JavaScript Basics | DOM Manipulation and Events |
| 4️⃣ 2️⃣ | Foundations | 🟡 JavaScript Basics | Revisiting Rock Paper Scissors |
| 4️⃣ 3️⃣ | Foundations | 🟡 JavaScript Basics | Project: Etch-a-Sketch |
| 4️⃣ 4️⃣ | Foundations | 🟡 JavaScript Basics | Object Basics |
| 4️⃣ 4️⃣ | Foundations | 🟡 JavaScript Basics | Project: Calculator |
| 4️⃣ 4️⃣ | Foundations | 🟡 JavaScript Basics | Choose Your Path Forward |
| 4️⃣ 5️⃣ | Full Stack JavaScript | 🟣 Intermediate HTML and CSS | Introduction |
| Project #️⃣ | 📂 Section | 📚 Sub-Section | 📖 Preview URL |
|---|---|---|---|
| 1️⃣ | Foundations | 🟥 HTML | Odin Recipes |
| 2️⃣ | Foundations | 🟦 CSS | Landing Page |
| 3️⃣ | Foundations | 🟨 JavaScript | Rock Paper Scissors |
| 4️⃣ | Foundations | 🟨 JavaScript | Rock Paper Scissors UI |
| 5️⃣ | Foundations | 🟨 JavaScript | Etch-a-Sketch |
| 6️⃣ | Foundations | 🟨 JavaScript | Calculator |