create-t3-turbo

repository·main·Indexed 27 days ago

https://github.com/t3-oss/create-t3-turbo

A monorepo starter template for full-stack development using Turborepo. It integrates Next.js, Tanstack Start, and Expo (React Native) with a shared backend powered by tRPC, Drizzle ORM, and Better Auth.

Tokens
8.7K
Snippets
18
Records
71
Agent score
91%

What's inside create-t3-turbo

  1. Generate Better Auth schema

    main

    This project uses Better Auth for authentication. You must generate the authentication database schema using the Better Auth CLI before authentication features will work.

    Run the following command to generate the schema:

    pnpm --filter @acme/auth generate

    Details:

    • Config source: packages/auth/script/auth-cli.ts (a CLI-only configuration file).
    • Output: packages/db/src/auth-schema.ts (a Drizzle-compatible schema for authentication tables).
    • Runtime usage: For actual application logic, use the configuration located in packages/auth/src/index.ts rather than the script file.
  2. Configure Expo dev scripts for iOS or Android

    main

    To run the Expo application, you need to modify the dev script in apps/expo/package.json to target your preferred emulator.

    iOS Simulator

    1. Ensure XCode and XCommand Line Tools are installed.
    2. (First time only) Run npx expo start from apps/expo and press I to launch Expo Go manually.
    3. Update apps/expo/package.json:
      "dev": "expo start --ios"
    4. Run pnpm dev from the project root.

    Android Emulator

    1. Ensure Android Studio tools are installed.
    2. Update apps/expo/package.json:
      "dev": "expo start --android"
    3. Run pnpm dev from the project root.
    +  "dev": "expo start --ios",
  3. Setup dependencies and database for create-t3-turbo

    main

    Follow these steps to prepare your local environment:

    1. Install dependencies: Use pnpm to install all workspace dependencies.
    2. Configure environment variables: Copy the .env.example file to .env and fill in the required values.
    3. Push database schema: Use the db:push command to sync your Drizzle schema with your database.

    Important: The db package is preconfigured for Supabase using the Vercel Postgres edge driver. If you use a different database, you must modify the schema in packages/db/src/schema.ts, the client in packages/db/src/index.ts, and the Drizzle configuration in packages/db/drizzle.config.ts. To use a non-edge driver, remove export const runtime = "edge"; from all pages and API routes.

    pnpm i
    
    cp .env.example .env
    
    pnpm db:push
  4. Configure and use EAS Update for Expo OTA updates

    main

    EAS Update allows you to send minor bug fixes and changes to users Over-The-Air (OTA) without a full app store submission. Note that changes involving native APIs still require a full rebuild and submission.

    1. Setup EAS Update

    Install the expo-updates library and configure the project:

    cd apps/expo
    pnpm expo install expo-updates
    eas update:configure

    2. Publish an Update

    To create a new update for production builds using your current git branch and commit message:

    cd apps/expo
    eas update --auto
    # Install expo-updates
    cd apps/expo
    pnpm expo install expo-updates
    
    # Configure EAS Update
    eas update:configure
    
    # Create an update
    eas update --auto
  5. Configure the Auth Proxy for Next.js preview deployments

    main
    The auth proxy is provided as a better-auth plugin. It is required for the Next.js app to authenticate users during preview deployments. It is not used for OAuth requests in production deployments. The simplest way to implement it is by deploying the Next.js app to Vercel.
  6. Configure Better-Auth for Expo

    main

    To enable authentication in the Expo app, choose one of the following methods:

    1. Deploy the Auth Proxy (Recommended): Use the Better Auth auth proxy plugin. By deploying the Next.js app, it acts as a proxy that handles OAuth flows and redirects back to the Next.js app. This provides a stable, publicly accessible URL that works even if your local port changes.
    2. Add local IP to OAuth provider: Manually add your local IP and port (e.g., 192.168.x.y:$PORT) to your OAuth provider's allowed callback URLs. This is less reliable as local IPs can change.
  7. Initialize a new project using create-t3-turbo

    main

    You can initialize a new project using the create-t3-turbo starter in two ways:

    1. Use as a template: Clone the repository and use it as your starting point.
    2. Use Turbo CLI: Use the create-turbo command to initialize your project using the repository as an example.

    Note: Ensure you meet the system requirements specified in the package.json#engines field before proceeding. Use pnpm as your package manager.

    npx create-turbo@latest -e https://github.com/t3-oss/create-t3-turbo
  8. Deploy the Expo application using EAS Build

    main

    Deploying Expo involves creating production builds and submitting them to app stores.

    1. Prerequisites

    Modify the getBaseUrl function in apps/expo/src/utils/api.tsx to point to your production backend URL.

    2. Setup EAS CLI

    Install the CLI, log in, and configure your project:

    pnpm add -g eas-cli
    eas login
    cd apps/expo
    eas build:configure

    3. Create a Production Build

    To create a production build for iOS:

    eas build --platform ios --profile production

    4. Submit to App Stores

    Use EAS Submit to send your build to the stores:

    eas submit --platform ios --latest

    Alternatively, you can combine build and submit using the --auto-submit flag: eas build ... --auto-submit

    # Install EAS CLI
    pnpm add -g eas-cli
    
    # Log in
    eas login
    
    # Configure Expo app
    cd apps/expo
    eas build:configure
    
    # Build for iOS production
    eas build --platform ios --profile production
    
    # Submit to stores
    eas submit --platform ios --latest
  9. Deploy the Next.js application to Vercel

    main

    To deploy the Next.js backend, use Vercel. Note that the Next.js application with tRPC must be deployed for the Expo app to communicate with the server in production.

    1. Create a new project on Vercel.
    2. Set the root directory to apps/nextjs.
    3. Add your POSTGRES_URL environment variable.
    4. Once deployed, use your production domain instead of localhost in the Expo app's getBaseUrl configuration.
  10. Add a new package to the monorepo

    main

    To create a new package with pre-configured tooling (package.json, tsconfig.json, index.ts, linting, and formatting), run the following command from the monorepo root:

    pnpm turbo gen init

    You will be prompted to provide a package name and choose whether to install dependencies.

  11. Configure ESLint in the validators package

    main

    The packages/validators directory uses a flat configuration format via eslint/config. It extends the @acme/eslint-config/base configuration and includes a global ignore rule for the dist/ directory to prevent linting build artifacts.

    import { defineConfig } from "eslint/config";
    import { baseConfig } from "@acme/eslint-config/base";
    
    export default defineConfig(
      {
        ignores: ["dist/**"],
      },
      baseConfig,
    );