Next.js this fabulous open source framework based on React allows you to manage an entire application! Both front-end and back-end, perfect for a j...
For further actions, you may consider blocking this person and/or reporting abuse
Great article for beginners! It's well-written and concise, so big thumbs up for the good work.
I noticed that this article is using
next export, which has been removed. To update it, simply add"output: export"to yournext.config.jsfile. That should do the trick!I had issues hosting this on S3 because of the URLs as /home on my navbar doesn't point to /home.html and redirection rules does not work either.
Using
trailingSlash : truein next.config.json seems to resolve the issue but then you would notice that your site serves up as /home/ instead of /home and it created problems with Google indexing.Using other services on AWS will resolve the issue and even rewriting the links to /home.html will work as well but it's stressful.
I resorted to deploying the site on render then I added a custom domain to point to my domain in route53
Hi Simon,
Can you explain more detail your solution? I faced to same issue and i want to fix it.
Which service of AWS should I use and how can i do it?
Thanks a lot.
For those like me - this guide doesn't cover case when you have more than one page - all other *.html files are ignored. Basically all routing happens client side, unless you are on index page. Ideally we should serve upon /about request file about.html and not index.html.
I am gonna try to this with s3 redirects, will see how hard it is but it feels like should be configured during deploy each time, depending on pages.
Hi, have you found any workaround for multiple routes deployment
I got laid off from company where that was needed :)
For anyone reading here the solution is adding trailingSlash to the config:
nuxt.config.js or nuxt.config.ts
This will generate folders for the routes, say, if you have /route, /some_route, /some_route_2, with that option, when doing:
yarn build && yarn exportit will generate a folder for each route with an index.html file inside, i.e./route/index.html
/some_route/index.html
/some_route_2/index.html
This way these can be served in a static fashion.
Thanks man, nailed it
How could i get index.html and i have nextjs only jacascript ?
Yes this method doesn't works
It means you not exported. paste it in to package.json scripts
run
npm run buildHey man, this is not described about the routing with S3/CloudFront. How do you handle the dynamic routing?
Why should I spend so much effort to deploying a static site to aws s3? There are tons of alternatives hosters with one command netlify vercel glitch and more…
S3 is cheap, fast, and simple. A static site is just files on a server and doesn't require a Node run-time. Vercel, Netlify, etc. offer great developer experiences but I think they get pretty expensive at scale. Much more than S3 bucket storage anyways.
It's only cheap because you're ignoring all the other problems that come with this.
if you're doing a single page exported static site, then this simple example will work for a throw away site that only ever gets deployed once.
the moment you're doing anything serious, you'll want zero-downtime-deployments (some people call this blue/green), multiple routes, automated deployments from github.
Once you realise you need these, you and your manager start thinking about the amount of hours you're putting into this... they don't care about nextjs, all they care about is that they look good to their managers... more frequent deployments, less support calls for errors caused by your lack of zero-downtime.
I think you seriously underestimate the amount of time these problems soak up.
You're absolutely right.
next exportkills almost all the features nextjs offers. In the Good-Fast-Cheap triangle, static deployments is only cheap.Hi, Will this next app in the s3 supports Incremental Static Regeneration? Just need your help on it!
I do not believe so. To host on S3 you have to run both
next buildandnext export. You lose a lot of features when you export, including ISR.nextjs.org/docs/advanced-features/...