What is deep paths? about react-router-tutorial

[Download]

Say your website runs at http://example.org.
Suppose you have a folder public in your project that corresponds with this URL.
Suppose this folder contains a file index.html, that has a link element that points to a stylesheet, like this:

<link rel="stylesheet" href="style.css" />

This will end up trying to load the file from http://example.org/style.css, which maps to /public/style.css. So that's where we place the stylesheet and all works well.

But now suppose we introduce a route /about. When people click a link to this route, the URL in the address bar will change to http://example.org/about.
So far so good, but now suppose that the user presses F5 to refresh the page. What will happen?

The browser will make a request to the server for http://example.org/about. The server serves up the HTML, containing the link element with a relative URL and the browser turns that relative URL into the absolute URL http://example.org/about/style.css, which would map to /public/about/style.css, which is wrong.

Basically, the index.html file will be served up for all paths, be they /, /about, or /about/something/very/deep. So we need absolute URLs in index.html so we can always refer back to the same path at the root where the css file lives.