React Router
<Redirect>
Any time that you want to force navigation, you can render a _________________. When it renders, it will navigate using its 'to' prop.
dynamic routing
A type of routing that takes place as your app is rendering, not in a configuration or convention outside of a running app.
<BrowserRouter>
Generally speaking, if you have a server that responds to requests which routing tag should be used to wrap your outermost application component?
<Switch>
The _________ component iterates over all of its children <Route> elements and only renders the first one that matches the current location.
<BrowserRouter>
The ___________ component is a specialized <Router> that uses the HTML5 history API (pushState, replaceState, and the popState) to keep your UI in sync with the URL.
<NavLink>
The _______________ is a special type of <Link> that can style itself as "active" when its 'to' prop matches the current location.
<Switch>
The ________________ component is used to group <Routes>s together.
an anchor (<a>)
What HTML tag is rendered in your application's HTML wherever you render a <Link>?
1. They are not SEO (Search Engine Optimization) friendly (HTML is mostly rendered through JS. Search engine crawlers are unable to see what gets rendered) 2. Slow initial loading time.(Have to wait until the JS gets loaded before the JS renders HTML)
What are 2 major problems with single page apps?
1. UX is improved because the website doesn't have to constantly reload itself 2. The server's loading will be freed up as most of the rendering work is moved client-side (end user's browser) 3. Development is much easier as the server and client now share an API (your front end app is self-contained and maintenance is easier)
What are the advantages of SPAs?
router components, route matching components, and navigation components
What are the three types of components in React Router?
<Route> and <Switch>
What are the two route matching components included with React Router?
<Link> and <NavLink>
What component does React Router provide for creating links in your application?
It allows websites to function as independent apps which communicate with servers through APIs.
What is the benefit of a single page application?
react-router-dom
What npm package do you install in order to use React Router?
<Route>
When a _____________ matches it will render its content and when it does not match, it will render null. One with no path will always match.
when you have an existing component and don't need to pass props
When should the component prop be used with the <Route> component?
when you have to pass in-scope variables to the component you want to render.
When should the render prop be used with the <Route> component?
when you want to use a function to pass in-scope variables because you will get undesired component unmounts/remounts.
When should you NOT use the component prop with the <Route> component?
component and render
_______________ and _____________ are the two prop choices which are almost always used with <Route> for rendering components.
Route matching
____________________________ is done by comparing a <Route>'s path prop to the current location's pathname.
lazy loading or code splitting.
________________________________ is a technique of downloading only what you need from the server and only downloading code not needed right now for when it is needed.