Git Product home page Git Product logo

create-t3-turbo's Introduction

create-t3-turbo

About

Ever wondered how to migrate your T3 application into a monorepo? Stop right here! This is the perfect starter repo to get you running with the perfect stack!

It uses Turborepo and contains:

apps
 |- expo
     |- Expo SDK 46
     |- React Native using React 18
     |- Tailwind using Nativewind
     |- Typesafe API calls using tRPC
 |- next.js
     |- React 18
     |- TailwindCSS
     |- E2E Typesafe API Server & Client
packages
 |- api
     |- tRPC v10 router definition
 |- db
     |- typesafe db-calls using Prisma

Quick Start

To get it running, follow the steps below:

Setup dependencies

# Install dependencies
npm install

# In packages/db/prisma update schema.prisma provider to use sqlite
- provider = "postgresql"
+ provider = "sqlite"

# Create a `.env` for prisma and make sure it's synced
echo DATABASE_URL=file:./db.sqlite >> packages/db/.env
npm run db-push

Configure Expo dev-script

Note: If you want to use a physical phone with Expo Go, just run npm run dev and scan the QR-code.

Use iOS Simulator

  1. Make sure you have XCode and XCommand Line Tools installed as shown on expo docs.
  2. Change the dev script at apps/expo/package.json to open the iOS simulator.
+  "dev": "expo start --ios",
  1. Run npm run dev at the project root folder.

For Android

  1. Install Android Studio tools as shown on expo docs.
  2. Change the dev script at apps/expo/package.json to open the Android emulator.
+  "dev": "expo start --android",
  1. Run npm run dev at the project root folder.

Deployment

Next.js

Prerequisites

We do not recommend deploying a SQLite database on serverless environments since the data wouldn't be persisted. I provisioned a quick Postgresql database on Railway, but you can of course use any other database provider. Make sure the prisma schema is updated to use the correct database.

Deploy to Vercel

Let's deploy the Next.js application to Vercel. If you have ever deployed a Turborepo app there, the steps are quite straightforward. You can also read the official Turborepo guide on deploying to Vercel.

  1. Create a new project on Vercel, select the apps/nextjs folder as the root directory and apply the following build settings: CleanShot 2022-09-03 at 22 51 25@2x

  2. Add your DATABASE_URL environment variable.

  3. Done! Your app should successfully deploy. Assign your domain and use that instead of localhost for the url in the Expo app so that your Expo app can communicate with your backend when you are not in development.

Expo

TODO: Feel free to PR a guide for this. Refer to the Expo docs:

References

The stack originates from create-t3-app.

A blog post where I wrote how to migrate a T3 app into this.

create-t3-turbo's People

Contributors

azezsan avatar juliusmarminge avatar justindc100 avatar marlalain avatar redbar0n avatar

Stargazers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.