How to Learn React: A Beginner's Roadmap

React is the most popular frontend library. Learning React opens doors to thousands of jobs. Here's how to learn React from scratch.

Prerequisites

Before React, you need:

• JavaScript — ES6+, arrays, objects, functions
• HTML/CSS — Basic understanding
• npm — Package manager basics

Setting Up React

# Create a new React app
npx create-react-app my-app

# Start the development server
cd my-app
npm start

React Fundamentals

// Components are functions
function App() {
  return (
    <div>
      <h1>Hello, World!</h1>
    </div>
  );
}

// Props pass data
function Greeting({ name }) {
  return <h1>Hello, {name}!</h1>;
}

// State manages data
import { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);
  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>+1</button>
    </div>
  );
}

Learning Path

1. Week 1: Components, JSX, props
2. Week 2: State, event handling
3. Week 3: React Router (navigation)
4. Week 4: useEffect, API calls
5. Month 2: Build projects