Next.js ãŒã‚„ã£ã¦ãã‚Œã¦ã„ãŸã“ã¨å…¨éƒ¨ã€è‡ªåˆ†ã§ã‚„ã£ã¦ã¿ãŸ
ã¯ã˜ã‚ã« Next.js ã§ã‚¢ãƒ—リを作るã¨ã€ãƒ«ãƒ¼ãƒ†ã‚£ãƒ³ã‚°ã€APIã€èªè¨¼ã€ãƒ“ルド最é©åŒ–ã¾ã§å…¨éƒ¨ãƒ•ãƒ¬ãƒ¼ãƒ ワークãŒã‚„ã£ã¦ãれる。開発ã¯å¿«é©ã ãŒã€ã€Œãªãœãã®æ§‹æˆãªã®ã‹ã€ã‚’èžã‹ã‚Œã‚‹ã¨ç”ãˆã«è©°ã¾ã‚‹å ´é¢ãŒã‚ã£ãŸã€‚ ãã“ã§ã€ä¼šè¨ˆã‚·ã‚¹ãƒ†ãƒ ã‚’é¡Œæã« Next.js を使ã‚ãšã« React + Hono + Supabase ã§åŒã˜ã“ã¨ã‚’実ç¾ã™ã‚‹æ§‹æˆã§é–‹ç™ºã—ã¦ã¿ãŸã€‚ ã“ã®è¨˜äº‹ã§ã¯ã€Next.js ãŒè£ã§ã‚„ã£ã¦ãã‚Œã¦ã„ã‚‹ã“ã¨ã‚’1ã¤ãšã¤å–り出ã—ã¦ã€ã€Œè‡ªåˆ†ã§ã‚„ã‚‹ã¨ã©ã†ãªã‚‹ã‹ã€ã‚’比較ã™ã‚‹ã€‚Next.js ã‚’å¦å®šã™ã‚‹è¨˜äº‹ã§ã¯ãªã„。便利ã•ã®è£ã«ã‚る仕組ã¿ã‚’ç†è§£ã™ã‚‹ãŸã‚ã®è¨˜éŒ²ã€‚ 1. ルーティング Next.js ã®å ´åˆ app/ ├── page.tsx → / ├── login/ │ └── page.tsx → /login └── dashboard/ └── page.tsx → /dashboard
Prisma ã‹ã‚‰ Atlas + Kysely ã¸ã®ç§»è¡Œ - Supabase 環境ã§ã®å®Ÿè·µè¨˜éŒ²
ã“ã‚Œã¯ãªã«ï¼Ÿ 本番環境ã§ç´„2å¹´é–“ Prisma を使ã£ã¦ã„ãŸãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã‚’ã€Atlas + Kysely ã«ç§»è¡Œã—ãŸè¨˜éŒ²ã§ã™ã€‚Supabase ã® PostgreSQL を使ã£ã¦ã„る環境ã ã£ãŸã®ã§ã€ã„ãã¤ã‹æ³¨æ„点ãŒã‚ã‚Šã¾ã—ãŸã€‚ã“ã®è¨˜äº‹ã§ã¯ã€ç§»è¡Œã®å‹•æ©Ÿã‹ã‚‰å…·ä½“çš„ãªæ‰‹é †ã€ãã—ã¦ç§»è¡Œãƒªã‚¹ã‚¯ã‚’抑ãˆã‚‹ãŸã‚ã«è¿½åŠ ã—㟠E2E テストã¾ã§ã€ä¸€é€£ã®æµã‚Œã‚’共有ã—ã¾ã™ã€‚ プãƒã‚¸ã‚§ã‚¯ãƒˆã®èƒŒæ™¯ ã“ã®ãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã¯ 2021å¹´8月㫠Next.js ã§é–‹ç™ºã‚’開始ã—ã€ç´„4å¹´åŠé‹ç”¨ã—ã¦ã„ã¾ã™ã€‚ 技術スタックã¯ä½•åº¦ã‹å¤‰ã‚ã£ã¦ã„ã¦ã€æœ€åˆã¯ Next.js 㨠Supabase SDK を使ã£ã¦ã„ã¾ã—ãŸã€‚èªè¨¼ã‚‚ Supabase Auth を使ã£ã¦ã„ãŸã®ã§ã™ãŒã€2023å¹´7月㫠Remix ã¸ç§»è¡Œã—ãŸã‚¿ã‚¤ãƒŸãƒ³ã‚°ã§ Supabase SDK を外ã—ã€Prisma ã¨è‡ªå‰ã®èªè¨¼ã«åˆ‡ã‚Šæ›¿ãˆã¾ã—ãŸã€‚2024å¹´11月ã«ã¯ React
AIé¢æŽ¥å®˜ã€å®Ÿè£…ã—ã¦ã¿ãŸããªã„？
AIé¢æŽ¥å®˜ã€å®Ÿè£…ã—ã¦ã¿ãŸããªã„？ã“ã®å‹•ç”»ã§ã¯ã€AIを使ã£ãŸæŽ¡ç”¨æ‹…当エージェントを自分ã§é–‹ç™ºãƒ»ãƒ‡ãƒ—ãƒã‚¤ã™ã‚‹æ–¹æ³•ãŒä¸å¯§ã«è§£èª¬ã•ã‚Œã¦ã‚‹ã€‚ Next.jsã€Reactã€Supabaseã€Vapiを使ã£ã¦ã€ - AIを用ã„ã¦éŸ³å£°ã§ã‚„ã‚Šã¨ã‚Šã§ãã‚‹ - è·ç¨®ã«åˆã‚ã›ã¦è³ªå•ã‚’è‡ªå‹•ç”Ÿæˆ - é¢æŽ¥å¾Œã®ã‚¹ã‚³ã‚¢ä»˜ãフィードãƒãƒƒã‚¯ã‚’自動出力 ã¨ã„ã£ãŸæ©Ÿèƒ½ãŒã€ã¡ã‚ƒã‚“ã¨ãƒ•ãƒ«ã‚¹ã‚¿ãƒƒã‚¯ã§ä½œã‚Œã‚‹ã€‚ UIã¯shadcnã€èªè¨¼ã¯Supabaseã€æ§‹æˆã‚‚æ´—ç·´ã•ã‚Œã¦ã¦ãã®ã¾ã¾å‚考ã«ã§ãるレベル。å˜ã«è©¦ã›ã‚‹ã ã‘ã˜ã‚ƒãªãã€å†ç¾æ€§ãŒé«˜ãã¦å¦ã³ã‚‚多ã„ã®ãŒã‚ã‚ŠãŒãŸã„。 AIを活用ã—ãŸSaaSã«èˆˆå‘³ã‚る人ã€æŽ¡ç”¨ãƒ—ãƒã‚»ã‚¹ã‚’技術ã§æ”¹å–„ã—ãŸã„人ã«ã¯ã‹ãªã‚Šåˆºã•ã‚‹ã¯ãšã€‚ 5時間越ãˆã®ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«ã ã‹ã‚‰ã€é€±æœ«ã«ã˜ã£ãり触ã£ã¦ã¿ã‚‹ã®ã‚‚ãŠã™ã™ã‚。
データベース丸見ãˆã®ã‚¤ãƒ³ã‚·ãƒ‡ãƒ³ãƒˆç™ºè¦‹è€…ã«ãªã£ã¦ã—ã¾ã£ãŸè©±ã€‚Supabaseをフãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã ã‘ã§å®Ÿè£…ã™ã‚‹éš›ã¯SELECTã®æ‰±ã„ã«æ³¨æ„ï¼
2025å¹´4月13日追記： Xã§å…±æœ‰ã•ã‚Œã¦ã”覧ã«ãªã£ã¦ã„ã‚‹æ–¹ãŒå¢—ãˆã¦ã„るよã†ãªã®ã§è¿½åŠ ã§è£œè¶³ã—ã¦ãŠãã¾ã™ã€‚ã“ã®å•é¡Œã¯RLSã®è¨å®šãƒŸã‚¹ã«ã‚ˆã£ã¦ç™ºç”Ÿã—ã¦ã„ãŸã‚‚ã®ã§ã‚ã‚Šã€Supabase自体ã«ã¯å•é¡Œã‚ã‚Šã¾ã›ã‚“ 。ç¾æ™‚点ã§ã®åƒ•ã®è€ƒãˆã§ã¯ フãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã ã‘ã§å®Ÿè£…ã™ã‚‹ã®ã¯ã€Œæ„外ã¨ä½¿ãˆã‚‹ã‚·ãƒ¼ãƒ³ãŒé™ã‚‰ã‚Œã‚‹ã€ ã§ã™ã€‚ユーザー自身ã®ç®¡ç†ç”»é¢ãªã©ã§ä½¿ã†ç¨‹åº¦ã«ç•™ã‚ã¦ãŠãã¨è‰¯ã„ã§ã—ょã†ã€‚特ã«ä¸ç‰¹å®šå¤šæ•°ã®ãƒ¦ãƒ¼ã‚¶ãƒ¼ãŒé–²è¦§ã™ã‚‹ã‚ˆã†ãªãƒ¦ãƒ¼ã‚¶ãƒ¼äº¤æµåž‹ã‚µãƒ¼ãƒ“スã«ã¯å…¨ãå‘ãã¾ã›ã‚“。ã“ã‚Œã¯å®Ÿéš›ã«Supabaseを使ã£ã¦é–‹ç™ºã—ã¦ã¿ã‚‹ã¨ç†è§£ã§ãã‚‹ã¨æ€ã„ã¾ã™ã€‚å…¨ã¦ã®ãƒ¦ãƒ¼ã‚¶ãƒ¼ãŒé–²è¦§ã§ãるよã†ã«ã™ã‚‹ã«ã¯RLSã§ç„¡æ¡ä»¶ãªtrueè¨å®šã«ã™ã‚‹å¿…è¦ãŒã‚ã‚Šã€publicスã‚ーマã«ã‚³ãƒ”ーã—ãŸãƒ¦ãƒ¼ã‚¶ãƒ¼æƒ…å ±ã‚‚å¿…ç„¶çš„ã«ç„¡æ¡ä»¶ãªtrueã«ã™ã‚‹å¿…è¦ãŒã‚ã‚‹ãŸã‚ã€é©åˆ‡ãªDBæ§‹é€ ã‚’ã—ã¦ãªã‘ã‚Œã°ãƒ¡ãƒ¼ãƒ«ã‚¢ãƒ‰ãƒ¬ã‚¹ã‚‚æ¼ã‚Œã¦ã—ã¾ã†ã®ã§ã™ã€‚ç„¡æ¡ä»¶ãªtrueè¨å®šã«ã™ã‚‹ = HTT
ベクトル検索エンジン Supabase with pgVector
ã“ã®è¨˜äº‹ã¯Supabaseã®ãƒ™ã‚¯ãƒˆãƒ«æ¤œç´¢æ©Ÿèƒ½ã®ç´¹ä»‹ã§ã™ã€‚ Supabase ベクトル検索エンジン Supabaseã¯åŸºæœ¬çš„ã«ã¯ã‚µãƒ¼ãƒãƒ¬ã‚¹ã®Postgresデータベースã§ã™ãŒã€pgvectorã¨ã„ã†æ‹¡å¼µã‚’使用ã™ã‚‹ã“ã¨ã§ãƒ™ã‚¯ãƒˆãƒ«æ¤œç´¢ã‚¨ãƒ³ã‚¸ãƒ³ã¨ã—ã¦ã‚‚使用ã™ã‚‹ã“ã¨ãŒã§ãã¾ã™ã€‚ ベクトル検索エンジンã¨ã¯ã€æ–‡ç« ・画åƒãƒ»éŸ³å£°ãªã©ã‚’ベクトル化ã—ã€ãƒ™ã‚¯ãƒˆãƒ«é–“ã®ã‚³ã‚µã‚¤ãƒ³é¡žä¼¼åº¦ã‚’使用ã—ã¦é¡žä¼¼æ€§ã®é«˜ã„コンテンツをå–å¾—ã™ã‚‹DBã§ã™ã€‚ ãã—ã¦ã€ãƒ™ã‚¯ãƒˆãƒ«æ¤œç´¢ã‚¨ãƒ³ã‚¸ãƒ³ã¨RDBを悪é”åˆä½“ã•ã›ã‚‹ã“ã¨ã§ã€SQLã®WHEREå¥ã‚„テーブル・ジョインãªã©RDBã®æ©Ÿèƒ½ã‚‚使ãˆã‚‹ã€ã„ã„ã¨ã“ã©ã‚ŠãªDBã«ãªã‚Šã¾ã™ã€‚
Cursor ã® Rules for AI 全体ã®ãƒ«ãƒ¼ãƒ«è¨å®š 翻訳 - Qiita
TypeScriptã€Node.jsã€Next.js App Routerã€Reactã€Shadcn UIã€Radix UIã€Tailwindã®ã‚¨ã‚スパート。 コードã®ã‚¹ã‚¿ã‚¤ãƒ«ã¨æ§‹é€ - æ£ç¢ºãªä¾‹ã‚’用ã„ã¦ã€ç°¡æ½”ã§æŠ€è¡“的㪠TypeScript コードを書ãã¾ã™ã€‚ - 関数型ã¨å®£è¨€åž‹ã®ãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°ãƒ‘ターンを使用ã—ã€ã‚¯ãƒ©ã‚¹ã¯é¿ã‘る。 - コードã®é‡è¤‡ã‚ˆã‚Šã‚‚å復ã¨ãƒ¢ã‚¸ãƒ¥ãƒ¼ãƒ«åŒ–を優先ã™ã‚‹ã€‚ - 補助動詞(isLoading, hasErrorãªã©)を用ã„ãŸèª¬æ˜Žçš„ãªå¤‰æ•°åを使用ã™ã‚‹ã€‚ - æ§‹é€ ãƒ•ã‚¡ã‚¤ãƒ«ï¼šã‚¨ã‚¯ã‚¹ãƒãƒ¼ãƒˆã•ã‚ŒãŸã‚³ãƒ³ãƒãƒ¼ãƒãƒ³ãƒˆã€ã‚µãƒ–コンãƒãƒ¼ãƒãƒ³ãƒˆã€ãƒ˜ãƒ«ãƒ‘ーã€é™çš„コンテンツã€åž‹ã€‚ 命åè¦å‰‡ - ディレクトリã«ã¯ãƒ€ãƒƒã‚·ãƒ¥ä»˜ãã®å°æ–‡å—を使用ã™ã‚‹ï¼ˆä¾‹ï¼šcomponents/auth-wizard）。 - コンãƒãƒ¼ãƒãƒ³ãƒˆã«ã¯åå‰ä»˜ãエクスãƒãƒ¼ãƒˆã‚’使用ã™ã‚‹ã€‚ TypeScriptã®ä½¿ç”¨æ³• - ã™ã¹ã¦ã®
ãŠå‰ã‚‚AI鬼ã«ãªã‚‰ãªã„ã‹ï¼ŸðŸ‘¹Bolt & Cursor & Supabase & Vercelã§äººé–“ã‚’ã‚„ã‚ã‚‹ãžã€ã‚¸ãƒ§ã‚¸ãƒ§ãƒ¼ï¼ðŸ‘º
生æˆAIを活用ã—ãŸãƒ—ãƒãƒ€ã‚¯ãƒˆé–‹ç™ºã®å®Ÿä½“験ã«é–¢ã™ã‚‹ã“ã¨ã‚’以下ã®å‹‰å¼·ä¼šã§ç™ºè¡¨ã—ã¾ã—ãŸï¼ ã€2/16開催ï¼å‹‰å¼·ä¼šã€‘ã¼ã・ã‚ãŸã—ã®ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã¨ã—ã¦ã®ç”ŸæˆAI活用勉強会ï¼ãƒãƒ³ã‚ºã‚ªãƒ³ã‚ã‚Šï¼ https://aigeeks01.peatix.com/view
1
メンテナンス
ランã‚ング
ãŠçŸ¥ã‚‰ã›
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
From Supabase to PlanetScale: Zero Downtime, 400GB, 150 Million Rows - Vitalize
Supabase Jobs
Introducing the Supabase UI Library
Option to disable anon key access to database · supabase · Discussion #4547
{{#tags}}- {{label}}
{{/tags}}