Next.js is a React Framework
React is a popular JavaScript library. At some point, you will need React to do more things than the library can handle. This is where Next.js shines. Next.js uses the React library as its primary technology, but it also builds additional common needs into it.
React is a library
React is a JavaScript library for building user interfaces. The user interface is often referred to as the front-end of an application.
This course assumes you have experience with React and have used it enough that you can consider yourself at an intermediate level. You do not have to be an expert, but having some foundational React experience will be important when learning Next.js.
Next.js is a framework
Next.js is built on the React library. It is considered a framework because there are specific ways to use Next.js. It is similar to React but better.
React apps need a lot of functionality, and you end up sourcing from third-party npm packages. With Next.js these apps are already built right into the framework. For example, the router is built-in, which makes it possible to have specific URLs load components that you can choose to be displayed at that location. Another example is how Next.js can manipulate the <head> tag of the site. This is great for SEO and is really easy to use.
React pros
State
The state of an application holds data. Some of the data will change as the user progresses through the app. The best way to think of state is as a front-end database, allowing your app to communicate with the back-end less often. State can also manipulate your view of the application. If something in state changes, it will also change what your user sees in the user interface.
Components
Components are the building blocks of any React app, and a typical React app will have many of these. Simply put, a component is a JavaScript function that optionally accepts inputs, such as properties(props), and returns a React element that describes how a section of the User Interface (UI) should appear.
More Pros
React is extremely popular, and there are a lot of pros to using React. There are so many that it would be hard to mention them all here.
React Cons
In general, there are not a whole lot of cons when working with React. In fact, the cons seem non-existent when you first dive into React. They only become apparent when you have spent a lot of time working with the library. Some of them, as I will mention, can be fixed with a third party npm package.
No Router
There are a couple of reasons why it is not ideal to install a router like React Router Dom. First, nearly every React app needs a Router, and you have to install a third party library for this functionality. Secondly, it is not that straightforward. Depending on how you build your app, using the router can be implemented in very different ways.
On-page SEO is impossible
I will explain why your site is not search engine-friendly when using only React in an upcoming lesson. For now, I want to tell you that, like you, I have made many attempts to make sites created with only React indexable by Google and other search engines. I literally tried everything. Finally, I gave up and invested the time to learn Next.js. I was surprised that it was really easy to learn. If you are having issues getting indexed by search engines, Next.js will fix this for you.
Why you should use Next.js
Next.js has all the benefits of React, but none of the issues that React presents. As you progress through the course, this statement will make more sense. Using Next.js also prevents you from having to install and learn multiple third-party npm packages because Next.js builds important functionalities into the framework.