Upgrade to Pro — share decks privately, control downloads, hide ads and more …

microCMSを使った ビジネスサイドとの コミュニケーション

7fccfb690a818ed2f3a15fc21d426d5a?s=47 meijin
September 30, 2021
Programming
2
600

microCMSを使った ビジネスサイドとの コミュニケーション

7fccfb690a818ed2f3a15fc21d426d5a?s=128

meijin

September 30, 2021
Tweet

More Decks by meijin

See All by meijin
React NativeアプリにStorybook CSF3.0を導入しよう
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
280
初めてエンジニアインターンの育成に取り組んで考えたこと
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
820
ESLintの独自ルール作成にチャレンジした話
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
2
250
シード期スタートアップで 2年半カイゼンしてきたこと
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
1
130
一部上場企業からベンチャー転職のBefore/After
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
320
次世代フロントエンドツールVite入門会
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
470
国産OSS_aspida_の_公認エバンジェリストに_任命してもらった話.pdf
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
1
200
React Native×Firebaseで オンライン指導用の チャットアプリを開発している話
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
1.7k
管理画面付きAPIが簡単に作れるmicroCMSとの向き合い方まとめ
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
1
960

Other Decks in Programming

See All in Programming
NestJS_meetup_atamaplus
F0a8d07597a19192791bf663504d2a17?s=48 atamaplus
0
230
SwiftUIで「意図」を伝える / swiftui_intention
42a6a049ac8f5265f31858a9509217fb?s=48 uhooi
2
150
VIMRC 2022
E76db8a47bdae9ef76629ecb366483ed?s=48 achimnol
0
140
夕食断食にTRY!/for-lt-12th
82492720940b57cec5072e190213ba3a?s=48 pachikuriii
0
250
WindowsコンテナDojo：第6回 Red Hat OpenShift入門
E5eb221d34d4ffbe973f8542b4c3a00e?s=48 oniak3ibm
PRO
0
180
MLOps勉強会_リアルタイムトラフィックのサーバレスMLOps基盤_20220810
7771ba477a3bee861bc62012a143bffe?s=48 strsaito
1
450
Untangling Coroutine Testing (Droidcon Berlin 2022)
4047c64e3a1e2f81addd4ba675ddc451?s=48 zsmb
2
490
リーダブルテストコード / #vstat
48a913a2e3bb5e68aae6f73079648e84?s=48 jnchito
48
36k
一口目から美味しいReactのスルメ本🦑
2801ae8fb5381bcd119805124a5eeaf2?s=48 taro28
2
690
フロントエンドエンジニアが変える現場のモデリング意識/modeling-awareness-changed-by-front-end-engineers
F122773bb8d506a4f38a94bfeff45945?s=48 uggds
32
13k
Records の使い方はこれでいいの？
をみんなで考えたい / Java DO #20
8c6c1f0c4c41d0640ade76bd71e9e475?s=48 gishi_yama
0
130
AWS Config Custom Rule、ノーコードでできるかな？
822eaa655305fe3cffb0b034913f0cd2?s=48 watany
0
250

Featured

See All Featured
Why Our Code Smells
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
324
55k
Support Driven Design
1519587b1a0febb658c36c94f6272b0d?s=48 roundedbygravity
87
8.6k
It's Worth the Effort
Ba530e786553390f3fb271848485681c?s=48 3n
172
26k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
C44e1f7e22c3f23cff7bc130871047ef?s=48 eileencodes
119
28k
Testing 201, or: Great Expectations
A9704266587836f7e784235e5073b93e?s=48 jmmastey
21
5.5k
ReactJS: Keep Simple. Everything can be a component!
Af6a12710770ad9a7cfd08c97efd40d3?s=48 pedronauck
655
120k
Building Flexible Design Systems
91cefdf141106fa10674aae74ce05890?s=48 yeseniaperezcruz
310
34k
How GitHub Uses GitHub to Build GitHub
78b475797a14c84799063c7cd073962f?s=48 holman
465
280k
The Mythical Team-Month
E6c6e133e74c3b83f04d2861deaa1c20?s=48 searls
210
39k
Thoughts on Productivity
A16eb159db895e3b01d3dc95767ad595?s=48 jonyablonski
44
2.4k
How to Ace a Technical Interview
2f5463832ccb768ccb4a1ca3607c27ef?s=48 jacobian
267
21k
YesSQL, Process and Tooling at Scale
D09fad3e36ae6841f54820be0e907f7a?s=48 rocio
157
12k

