History API

The History API lets you interact with the browser history, trigger the browser navigation methods and change the address bar content.

It’s especially useful in combination with modern Single Page Applications, on which you never make a server-side request for new pages, but instead the page is always the same: just the internal content changes.

A modern JavaScript application running in the browser that does not interact with the History API, either explicitly or at the framework level, is going to be a poor experience to the user, since the back and forward buttons break.

Also, when navigating the app, the view changes but the address bar does not.

And also the reload button breaks: reloading the page, since there is no deep linking, is going to make the browser show a different page

The History API is available on the window object, so you can call it like this: window.history or history, since window is the global object.

Lessons in this unit:

0: ▶︎ Introduction
1: Navigating the history
2: Add an entry to the history
3: Modify history entries
4: Access the current history entry state
5: The `popstate` event
6: The `hashchange` event
Are you intimidated by Git? Can’t figure out merge vs rebase? Are you afraid of screwing up something any time you have to do something in Git? Do you rely on ChatGPT or random people’s answer on StackOverflow to fix your problems? Your coworkers are tired of explaining Git to you all the time? Git is something we all need to use, but few of us really master it. I created this course to improve your Git (and GitHub) knowledge at a radical level. Launching May 21, 2024. Join the waiting list!