UIDev - React Router v4 2020-7 Free Tutorial

Table of Contents

Description

UIDev – React Router v4 is a react training course. All courses offered by UIDev use a proven structure that is optimized for the transfer of basic knowledge, not just the concept of learning.

What you will learn in UIDev – React Router v4 course:

Familiarity with React Router v4 and new routing methods
Work with URL parameters
Learn nested paths
Page Management 404
Manage static paths such as / settings alongside dynamic paths such as /: uid
Customize links
Animated shifts
Batch code

Course specifications

Publisher: UIDev ( UI.Dev )
Language: English
Number of courses: 51
Duration: 6 hours and 44 minutes

React Router v4 course topics:

Why React Router v4?

Introduction and Philosophy behind React Router v4

URL Parameters

URL Parameters with React Router v4
Solution URL Parameters

Nested Routes

Nested routes with React Router v4
Solution Nested Routes

Passing Props

Pass props to a component rendered by React Router v4
Solution Passing Props

Programmatically Navigating

Programmatically navigate using React Router v4
Solution Programmatically Navigate Declaratively
Solution Programmatically Navigate Imperative

Query Strings

Query Strings with React Router v4
Solution Query Strings

404 Pages

Handling 404 pages catch-all routes with React Router v4
Solution Catch-All Routes

Ambiguous Matches

Ambiguous Matches with React Router v4
Solution Ambiguous Matches

Passing Props to Link

Pass props to React Router v4s Link component
Solution Passing Props to Link

Sidebars

Rendering a Sidebar or Breadcrumbs with React Router v4
Solution Sidebar

Customizing Link

Customizing your own Link component with React Router v4
Solution Customizing Link

(Project) Hash History Basketball League

Project Introduction and Starter Files with Create React App
Project Given code for Project
Project Setting up the initial routes
Project Setting up a catchall 404 route
Project Setting up the Home route
Project Fetching the players
Project Rendering the players
Project Fetching the teams
Project Rendering the teams
Project Setting up the teams page
Project Fetching the teams articles
Project Rendering the teams articles
Project Creating a Loading component

Animated Transitions

Animated Transitions with React Router v4
Solution Animated Transitions
Project Adding in Animated Transitions

Code Splitting

Code Splitting with React Router v4
Solution DynamicImport
Solution Reactlazy
Project Code Splitting

Protected Routes

Protected routes and authentication with React Router v4
Solution Protected Routes

Preventing Transitions

Preventing transitions with React Router v4
Solution Preventing Transitions

Route Config

Route Config with React Router v4
Solution Route Config

Bonus

Bonus Server Rendering with React and ReactRouter v4
Bonus Recursive paths with React Router v4

Course prerequisites:

A fundamental understanding of JavaScript or familiarity with another programming language. For example, you should be comfortable with functions, arguments, loops, control flow, etc. If you want to jump straight into the React courses, we recommend having a stronger knowledge of JavaScript, which you can get from our JavaScript courses if you’re unsure.