Self-paced learning, from the foundations
Full-Stack Web Development
Create your first web page, then learn how its layout, code, server and database work together. Build practical features as your skills grow.
All four courses are currently free in the learning portal. Paid checkout is not active.
A glimpse of what you’ll explore
<h1>My first site</h1>
<p>Built by me.</p>
h1 {
color: #2458e6;
}site.
Built by me.
Hello, web.Work towards delivering a usable web application from an unfamiliar brief.
- English and Urdu lessons
- A visual or interactive explanation in every unit
- Editable HTML, CSS and JavaScript practice
- Connected project packages and break/fix work
What you’ll learn to do
Build understanding in small steps, then apply it to work you can inspect and explain.
- Create clear HTML and responsive CSS layouts that work with a keyboard and on smaller screens.
- Write JavaScript functions and use browser events, forms and APIs.
- Build interfaces with TypeScript and React.
- Create Node.js APIs and store real records in PostgreSQL.
- Handle accounts, ownership, private files and background jobs.
- Choose rendering and caching approaches for different pages.
- Test failures, deploy on Linux and rehearse backup and recovery.
- Explain your design decisions and respond to a changed project requirement.
Put your skills into a real build
These projects connect the smaller lessons. Start with guidance, then change a requirement and explain your choices.
PROJECT 01
Your first accessible website
Build a responsive workshop page with a labelled form, then check its layout and keyboard use.
PROJECT 02
A React task workspace
Add editing, search, saved tasks and export while learning components and state.
PROJECT 03
A connected full-stack application
Connect React, Node.js and PostgreSQL with accounts, private files, jobs and failure tests.
Plan your study time
Provisional planning estimate, not measured student completion times. Includes lessons, practice, revision and projects.
Interactive calculation requires JavaScript. Provisional estimates require suitable tools, access and feedback.
Planning is not a guarantee of completion or mastery.
Excluded: electives, ungraded external-model work, waiting/provider delays and review queues.
Method and exclusions
Editorial task budgets, not measured learner timing. Electives, ungraded external-model work, waiting/provider delays and review queues are excluded.
Estimate basis: provisional editorial planning; not measured student completion times · 2026-10-30
Your learning route
26 modules, from foundations to delivery. Open a chapter to see the topics in order.
Start with the foundations. Revisit an earlier topic whenever a term or task feels unfamiliar.
01Make your first website8 modules
- 1
Assessment and computer basics
Create your first page while learning files, paths and the tools around it.
- 2
How websites work
Follow a browser request from its URL to a response.
- 3
Working environment and beginner Linux
Use Windows confidently and learn Ubuntu commands in a dedicated practice folder.
- 4
Git and GitHub
Keep history, collaborate and recover a small mistake.
- 5
HTML
Give each part of a document a clear meaning.
- 6
Forms and accessibility
Make input and navigation understandable with a keyboard as well as a mouse.
- 7
CSS foundations
Explain which rule wins and how a box gets its size.
- 8
Layout and visual design
Build layouts that remain usable across screen sizes and writing directions.
02Learn programming and interfaces7 modules
- 9
JavaScript fundamentals
Predict small programs before running them; understand arrays before looping over them.
- 10
Functions, data and debugging
Split a problem into testable parts and explain each returned value.
- 11
Browser programming
Connect an event to state, validation and a visible page update.
- 12
Async programming and APIs
Show honest loading and failure states while requests finish in different orders.
- 13
TypeScript and development tools
Separate build-time type checks from runtime validation and keep builds reproducible.
- 14
React foundations
Describe the interface with components, props and state.
- 15
Building React applications
Handle forms, routes and external effects without losing user work.
03Connect the backend and data6 modules
- 16
Node.js and backend APIs
Run a server and define the contracts its callers can rely on.
- 17
PostgreSQL from the beginning
Install or connect to a real database, then write and inspect your first rows.
- 18
Reliable data handling
Keep data correct through competing edits, failures and schema changes.
- 19
A complete connected application
Trace one visible action all the way from React to a persistent database row.
- 20
Accounts, security and privacy
Prove identity, enforce ownership and manage the complete account lifecycle.
- 21
Practical application features
Add bounded files, background work and integrations that can fail safely.
04Test, deploy and deliver5 modules
- 22
Production frontend techniques
Choose rendering and caching for the page, its users and its content.
- 23
Testing and automated checks
Test what the system does, including invalid input and service failures.
- 24
Linux servers and deployment
Take a versioned application through a controlled server deployment.
- 25
Operating and maintaining applications
Investigate a fault, restore data and release a safe update.
- 26
Independent professional delivery
Turn an unfamiliar brief into a product you can defend, change and maintain.
What you need to begin
Read, try, then build. The right practice environment becomes part of the lesson.
Your starting point
- No coding experience is assumed.
- Begin with files, folders, an editor and a first browser page.
- Linux, Git and debugging are introduced as part of the course.
Your practice setup
- Use a laptop or desktop with a modern browser and a keyboard for project work.
- The first HTML, CSS and JavaScript activities have an editable browser preview.
- Complete applications need local Node.js, Git and PostgreSQL; setup is taught in the route.
- Deployment and recovery use a separate Linux environment. A hosting account, domain and any paid services are separate costs when you choose to use them.
Questions before you start
A few clear answers to help you choose your next step.
Can I take this course if I have never written code?
Yes. The first module teaches files, paths and your first page. HTML and CSS come before JavaScript, and the frameworks come after those foundations.
Which technologies are in the main route?
The main route covers HTML, CSS, JavaScript, TypeScript, React, Node.js and PostgreSQL. It also introduces Next.js rendering, Git, Linux, testing, security and deployment.
Can I write code and see the result?
Beginner HTML, CSS and JavaScript exercises provide an editable browser preview. Later server and database projects run in a real local development environment.
How is this different from the WordPress course?
This route focuses on building custom web applications with JavaScript and a separate backend and database. The WordPress course starts with a CMS and then teaches PHP, themes, plugins and WordPress-specific development.
Keep exploring
Connect this route to another skill, or start with a short beginner guide.