https://github.com/thepravin/react_setup

https://github.com/thepravin/react_setup

Last synced: 2 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/thepravin/react_setup
• Owner: thepravin
• Created: 2024-01-16T10:09:17.000Z (12 months ago)
• Default Branch: main
• Last Pushed: 2024-01-16T10:54:36.000Z (12 months ago)
• Last Synced: 2024-01-16T17:14:56.000Z (12 months ago)
• Size: 1.95 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Getting Started with React 🚀

## 👉 Method 1: Using Create-React-App

### Step 1: Install Node.js

Ensure that you have Node.js installed on your system. 
  You can download it from [nodejs.org](https://nodejs.org/).

### Step 2: Create a New Folder

Open your terminal and create a new folder for your React project.
 For example, let's name it 

```bash

mkdir ReactApp.

 ```

### Step 3: Change Directory to Your Project Folder

Navigate to the newly created folder using the command line.

```bash

cd ReactApp

```

### Step 4: Create a New React App

Run the following command to generate a new React app.

```bash

npx create-react-app demoReactApp

```

### Step 5: Change Directory to Your App

Move into the newly created app folder.

```bash

cd ReactApp demoReactApp

```

### Step 6: Start the Development Server

Launch the development server.

```bash

npm start

```

***

## 👉 Method 2: Manual Setup

### Step 1: Open Folder and Create index.html File

Open your preferred text editor, create an index.html file, and save it in your project folder.

### Step 2: Open Terminal

Open your terminal or command prompt.

### Step 3: Initialize npm

Run the following command.

```bash

npm init

```

### Step 4: Install Parcel as a Dev Dependency

Install Parcel as a development dependency.

```bash

npm install -D parcel

```

### Step 5: Install React and React-DOM

Install React and React-DOM.

```bash

npm install react

npm install react-dom

```

### Step 6: Run Parcel for Local Development

Run the following command to start a local development server.

```bash

npx parcel index.html

```

### Production Build

To create a production build, use the following command.

```bash

npx parcel build index.html

```

---

## 👉Method 3: Started with Vite

This guide will walk you through the steps to create a Vite project and run it using npm.

### Step 1: Create a Vite Project

Use the following command to create a new Vite project:

```bash

npm create vite

```

###  Step 2: Project Setup

After running the command, you will be prompted to enter the project name.
 Choose a suitable name for your project.

### Step 3 : Select Framework

After entering your project name, Vite will prompt you to select a framework: 


Use your keyboard arrow key to select ```React.```

### Step 4 : Select Language

After selecting the React framework, Vite will prompt you to choose the language type. 


Use your arrow keys to select ```JavaScript```

### Step 5: Install Dependencies

Install the project dependencies using the following command:

``` bash

npm install

```

### Step 6: Run the Project

Now, you can run the Vite project with the following command:

```bash

npm run dev

```



🧑‍💻 Happy coding!