The best way to setup an opinionated, full-stack, typesafe Next.js project

npx create-t3-app@latest
Copied

What is this? Some kinda template?

What is this? Some kinda template?

Kind of. We love all of the technologies that create-t3-app includes - check out init.tips for even more info on topics such as state management and deployment - but we do not believe these are needed on every project. So we made create-t3-app to do one thing: Simplify complex boilerplate around the core T3 Stack tech without compromising the pieces modularity. This is NOT an all-inclusive template and we expect you to bring your own libraries as well.

Libraries that work

Without the complex setup

create-t3-app gives you the option to install libraries that you need without the hassle of scaffolding it all yourself.

NextJS

We love React. It has made UI development accessible in ways we never imagined before. It also can lead developers down some rough paths. Next.js offers a lightly opinionated, heavily optimized approach to creating a website using React. From routing to API definitions to image rendering, we trust Next.js to lead developers towards good decisions.

TypeScript

Javascript is hard. Why add more rules? We firmly believe the experience TypeScript provides will help you be a better developer, regardless of where you are in your career as an engineer. Whether you're new to web development or a seasoned pro, the "strictness" of TypeScript will provide a less frustrating, more consistent experience than vanilla JS

TailwindCSS

Tailwind is a utility-first CSS framework for rapidly building custom user interfaces. It's a great way to quickly get up and running with a new project, but it can also be used to add some much needed polish to an existing project. We include the option to add Tailwind to provide a consistent, responsive, and accessible experience across all of your projects.

tRPC

If you use TypeScript on both the frontend and backend, you should use tRPC to infer types to create a full stack type-safe API. It can be used in place or alongside Next.js' API routes, or as a standalone server.
NextAuthJS

NextAuth

When you need a flexible, secure, and scalable authentication solution, NextAuth.js is the go-to. It ties into your existing database and provides a simple API to manage users and sessions, and ties into NextJS and tRPC to provide a seamless experience.

Prisma

Prisma is the best way to work with databases in your NextJS app. It provides a simple, type-safe API to query your database, and it can be used with a bunch of different databases, including Postgres, MySQL, SQL Server, and SQLite.
@synecdokey's Avatar

Finally had the chance to play with @trpcio and it's scary how easy it makes to make your data flow, with full type safety and backend validation. With create-t3-app and @supabase, I was able to create a simple to-do app with auth in less than 3 hours, scary.

2
9
75
@pitasiantonio's Avatar

We just launched @Pisa_Dev: https://pisa.dev/ ... 🎉🎉 Built using the cool kids’ stack of 2022: - @nextjs - @tailwindcss - @trcpio - @prisma - @planetscaledata - @PlausibleHQ Built by create-t3-app, thanks @t3dotgg! Let me go deeper on this, a thread…🧵

4
5
43
@ajcwebdev's Avatar

Now that Blitz.js has pivoted and Bison has stagnated, create-t3-app will be the only framework to give Redwood a run for its money in the quest to build a legitimate fullstack React framework.

9
4
18