React — Setup

Prerequisites

Before setting up React, make sure you have:

• Node.js (version 14 or higher)
• npm or yarn
• Code editor (VS Code recommended)

Installing Node.js

Download Node.js from nodejs.org. This installs npm (Node Package Manager).

# Check Node.js version
node --version

# Check npm version
npm --version

Creating a React Project

# Using npx (recommended)
npx create-react-app my-app

# Using yarn
yarn create react-app my-app

Using Vite (Faster)

# Create with Vite
npm create vite@latest my-app -- --template react

# Install dependencies
cd my-app
npm install

# Start dev server
npm run dev

Project Configuration

// package.json
{
  "name": "my-app",
  "version": "1.0.0",
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  }
}

VS Code Extensions

Install these extensions for better development:

1. ES7 React/Redux/GraphQL/React-Native snippets
2. Prettier - Code formatter
3. ESLint
4. Auto Rename Tag

Mini Practice

Set up a React project that:

1. Creates a new React app with Vite
2. Installs dependencies
3. Starts the development server
4. Opens the app in browser

Up Next

Next: Learn about JSX syntax.