
Next.js 9.3 – Static Site Support, 32 KB Smaller Runtime - leerob
https://nextjs.org/blog/next-9-3
======
ncphillips
Preview Mode is an amazing innovation!

I work on TinaCMS, a toolkit for building content management into your
website, and we just implemented an open-authoring system on our own docs.
People can contribute to our docs without ever leaving the website. You just
click "Edit this post" and it will create a fork and enter inline-editing
mode. Any changes are committed back to your fork and then you can open a PR
from there.

[https://tinacms.org/blog/introducing-visual-open-
authoring](https://tinacms.org/blog/introducing-visual-open-authoring)

~~~
eyelidlessness
This is really cool. Many _many_ years ago, I worked on a project that
attempted to provide functionality like this, but with the limitations of
browsers (IE 6 was still by far the majority share), libraries and my own
talents, it was too ambitious to achieve. It warms my heart to see that vision
realized in real products today.

~~~
ncphillips
Thanks so much! We’re really just getting started. There’s going to be a lot
of advances in the next couple months.

------
Insanity
I've used Next.js for the first time about 3 weeks ago to launch a small
experiment. It was also my first introduction to react.

I must say, it was a pleasure to use. Great tutorials and the deployment using
"now" was easy. Even attaching my own domain to it took less than 10 minutes.

Really recommend trying it out if you're interested in frontend development!

~~~
kylemh
or if you're _not_ interested in front-end work, but need to do something
quick.

~~~
Insanity
Woops yeah indeed, that was my use-case actually!

------
rmrfrmrf
I'm in the market for an SSG for documentation of a larger project (and
therefore I'm looking for something quick and easy to maintain). Hoping to
keep it within the JS ecosystem so that would rule out Hugo and Jeckyll. Is
Next.js easier to use than Gatsby, or is there an even simpler alternative I
haven't come across yet? Ideally I'd be able to point this library to a glob
of .md files and generate HTML + RSS.

~~~
_bxg1
I built my personal website with nothing but Express and JS template strings:
[https://github.com/brundonsmith/website](https://github.com/brundonsmith/website).
It's so simple to do that I almost question the necessity of "static site
generators" in general (Next.js of course does much more than static site
generation).

~~~
lioeters
Interesting approach, how every page is a JS file that builds the HTML page as
a string; structurally it looks almost the same as how React/Next.js do it.

With that setup, I imagine it's fairly trivial to add a "static site
generator":

\- Run the local server that serves the rendered pages.

\- Run a Node.js process that will take a given array of all page routes; make
HTTP requests to those local URLs; and save the rendered HTML into folders,
for a complete static site.

~~~
_bxg1
Yep, that's what it already does :) And a neat property is that I could freely
move different render functions between static, request-time, and client-side
if I wanted to.

People tend to think of React rendering and the like as this special,
mysterious process. But the only special thing about it is the way it
efficiently reconciles and updates an _existing_ DOM to match a new DOM. That
initial render is really no different from PHP. Static site generators are
just PHP with a prewarmed cache.

~~~
lioeters
Ah, I didn't dig deep enough to see that it already does what I described,
heheh. So it's a static site generator as well as a server that dynamically
renders. I like the sound of being able to "partially compile", having the
choice to leave some routes rendered at request-time or client-side.

I heard the analogy (equivalence?) before, that statically rendered sites are
_caches that are invalidated at build time_.

Makes sense, and thinking of it as a strategy that can be partially applied -
rather than as an all-encompassing framework or tool - is insightful, so it
can be mixed and matched with dynamic rendering as needed.

~~~
styfle
What you described here is basically how Next.js works :)

The blog post mentions the 3 APIs that make this possible:

\- getStaticProps (Static Generation): Fetch data at build-time.

\- getStaticPaths (Static Generation): Specify dynamic routes to prerender
based on data.

\- getServerSideProps (Server-Side Rendering): Fetch data on each request.

------
Pandabob
Looks awesome congrats to the team. I'm hoping preview mode will also work
with Contentful.

------
nviennot
I love Next.js! I used it for building a personal finance tracking tool:
[https://github.com/nviennot/easy-finance](https://github.com/nviennot/easy-
finance)

------
AgentME
The new `getServerSideProps` function addresses my biggest pain point with
Next.js. I found it super awkward that if you wanted to make a website with
data from a database, you basically needed two webservers: one to access the
database and expose it over the web via a raw format like JSON, and then a
Next.js-powered one to take that JSON and make it into HTML. For a lot of
projects that separation can be nice, but for small sites or prototypes it's
too much effort. Now I can easily have the Next.js server access the database
directly.

~~~
ficklepickle
Nuxt.js solved this with asyncData ages ago

------
kintalo
Love the team behind it and their outlook on engineering and design. Look
forward to using 9.3 and view getStaticProps as a major step forward.

------
k__
Nice, with SSG support Next becomes basically Gatsby on drugs.

------
nobody0
Next.js do is more favorable if you don't want to be locked-in.

That's important to overcome the fatigue learning all the buzzwords

------
ficklepickle
Nuxt.js has had "SSG" for a long time

------
rolltiide
I’ve been interviewing and encountered my first company using that and was my
first exposure to it.

Very fascinating project!

