To install React.js, you need to set up your development environment. Here’s a step-by-step guide to getting started:
Prerequisites
Node.js and npm: React.js requires Node.js and npm (Node Package Manager) to be installed on your machine. You can download and install Node.js from nodejs.org.
Step-by-Step Installation
Install Node.js and npm
Download the installer for your operating system from nodejs.org and follow the installation instructions. This will install both Node.js and npm.
Create a New React Application
The easiest way to create a new React application is by using the Create React App CLI tool. This tool sets up a new React project with a sensible default configuration.
- Open your terminal or command prompt.
- Run the following command to install Create React App globally:
npm install -g create-react-app
After the installation is complete, create a new React application by running:
npx create-react-app my-app
Replace my-app
with the name of your project.
Navigate to your project directory:
cd my-app
Start the development server:
npm start
Your new React app should now be running on http://localhost:3000
. The development server will automatically reload the page if you make edits to your code.
Project Structure
After creating your React application, the project directory will look something like this:
my-app
├── README.md
├── node_modules
├── package.json
├── public
│ ├── favicon.ico
│ ├── index.html
│ └── ...
├── src
│ ├── App.css
│ ├── App.js
│ ├── App.test.js
│ ├── index.css
│ ├── index.js
│ └── ...
public: This folder contains the public assets of your application. The main file here is index.html
, which serves as the entry point for your app.
src: This folder contains the source code of your application. The main files to note here are index.js
and App.js
.