Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/arafipro/user-prisma-api-yt
【Cloudflare Workers】Hono+Cloudflare D1+Prisma 20分でREST APIを作成
https://github.com/arafipro/user-prisma-api-yt
cloudflare cloudflare-d1 cloudflare-workers hono prisma typescript youtube
Last synced: 14 days ago
JSON representation
【Cloudflare Workers】Hono+Cloudflare D1+Prisma 20分でREST APIを作成
- Host: GitHub
- URL: https://github.com/arafipro/user-prisma-api-yt
- Owner: arafipro
- Created: 2024-05-19T08:20:42.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-05-21T00:39:30.000Z (9 months ago)
- Last Synced: 2024-11-24T22:14:03.243Z (2 months ago)
- Topics: cloudflare, cloudflare-d1, cloudflare-workers, hono, prisma, typescript, youtube
- Language: TypeScript
- Homepage: https://youtu.be/f641dliqzwQ
- Size: 43 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 【Cloudflare Workers】Hono+Cloudflare D1+Prisma 20分でREST APIを作成
## YouTube
[!["【Cloudflare Workers】Hono+Cloudflare D1+Prisma 20分でREST APIを作成"](https://i.ytimg.com/vi/f641dliqzwQ/maxresdefault.jpg)](https://youtu.be/f641dliqzwQ)
## 技術選定
- TypeScript
- Hono
- Prisma
- Cloudflare D1
- Cloudflare Workers## 初期設定
### NodeModule をインストール
```bash
npm install
```### データベースを作成
```bash
npx wrangler d1 create user-prisma-api
```### wrangler.toml に追記
```toml
[[d1_databases]]
binding = "DB"
database_name = "user-prisma-api"
database_id = ""
`````はデータベースを作成したときに出力されるID
### ローカルデータベースにテーブルを作成
```bash
npx wrangler d1 migrations apply user-prisma-api --local
```### リモートデータベースにテーブルを作成
```bash
npx wrangler d1 migrations apply user-prisma-api --remote
```### ローカルデータベースのテーブルにダミーデータを登録
```bash
npx wrangler d1 execute user-prisma-api --local --file=./prisma/dummy-data.sql
```### リモートデータベースのテーブルにダミーデータを登録
```bash
npx wrangler d1 execute user-prisma-api --remote --file=./prisma/dummy-data.sql
```## デプロイ
```bash
npm run deploy
```## APIに接続を許可するURLを指定(CORS)
`src/index.ts`のcorsのoriginに接続を許可するURLを指定する
配列で複数指定することも可能
コメントアウトして使用する
接続を許可するURLを指定する場合は最後のスラッシュ(/)は不要
例)`http://localhost:8000(/は不要)`### /users
idを指定しないURLの場合
GETとPOSTでしか使わない```ts:src/index.ts
app.use(
"/users",
cors({
origin: ["{許可するURL1}", "{許可するURL2}"],
allowHeaders: [
"X-Custom-Header",
"Upgrade-Insecure-Requests",
"Content-Type",
],
allowMethods: ["GET", "POST", "OPTIONS"],
...
})
);
```### /users/*
idを指定したURLの場合
GETとPUTとDELETEでしか使わない```ts:src/index.ts
app.use(
"/users/*",
cors({
origin: ["{許可するURL1}", "{許可するURL2}"],
allowHeaders: [
"X-Custom-Header",
"Upgrade-Insecure-Requests",
"Content-Type",
],
allowMethods: ["GET", "PUT", "DELETE", "OPTIONS"],
...
})
);
```## テーブル
### テーブル名 User
| No. | カラム名 | データ型 | 主キー |
| --- | -------- | -------- | :----: |
| 1 | id | integer | ○ |
| 2 | name | text | |
| 3 | email | text | |