Web Development Foundations

Complete syllabus

Every chapter and lesson

1. 01

   Chapter 1 · 3 lessons

   How the Web Works

   1. 1.1

      The internet & HTTP

      8 min · Quick check

      Lesson goal: By the end you can explain the fundamental concepts of the internet and the Hypertext Transfer Protocol (HTTP).

      • Define the internet and its role in global communication.
      • Explain what Hypertext Transfer Protocol (HTTP) is and its purpose.
      • Describe how HTTP facilitates the transfer of data between clients and servers.
   2. 1.2

      Clients, servers & URLs

      8 min · Quick check

      Lesson goal: By the end you can identify the roles of clients, servers, and Uniform Resource Locators (URLs) in web communication.

      • Define what a client is in the context of web development.
      • Define what a server is and its function in serving web content.
      • Explain what a Uniform Resource Locator (URL) is and its components.
   3. 1.3

      The browser & rendering

      8 min · Quick check

      Lesson goal: By the end you can describe how web browsers render web pages.

      • Define what a web browser is and its primary functions.
      • Explain the process of rendering a web page from HTML, CSS, and JavaScript.
      • Discuss the role of the Document Object Model (DOM) in rendering.
2. 02

   Chapter 2 · 3 lessons

   HTML

   1. 2.1

      Structure & semantics

      9 min · Quick check

      Lesson goal: By the end you can explain the importance of structure and semantics in HTML documents.

      • Define structure in the context of HTML.
      • Explain the role of semantic elements in improving accessibility.
      • Identify common semantic HTML elements and their uses.
   2. 2.2

      Text, links & media

      8 min · Quick check

      Lesson goal: By the end you can effectively use text, links, and media in HTML documents.

      • Define the purpose of text elements in HTML.
      • Explain how to create hyperlinks using anchor tags.
      • Identify different media elements and how to embed them in HTML.
   3. 2.3

      Forms

      8 min · Quick check

      Lesson goal: By the end you can create and manage forms in HTML.

      • Define what an HTML form is and its purpose.
      • Explain the different input types available in HTML forms.
      • Identify how to structure a form using various HTML elements.
3. 03

   Chapter 3 · 3 lessons

   CSS

   1. 3.1

      Selectors & the box model

      9 min · Quick check

      Lesson goal: By the end you can understand and apply CSS selectors and the box model in web development.

      • Define CSS selectors and their purpose in styling HTML elements.
      • Explain the box model, including content, padding, border, and margin.
      • Identify how the box model affects layout and design of web pages.
   2. 3.2

      Layout with flexbox & grid

      9 min · Quick check

      Lesson goal: By the end you can utilize flexbox and grid layout techniques to create responsive web designs.

      • Define flexbox and grid layout, including their key properties and differences.
      • Explain how to implement flexbox for one-dimensional layouts.
      • Describe how to use grid for two-dimensional layouts.
   3. 3.3

      Responsive design

      8 min · Quick check

      Lesson goal: By the end you can create responsive designs using media queries and flexible layouts.

      • Define responsive design and its importance in modern web development.
      • Explain how media queries work and how to apply them in CSS.
      • Identify techniques for creating flexible layouts that adapt to different screen sizes.
4. 04

   Chapter 4 · 3 lessons

   JavaScript

   1. 4.1

      Variables, types & functions

      9 min · Quick check

      Lesson goal: By the end you can understand and utilize variables, data types, and functions in JavaScript.

      • Define what variables are and their purpose in programming.
      • Identify different data types in JavaScript such as strings, numbers, and booleans.
      • Explain the concept of functions and how to declare and invoke them.
   2. 4.2

      The DOM & events

      9 min · Quick check

      Lesson goal: By the end you can manipulate the Document Object Model (DOM) and handle events in JavaScript.

      • Define the Document Object Model and its role in web development.
      • Describe how to select and manipulate DOM elements using JavaScript.
      • Explain event handling and how to respond to user interactions.
   3. 4.3

      Fetching data & async

      8 min · Quick check

      Lesson goal: By the end you can fetch data asynchronously using JavaScript and handle responses.

      • Define asynchronous programming and its importance in web applications.
      • Explain how to use the Fetch API to retrieve data from a server.
      • Describe how to handle promises and asynchronous operations in JavaScript.
5. 05

   Chapter 5 · 3 lessons

   Building & Deploying

   1. 5.1

      Organizing a project

      8 min · Quick check

      Lesson goal: By the end you can effectively organize a web development project.

      • Define the structure of a web project including folders and files.
      • Identify the importance of naming conventions for files and directories.
      • Explain the role of version control in project organization.
   2. 5.2

      Accessibility & best practices

      8 min · Quick check

      Lesson goal: By the end you can apply accessibility best practices to your web projects.

      • Define web accessibility and its importance for users.
      • Identify common accessibility standards and guidelines.
      • Explain how to implement accessible design elements in web development.
   3. 5.3

      Deploying a site

      8 min · Quick check

      Lesson goal: By the end you can deploy a website to a live server.

      • Define the steps involved in deploying a website.
      • Identify different hosting options and their features.
      • Explain how to configure domain settings for a deployed site.