Foundations: Web Development

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