Building a static HTML frontend with RESTful backend: Handling bookmarkable URLs

I’m trying to make a web app with a static HTML frontend and a RESTful backend. I’m used to server-side rendering but want to try something new.

Here’s my plan:

  • Use static HTML files
  • Fetch data with JavaScript from a REST API
  • Make URLs bookmarkable

I’m wondering how to handle bookmarkable URLs when the HTML and data come from separate requests. For example:

/users/
- Loads users.html
- Makes AJAX call for user list

/users/bob
- Loads user.html
- Makes AJAX call for Bob's info

Is this a good approach? It seems flexible for backend work and easier for designer collaboration. Has anyone done this before? Are there better ways to do it?

I’d love to hear your thoughts or suggestions. Thanks!

i’ve tryd similar. the history api works well to update urls without reloading, letting you catch changes and fetch data via ajax. also, a lightweight routing library may help if your app grows. hope its helpful!

ooh, interesting approach! have u considered using a single-page app framework like React or Vue? they handle routing and state management really well. but if u wanna stick with vanilla JS, maybe look into the Fetch API for smoother AJAX calls? just curious, what made u choose this setup over server-side rendering?