Jump to content

Other Recommendations

We recognize that the libraries included in create-t3-app don’t solve every problem. While we encourage you to begin your project with the things that we provide, there will come a time when you need to bring in other packages. Only you can know what your project needs, but here are some things that we find ourselves recommending frequently.

These are recommendations by individual Create T3 App contributors and should not be seen as “official” endorsements by the Create T3 App team or T3-OSS. Please do your own research, especially before committing to paid services.

State Management

Editor’s Note: State management libraries can be great, but often aren’t necessary. tRPC’s React Query hooks should be able to take care of your server state. For client state, start with React’s useState, and reach for one of these options when you need more.

Zustand

For never using Redux again

The “modern, simple Redux” you didn’t know you needed. Poimandres↗ can always be trusted. You can build everything from video call apps to games to servers with this little library.

Jotai

For never using Context again

For a more atomic approach, Jotai is hard to beat. Also by Poimandres↗, Jotai lets you define singletons that feel like global useState. A great option for stateful behaviors that don’t need a state machine just yet.

Component Libraries

Most apps need the same handful of components - toggle buttons, dropdown menus, modals, and so on. These libraries provide great, accessible components that you can use and customize to your liking.

Unstyled Component Libraries

Also known as headless libraries, they provide great unstyled, and accessible components that you can customize to your liking. Here are a few recommendations.

  • Radix UI↗ gives you a powerful set of convenient and accessible primitives that you can style with vanilla or Tailwind CSS.

  • Headless UI↗ made by the Tailwind CSS team also provides unstyled, accessible components that integrate seamlessly with Tailwind CSS.

  • React Aria↗ provides accessible UI primitives for your design system. Their Date Picker component is top tier.

Styled Component Libraries

For when you just want your app to look OK

Sometimes you’re building a project where you just want the UI to look decent out of the box. For Admin Dashboards and other similar projects, any of these component libraries will get the job done.

Class Variance Authority

For building UI Libraries

Declaratively build a UI Library with different color, size, etc. variants. When your project reaches a scale where you want a standardized set of UI components with multiple variants using Tailwind CSS, CVA is a great tool.

Animations

For when you need animations in your app, here are our recommendations.

AutoAnimate

For animations with a single line of code

Most animation libraries try to satisfy every possible use case, and become clunky as a result. AutoAnimate is a zero-configuration tool that will give you a significant improvement in UX with no additional developer effort.

Framer Motion

For complex animations with declarative code

Framer Motion provides a simple, declarative syntax and allows you to write less code to craft everything from complex animations to even gestures.

Deployments, Infrastructure, Databases and CI

Vercel

For hosting your app

Vercel took the hell of web deployments and made it a set-and-forget GitHub integration. We’ve scaled to hundreds of thousands of users without issue. AWS-powered, just a way better interface :)

PlanetScale

For databases without the worry

PlanetScale is the best “serverless database platform” we’ve used by far. Insane scale, great developer experience, and fantastic pricing. If you’re using SQL (and hopefully Prisma), this is hard to beat.

Railway

For hosting your infra

“Modern Heroku”. The easiest way to get a real server up and running. If Vercel and PlanetScale aren’t enough, Railway probably is. Point it at a GitHub repo and go.

Upstash

For serverless Redis

We love Prisma and PlanetScale, but some projects require a more performant solution. Upstash allows you to get the in-memory performance of Redis in your serverless project, without having to manage the infrastructure and scaling yourself.

Pusher

For serverless WebSockets

If WebSockets are the primary focus of your project, you may want to consider a more traditional backend such as Fastify↗ (which also works with tRPC!↗). But for quickly adding WebSockets to a T3 App, Pusher is an excellent choice.

Soketi

Soketi is a self-hostable, simple, and fast alternative to Pusher. It’s fully compatible with the Pusher SDK which you can use to connect to the server. Soketi serverless is also in beta.

Analytics

User data is very valuable when you’re building an app. Here are some analytics providers we recommend.

Plausible

Need analytics? Plausible is one of the quickest ways to get them. Super minimal. It even has a simple plugin for Next.js↗.

Umami

Umami is an open-sourced, self-hostable, simple, fast, privacy-focused alternative to Google Analytics. You can deploy it really easily to Vercel, Railway, etc. with PlanetScale as your database or you can also use its cloud version.

Other

Next Bundle Analyzer

It can sometimes be difficult to determine what will be included in the build output for your app. Next Bundle Analyzer is an easy way to visualize and analyze the JavaScript bundles that are generated.