Skip to content

Repository files navigation

Van Renting Web App

This project is a part of learning React Router.

Steps

1. Create React with Vite

$ npm create vite@latest

Need to install the following packages:
create-vite@5.2.1
Ok to proceed? (y) y
✔ Project name: vanRentingWebApp
✔ Select a framework: › React
✔ Select a variant: › TypeScript + SWC

2. Install React Router

$ npm i react-router-dom

3. Update the src/main.tsx file

import ReactDOM from 'react-dom/client';

import './index.css';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <App/>
);

4. Update the src/App.tsx file

import { BrowserRouter, Routes, Route } from 'react-router-dom';
import './App.css';

export default function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path='/' element={<div>Home</div>} />
        <Route path='/about' element={<div>About</div>} />
      </Routes>
    </BrowserRouter>
  )
};

5. Install Bootstrap

$ npm i --save bootstrap @popperjs/core
$ npm i --save-dev sass

6. Import Bootstap's styles and JS

// src/scss/styles.scss
@import "bootstrap/scss/bootstrap";
// src/main.tsx
import './scss/styles.scss'
import 'bootstrap';

About

This project is a part of learning React Router 6

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages