React Router DOM Lab Setup

Setup

Open your Terminal application and navigate to your ~/code/ga/labs directory:

cd ~/code/ga/labs

Create a new Vite project for your React app:

npm create vite@latest

You’ll be prompted to choose a project name. Let’s name it react-router-dom-lab.

• Select a framework. Use the arrow keys to choose the React option and hit Enter.

• Select a variant. Again, use the arrow keys to choose JavaScript and hit Enter.

Navigate to your new project directory and install the necessary dependencies:

cd react-router-dom-lab
npm i

Open the project’s folder in your code editor:

code .

Clear App.jsx

Open the App.jsx file in the src directory and replace the contents of it with the following:

// src/App.jsx

const App = () => {
  return <h1>Hello world!</h1>;
};

export default App;

Running the development server

To start the development server and view our app in the browser, we’ll use the following command:

npm run dev

You should see that Vite is available on port number 5173:

localhost:5173