Transcript

  1. 📮 microCMSを使った ビジネスサイドとのコミュニケーション meijin / 株式会社NoSchool CTO

  2. 自己紹介 - meijin / 株式会社NoSchool CTO - Twitter: @Meijin_garden -

    最近はReact / React Nativeをよく書いてる - Webフロントエンドとソフトウェア設計が好き - 趣味は将棋☗ 2

  3. 📌 本スライドの要点 3 - microCMSの良いところを語るスライドです - microCMSはビジネスサイドと一緒に 管理画面を見ながらデータ構造を設計できる - 何ができる/できないのイメージ共有がしやすい

    - カテゴリー分けとカスタムフィールドを紹介

  4. microCMSを使った ビジネスサイドとの コミュニケーション 対象のJamstackサービスと 運営体制 4

  5. マナリンクTeachers - https://for-teachers.manalink.jp/ - Next.js(ISR) + microCMS - オンライン家庭教師向けの情報メディア インタビュー記事や指導のコツなどを掲載

    5

  6. 6

  7. 運営体制 - 󰡈 ビジネスサイド1名 - 企画、先生へのインタビューなど - 󰞵 開発サイド1名（私） -

    日頃アプリや決済機能なども開発しているので、 工数を抑えて開発するためにバックエンドはmicroCMS！ - サーバー費用も安い（Vercel） 7

  8. microCMSを使った ビジネスサイドとの コミュニケーション 要件定義の例① 記事のカテゴリー分け 8

  9. 記事のカテゴリー分けとは - https://for-teachers.manalink.jp/useful/job-side - ポイント - 大カテゴリと小カテゴリがある - 各カテゴリごとに一覧があり、URLとTitleとDescription等があ る

    - 各記事につき必ず大小1つずつ紐づく 9

  10. STEP1 各カテゴリごとの仕様を表で整理 10

  11. STEP2 カテゴリごとに”動的に”変わる点を洗い出し - URL(に使われる英単語) - カテゴリの名前 - Title / Description

    - どの大カテゴリに属するか※小カテゴリのみ 11

  12. STEP3 microCMSでAPIを作成 動的に変わる部分を スキーマとして設計 12

  13. ポイントは、 ここまでの流れをすべて ビジネスサイドの方でも自分でできること👍 13

  14. 󰳕󰳖最初は一緒にAPIを作成 ↓ 󰳕「では同じ調子で作成してください」 「わかりました」󰳖 「他のAPIのカテゴリ作成もできました！」󰳖 󰳕「内容OKです！ 　　ダミーデータ入稿お願いします！」 14

  15. この開発フローの良いところ 15 - 早い段階からダミーデータの入稿に入れるため、 要件をビジネスサイドにイメージしてもらいやすい - リレーションとかスキーマみたいな概念を肌で感じてもらい やすい（microCMSさんのワーディングが上手）

  16. microCMSを使った ビジネスサイドとの コミュニケーション 要件定義② 記事本文中に吹き出しを埋めたい 16

  17. こんな感じで記事に吹き出しを入れたい要望 17 会話を載せたいコンテンツ - 先生へのインタビュー - 先生方との勉強会

  18. 普通にmicroCMSを使った場合 本文に指定するリッチエディタフィールドは 単純に大きいHTMLなので、吹き出しを埋めるのは困難 18

  19. STEP1 カスタムフィールド 19

  20. STEP2 カスタムフィールドの繰り返しを設定 20

  21. STEP3 React実装 21

  22. 企画の流れ 󰳕「microCMSこんなことできるみたいです〜」 　（Slackに記事をシェア） 「記事に吹き出しを埋めたいです」󰳖 󰳕「たぶんできそうなのでやってみます(勘)」 　「実装できたので入稿お願いします！」 「入稿しました！」󰳖 22

  23. コミュニケーションのポイント 📌 社内でmicroCMSのノウハウ記事をシェアする 📌 管理画面から入力可能なデータ形式なら実装可能、と いう話をする。できる/できないのイメージ共有がしやすい 23

  24. 24

  25. microCMSを使った ビジネスサイドとの コミュニケーション まとめ 25

  26. microCMSを使ったコミュニケーション 📌 管理画面を一緒に見ながら要件定義を進める 📌 何ができる/何ができないのイメージ共有をする 📌 慣れてきたら自分でAPI作成・改修ができる （UIによるITリテラシの底上げがノーコードやローコードの本質なのかも？） 26

  27. microCMSを使った ビジネスサイドとの コミュニケーション 告知 27

  28. オンライン家庭教師マナリンクはエンジニア採用中！ 以下のサービスを開発しています 28 先生を集客するメディア 先生を探せるWebサイト オンライン指導専用アプリ

  29. 29

  30. マナリンクTeachers (https://for-teachers.manalink.jp/) めっちゃ面白いインタビュー記事を多く 掲載しているのでぜひ 読んでいただきたいです （右のは私の個人的なおすすめ） 30

  31. ご清聴ありがとうございました 発表内容等についてもっと知りたい /カジュアル面談のお申込みはコチラ 　　　@Meijin_garden 31