Original subtitles

In those course sections

which you went through up to this point,

we built a lot of demo projects and example projects,

and there's one thing which

all these projects have in common.

They all basically take place on one single page.

With which I mean, that their URL never changes.

When we navigate around in these apps,

when we dive into different features of the apps we build

the URL always stays the same,

and this kind of makes sense because you learned

that with React we typically do build

a single page application.

But on the other hand, you could argue that

having a URL which never changes isn't ideal.

Because after all,

it's one of the greatest advantages of websites

that you can directly link to a certain page or feature

inside of a website.

You can directly link to a specific article

which is interesting, to a specific product on amazon.com,

that's one of the key benefits of the web, in the end.

And currently in our React apps, which we're building,

it's not a feature we can utilize

because the URL never changes

and therefore we can only link to the app overall,

to the website overall,

and whenever we share a link to our website,

users can of course visit it,

but they will end up on the starting page of our website.

And therefore, in this course section,

we're going to dive into a concept called routing.

And with that we're going to learn

how we can add multiple pages

or the illusion of having multiple pages

with different URL's to the same single page application.

So, we will still build a single page application

where React and the browser is responsible

for updating what the user sees,

but we will still be able to change the URL

and use multiple pages.

And if that sounds strange

we're going to learn how it works in this course section.

Specifically, we're going to explore

what exactly Client-Side Routing is

and how we make it work.

We're then going to dive into a third party package

called React-Router,

which we'll use to implement routing

in our React application,

and we're then going to work with that package

to add routing to an example project.

And we're not just going to dive into the basics,

but as we always did in this course,

we are going to dig a bit deeper

and we are going to dive into some advance features as well,

Dynamic Routes, Nested Routes, and more.