Tips for Working with Next.js - Part 1

I'm going to share a series of insights I've come across while working with Next.js in recent years, presented in a series of catchy titles. If any of the sections seem confusing or require further explanation, feel free to mention it in the comments, and I'll be happy to provide more details.

• Never hesitate to turn your project into a MonoRepo, even for a moment.

• Using TurboRepo is not recommended yet.

• Opting for NX makes much more sense. The first thing to note is that its speed is several times faster than the rest.

• Connect GitHub to Vercel and run web vitals tests after each push. If your score is lower than the previous time, inspect your code, address the issue, and then proceed. Don't postpone it, as it will only get harder over time.

• Avoid using Ant Design.

• If you're in search of a suitable UI library, consider using Mantine.

• During development with Next.js, the most crucial web vital factor to pay attention to is TBT (Total Blocking Time). Don't let it escalate to a point where it becomes unmanageable.

• Utilize Next Future Image.

• For external scripts like Google Ads, use PartyTown and employ a script loading strategy on the Worker.

• It's still too early to heavily employ Server Components.

• Prefer SupaBase over Firebase.

• Instead of anything else, use Zustand for state management.

• Absolutely steer clear of using Moment. Replace it with DayJS.

• For sliders and carousels, nothing beats Keen Slider. It's the optimal choice for Next.js, addressing CLS issues.

• Only if you're 100% compelled and out of options should you resort to using Next.js APIs. Avoid them as much as possible.