Difference between Reactjs and Nextjs
In short, React is a library, and NexJS is a framework, but do you know the difference between each?
What is a web app
To build a modern web app, you need at least these three things
- A component library to display content and allow users to interact
- A routing system to navigate through the sections or pages in the app
- A build system to package-ready the app to be published to the internet
Library vs. framework
Libraries and frameworks are code that someone else wrote to help you solve common problems while writing your application.
Libraries
Libraries are to solve a specific problem in your app. For example:
- Routing
- Dates management
- Transform data
Some popular JavaScript libraries:
- date-fns: Modern JavaScript date utility library
- Ramda: A practical, functional library for JavaScript programmers.
- Parsley: the ultimate JavaScript form validation library
Frameworks
It can be everything you use to develop your web app. Typically is a collection of libraries that work together in some opinionated way to help you build a fully functioning app.
Some popular JavaScript frameworks
- Angular: provide routing, fetching data, components, testing, and more
- Nuxt.js: same as Next.js but instead of Reactjs, uses Vue
- Express.js: is NodeJS framework for the server
Reactjs vs. Nextjs
React is a JavaScript library that helps you to build user interfaces using components as building blocks.
Reactjs do one part of all the web app, which is to build UI components to show content.
NextJS is a framework with a set of libraries that work together to build a web app, and one of those libraries is Reactjs.
React is used by Nextjs not only to create components in the UI but to build full pages.
Other libraries used by Nextjs are:
- next/router for routing and navigation
- next/link a component that allows our web app to link pages and lazy load data
- next/image a component to load images into the pages in the most performant way
Conclusion
Nextjs as a framework allows you to use React library to build pages and UI for your web app.
Reactjs as a library is part of a framework, the UI components part.