Generating a Single Page Application

Hi, is it possible with Hugo to generate a single page application, where content pages are loaded dynamically into a single “physical” web page when users click in the navigation? I’m not talking about a single page site with no additional content, but a single page application, where additional content is loaded dynamically.

2 Likes

Yes that should be possible.

@pgage I would start with jsonify and move forward from there (there’s also plainify).

I assume you are creating a content-focused SPA if you’re using Hugo and markdown files. Server config will be up to you, since the Hugo server isn’t production ready.

@rdwatters I didn’t explain much in my initial post, but what I want to end up with is a typical site with horizontal nav (take https://www.bufferbloat.net/ as an example, also made with Hugo), but one of the pages is an application, with more dynamic content and user interaction. When someone switches to other pages on the site, this application needs to maintain state so that when they come back to it, they can continue working where they left off. Maintaining state on the server side and restoring it would be overly complicated in this case, and not as performant. So I thought, if there were a way to tell Hugo to generate an SPA instead of making multiple individual pages, where Hugo would handle making links using different fragment identifiers for each “page” in the site, and would load pages with XMLHttpRequest, for example, that could make things a lot simpler. It would still be a static site with no server support necessary. I could just add my app as another “page” within the SPA and be done.

Could you explain in what way I would use jsonify or plainify?

Thanks for the ideas…

1 Like