Chapter 12

Astro2 + tRPC, Mermaid ER図の管理【作例】

knaka Tech-Blog
knaka Tech-Blog
2023.03.19に更新

概要:

Mermaid ER図を登録参照できる。試作的アプリの作成メモとなります

  • 前の Mermaid記法の記事を参考にしました。
  • 設計ツール的な作例となります。
  • 紹介的な内容です
  • Vercelに、設置しました。

構成

  • Astro: 2
  • trpc/server : 10.13.2
  • postgers (supabase)

関連の記事

https://zenn.dev/knaka0209/articles/8890bd2778f806


参考のコード

https://github.com/kuc-arc-f/er_simple1


ER図、参考

  • 詳細画面


  • 編集画面


  • path

/chart : 一覧
/chart/show/ID : 詳細
/chart/edit/ID : 編集


  • tree : client
$ tree .
.
├── components
├── env.d.ts
├── layouts
│   └── Layout.astro
├── lib
│   ├── Layout.ts
│   ├── LibAuth.ts
│   ├── LibConfig.ts
│   ├── LibCookie.ts
│   ├── LibCrud.ts
│   ├── LibDbSession.ts
│   ├── LibLogin.ts
│   ├── LibSqlite.ts
│   ├── LibStorage.ts
│   └── LibTest.ts
├── pages
│   ├── chart
│   │   ├── Chart.ts
│   │   ├── ChartCreate.ts
│   │   ├── ChartEdit.ts
│   │   ├── ChartShow.ts
│   │   ├── Test.ts
│   │   ├── create.astro
│   │   ├── edit
│   │   │   └── [id].astro
│   │   ├── index.astro
│   │   └── show
│   │       └── [id].astro
│   ├── index.astro
│   ├── login
│   │   ├── Login.ts
│   │   └── index.astro
└── utils
    └── trpc.ts

関連のページ

https://zenn.dev/knaka0209/books/7922ed2c2326b0

....