The Odin Project
Free Online Course
selfpaced
Overview
This is where it all begins! A hands-on introduction to all of the essential tools you'll need to build real, working websites. You'll learn what web developers actually do – the foundations you'll need for later courses.
- The baseline knowledge you need before getting into the more 'programming' aspects of web development.
- Configure your development environment and install some software necessary for web development.
- The basics of Git and how you can upload your future projects to GitHub so you can share your work and collaborate with others on projects easily.
- The foundations of HTML, a fundamental building block of everything on the web.
- Make your HTML look the way you want by adding styles with CSS.
- Learn how to put things exactly where you want them on your web projects using flexbox.
- Dig into JavaScript and learn how to make the web dynamic.
- Learn about the back end, where we'll demystify what goes on behind the scenes on a web server.
Syllabus
- Introduction
- How this Course Will Work
- Introduction to Web Development
- Motivation and Mindset
- Asking For Help
- Join the Odin Community
- How Does the Web Work?
- Installations
- Installation Overview
- Prerequisites
- Text Editors
- Command Line Basics
- Setting Up Git
- Git Basics
- Introduction to Git
- Git Basics
- HTML Foundations
- Introduction to HTML and CSS
- Elements and Tags
- HTML Boilerplate
- Working with Text
- Lists
- Links and Images
- Commit Messages
- Project: Recipes
- CSS Foundations
- CSS Foundations
- Inspecting HTML and CSS
- The Box Model
- Block and Inline
- Flexbox
- Introduction to Flexbox
- Growing and Shrinking
- Axes
- Alignment
- Project: Landing Page
- JavaScript Basics
- Fundamentals Part 1
- Fundamentals Part 2
- JavaScript Developer Tools
- Fundamentals Part 3
- Problem Solving
- Understanding Errors
- Project: Rock Paper Scissors
- Clean Code
- Installing Node.js
- Fundamentals Part 4
- DOM Manipulation and Events
- Revisiting Rock Paper Scissors
- Project: Etch-a-Sketch
- Fundamentals Part 5
- Project: Calculator
- The Back End
- Introduction to the Back End
- Introduction to Frameworks
- Conclusion
- Choose Your Path Forward
