25 ms·

Next.js 9.3 – Static Site Support, 32 KB Smaller Runtime

174 points by leerob 7y ago

ncphillips 7y ago
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
- leerob 7y ago
  Wow, this is incredible! I'll have to try it out.
- eyelidlessness 7y ago
  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 7y ago
    Thanks so much! We’re really just getting started. There’s going to be a lot of advances in the next couple months.
- deleted 7y ago
  [deleted]
Pandabob 7y ago
Looks awesome congrats to the team. I'm hoping preview mode will also work with Contentful.
rmrfrmrf 7y ago
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.
- pspeter3 7y ago
  I've used Eleventy which was pretty solid. I'm curious about Next.js though since it seems like it does almost everything out of the box that I want. I'm unsure if can prerender non HTML content though which is interesting.
- leerob 7y ago
  Both Next.js and Gatsby are great to work with. If you're looking to stay in the JS ecosystem, you'll be happy with either choice. As for which is "easier", it comes down to your skill set and preference. If you're familiar with GraphQL and enjoy it, you might prefer to use Gatsby. You can use GQL to fetch your Markdown files. If you're not as familiar with GQL, then it could be seen as a barrier to entry. The biggest advantage Gatsby has over Next.js is its plugin system. For example, you're a simple config change away from an RSS feed -> https://www.gatsbyjs.org/packages/gatsby-plugin-feed/ https://www.gatsbyjs.org/packages/gatsby-plugin-feed/ The biggest advantage Next.js has over Gatsby is that it's a hybrid React framework. You can mix SSG and SSR together in the same application. This could be very beneficial if you want your main marketing site, SaaS app, and documentation to all live in the same project. A great example of MDX (Markdown) + Next.js for production docs would be the StaticKit site -> https://github.com/unstacked/statickit-site https://github.com/unstacked/statickit-site
- kylemathews 7y ago
  Gatsby is widely used for documentation sites (check out sites on the showcase https://www.gatsbyjs.org/showcase/?filters%5B0%5D=Documentation https://www.gatsbyjs.org/showcase/?filters%5B0%5D=Documentat...). Typescript is rebuilding their docs on Gatsby right now and wrote up their reasoning behind the choice here: https://www.gatsbyjs.org/blog/2020-01-23-why-typescript-chose-gatsby/ https://www.gatsbyjs.org/blog/2020-01-23-why-typescript-chos...
k__ 7y ago
Nice, with SSG support Next becomes basically Gatsby on drugs.
Insanity 7y ago
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 7y ago
  or if you're _not_ interested in front-end work, but need to do something quick.
  - Insanity 7y ago
    Woops yeah indeed, that was my use-case actually!
rolltiide 7y ago
I’ve been interviewing and encountered my first company using that and was my first exposure to it. Very fascinating project!
kintalo 7y ago
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.
AgentME 7y ago
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 7y ago
  Nuxt.js solved this with asyncData ages ago
nobody0 7y ago
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
nviennot 7y ago
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
ficklepickle 7y ago
Nuxt.js has had "SSG" for a long time

174 points by leerob 7y ago

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

leerob 7y ago
Wow, this is incredible! I'll have to try it out.
eyelidlessness 7y ago
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 7y ago
  Thanks so much! We’re really just getting started. There’s going to be a lot of advances in the next couple months.
deleted 7y ago
[deleted]

Pandabob 7y ago

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

rmrfrmrf 7y ago

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.

pspeter3 7y ago
I've used Eleventy which was pretty solid. I'm curious about Next.js though since it seems like it does almost everything out of the box that I want. I'm unsure if can prerender non HTML content though which is interesting.
leerob 7y ago
Both Next.js and Gatsby are great to work with. If you're looking to stay in the JS ecosystem, you'll be happy with either choice. As for which is "easier", it comes down to your skill set and preference. If you're familiar with GraphQL and enjoy it, you might prefer to use Gatsby. You can use GQL to fetch your Markdown files. If you're not as familiar with GQL, then it could be seen as a barrier to entry. The biggest advantage Gatsby has over Next.js is its plugin system. For example, you're a simple config change away from an RSS feed -> https://www.gatsbyjs.org/packages/gatsby-plugin-feed/ https://www.gatsbyjs.org/packages/gatsby-plugin-feed/ The biggest advantage Next.js has over Gatsby is that it's a hybrid React framework. You can mix SSG and SSR together in the same application. This could be very beneficial if you want your main marketing site, SaaS app, and documentation to all live in the same project. A great example of MDX (Markdown) + Next.js for production docs would be the StaticKit site -> https://github.com/unstacked/statickit-site https://github.com/unstacked/statickit-site
kylemathews 7y ago
Gatsby is widely used for documentation sites (check out sites on the showcase https://www.gatsbyjs.org/showcase/?filters%5B0%5D=Documentation https://www.gatsbyjs.org/showcase/?filters%5B0%5D=Documentat...). Typescript is rebuilding their docs on Gatsby right now and wrote up their reasoning behind the choice here: https://www.gatsbyjs.org/blog/2020-01-23-why-typescript-chose-gatsby/ https://www.gatsbyjs.org/blog/2020-01-23-why-typescript-chos...

k__ 7y ago

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

Insanity 7y ago

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 7y ago
or if you're _not_ interested in front-end work, but need to do something quick.
- Insanity 7y ago
  Woops yeah indeed, that was my use-case actually!

rolltiide 7y ago

I’ve been interviewing and encountered my first company using that and was my first exposure to it. Very fascinating project!

kintalo 7y ago

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.

AgentME 7y ago

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 7y ago
Nuxt.js solved this with asyncData ages ago

nobody0 7y ago

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

nviennot 7y ago

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

ficklepickle 7y ago

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