Web DevelopmentBeginner
Full-Stack Web Developer: Zero to Job-Ready
HTML, CSS, JavaScript, Git, React, Node.js, Express, databases and deployment — build and launch real web apps and a portfolio that gets you hired.
153 lessons42h 35m of video4 quizzes3 practical tasks Certificate
What you'll learn
- Build accessible, responsive web pages with HTML and CSS (Flexbox and Grid)
- Program in JavaScript and make pages interactive with the DOM
- Use Git and GitHub like a professional developer
- Build modern user interfaces with React components, props and state
- Create a back end and REST API with Node.js and Express, with sign-up and login
- Store data in MongoDB and query PostgreSQL with SQL
- Deploy front end, back end and database to the internet for free
- Build a portfolio and full-stack project that shows employers what you can do
Course content
Part 1. Start here3 lessons
Part 2. HTML: the structure of the web11 lessons
- HTML: Getting Startedby freeCodeCamp.org19 min
- HTML: Head Elementby freeCodeCamp.org9 min
- HTML: Text Basicsby freeCodeCamp.org21 min
- HTML: List Typesby freeCodeCamp.org10 min
- HTML: Add Linksby freeCodeCamp.org31 min
- HTML: Add Imagesby freeCodeCamp.org30 min
- HTML: Semantic Tagsby freeCodeCamp.org24 min
- HTML: Create Tablesby freeCodeCamp.org16 min
- HTML: Forms & Inputsby freeCodeCamp.org45 min
- HTML: HTML Projectby freeCodeCamp.org42 min
- Quiz: HTML
Part 3. CSS: style and layout30 lessons
- CSS: Introduction to Courseby freeCodeCamp.org9 min
- CSS: What is a Selector?by freeCodeCamp.org11 min
- CSS: Specificity & When to use Selectorsby freeCodeCamp.org13 min
- CSS: Advanced Selectorsby freeCodeCamp.org20 min
- CSS: Attribute Selectorsby freeCodeCamp.org13 min
- CSS: Types of Colorsby freeCodeCamp.org12 min
- CSS: Coloring Textby freeCodeCamp.org12 min
- CSS: Other Background Propertiesby freeCodeCamp.org12 min
- CSS: Gradientsby freeCodeCamp.org15 min
- CSS: Introduction to Types of Unitsby freeCodeCamp.org12 min
- CSS: Text Manipulationby freeCodeCamp.org15 min
- CSS: Font Familiesby freeCodeCamp.org13 min
- CSS: Using External Fontsby freeCodeCamp.org10 min
- CSS: CSS Bordersby freeCodeCamp.org13 min
- CSS: Float & Display Typesby freeCodeCamp.org22 min
- CSS: Flex Direction & Wrapby freeCodeCamp.org11 min
- CSS: Content Alignmentby freeCodeCamp.org11 min
- CSS: Shrink, Grow, & Basisby freeCodeCamp.org11 min
- CSS: Item Alignmentby freeCodeCamp.org11 min
- CSS: Template Columns & Rowsby freeCodeCamp.org17 min
- CSS: Column & Row Linesby freeCodeCamp.org13 min
- CSS: The Transition Propertyby freeCodeCamp.org17 min
- CSS: Transformation Functionsby freeCodeCamp.org14 min
- CSS: Creating Animations w/ Keyframesby freeCodeCamp.org11 min
- CSS: Animation Propertiesby freeCodeCamp.org11 min
- CSS: Website Transformation - SOLUTIONby freeCodeCamp.org39 min
- CSS: What to Learn Nextby freeCodeCamp.org5 min
- A practical guide to responsive web design (Kevin Powell)by Kevin Powell23 min
- Practise: Flexbox Froggy and Grid Garden
- Project: a responsive landing page
Part 4. JavaScript: make it interactive35 lessons
- JavaScript: Storing Values with the Assignment Operatorby freeCodeCamp.org10 min
- JavaScript: Augmented Math Operationsby freeCodeCamp.org11 min
- JavaScript: Escaping Literal Quotesby freeCodeCamp.org10 min
- JavaScript: Word Blanksby freeCodeCamp.org11 min
- JavaScript: Write Reusable with Functionsby freeCodeCamp.org11 min
- JavaScript: Global Scopeby freeCodeCamp.org10 min
- JavaScript: Equality Operatorsby freeCodeCamp.org15 min
- JavaScript: Golf Codeby freeCodeCamp.org13 min
- JavaScript: Switch Statementsby freeCodeCamp.org10 min
- JavaScript: Counting Cardsby freeCodeCamp.org10 min
- JavaScript: Objects for Lookupsby freeCodeCamp.org10 min
- JavaScript: Record Collectionby freeCodeCamp.org11 min
- JavaScript: Nesting For Loopsby freeCodeCamp.org10 min
- JavaScript: Profile Lookupby freeCodeCamp.org11 min
- JavaScript: var vs letby freeCodeCamp.org12 min
- JavaScript: Arrow Functionsby freeCodeCamp.org10 min
- JavaScript: Destructuring Assignmentby freeCodeCamp.org13 min
- JavaScript: import and exportby freeCodeCamp.org16 min
- The DOM: Selecting Elements in the DOMby freeCodeCamp.org10 min
- The DOM: Styling an Elementby freeCodeCamp.org10 min
- The DOM: Traversing the DOMby freeCodeCamp.org17 min
- The DOM: Event Listenersby freeCodeCamp.org7 min
- The DOM: Event Propagationby freeCodeCamp.org15 min
- The DOM: Event Delegationby freeCodeCamp.org11 min
- The DOM: Project 1 CSS Stylingby freeCodeCamp.org13 min
- The DOM: Project 1 JavaScriptby freeCodeCamp.org8 min
- The DOM: Project 2 CSS stylingby freeCodeCamp.org9 min
- The DOM: Project 2 JavaScriptby freeCodeCamp.org7 min
- The DOM: Project 3 CSS Stylingby freeCodeCamp.org9 min
- The DOM: Project 4 CSS Stylingby freeCodeCamp.org9 min
- The DOM: Project 4 JavaScriptby freeCodeCamp.org14 min
- The DOM: Project 5 JavaScriptby freeCodeCamp.org13 min
- The DOM: Project 5 CSS Styling p2by freeCodeCamp.org7 min
- Quiz: JavaScript
- Project: an interactive app
Part 5. Git and GitHub for developers9 lessons
- Git: Terms to be learn in videoby freeCodeCamp.org4 min
- Git: sign up in GitHubby freeCodeCamp.org6 min
- Git: cloning through VS Codeby freeCodeCamp.org6 min
- Git: committingby freeCodeCamp.org3 min
- Git: SSH Keysby freeCodeCamp.org5 min
- Git: git pushby freeCodeCamp.org5 min
- Git: git branchingby freeCodeCamp.org26 min
- Git: Undoing in gitby freeCodeCamp.org5 min
- Git: Forking in gitby freeCodeCamp.org6 min
Part 6. React: modern front ends21 lessons
- React: Creating a React Appby Programming with Mosh7 min
- React: Creating a React Componentby Programming with Mosh7 min
- React: How React Worksby Programming with Mosh4 min
- React: Creating a ListGroup Componentby Programming with Mosh6 min
- React: Rendering Listsby Programming with Mosh6 min
- React: Conditional Renderingby Programming with Mosh5 min
- React: Handling Eventsby Programming with Mosh6 min
- React: Managing Stateby Programming with Mosh6 min
- React: Passing Data Via Propsby Programming with Mosh8 min
- React: Passing Childrenby Programming with Mosh7 min
- React: Exercise: Building a Button Componentby Programming with Mosh9 min
- React: Exercise: Showing an Alertby Programming with Mosh6 min
- React projects: Section 1 – React Basicsby freeCodeCamp.org2h 18m
- React projects: Section 2 – Travel Journal Projectby freeCodeCamp.org2h 15m
- React projects (optional): Section 3 – Chef Claude Projectby freeCodeCamp.org5h 11m
- React projects (optional): Section 4 – Meme Generator Projectby freeCodeCamp.org1h 57m
- React projects (optional): Section 5 – Tenzies Projectby freeCodeCamp.org1h 30m
- React projects (optional): Section 6 – Assembly Endgame Projectby freeCodeCamp.org2h 7m
- React projects (optional): Bonus Section – React and VS Codeby freeCodeCamp.org23 min
- Tailwind CSS crash courseby Traversy Media31 min
- Quiz: React
Part 7. The back end: Node.js, Express and APIs24 lessons
- What is a REST API?by IBM Technology9 min
- REST APIs with examplesby ByteByteGo5 min
- Back end: Core Components: Languages, Databases, Runtimes, Frameworksby freeCodeCamp.org5 min
- Back end: Project Initialization (Git & npm)by freeCodeCamp.org6 min
- Back end: Environment Variables (.env)by freeCodeCamp.org6 min
- Back end: Creating the Express App (app.js)by freeCodeCamp.org7 min
- Back end: Connecting Database to Server (database.js)by freeCodeCamp.org6 min
- Back end: Server Entry Point (index.js)by freeCodeCamp.org8 min
- Back end: Setting up Nodemon & Running the Serverby freeCodeCamp.org5 min
- Back end: Creating the User Modelby freeCodeCamp.org10 min
- Back end: Understanding Controllersby freeCodeCamp.org13 min
- Back end: The Journey of a Requestby freeCodeCamp.org9 min
- Back end: HTTP Methods & Status Codes Explainedby freeCodeCamp.org6 min
- Back end: Testing the Register APIby freeCodeCamp.org5 min
- Back end: Hashing Passwords with Bcryptby freeCodeCamp.org9 min
- Back end: Comparing Passwords for Loginby freeCodeCamp.org5 min
- Back end: Coding the Logout Controllerby freeCodeCamp.org6 min
- Back end: Creating the Post Modelby freeCodeCamp.org6 min
- Back end: Coding the Register Controllerby freeCodeCamp.org10 min
- Back end: Read All Posts APIby freeCodeCamp.org5 min
- Back end: Update Post APIby freeCodeCamp.org9 min
- Back end: Delete Post APIby freeCodeCamp.org7 min
- Back end: Testing Delete Postby freeCodeCamp.org3 min
- Quiz: back end and APIs
Part 8. Databases: MongoDB and SQL15 lessons
- Learn MongoDB in 1 hourby Bro Code1h 0m
- SQL with PostgreSQL: PostgreSQL Introductionby freeCodeCamp.org2 min
- SQL with PostgreSQL: SELECT statementby freeCodeCamp.org10 min
- SQL with PostgreSQL: SELECT DISTINCTby freeCodeCamp.org12 min
- SQL with PostgreSQL: COUNTby freeCodeCamp.org15 min
- SQL with PostgreSQL: SELECT WHEREby freeCodeCamp.org8 min
- SQL with PostgreSQL: SELECT WHERE Exampleby freeCodeCamp.org9 min
- SQL with PostgreSQL: COUNTby freeCodeCamp.org17 min
- SQL with PostgreSQL: ORDER BYby freeCodeCamp.org7 min
- SQL with PostgreSQL: LIMITby freeCodeCamp.org13 min
- SQL with PostgreSQL: LIKE and ILIKEby freeCodeCamp.org22 min
- SQL with PostgreSQL: Aggregate Functionsby freeCodeCamp.org9 min
- SQL with PostgreSQL: GROUP BY exampleby freeCodeCamp.org17 min
- SQL with PostgreSQL: HAVING commandby freeCodeCamp.org11 min
- SQL with PostgreSQL: AS Statementby freeCodeCamp.org5 min
Part 9. Launch and get hired5 lessons
- Deploy a full-stack app for free (Vercel + Render)by WebX Learner11 min
- The junior developer portfolio that gets you hiredby Dylan Cole6 min
- 4 portfolio projects that get you hiredby Peter Elbaum8 min
- Getting your first web developer job or client from Africa
- Capstone project: Your full-stack app and portfolio · 🎓 Capstone project
Capstone project: Capstone project: Your full-stack app and portfolio. You finish by building something real; a mentor reviews it before your certificate is issued.
About this course
This is the complete path to becoming a web developer, starting from nothing. You'll build web pages with HTML and CSS, make them interactive with JavaScript, manage your code with Git and GitHub, build modern interfaces with React, create your own back end and API with Node.js and Express, store data in MongoDB and PostgreSQL, and put everything live on the internet for free. Every part ends with a project, and your capstone is a full-stack app with your own portfolio site — the two things employers and clients ask for. Around 35 hours of video plus practice: about 3–4 months at an hour a day.