CodeNewbie Community 🌱

Connor
Connor

Posted on

How do I change the URL without reloading the page?

What up y'all! I've been working on creating a portfolio site from scratch and got stuck on this annoying little problem.

Can anyone shed some light on how to change a URL without reloading the page?

Thanks all!

Top comments (3)

Collapse
 
larrymartin1job profile image
Larry Martin

Utilizing the History API in JavaScript allows you to modify the URL without triggering a page reload. It is a powerful method for creating smooth transitions and updating the URL according to different site states or user actions.
Window Installation Services in Kitsap County WA

Collapse
 
terabytetiger profile image
Tyler V. (he/him)

I think the answer might be different depending on what you mean here.

Are you redirecting the user, but want a transition between pages?

Are you trying to update the url as the user scrolls past a certain point on the page?

It could also be helpful to mention what you're working with - React, Vanilla JS, Vue, etc... since depending on the framework/libraries in use there may be different answers :)

Collapse
 
kleinemaulwurf profile image
Der @KleineMaulwurf

The HTML5 history API can do that.

history.pushState(null, null, 'subpage');

More details here: css-tricks.com/using-the-html5-his...