Youtor
React Sidebar Navigation Menu using React Router v64 Beginner Tutorial
YOUR LINK HERE:
http://youtube.com/watch?v=ghxVYER-GCY
Sign Up 👻👻👉 https://semicolon.dev/YouTube • (We're free online community, meet other makers!) • #reactjs #react #reactrouter #reacttutorial #coding #webdev #frontend #webdevelopment #programming Is your react v6 router not routing? In this tutorial we'll cover how to create router in React with a simple navigation bar with clickable links and buttons. We need to export Link, BrowserRouter, Routes and Route components from react-router-dom package. • React Router v6 article based on this video: • https://semicolon.dev/react/router-v6... • Tags: #reactjs #react #reactrouter #coding #programming #webdev #vscode #webdevelopment • Notes: • We no longer use useHistory in V6, so if you get the error: • useHistory was not found in react-router-dom • you should just use useNavigate instead. • Video Chapters: • 00:00 React Router v6 Tutorial / React Routing • 00:15 Installing react router using npm install • 00:42 Import components (BrowserRouter, Router, Routes, Route) • 01:37 How to Create Route Page Components (home, about, contact) • 02:27 How to export page component as default function • 03:22 How to use Route component to create URL pages • 04:35 How to create default error page (page URL not found) in React • 05:11 How To Create Navigation Bar (how to use Link component) • 06:47 How to create Clickable button with React Router V6 • 07:02 useNavigate • 08:18 How to pass parameter to URL (react router) • React simple router example, react router example, react router dom v6 how to use, test route • Related topics • --------------------------- • react router v6 guide • react router v6 redirect • react router v6 docs • react router v6 history • react router v6 not routing • react router v6 useHistory • react router v6 redirect example • react router v6 redirect add query params • react router v6 redirect useNavigate • react router v6 redirect default route • npm install react-router-dom • react router dom
#############################
