sora32127 commented 7 months ago

やりたいこと

オープンソースとしての開発をやりやすくしたい

内容

Supabaseのシード用データを用意する
コマンドの整備

eggplants commented 7 months ago

自分用のメモとしてPR出す前に書いてたやつです。しかし、以下の手順だとユーザー登録のメールを受け取った時にInbucketに届いたリンクが404になる問題があり登録が試せず、どこか間違っていそうです。叩き台になれば…

development.md:


# 開発ドキュメント

## 環境構築

### 必須

- node 18
- Docker

## 手順

```sh
npm install
npx supabase init

# supabase/config.toml を編集
# auth.email.enable_confirmations を true に

# .env.example をコピーしコメントに従って値を埋める
cp .env.example .env

# ローカルで supabase 起動
npx supabase start

# supabase の PosgreSQL に prisma のマイグレーション適用
npx prisma db push

# supabase/config.toml 更新後は要再起動
npx supabase stop
npx supabase start
```

## ローカルで立つWebサーバー

### フロントエンド

URL: http://localhost:5174/

Webアプリのフロントエンド。

### Supabase Studio

URL: http://127.0.0.1:54323

DB管理やユーザー管理などができるコンソール。

### Inbucket

URL: http://127.0.0.1:54324/

登録時など、開発環境で外向きのメールが届く。

.env.example:

# Administrator ID
ADMIN_USER_ID=""
# Cloudflare Turnstile Key
CF_TURNSTILE_SITEKEY=""
# Tag Manager ID
# https://developers.google.com/analytics
GA_TRACKING_ID=""
# https://platform.openai.com/account/api-keys
OPENAI_API_KEY=""
# npx supabase status -o json | jq .JWT_SECRET
SESSION_SECRET=""
# npx supabase status -o json | jq .ANON_KEY
SUPABASE_ANON_KEY_CLIENT=""
# npx supabase status -o json | jq .DB_URL
SUPABASE_CONNECTION_STRING=""
# npx supabase status -o json | jq .SERVICE_ROLE_KEY
SUPABASE_SERVICE_ROLE_KEY=""
# npx supabase status -o json | jq .API_URL
SUPABASE_URL=""
# npx supabase status -o json | jq .GRAPHQL_URL
SUPABASE_URL_CLIENT=""

また、Vite開発環境起動時に

環境変数が .env から読み込まれない
Prisma で vector 型がエラーになる
root.tsx の loader で gaTrackingId が undefined の時エラーになる

の解消のために以下の変更が必要でした。

`git diff`

``` diff --git a/app/root.tsx b/app/root.tsx index c10f809..192e9a4 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -33,7 +33,7 @@ export const links: LinksFunction = () => [ export async function loader() { const gaTrackingId = process.env.NODE_ENV !== "development" ? process.env.GA_TRACKING_ID : ""; return json({ - gaTrackingId, + gaTrackingId: gaTrackingId ?? "", }); } @@ -121,4 +121,4 @@ export function ErrorBoundary() {

); } -} \ No newline at end of file +} diff --git a/prisma/schema.prisma b/prisma/schema.prisma index 8c158fa..ba7cce2 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -1,10 +1,13 @@ generator client { provider = "prisma-client-js" + previewFeatures = ["postgresqlExtensions"] } datasource db { provider = "postgresql" url = env("SUPABASE_CONNECTION_STRING") + + extensions = [vector] } model DimTags { @@ -132,4 +135,4 @@ model FctPostEditHistory { @@id([postId, postRevisionNumber]) @@map("fct_post_edit_history") -} \ No newline at end of file +} diff --git a/vite.config.ts b/vite.config.ts index 2b6aff9..a08c568 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,10 +1,15 @@ import { vitePlugin as remix } from "@remix-run/dev"; import { installGlobals } from "@remix-run/node"; -import { defineConfig } from "vite"; +import { type ConfigEnv, defineConfig, loadEnv } from "vite"; import tsconfigPaths from "vite-tsconfig-paths"; installGlobals(); -export default defineConfig({ - plugins: [remix(), tsconfigPaths()], -}); +export default ({ mode }: ConfigEnv) => { + process.env = {...process.env, ...loadEnv(mode, process.cwd())}; + + return defineConfig({ + plugins: [remix(), tsconfigPaths()], + }); +} ```

sora32127 commented 7 months ago

@eggplants たたき台の提供、ありがとうございます。僕もSupabaseの認証周りの再現が鬼門になりそうかなと思っていて、どうしても難しい場合、認証プロセスを省いてすでに認証されたユーザーをシード段階で作ってしまうのもありかなと思っていました。また、変更箇所の指定もありがとうございます。のちほど変更します。開発への協力、非常に助かります 🙏

sora32127 commented 7 months ago

@eggplants ローカル開発環境の整備を行いました。類似記事をフェッチしようとするとエラーになりますが、そこは追って対応します。ひとまずこのIssueはクローズとします。

sora32127 / healthy-person-emulator-dotorg

【環境整備】ローカル環境でテスト実行するための手順とデータを整備したい #8

やりたいこと

内容