The update for React (v6) and creating routes

npx create-react-app demo-projectcd demo-project
npm install react-router-dom 
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom'
import React from 'react'
import Home from './Home'
class App extends React.Component {render(){
return (
<Router>
<div className="App">
<Switch>
<Route exact path='/' component={Home}/>
</Switch>
</div>
</Router>
)
}
}
export default App
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'
import React from 'react'
import Home from './Home'
function App() {return (
<Router>
<Routes>
<Route index path="/" element={<Home/>}/>
</Routes>
</Router>
)
}

--

--

--

A software engineering student at Flatiron School.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

WALKING THE REACT JS ROAD WITH SIDEHUSTLE- Team Atomic For every member of the atomic team, front…

Understand Code Splitting in Next.js by Solving a Common Error

Enabling initialNavigation with LocalizeRouter and Angular Universal

Adapting legacy site to iFrame with access to parent window’s URL

What is ESLint? How do I set it up on Atom?

Simulating single and multiple inputs using pyTest and monkeypatch

Create Responsive Width and Height in React Native

Configuring Dexie.js in an Angular Project

Dexie.js for Angular

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Jessica Sewell

Jessica Sewell

A software engineering student at Flatiron School.

More from Medium

Re-assigning a value to UseParams hook using useState hook.

Setting Up React Router

Hooked on React

Trick for Conditional Rendering in Navlink component of React Router