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
documentation-driven-development-in-small-team
Search
chanko
May 29, 2019
Programming
3
2.3k
documentation-driven-development-in-small-team
documentation driven development in small team with Angular
chanko
May 29, 2019
Tweet
Share
More Decks by chanko
See All by chanko
co-trip-ux-design
chanko
2
67
Other Decks in Programming
See All in Programming
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
300
ruby.wasmで多人数リアルタイム通信ゲームを作ろう
lnit
3
500
AI Agent 時代のソフトウェア開発を支える AWS Cloud Development Kit (CDK)
konokenj
5
570
MCPを使ってイベントソーシングのAIコーディングを効率化する / Streamlining Event Sourcing AI Coding with MCP
tomohisa
0
160
Porting a visionOS App to Android XR
akkeylab
0
650
AIプログラマーDevinは PHPerの夢を見るか?
shinyasaita
1
240
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
3
780
Result型で“失敗”を型にするPHPコードの書き方
kajitack
5
970
システム成長を止めない!本番無停止テーブル移行の全貌
sakawe_ee
1
220
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
210
なぜ「共通化」を考え、失敗を繰り返すのか
rinchoku
1
660
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
5
8.1k
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Optimizing for Happiness
mojombo
379
70k
How to train your dragon (web standard)
notwaldorf
96
6.1k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Why Our Code Smells
bkeepers
PRO
336
57k
Facilitating Awesome Meetings
lara
54
6.5k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
The World Runs on Bad Software
bkeepers
PRO
69
11k
KATA
mclloyd
30
14k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.4k
Transcript
小規模チームにおける ドキュメント駆動開発のすすめ Kohei Iizuka ng-japan meetup 2019 Spring 2019/5/29
• 飯塚 航平(いいづか こうへい) • フロントエンドエンジニア(Angular) • 兼サーバサイドエンジニア(Go) • Voicy
• 開発歴1年弱 About me @chankolfin
What’s Voicy? パーソナリティが自らの声を通して 声のブログやニュースを放送している ボイスメディアです。 スマートフォンやウェブサイト、 スマートスピーカーを通して、 いつでもどこでもリスナーの耳に届きます。 ボイシーとは?
• 現在の開発と組織体制について • ドキュメント駆動による開発体制とアーキテクチャの改善 • 今後の展望 TL;DR
現在の開発と組織体制について
• toB案件のシステムの開発をほぼ一人で担当(サーバサイド含む) • 海外開発チームとの仕様書を通した開発連携 • フロントエンド主担当がいなかったことによるコンポーネントの肥大化 (スタイルガイドラインで400行推奨のところ、800行、、) • リリース重視によるテストなし、未使用メソッドの嵐 現在の開発と組織体制について
None
• NgRxによる状態管理 • テスト駆動開発によるコンポーネントの抽象化 • Atomic Designによるコンポーネントの標準化 • (モジュールの分割とLazy loading)
よく出てくるコンポーネント綺麗化対策
調べた結果 →あ、、これ一気に始めるの無理だわ
調べた結果 • 全て一気に行うことは工数的に難しい • 海外開発チームとの連携のため学習コストは下げたい、仕様書から開発できるよう にしたい →全てはコンポーネント、モジュール階層を適切に単純化すること →ドキュメント作成の自動化 + ドキュメント駆動による開発の単純化
+ コミュニケーション明確化
None
compodocとは
Demo 皆さんもすぐに実行可能 npm install -g @compodoc/compodoc // add to package.json
"scripts": { "compodoc": "npx compodoc -p src/tsconfig.app.json" } npm run compodoc
• コンポーネントの階層を見える化 • コメントの徹底 • 必要なメソッドが入ったことをそのまま確認できる • 実装不足や不必要なレビューを減らせる • 海外開発チームへの開発依頼を単純化
• 仕様書作成コストの削減 Compodocによるドキュメント作成自動化
Before(コンポーネント&モジュール)
After(コンポーネント&モジュール)
エンジニア in 日本 → 設計、スケール、事業の成長、仕様書の作成とQ&A対応、細かいレビュー エンジニア in 海外 → 開発、仕様書に対するQ&A セミコミットエンジニア → 開発とアドバイス、仕様書の作成とレビュー
Before(コミュニケーション)
エンジニア in 日本 → 設計、スケール、事業の成長、仕様書の作成とQ&A対応、細かいレビュー エンジニア in 海外 → 開発、仕様書に対するQ&A セミコミットエンジニア → 開発とアドバイス、仕様書の作成とレビュー
After(コミュニケーション)
• ドキュメントによる海外開発チームとの円滑&シンプルなコミュニケーションができる 体制づくり ◦ 「こんなメソッドが入っている、こういうコンポーネントを、こういう階層で作って!」 ◦ 実際に作ったものが要件通りに入っているかが一目でわかる ◦ コメント不足の見える化とコメントの徹底 •
コンポーネント再設計→テストの流れを少しずつ作る ◦ Lazy loading with Doc(モジュールの分離) ◦ Container & Presentational Component with Doc(コンポーネントの分離) ◦ State Management with Doc(状態管理) ◦ Testing with Doc(テスト) • 新規で開発する人、セミコミがすぐにバリューを出せる環境づくり 今後の展望
は、、?NgRxもテストもドキュメント化できないで使えると思ってんのか おまけ ← 4月にIssue化されている
おまけDemo