Loading video...

Video Failed to Load

Go Home

43,459 views • 2 years ago •via X (Twitter)

9 Comments

Alex Sidorenko's profile picture
Alex Sidorenko2 years ago

This is the static export - the closest thing to SPA in Next. Unlike classical SPA (with one index.html page), the static export pre-generates all routes into HTML files during the build time. Like SPA, it can be hosted on any server that can serve static assets.

Alex Sidorenko's profile picture
Alex Sidorenko2 years ago

The navigation happens on the client. We can fetch dynamic data with useQuery/SWR in client components. We can even fetch static data in server components - it will get fetched during the build time.

Alex Sidorenko's profile picture
Alex Sidorenko2 years ago

At the moment, dynamic routes need to be pre-generated using generateStaticParams for static exports. However, there is a proposal for serverless navigation, which could potentially remove this limitation.

Benzigar Alvin.'s profile picture
Benzigar Alvin.2 years ago

Disclaimer : For SPA, go for @reactjs . Next is not built for that. And build export will not work in next unless there is not server side code..

Wojciech Maj 🦋 @wojtekmaj.pl's profile picture
Wojciech Maj 🦋 @wojtekmaj.pl2 years ago

That sounds like Vite with extra steps

Chuangcius's profile picture
Chuangcius2 years ago

I've been waiting SPA in next.js for quite a while, will it come someday?

Alex Sidorenko's profile picture
Alex Sidorenko2 years ago

Well, this is it. Static export generates static files, so it works like SPA. It's even better as it pre-generates HTML for all routes, not only index.html. However, the dynamic routes are the missing piece of the puzzle right now.

Rahul's profile picture
Rahul2 years ago

If you want to deploy a next.js app using cloudflare, then this will be very helpful

Wael Assaf's profile picture
Wael Assaf2 years ago

Yes That's a static export

Related Videos