React 301 - An overview of react-router

react-301.md

React 301

An overview of react-router

• <1> refers to what the browser shows in the view at a given URL
• If a url ends in a <2>, it means that routing is controlled by the server
• react-router is an NPM library
• One advantage of <3> routing is the site is faster
• When the browser handles routing, it means we can avoid sending additional requests to the <4>
• One challenge we have with browser-side routing is dealing with to <5>
• You can think of routing is a <6> relationship
• Routing is all about <7> the view to the URL
• npm i <8> is the command to add react-router as a dependency to the project
• We must wrap the entire application in the <9> component
• Broadcasting a change in the URL can be done with the <10> component
• The <11> prop on the <NavLink /> component becomes the <12> attribute on an anchor tag in HTMl
• Each individual <13> must be contained within a parent <14> component
• The <15> prop on <Route /> matches a to prop on <NavLink />
• When there’s a match between the broadcast and the subscription, the component set in the <16> prop is rendered in the view

---

Key terms and phrases

1. broadcast1.subscription
2. <BrowserRouter />
3. browser-side
4. element
5. file extension
6. href
7. matching
8. <NavLink />
9. path
10. react-router-dom
11. <Route />
12. <Routes />
13. Routing
14. server
15. shared state
16. to