Using React Router 4: Lesson 1 of 12

Introduction

Up Next

Setting up the Development Environment

Autoplaying in 7 seconds!

Cancel

Create a Free Account to Watch

Sign Up Now

Login to your account

Introduction

Once you learn how to use React to create dynamic user interfaces on a single page, you'll start to wonder if you can make an entire site where the front-end is entirely React. You can gain benefits from this since after the initial page load, you will only need to make requests to your server to get data from its API. This sort of application is called a Single Page Application or SPA.

To do this, you will need to learn how to use a router. The router will handle updating the URL when certain things are clicked on and then updating the view according to the URL. There is a very popular router called React Router that we will learn how to use in these lessons. It allows you to express your routes as JSX components and also ships with a component that will handle updating the URL when it is clicked on. If you need more fine grained control, then each route is supplied with three props to allow you to write your own page transition logic - history, location, and match.

In this course, we will be adding routing capabilities to a CMS that allows you to create, update, and delete users. There will be a login form to access it. Therefore, we will need to not only be able to route between each screen but also protect certain routes from unauthenticated users.

Well, let's start out in the next video by setting up our development environment.

Alex Sears

2 posts

Developing is not only my job but also my passion. I love to teach myself new things as much as I love teaching others. The more people we get involved in this little thing we call "web development," the better we can make it. I mean, we always need more cat videos, right?