Setting up development tools

1. Download and install Node.js. Details are found here.
2. Optionally to automatically generate React code snippets in Visual Studio Code, search extensions for "react" and install the extension called "ES7+ React/Redux/React-Native snippets" by the publisher dsznajder.

Scaffolding a new project

1. Run below command to create a new project say called myproject:
   npm create vite@latest myproject
2. Select the framework: React
3. Select the varient: JavaScript
4. Select the linter: Oxlint
5. Select "Yes" if npm install and npm run dev should run automatically.
6. If selected "No", run the following commands afterwards:
   1. To change to the correct directory: cd myproject
   2. To install node packages (project dependencies): npm install
   3. To start development server: npm run dev
7. The URL to access the development server will appear on the terminal. Use a web browser and access that URL.

Opening inside an IDE

Open the generated myproject (say) directory from an IDE like Visual Studio Code.

To experiment, edit index.css, App.css and App.jsx while observing the results on the web browser.

Build the project

Run the below command to build the project:

npm run build

The output will be placed inside a directory called dist. This content can be uploaded to a web server. Note that opening the index.html file directly from a web browser (i.e. without serving from a web server) might not work.