Moocable is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Foundations: Web Development

Description

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

Online Courses

The Odin Project

Free

On-Demand

Beginner

Foundations: Web Development

Affiliate notice

  • Type
    Online Courses
  • Provider
    The Odin Project
  • Pricing
    Free
  • Duration
    On-Demand
  • Difficulty
    Beginner

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.  

  • 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