4 reasons to use NextJS

pepyta

Gál Péter

Posted on September 18, 2020

4 reasons to use NextJS

At first I was scared to use JavaScript libraries, but then I tried them out and it kinda felt right. I was drawn by this world. It really made my days a lot simpler and me a better developer.

But before I begin. What is NextJS?

NextJS is a javascript library that uses React to help you develop better applications. It manages both your API endpoints and your static or server-sde rendered pages. So it's kind of neat.

GitHub logo vercel / next.js

The React Framework

Next.js logo

Next.js

Vercel logo NPM version License Join the community on GitHub

Getting Started

Used by some of the world's largest companies, Next.js enables you to create full-stack web applications by extending the latest React features, and integrating powerful Rust-based JavaScript tooling for the fastest builds.

Documentation

Visit https://nextjs.org/docs to view the full documentation.

Community

The Next.js community can be found on GitHub Discussions where you can ask questions, voice ideas, and share your projects with other people.

To chat with other community members you can join the Next.js Discord server.

Do note that our Code of Conduct applies to all Next.js community channels. Users are highly encouraged to read and adhere to them to avoid repercussions.

Contributing

Contributions to Next.js are welcome and highly appreciated. However, before you jump right into it, we would like you to review our…

1. It will create a faster and lighter website

When it comes to creating a website, writing it only in HTML is not just hard and time consuming, but you probably can't write a better code than what a computer can generate (at least in terms of package size).

The framework will handle bundling better than anything else. If you have funcntions/classes that you don't use it will just simply
leave it out.

If you were to write a basic site with HTML/CSS/JS you would have to remove every unused code to not bloat the users' networks.

2. You can use almost any NPM package

For sure there is browserify and webpack by themselves that can handle this task, but they will generate files that are going to include things that you don't need. If you have multiple packages, you will know that your node_modules folder is weighing several mb of data. If you want to send them every time someone wants to access your site you are going to face slow loading times.

Contary to the NextJS, it will handle everything and you can use any NPM package, that can run in a browser, let's just say it is timsort or material-ui.

3. You're going to have clean developement envoriments

You have imports and the support of typescript (which means that you will have typings and classes thanks God).

I can't stress this enough. You're not really writing pages, but rather you're writing independent Components, that look much cleaner that their predecessor.

Also being able to tell if your variable is a string or a number or if it has username component or not will make your everyday life much better. Trust me.

Shortly, you're going to have typings, which means autocomplete for your code and code splitting, which is good if you're building large applications

4. You're going to have a large community, that can help you

When I first started to use React, I felt that it was so easy, because there were so good documentations. And not just that, you don't even have to worry about creating every single UI components. You have multiple implementations of Material Design Principles. If you don't trust me than just think about that the largest JS framework is React. We can use React components, so I think we kind of have a head start, compared to other frameworks.

Great! How can I jump in?

With the release of create-next-app, it is easier to start creating a project than ever. If you want to jump right in, then after you've installed NodeJS, you just have to run the npx create-next-app command and your project is ready to edit it.

Can you give me some advice?

  • Use TypeScript!
  • Use material-ui to create User Interfeces
  • Have a folder structure that has (/pages, /public, /components) folders.
  • If you're developing an API use Prisma. It is a database driver, that will generate a type-safe JS module for you to use it in your project.

Thank you for your attention!
Gál Péter (pepyta)

💖 💪 🙅 🚩
pepyta
Gál Péter

Posted on September 18, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related