Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
microCMSの開発組織 - Deep dive into microCMS
Search
microCMS
July 11, 2024
Technology
2
4.7k
microCMSの開発組織 - Deep dive into microCMS
microCMS MeetUp 2024で発表したスライドです。
https://microcms.connpass.com/event/316541/
microCMS
July 11, 2024
Tweet
Share
More Decks by microCMS
See All by microCMS
絶対に失敗できないキャンペーンページの高速かつ安全な開発、WINTICKET × microCMS の開発事例
microcms
0
410
microCMS 最新リリース情報(microCMS Meetup 2025)
microcms
0
430
microCMSのリッチエディタ開発:設計・品質・使いやすさの実現手法
microcms
0
150
エンジニア創業者が語るユーザー中心のプロダクト作り
microcms
1
320
What’s new in microCMS (2024 microCMS Meetup)
microcms
0
3.2k
意思決定のモヤが晴れるまで
microcms
7
2.4k
Webフロントエンドの進化とJamstackアーキテクチャの変遷
microcms
7
3.3k
microCMS AI
microcms
0
2.2k
microCMSのエンジニア組織と文化
microcms
0
2.1k
Other Decks in Technology
See All in Technology
共有と分離 - Compose Multiplatform "本番導入" の設計指針
error96num
2
570
生成AI時代のデータ基盤設計〜ペースレイヤリングで実現する高速開発と持続性〜 / Levtech Meetup_Session_2
sansan_randd
1
150
2025年夏 コーディングエージェントを統べる者
nwiizo
0
170
Django's GeneratedField by example - DjangoCon US 2025
pauloxnet
0
150
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
lauchacarro
0
190
複数サービスを支えるマルチテナント型Batch MLプラットフォーム
lycorptech_jp
PRO
1
380
Aurora DSQLはサーバーレスアーキテクチャの常識を変えるのか
iwatatomoya
1
990
20250913_JAWS_sysad_kobe
takuyay0ne
2
220
「何となくテストする」を卒業するためにプロダクトが動く仕組みを理解しよう
kawabeaver
0
410
2025年になってもまだMySQLが好き
yoku0825
8
4.8k
TS-S205_昨年対比2倍以上の機能追加を実現するデータ基盤プロジェクトでのAI活用について
kaz3284
1
160
現場で効くClaude Code ─ 最新動向と企業導入
takaakikakei
1
250
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
42
2.8k
KATA
mclloyd
32
14k
YesSQL, Process and Tooling at Scale
rocio
173
14k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Done Done
chrislema
185
16k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
840
Building an army of robots
kneath
306
46k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Embracing the Ebb and Flow
colly
87
4.8k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Transcript
株式会社microCMS 大西 智也 microCMSの開発組織 Deep dive into microCMS
2 • ヤフー株式会社にて約10年エンジニアを経験 • メール、ヤフオク、PayPayフリマ、CTO室... • iOS、Webフロントエンド、バックエンド、機械学習...etc • 2022年5 月
にmicroCMSにジョイン • 組織やバックエンドの課題を中 心 に業務 • エンジニアが楽しく、不安なく働ける環境作り • 趣味 • ゲーム、ドライブ、個 人 開発、Apple • Vision Pro買いました 株式会社microCMS CTO 大西 智也 @Tomoya_Onishi
2 • 技術スタックとAIツール • 技術的な課題 • チームと役割 • 開発フロー •
品質向上の取り組み • カルチャー、働き 方 • 今後の課題 • 採 用 情報 今 日 お話しすること
4 技術スタック
5 技術スタック(バックエンド) • プログラミング 言 語 Go, Node.js •
IaC Terraform • コンピューティングサービス Lambda、ECS • データベース、ストレージ DynamoDB、S 3 • 検索 OpenSearch • キャッシュ CloudFront • 保護、レートリミット AWS WAF, Cloudflare WAF • フロントエンドへの 非 同期イベントの通知 Momento Topics • フィーチャーフラグ LaunchDarkly • 画像最適化 Imgix • 決済 Stripe • CRM HubSpot
6 技術スタック(モニタリング、オブザーバビリティ) • メトリクス監視、ログ分析、ダッシュボード Grafana, CloudWatch Logs • 外形監視、E
2 E Checkly、Playwright • エラートラッキング Sentry • 分散トレーシング OpenTelemetry, AWS X-Ray • MaC Terraform
7 技術スタック(フロントエンド) • プログラミング 言 語 TypeScript • UIライブラリ
React • ビルドツール Vite • テスティング Vitest, React Testing Library • E 2 E Playwright • フロントエンドへの 非 同期イベントの通知 Momento Topics • フィーチャーフラグ LaunchDarkly • Lint, Format ES-Lint, Prettier → Biome • その他 Storybook Figma Hygen
8 AIツール
9 生 産性を上げるためのAIツール • ChatGPT • ChatGPT Plusを全社員が使 用 可能
• 通常使 用 に加えて、Assistant APIでテストケースをレビューするQAエンジニアを作成 • Copilot • 全エンジニアが使 用 可能
1 0 生 産性を上げるためのAIツール • CodeRabbit • AIコードレビュー • モノレポなのでディレクトリごとにプ
ロンプトを分けて精度向上 • 障害の再発防 止 策としても活 用 • AIの指摘を全て解決してから 人 間に レビュー依頼
1 1 ツールを使った 自 動化 ・ 仕組み化 エンジニアリング領域に限らず、 便利なもの ・
トレンドなものを積極的に導 入 し、 「 自 動化 ・ 仕組み化」する 文 化が根付いている • ClickUp • Cleanshot X • Dify • Pipedream • Kintai bot • Backoffice bot • tl;dv • etc....
1 2 チームと役割
PM チームと役割 ストリームアラインドチーム プラットフォームチーム(バックエンド) プラットフォームチーム(フロントエンド) チームトポロジーの概念を拝借 サポート • 顧客に価値を届ける •
新機能、改善 • フロントエンド & API • 非 機能要件 • Code Health • 開発者体験 • インフラ, SRE, オブザーバビリティ • CI/CD • 非 機能要件 • Code Health • 開発者体験 • CI/CD • E 2 Eテスト • JavaScript SDK
1 4 開発フロー
1 5 開発フロー 企画 実装 QA リリース 総合テスト
1 6 開発フロー • PMが中 心 となって仕様を決定 • プラットフォームチームについてはそのチームのテックリード •
顧客からのフィードバック、経営、技術課題等々を材料に仕様 ・ デザインを検討 企画 実装 QA リリース 総合テスト
1 7 開発フロー • エンジニアにタスクをアサイン • 規模にもよるが基本的に1 人 • タスクの細分化やスケジュール管理は
自身 で 行 う • Design Doc • 考慮漏れ防 止 のタスクテンプレート • 毎 日 の朝会や進捗チェックはなし • 仕様に不備があったりより良いアイデアがあればPMとともに議論 企画 実装 QA リリース 総合テスト
1 8 開発フロー • PMが受け 入 れテストを実施 • 問題があればエンジニアにフィードバック •
Qaseというテスト管理ツールでテストを管理 企画 実装 QA リリース 総合テスト
1 9 開発フロー • 毎週 木 曜 日 に全てのチームの変更を取り込んだ状態で変更分の受け 入
れテスト、リグレッションテストを実施 • E 2 Eテストを実施 • QaseとE 2 EテストはCI連携されており結果がQaseに反映される • 手 動テストも 自 動テストも全てPassしたことを確認して完了 企画 実装 QA リリース 総合テスト
2 0 開発フロー • 翌 月 曜 日 にリリース •
フィーチャーフラグ等を使い、有料プラン、Enterprise向け環境へのリリースは遅らせることもある 企画 実装 QA リリース 総合テスト
2 1 開発フロー ユーザにいいものを届けるために、どのフェーズでも 手 戻りし、 スケジュールも延期する 文 化 企画
実装 QA リリース 総合テスト
2 2 品質向上の取り組み
2 3 外形監視 ・ E 2 Eテストの強化 • 外形監視の強化 •
Checkly • ステージング環境でも実施 • コンテンツAPI、マネジメントAPI、管理画 面 の ページ • アクセスできるか、期待したレスポンスか • ブラウザーE 2 Eテストの強化 • Playwright • 管理画 面 のE 2 Eテストを強化 • Test Automation Daysにて実装、整理 • 月 に2 日 • 自 動テストや関連作業にフルコミット
2 4 オブザーバビリティの強化 • Grafana • メトリクスやエラーログの監視とアラート • ダッシュボード •
ログ分析
2 5 インシデント対応フローの整備 • APIを提供するなどサービスの性質上、 高 いレベルの 品質管理が必要 • Incident
Command Systemに沿ったフローを整備 • Incident Commander (IC) • Operations Lead (OL) • Communication Lead (CL) • Datadogでチケット管理 • 起票と同時にSlackのチャンネルが 自 動作成され、全員が 強制 入 室 • IC, OL, CLの役割を決め、hotfix • 再発防 止 策を検討、実施したらクローズ • 月 に1度、チーム全体でインシデントを振り返る
2 6 QAフローの強化 • Qaseにてテストケースを管理 • 実装完了時に受け 入 れテストを実施 •
リリース前の総合テストで再度実施 • GPTsがテストケースをレビュー
2 7 プロダクト仕様の体系的な管理 with Qase • Qaseでプロダクト仕様を体系的にまとめていく取り組みをトライ中 • PMとCTOがオーナー •
受け 入 れテストのテストケースを取捨選択、 リファクタリングし「プロダクト仕様」セクションに移動 • 「microCMSとはこのようなサービス仕様である」が更新 され続けていく • 案件ごとに仕様書を作り込んでもスナップショット でしかないのですぐに陳腐化する TRIAL
2 8 • プロダクト仕様の体系的な管理 • 最新の仕様の把握 • 「コードが仕様」の回避 •
企画スピードの低下 • エンジニアの疲弊 • 仕様管理をエンジニアに押し付けない 文 化 • AI、新 入 社員の学習 • E 2 Eテストの効率的な実装 • 自 動化されている、されていないを可視化 • 月 2 日 の 自 動テスト整備デーにて、実装 プロダクト仕様の体系的な管理 with Qase TRIAL 目 的 ① 目 的 ②
2 9 カルチャー ・ 働き 方
3 0 カルチャー ・ 働き 方 • フルリモート、 非 同期ワーク
• 自 動化、仕組み化 • ワークライフバランス
3 1 フルリモート、 非 同期ワーク • ハイブリッドなし • オフィスなし •
オフ会を年2回開催 • 任意参加 • タスクの 一 元管理 • ClickUp • 誰が何をいつまでにが可視化 • ドキュメンテーション、ログ • 出社の場合は、 立 ち話等でコミュニケーションが活発化するかもしれないが、 情報がオープンにならない • リモートでは突発的な会話等もログに残しやすくオープン
3 2 ClickUp
3 3 非 同期ワーク • ミーティング前にNotionに議論ポイントをまとめて共有、 事前にコメントしておき、議論に集中 • #ask-anythingチャンネルで雑に聞くとすぐに返事が来る •
込み 入 った話や雑に会話した 方 が早そう!という場合は 気軽にハドルで会話する 文 化も共存 • 定例は最低限 • 課題や情報シェアを次の定例まで待つ必要はない • etc...
3 4 Notionに議論ポイントをまとめて共有、事前にコメント
3 5 自 動化、仕組み化 • Slackでスタンプを押すと勤怠打刻、勤怠サマリをレポート • チーム間のタスク連携の 自 動化
• 開発チームのリリースタスクがクローズしたら、サクセス チームのブログ公開タスクが 自 動 生 成 • ブログ公開時にツイート 文 をAIで提案 • Qaseを活 用 したQAフローの仕組み化 • テストケースをChatGPTで作ったbotでレビュー • ClickUpでタスクを作って、作業してほしい 人 にアサイン • クローズされると依頼側に通知が来る • Slackでの 文 章不要 • エンジニアの書類選考 • 年末調整 • セキュリティアップデート 1つ1つの施策が良い悪いではなく、 こういった取り組みを 積極的にする 文 化がある
3 6 その結果... プラットフォームチームのとあるエンジニア ストリームアラインドチームのとあるエンジニア
3 7 ワークライフバランス • フルリモート • フレックスタイム • コアタイム 10時〜14時
• アディショナル休暇 • 有給休暇を使い切ると + 10 日 間休める • 100%近い消化率
3 8 課題
3 9 今後の課題 • 新機能の提供スピード • インフラやバックエンドに関わる 非 機能要件の改善 •
DBや検索がボトルネックとなり 高 負荷時に サービスが不安定になる • Code Healthの改善 • バックエンド(Go)、フロントエンド(TypeScript)の アーキテクチャの改善 • キャッシュ戦略 • ログ戦略や分散トレーシング • より早い不具合解決を 目 指す • リードタイムの短縮 • 品質を担保したままデプロイ頻度を上げる戦略 • 開発者体験の改善 • etc....
4 0 採 用 情報
Terraform Go移植 Observability Code Health DynamoDB, OpenSearch 非 機能要件の改善 開発者体験の改善
Backup and Recovery Distributed Tracing Continuous Integration/ Continuous Delivery Unit Testing / End-to-End Testing Event-Driven Architecture Logging Strategy Test Size Message Queues Logging / Monitoring 4 1 プラットフォームチーム (バックエンド領域)
Frameworks and Libraries アクセシビリティ 非 機能要件の改善 スタイリングとデザイン Vite TypeScript 開発者体験の改善
Caching Strategy Component Design Continuous Integration/ Continuous Delivery Unit Testing / End-to-End Testing Testing Tools Build Tools Performance Optimization React Event-Driven Architecture 4 2 プラットフォームチーム (フロントエンド領域)
ユーザに価値を届ける アクセシビリティ API 新機能と改善 Vite TypeScript Go, Node.js Caching Strategy
Component Design Feature Flags Unit Testing / End-to-End Testing Testing Tools Build Tools Performance Optimization React Event-Driven Architecture 4 3 プロダクトエンジニア
テスト戦略 アクセシビリティ End-to-End Testing Qase リードタイムの短縮 受け 入 れテスト Synthetics
Test Case Management Continuous Testing Feature Flags Unit Testing / End-to-End Testing Mock / Stub / Spy/ Fake / Dummy Regression Testing Exploratory Testing Load Testing / Stress Testing 4 4 QAエンジニア
4 5 こういった 方 に来てほしい! • プロダクトに共感できる • 働き 方
に共感できる • オープンで優しいコミュニケーションができる • 自 分でタスクを管理し、 自立 して業務できる https://jobs.microcms.co.jp/
4 6 ご清聴ありがとうございました