Need advice about which tool to choose?Ask the StackShare community!

Next.js

2.8K
2.8K
+ 1
267
React Storybook

270
280
+ 1
0
Add tool

Next.js vs React Storybook: What are the differences?

Developers describe Next.js as "A small framework for server-rendered universal JavaScript apps *". Next.js is a minimalistic framework for server-rendered React applications. On the other hand, *React Storybook** is detailed as "Develop and design React components without an app". You just load your UI components into the React Storybook and start developing them. This functionality allows you to develop UI components rapidly without worrying about the app. It will improve your team’s collaboration and feedback loop.

Next.js can be classified as a tool in the "Frameworks (Full Stack)" category, while React Storybook is grouped under "MVC Tools".

Some of the features offered by Next.js are:

  • Zero setup. Use the filesystem as an API
  • Only JavaScript. Everything is a function
  • Automatic server rendering and code splitting

On the other hand, React Storybook provides the following key features:

  • Isolated environment for your components (with the use of various iframe tactics).
  • Hot module reloading (even for functional stateless components).
  • Works with any app (whether it's Redux, Relay or Meteor).

Next.js and React Storybook are both open source tools. React Storybook with 38.9K GitHub stars and 3.19K forks on GitHub appears to be more popular than Next.js with 38.2K GitHub stars and 4.6K GitHub forks.

Avocode, OverCode Solutions, and CybrHome are some of the popular companies that use Next.js, whereas React Storybook is used by Huddle, Quizlet, and AppsFlyer. Next.js has a broader approval, being mentioned in 79 company stacks & 66 developers stacks; compared to React Storybook, which is listed in 43 company stacks and 22 developer stacks.

Decisions about Next.js and React Storybook

We’re a new startup so we need to be able to deliver quick changes as we find our product market fit. We’ve also got to ensure that we’re moving money safely, and keeping perfect records. The technologies we’ve chosen mix mature but well maintained frameworks like Django, with modern web-first and api-first front ends like GraphQL, NextJS, and Chakra. We use a little Golang sparingly in our backend to ensure that when we interact with financial services, we do so with statically compiled, strongly typed, and strictly limited and reviewed code.

You can read all about it in our linked blog post.

See more
Lucas Litton
Founder & CEO at Macombey · | 13 upvotes · 279.8K views

Next.js is probably the most enjoyable React framework our team could have picked. The development is an extremely smooth process, the file structure is beautiful and organized, and the speed is no joke. Our work with Next.js comes out much faster than if it was built on pure React or frameworks alike. We were previously developing all of our projects in Meteor before making the switch. We left Meteor due to the slow compiler and website speed. We deploy all of our Next.js projects on Vercel.

See more

Hey guys,

My backend set up is Prisma / GraphQL-Yoga at the moment, and I love it. It's so intuitive to learn and is really neat on the frontend too, however, there were a few gotchas when I was learning! Especially around understanding how it all pieces together (the stack). There isn't a great deal of information out there on exactly how to put into production my set up, which is a backend set up on a Digital Ocean droplet with Prisma/GraphQL Yoga in a Docker Container using Next & Apollo Client on the frontend somewhere else. It's such a niche subject, so I bet only a few hundred people have got a website with this stack in production. Anyway, I wrote a blog post to help those who might need help understanding it. Here it is, hope it helps!

See more
Get Advice from developers at your company using Private StackShare. Sign up for Private StackShare.
Learn More
Pros of Next.js
Pros of React Storybook
  • 38
    Automatic server rendering and code splitting
  • 32
    Built with React
  • 28
    Easy setup
  • 21
    Universal JavaScript
  • 21
    Zero setup
  • 20
    TypeScript
  • 15
    Static site generator
  • 11
    Simple deployment
  • 11
    Incremental static regeneration
  • 9
    Just JavaScript
  • 9
    Filesystem as an API
  • 8
    Frictionless development
  • 7
    Isomorphic React applications
  • 7
    Testing
  • 6
    Not nuxt
  • 6
    Has many examples and integrations
  • 6
    Well Documented
  • 6
    Everything is a function
  • 4
    Not vue
  • 1
    Deployment
  • 1
    File based routing + hooks built in
    Be the first to leave a pro

    Sign up to add or upvote prosMake informed product decisions

    Cons of Next.js
    Cons of React Storybook
    • 8
      Not Vue
    • 7
      Structure is weak compared to Angular(2+)
    • 2
      Is no Angular
    • 2
      Not flutter
    • 1
      Not Angular 2
    • 3
      Hard dependency to Babel loader

    Sign up to add or upvote consMake informed product decisions

    What is Next.js?

    Next.js is a minimalistic framework for server-rendered React applications.

    What is React Storybook?

    You just load your UI components into the React Storybook and start developing them. This functionality allows you to develop UI components rapidly without worrying about the app. It will improve your team’s collaboration and feedback loop.

    Need advice about which tool to choose?Ask the StackShare community!

    What companies use Next.js?
    What companies use React Storybook?
    See which teams inside your own company are using Next.js or React Storybook.
    Sign up for Private StackShareLearn More

    Sign up to get full access to all the companiesMake informed product decisions

    What tools integrate with Next.js?
    What tools integrate with React Storybook?

    Sign up to get full access to all the tool integrationsMake informed product decisions

    Blog Posts

    What are some alternatives to Next.js and React Storybook?
    Create React App
    Create React apps with no build configuration.
    Gatsby
    Gatsby lets you build blazing fast sites with your data, whatever the source. Liberate your sites from legacy CMSs and fly into the future.
    Hexo
    Hexo is a fast, simple and powerful blog framework. It parses your posts with Markdown or other render engine and generates static files with the beautiful theme. All of these just take seconds.
    LoopBack
    A highly-extensible, open-source Node.js framework that enables you to create dynamic end-to-end REST APIs with little or no coding. Connect to multiple data sources, write business logic in Node.js, glue on top of your existing services and data, connect using JS, iOS & Android SDKs.
    React
    Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project.
    See all alternatives