Web Development for Beginners

Web Development for Beginners is a Breni path that takes you from how the web works to a website of your own online. Its 8 courses cover the web itself, HTML, CSS, responsive layouts, JavaScript in the browser, back-end basics, Git and deployment, and a portfolio site. Learners finish able to build a responsive multi-page site, add interactivity and publish it on a custom domain. JavaScript appears only as far as a website needs it. HTML must be finished before CSS, as each course opens in turn.

  • 8 courses
  • 15 learning objectives
  • Level: beginner
  • Language: English
  • Price: Subscription, free trial

What you will be able to do

  • Build a multi-page website with semantic HTML and CSS
  • Create responsive layouts with Flexbox, Grid and media queries
  • Add interactivity with JavaScript events and the DOM
  • Fetch data from a public API and show it on a page
  • Track changes to a project with Git and GitHub
  • Deploy a website with a custom domain and HTTPS

Full curriculum

Part 1 · Front-end basics

1. How the Web Works: Behind the Screen

Explain what happens between typing a web address and seeing a page. Units, in order: Browsers, servers and HTTP; Domain names and DNS; Front end and back end; Developer tools in the browser; Setting up a code editor.

  • — Browsers, servers and HTTP
    Learn how browsers fetch pages from servers using HTTP.
    • What is a web browser
    • How web servers work
    • Basics of the HTTP protocol
  • — Domain names and DNS
    Find out how names turn into server IP addresses.
    • What is a domain name
    • The Domain Name System
    • How DNS lookup works
  • — Front end and back end
    Explore what users see versus what runs behind the scenes.
    • The front end layer
    • The back end layer
    • How front and back connect
  • — Browser developer tools
    Use built in browser tools to inspect website code.
    • Opening developer tools
    • Inspecting HTML and CSS
    • Checking network requests
  • — Setting up a code editor
    Install and configure a code editor for writing web pages.
    • Choosing a code editor
    • Installing a code editor
    • Basic editor setup

2. HTML Fundamentals

Structure a web page with semantic HTML. Units, in order: Tags, elements and attributes; Headings, paragraphs and lists; Links and images; Forms and inputs; Semantic HTML and accessibility.

3. CSS Fundamentals

Style a page with colours, fonts, spacing and the box model. Units, in order: Selectors and specificity; The box model; Colours, fonts and units; Classes and reusable styles; Debugging CSS in developer tools.

Part 2 · Layout and interactivity

4. Responsive Layouts

Build layouts that work on phones, tablets and desktops. Units, in order: Flexbox; CSS Grid; Media queries; Mobile-first design; Responsive images.

5. JavaScript in the Browser

Add interactivity to a page with JavaScript. Units, in order: Variables, functions and events; Selecting and changing elements with the DOM; Handling clicks and form input; Showing and hiding content; Fetching data from an API.

Part 3 · Shipping websites

6. Back-End Basics

Explain how servers, databases and APIs power a website. Units, in order: What a server does; REST APIs and JSON; A simple Node.js server; Storing data in a database; Authentication basics.

7. Git and Deployment

Track code with Git and put a website online. Units, in order: Git commits and branches; GitHub repositories; Hosting a static site; Custom domains and HTTPS; Updating a live site safely.

8. Building a Portfolio Website

Plan, build and launch a complete multi-page website. Units, in order: Planning pages and content; Building the layout; Adding a contact form; Performance and SEO basics; Testing across browsers.

Sample: How the Web Works: Behind the Screen

The opening tier, (Browsers, servers and HTTP). Learn how browsers fetch pages from servers using HTTP.

What is a web browser

Understand how a browser requests and shows web pages.

How web servers work

Discover how remote servers store and send website files.

Basics of the HTTP protocol

Learn how browsers and servers talk using HTTP messages.

Questions about Web Development for Beginners

How long does it take to learn web development?

It depends on how often you practise, but simple sites come together within weeks of steady work. Breni lessons take about three minutes each.

Should I learn HTML, CSS or JavaScript first?

HTML first, then CSS, then JavaScript. The path follows that order because each one builds on the last.

Do I need JavaScript for web development?

Yes, for anything interactive. This path covers what a website needs, and JavaScript for Beginners goes deeper into the language itself.

Does this course cover front end or back end?

Mostly front end, with one course on servers, APIs and databases so you can see how the back end fits in.

Do I get a certificate for this web development course?

Finishing all 8 courses earns a Breni certificate of completion. It records that you completed the path and is not a degree.

Related learning paths

Start Web Development for Beginners

Get Breni on Google Play and start Web Development for Beginners Download on the App Store