FUTEAC
Get My Free Roadmap

Web Development

React from Scratch

React is the most in-demand frontend library for full-stack work. In this course you will set up a modern React project, break interfaces into reusable components, manage state with hooks, and load data from an API. You will also add page routing and prepare an app for deployment. It assumes you are already comfortable with HTML, CSS, and JavaScript, as covered in the Frontend Developer roadmap.

Intermediate · 13 lessons · 10 hours · English · Part of the Full-Stack Developer Roadmap

React from Scratch course cover artwork

What you will learn

  • Set up a React project with Vite and structure an app
  • Build reusable components with props and JSX
  • Manage state with useState and side effects with useEffect
  • Render lists, handle forms, and show loading and error states
  • Add multi-page navigation with React Router
  • Fetch, display, and update data from a REST API

Curriculum

Module 1: React Fundamentals
  • Why React? Setting Up Your First ProjectFree preview10 min
  • Components and JSX12 min
  • Props: Passing Data Between Components11 min
  • Rendering Lists and Conditional UI12 min
  • Module Quiz: React FundamentalsQuiz
Module 2: State and Hooks
  • useState: Making Components Interactive13 min
  • Forms and Controlled Inputs in React12 min
  • useEffect and Fetching Data14 min
  • Module Quiz: Hooks and StateQuiz
Module 3: Building a Complete App
  • Routing with React Router12 min
  • Structuring a Real Project: Folders and Patterns10 min
  • Reading: Preparing a React App for Deployment7 min
  • Module Quiz: Complete React AppsQuiz

Project: Build a Task Manager App with React — you finish this course by building it, not just by watching.

Requirements

  • Confident HTML, CSS, and JavaScript (ES6+) basics
  • Node.js installed on your computer
  • A free code editor such as VS Code

Frequently asked questions

Is React from Scratch really free?

Yes. This course is free and open. Its lessons use public learning videos with FUTEAC summaries, tasks and quizzes. An optional verified certificate is available after completion.

Do I get a certificate?

You receive a completion record when you finish the course and pass its quizzes. A verifiable certificate with a public verification link is available as an optional upgrade.

What do I need before starting?

Check the Requirements section on this page. If a course builds on an earlier one, we say so there — and the roadmap shows you the right order.

Related courses

Web Development

Free

HTML & CSS Foundations

Build your first real web pages with semantic HTML and modern CSS — no experience needed.

Beginner · 15 lessons · 8 hours · English + Urdu

Web Development

Free

JavaScript Essentials

Learn JavaScript from zero and make your web pages interactive — variables, functions, DOM events, and fetching data.

Beginner · 14 lessons · 9 hours · English