Skip to main content
Advertisement

React: Prerequisite Knowledge and Environment Setup (Step 1)

Target Version: React 18 / 19+ Official Documentation: React Documentation

1. Before Learning React

React is a declarative UI library. You will find it much easier to learn if you have the following prerequisite knowledge:

  • Modern ES6+ Syntax: Destructuring assignment, spread operator (...), arrow functions, and modules (import/export).
  • DOM Concepts: An understanding that web documents are structured as a tree.
  • npm/yarn: Basic usage of package managers.

2. Setting Up the Development Environment (Local Setup)

The fastest way to start a modern React project is by using Vite.

Creating and Running a Project

# 1. Create a Vite project (Choose React & JavaScript)
npm create vite@latest my-react-app -- --template react

# 2. Enter the project folder
cd my-react-app

# 3. Install dependencies
npm install

# 4. Start the development server
npm run dev

3. Core Philosophy of React

  • Component-based: Divide the UI into independent, reusable pieces.
  • Virtual DOM: Automatically optimizes performance by manipulating a Virtual DOM instead of the actual DOM.
  • One-way Data Flow: Data always flows from parent to child (Props).
Advertisement