create-t3-app

The best way to start building full-stack Next.js apps.

Install the pnpm package manager on your system if you haven't already.

Run this script in your terminal to start the create-t3-app process.

pnpm create t3-app@latest

Enter the name of your project.

◆  What will your project be called?
│  quadratic-ui

Select TypeScript.

◆  Will you be using TypeScript or JavaScript?
│  ● TypeScript
│  ○ JavaScript

Select Tailwind CSS.

◆  Will you be using Tailwind CSS for styling?
│  ● Yes / ○ No

Choose whether or not to use tRPC.

◆  Would you like to use tRPC?
│  ○ Yes / ● No

Select your authentication provider. If you don't need authentication or aren't using NextAuth.js, choose "None".

◆  What authentication provider would you like to use?
│  ● None
│  ○ NextAuth.js

Select your database ORM. If you don't need a database, select "None". Otherwise, if your database is compatible, I would recommend Drizzle.

◆  What database ORM would you like to use?
│  ○ None
│  ○ Prisma
│  ● Drizzle

Choose the App Router.

◆  Would you like to use Next.js App Router?
│  ● Yes / ○ No

Select your database provider.

◆  What database provider would you like to use?
│  ○ SQLite (LibSQL)
│  ○ MySQL
│  ● PostgreSQL
│  ○ PlanetScale

Choose to initialize a Git repository.

◆  Should we initialize a Git repository and stage the changes?
│  ● Yes / ○ No

Choose to run pnpm install.

◆  Should we run 'pnpm install' for you?
│  ● Yes / ○ No

Select the default import alias.

◆  What import alias would you like to use?
│  ~/

Wait for the installation to complete. Your terminal should look like this.

✔ quadratic-ui scaffolded successfully!

Adding boilerplate...
✔ Successfully setup boilerplate for drizzle
✔ Successfully setup boilerplate for tailwind
✔ Successfully setup boilerplate for dbContainer
✔ Successfully setup boilerplate for envVariables
✔ Successfully setup boilerplate for eslint

Installing dependencies...
✔ Successfully installed dependencies!

Initializing Git...
✔ Successfully initialized and staged git

Next steps:
  cd test
  Start up a database, if needed using './start-database.sh'
  pnpm db:push
  pnpm dev
  git commit -m "initial commit"

Create a repository on GitHub and copy the repository's URL. It should look something like this: https://github.com/qiaoandrew/quadratic-ui.git.

Change into your project's root directory. Run the following command, replacing quadratic-ui with the name of your project.

cd quadratic-ui

Push your repository to GitHub through the command line by running the following commands in your project's root folder. Replace the GitHub link with your own.

git remote add origin https://github.com/qiaoandrew/quadratic-ui.git
git branch -M main
git add .
git commit -m 'initial commit'
git push -u origin main

Create a new project on Vercel. Log in with your GitHub account and connect your new GitHub repository to the project.

Add the following environment variable as a placeholder under the "Environment Variables" section.

DATABASE_URL="postgresql://postgres:password@localhost:5432/test"

Click deploy!

Follow the quickstart guide to get started with quadratic/ui.