Pretty URLs or HTML5 mode for any front-end SPA: Angular, React & more

The original pretty URLs tutorial has helped quite a few since its inception. Fast-forward a few years and things haven't changed much. Yes, search engines are getting better at indexing dynamic content, but this didn't remove the need for pretty URLs.

We should see the hashbang #! for what it is: a dirty little hack. So let's get rid of it!

Without further ado, here's how to get pretty URLs on some of the most popular server setups & front-end frameworks.

Apache .htaccess

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html