![見出し画像](https://assets.st-note.com/production/uploads/images/143587006/rectangle_large_type_2_a1c57d7bbc2c1d9642493d45d7e5e219.png?width=1200)
APPRENTICE生のための日報支援サービスをチームで作った話
下記URLのAPPRENTICE生に特化した日報作成支援サービスを開発しました。
[注意]AI校閲機能はCORSの不具合のため動作しません
この記事の対象者
APPRENTICE生
チーム開発初心者
チーム開発をどのように行なったのか
開発
チーム: 設計4人、実装3人
諸事情で途中離脱したメンバーがプロダクトのサービス名と課題、デザインに協力してくれたおかげで作業効率がめっちゃ進んだ!
開発期間: 2ヶ月
バージョン管理:GitHub
タスク管理:GitHub Projects
コードレビュー:PRによるレビュー
方針: 全員からのLGTM獲得後、developにマージ
良かった点
チーム間で知らない機能コードの混入を防ぐ
機能ごとに分離したPRでレビュー負荷を軽減
改善点
LGTM待ちによる機能開発の遅延が発生するため、優先度に基づいてLGTMしてもらうようにする!
コミュニケーション:Discord
ガントチャートと見積もり:スプレッドシート
良かった点
早期の見積もりによりReact.jsを触ったことがないメンバーの学習時間を確保
締切前心理的負担の軽減による生産性向上
スライド作成: Canva
良かった点
テンプレートに則ってスライドを作成することができる
改善点
発表時の評価軸がワクワクするものを開発することだったため、それに合わせたスライド構成にするとよりプロダクトの魅力を伝えられると思いました。
開発環境: React.js
良かった点
触ったことないけど、React.jsを使って開発したいと言ってくれたおかげでHTML,JavaScript,CSSだけだと作るのが大変なプロダクトにすることができました。
改善点
リセットCSSやTailwind CSSを先に導入する
開発を早めに着手することを優先して、メンバーにタスク割り振りました。そのおかげで学習期間を確保できたのですが、完全にCSSライブラリを突っ込むタイミングを逃してしまいました😳
Vercelデプロイ時にgeminiAPIとのCORSサーバーエラーになったのでAPIとのデプロイ経験のあるNext.jsを検討しても良かった。
Next.jsのApp Routerなら個人的にルーティング周り以外はReact.jsとほぼ一緒のためNext.jsっぽいところだけこっちで整備してReact.jsと一緒の部分で提案しても良かったかも!?
今回のチーム開発で意識したこと
前回のチーム開発の反省を活かしつつ開発を進めました。
以下の点を意識できたので非常にいいプロダクトになりました!
解決すべき課題は何かを明確化
本当にそのサービスで課題が解決するのかの視点に立つ
課題の洗い出しについて
今回のお題は自分たちがワクワクするものを開発することでした。
ワクワクしつつユーザーの役に立つものを考えるということで、チームのメンバーが課題を提案してくれました!
そのおかげで早い段階から実装に着手できたのが完成の決めてになりました!
チームメンバーの皆さん本当にありがとうございます!
最初の課題について
当初の課題は、APPRENTICE生が突然離脱してしまうことでした。
離脱してしまう前兆
日報を提出しなくなる
日報を提出しないとメンターやチームメンバーがメンティーの状況を把握できないのでメンタル不調などに気づけない
前兆を踏まえて
日報を提出することで何かしらの褒美が貰える仕組みがあればいいのではないかというチームの会議で話になりました。
褒美について
一定の期間日報を提出していればメンターと1on1を追加で話せる機会頂ける。
APPRENTICEの山浦さんと上記の条件で話して前向きに検討して貰えることになりました。
本当に1on1を開くことで本来の課題であるAPPRENTICE生の離脱を防げるか?
要件をみんなで詰めていって一旦要件定義を完成させました。日報のアプローチで課題を解決することを考えていたのですが、一旦クールダウンしてよく考えてみることにしました。
1on1では根本的に離脱するアプレンティス生を止めることは難しいのでは無いかという話をしました。
1on1が有効なメンティ
メンタル的に弱っている
1on1が有効なのはメンタル的に弱っているメンティーが思い浮かびました。ちょうど案を出した時期に、なんでも相談アワー という仕組みが導入されたので、メンタル不調のメンティーのケアができる仕組みができたので1on1自体が不要ではないかという話をしました。(一度固まった仕様をかき乱してしまいましたが、メンバーに恵まれたおかげで、暖かく受け入れて貰えてめっちゃ助かりました🙇)
再出発
APPRENTICE運営自体の課題をユーザー側である自分たちで解決することは難しいという話ということで、自分たちの課題に立ち返りました。
日報の質を高めつつ楽に作成できる支援サービス
自分たちが毎日書いている日報をより良いものにするためにそっちにフォーカスすることにしました。自分たちの課題ならプロダクトが完成すれば必ず使うところまで持ってい行けるので良い課題設定だと感じました
実装について
wakatimeから分析します。
以下リンク
![](https://assets.st-note.com/img/1717995219771-SFYEXjDjRX.png?width=1200)
リポジトリ全体の操作時間は50hほどでした!結構時間消費しててびっくり!
![](https://assets.st-note.com/img/1717995781769-uIsUyWvFmQ.png?width=1200)
一番長いので6月8日は12hくらいVSCode弄ってたみたい!最後の追い込みがしっかり追い込めてた!
![](https://assets.st-note.com/img/1717995887314-mhCACqASHi.png?width=1200)
一番弄ってたのがsingle/index.jsでした。
single/index.jsはPDCAコンポーネントの各PLAN,DO,CHECK,ACTIONに該当するコンポーネントです。具体的には下記の要素です。時間かかってた原因は、当初はnoteみたいにmarkdownに対応させるつもりが無かったんですが、時間的に余裕ができたので、しんどいけどやってみるかってことでBlock Noteのライブラリを導入することでNoteみたいな処理ができるようにしました。なので改修する時間などが多かったためsingle/index.jsが一番最長の時間になったのかなと2番目に多いEditor/index.jsはBlock Noteのライブラリに対応させるために使っています。
![](https://assets.st-note.com/img/1717995970958-9IwvDLF8Uy.png?width=1200)
VSCodeの稼働している時間だけみても結構な時間が流れてるんだなと再確認!
まとめ
今回のチーム開発では、要件で出した内容を全部盛り込めて実装できたのでめっちゃ嬉しかったです。一人ではこの規模のプロダクトは作れなかったのでチームメンバーと協力し、困難な課題にも粘り強く取り組み、乗り越えることができました!チーム開発の機会を提供して頂いたAPPRENTICE運営のみなさん、チームメンバーのみなさん、本当にありがとうございました!
これからオリプロの期間に入るので気を緩めずに頑張って行きたい🫡