sapper + svelte で、チャットを作る【作例】

概要:

前のsapper + svelteの関係で、チャットの例となります。

• ヘッドレスCMS/ mongoDB をバックエンドで。クロスドメイン通信の構成
• バックエンドほぼ開発ゼロ
• フロント側を開発
• 新着投稿は。タイマーで pull式取得して更新

---

環境

• svelte: 3.17.3
• sapper: 0.28.0
• node : 14.17
• mongoDB

---

参考のコード

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

• ヘッドレスCMS(前に自作した mongoDB版)

https://github.com/kuc-arc-f/headless-1

---

画面

---

準備、データ項目の設定

• ヘッドレスCMSに、APIスキーマの定義、 users, chats, chat_posts
  画面から入力

users

• name
• email
• password

chats:

• name : text
• content : text
• user_id : text

chat_posts:

• chat_id : text
• user_id : text
• title : text
• body : text

---

コード

• chat画面
  /src/routes/chats/[id].svelte

• chat一覧
  /src/routes/chats/index.svelte

....