If you enjoy video content, be sure to subscribe to my channel to stay updated on new content!
Now, let's dive into the content!
It's no longer a secret among developers that Next.js is truly an incredible product.
Want to take your Next.js frontend to the next level?
I'll share 7 very useful libs for you to use in your personal projects. And here's the deal – there's no silver bullet, okay? It's just my opinion... LET'S GO!
1. Prisma
Prisma is not specific to Next.js. It's an ORM for working with your database.
ORM is a unified wrapper for database queries.
It maintains a good structure and allows quick switching between different database providers.
While there are many ORMs you can use, Prisma supports TypeScript for its queries, making everything 100x faster. Next.js has embraced TypeScript in its default configuration, making it a perfect match.
Another cool ORM that's gaining popularity in the community is Drizzle. Unlike Prisma, it's more SQL-like.
Other ORMs and data structures tend to divert/abstract you from SQL, leading to a double learning curve – the need to know both SQL and the structure's API.
Drizzle is the opposite.
It's very similar to SQL, so you can have zero or minimal learning curve and access all the power of SQL.
2. Shadcn-ui
This one is a bit more personal, but Shadcnui was created to address a latent pain in UIs. There's a video on the channel where I explain more about the advantages and disadvantages, but with this UI, it's much easier to work on large projects and systems.
3. Trigger dev
Imagine a process that needs to run every day at 5 pm... How to implement cron jobs in Next.js?
Some people might say it's impossible, but it's possible thanks to Trigger Dev. They offer Background Jobs for applications. Not necessarily just for Next.js but for any other application where you want to implement cron.
4. NextAuth
Suppose you want to implement authentication from service providers like Facebook/Google/GitHub (oAuth). In that case, you either have to create your implementation for each provider or use an external service like kide or Clerk.
If you want to do everything on your own without using a third-party service, you can use NextAuth, which provides an easy implementation for you to add them easily, providing only the correct keys.
5. Trpc
End-to-end typesafe
If you don't want to create a traditional API, Trpc is excellent for creating a backend because it is end-to-end typesafe. There's a video on the channel where I teach how to create a project with a Next.js monorepo and Trpc; it's worth checking out later. But it's very useful, especially for those who love TypeScript because you won't have to worry about typing both your front and back-end, allowing you to focus on other important parts.
6. ZOD and React Hook Form
Zod is an object validator (server and client).
You can put different rules on an object and validate it later, like a username and password or more complex things.
Zod is not specific to Next.js.
On the other hand, React Hook Form is specific to React.
React Hook Form is an excellent project for client-side validation (showing errors in inputs, managing input state, and sending).
7. React-Query
It's an incredibly useful tool for developers looking to improve the performance and usability of their React-based applications.
It does automatic state management, so you don't have to worry about manually managing the state of your API requests or data cache; the library does it automatically.
Supports pagination and on-demand loading; there's a video on the channel where I teach how to use infinite scroll with this library, and integration is extremely simple.
And that's it; every day more technologies are emerging, so until next time!
I hope I've helped you with something; good luck on your journey!
If you enjoyed this content, check out my YouTube channel, and if it makes sense to you, consider subscribing =)
Until next time!
