t3 turbo and clerk下載t3 turbo and clerk源代碼下載

t3 turbo and clerk

Ai源碼

v1.1.0

下載

用店員身份驗證創建T3渦輪

文員儀表板設置

要使此模板工作，您需要將Discord作為OAuth提供商啟用。您可以在店員儀表板中找到User & Authentication / Social Providers的社交選項

如果在添加Discord之外更改此處的任何設置，則可能需要更新世博代碼以處理您更改的任何要求。

它使用turborepo並包含：

代碼佈局

 .github
  └─ workflows
        └─ CI with pnpm cache setup
.vscode
  └─ Recommended extensions and settings for VSCode users
apps
  ├─ expo
  └─ next.js
      ├─ Next.js 13
      ├─ React 18
      └─ E2E Typesafe API Server & Client
packages
 ├─ api
 |   └─ tRPC v10 router definition
 └─ db
     └─ typesafe db-calls using Prisma

快速開始

要使它運行，請按照以下步驟操作：

設置依賴性

 # Install dependencies
pnpm i


# Configure environment variables.
# There is an `.env.example` in the root directory you can use for reference
cp .env.example .env

# Push the Prisma schema to your database
pnpm db-push

配置博覽會應用

Expo不將.ENV用於發布鍵，因此您需要轉到apps/expo/app.config.ts並在此處添加。

 const CLERK_PUBLISHABLE_KEY = "your-clerk-publishable-key";

配置expo `dev` -script

注意：如果您想將實體手機與Expo GO一起使用，只需運行pnpm dev並掃描QR代碼即可。

使用iOS模擬器

確保您已安裝XCode和Xcommand Line工具，如Expo Docs上所示。
更改apps/expo/package.json上的dev腳本以打開iOS模擬器。

 +  "dev": "expo start --ios",

在項目根文件夾上運行pnpm dev 。

對於Android

安裝Android Studio工具，如博覽會文檔所示。
更改apps/expo/package.json上的dev腳本以打開Android模擬器。

 +  "dev": "expo start --android",

在項目根文件夾上運行pnpm dev 。

部署

next.js

請注意，如果您要構建Locallly，則需要正確插入ENV，例如使用pnpm with-env next build

先決條件

我們不建議在無服務器環境上部署SQLITE數據庫，因為數據不會持續。我在鐵路上提供了一個快速的PostgreSQL數據庫，但是您當然可以使用任何其他數據庫提供商。確保更新Prisma模式以使用正確的數據庫。

部署到Vercel

讓我們將下一個應用程序部署到Vercel。如果您曾經在那裡部署過TurborePo應用程序，則步驟非常簡單。您還可以閱讀有關部署到Vercel的官方TurborePo指南。

在Vercel上創建一個新項目，選擇apps/nextjs文件夾作為根目錄，然後應用以下構建設置：

Vercel部署設置

安裝命令過濾了Expo軟件包，並保存了依賴性安裝的幾秒鐘（和緩存大小）。構建命令使我們使用Turbo構建應用程序。

添加您的DATABASE_URL ， NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY和CLERK_SECRET_KEY Environment變量。
完畢！您的應用程序應成功部署。分配您的域，並將其代替在Expo應用中的url而不是localhost ，以便您的Expo應用程序在不開發時可以與您的後端通信。

博覽會

與Web上的Next.js相比，部署您的Expo應用程序的工作方式略有不同。您需要將應用程序的生產構建提交給Apple App Store和Google Play等應用程序商店，而不是“部署”您的應用程序。您可以在博覽會文檔中閱讀完整的應用程序，包括最佳實踐。

讓我們從設置EAS構建開始，這是EXPO應用程序服務的縮寫。構建服務可幫助您創建應用程序的構建，而無需進行完整的本地開發設置。下面的命令是創建第一個構建的摘要。
```
// Install the EAS CLI
$ pnpm add -g eas-cli

// Log in with your Expo account
$ eas login

// Configure your Expo app
$ cd apps/expo
$ eas build:configure
```
初始設置後，您可以創建第一個構建。您可以為Android和iOS平台進行構建，並使用不同的EAS.JSON構建配置文件來創建生產構建或開發或測試構建。讓我們為iOS製造生產。
```
 $ eas build --platform ios --profile production
```
如果您不指定--profile標誌，EAS默認情況下使用production配置文件”。
現在您已經製作了第一個生產，可以將其提交給商店。 EAS提交可以幫助您將構建發送到商店。
```
 $ eas submit --platform ios --latest
```
您還可以使用eas build ... --auto-submit構建並提交單個命令。
在將應用程序掌握在用戶手中之前，您必須向應用商店提供其他信息。這包括屏幕截圖，應用程序信息，隱私政策等。在預覽中，EAS Metadata可以幫助您獲取大多數此信息。
如果您正在與文員一起使用Oauth社交提供商，例如Google，Apple，Facebook等...，您必須在店員儀表板中使用自己的Oauth重定向URL，以供店員儀表板中的Expo應用程序。
在apps/expo/app.config.ts中，添加一個scheme ，該方案將用於識別您的獨立應用程序。
```
 import { ExpoConfig , ConfigContext } from "@expo/config" ;

const CLERK_PUBLISHABLE_KEY = "your-clerk-publishable-key" ;

const defineConfig = ( _ctx : ConfigContext ) : ExpoConfig => ( {
   name : "expo" ,
   slug : "expo" ,
   scheme : "your-app-scheme" ,
   // ...
} ) ;
```
然後，在店員儀表板中，轉到用戶和身份驗證>“社交連接”>“設置” ，然後將應用程序的方案添加並將URL重定向到重定向URLS字段：
```
your-app-scheme://oauth-native-callback
```
在這裡， your-app-scheme對應於app.config.ts中定義的scheme ，而oauth-native-callback對應於與社交提供者進行認證時定義的重定向URL。請參閱signinwithoauth.tsx以獲取參考。
您可以在世博文檔中找到有關此信息的更多信息。
現在，您應該能夠在Testflight應用程序構建中與您的社會提供商登錄。
一旦獲得了所有批准，您的用戶最終就可以享受您的應用程序。假設您發現了一個小錯字。您必須創建一個新的構建，將其提交給商店，並等待批准，然後才能解決此問題。在這些情況下，您可以使用EAS更新快速向您的用戶發送小型錯誤，而無需經歷這個漫長的過程。讓我們首先設置EAS更新。
下面的步驟總結了EAS更新指南的入門。
```
// Add the ` expo-updates ` library to your Expo app
$ cd apps/expo
$ pnpm expo install expo-updates

// Configure EAS Update
$ eas update:configure
```
在我們將更新發送到您的應用程序之前，您必須創建新構建並將其提交給應用商店。對於包括本機API的每個更改，您必須重建應用程序並將更新提交給應用商店。請參閱步驟2和3。
現在，一切都準備好進行更新，讓我們為production構建創建一個新的更新。使用--auto標誌，EAS更新使用您當前的git分支名稱並為此更新提交消息。了解更多信息以獲取更多信息。
```
$ cd apps/expo
$ eas update --auto
```
您的OTA（空中）更新必須始終遵循應用商店的規則。未經App Store批准，您無法更改應用程序的主要功能。但這是更新應用程序的快速方法，以進行較小的更改和錯誤修復。
完畢！現在您已經創建了生產構建，將其提交給商店並安裝了EAS更新，您已經準備好了！