こんにちは、バックエンドエンジニアの中山です。
PR TIMESは今年、企業向け管理画面のUIリニューアルを行いました。リニューアルと並行して他の開発も進める中で、立ち上がりのつまずきや、レビュー・AI活用の変化、直近の技術課題など、現場で得た学びをざっくばらんに振り返ります。
UIリニューアルやその他の動きについて、詳細は以下の記事に書かれています。
参加者
- 中山（進行・24卒）
- チャノックナン（25卒）
- 田中（24卒）
- 筒井（24卒）
自己紹介
中山：進行の中山です。今日は24卒と25卒の今年の開発を、データを見ながらゆるく振り返っていきましょう。まずは自己紹介からお願いします。
チャノックナン：25卒です。ハッカソン参加を経て内定者インターンとして入社し、現在は正社員として働いています。フロントエンド中心に開発をしています。
田中：24卒です。インターンは1年半くらい。最近はUIプロジェクトの分析ページで開発リーダーを担当していて、今はログイン履歴やアクティブセッションの一覧を進めています。
筒井：24卒です。研究室の都合でインターン経験はありません。最近はUIの分析データのバックエンドやストーリーのテストを担当していて、今は新規プロジェクトの技術仕様書を書いています。
中山：24卒です。私はPR TIMESではインターン経験はなく他社でインターンをしていました。最近はUIリニューアルと社内管理画面の移行まわりのタスクをやっていました。
立ち上がりの壁
中山：チャノックナンさん、研修が終わってから、最初に任されたタスクって何でした？
チャノックナン：研修がまだ残っている時期から、優先度の高い新社内管理画面のバグ修正を並行して始めました。気づけば3ヶ月くらい取り組んでいました。
中山：最初は何が一番分からなかったですか？技術・ドメイン知識などどこが大変でした？
チャノックナン：社内管理画面がSaaSのBaseMachinaを使っていて、その仕組みの理解が難しかったです。今も完全に理解できたとは言えないんですが、BaseMachina上で動くReact部分はだんだん掴めてきました。
中山：BaseMachina系って、AIに聞いても解けないことありますよね。
チャノックナン：あります。BaseMachinaが特殊で、AIに聞いても解決しないことが多くて。ドキュメントを読み直したり、同僚に相談しながら進めました。
中山：具体的に「ここがキツかった」って例はありますか？
チャノックナン：
検索→詳細→検索結果に戻ると、検索条件が初期化される問題がありました。BaseMachinaの想定外っぽくてReact側では、検索条件をURLのクエリパラメータとして保持するように変更しました。コンポーネントの読み込み時にクエリパラメータを確認して検索を実行します。検索時は直接処理を行うのではなく、まずURLを更新する形にしています。URL変更を監視して差分が発生したタイミングでコンポーネントを再読み込みさせることで、画面遷移を挟んでも検索状態が正しく維持されるようになり、問題を解消できました。
中山：この課題を解決する時に、特に助かったものは何でした？
チャノックナン：同僚への相談が一番大きいです。あとはレビューで「どういう状態を保持すべきか」を一緒に整理してもらえたのも助かりました。
プルリクエスト/レビュー数のアウトプットが増えた背景
中山：次は24卒メインで、Findy Team+のアクティビティを見ながら振り返りたいです。UIリニューアルの期間はいつ頃でしたっけ？
田中：9月上旬に開始して、11月頃まで続いていた認識です。
筒井：同じく、そのくらいです。
中山：田中さん、9月中旬〜10月上旬でプルリクエスト数と変更量が増えてますよね。何が起きてましたか？
田中：UIリニューアルの分析ページのバックエンド実装が始まった時期と一致してます。10月後半は他のプロジェクトのAPI実装にも入っていて、そこで活動が増えたと思います。
中山：レビュー数も同じタイミングで上がってますね。
田中：分析ページを筒井さんと2人で実装していて、相互にレビューしていたのが大きいです。2人だと遠慮なく議論できるし、詰まったら「ハドルしましょうか」ってすぐ声をかけられたのが良かったですね。
中山：筒井さんも田中さんと似たようなグラフですね
筒井：そうですね、この時期はほとんど同じプロジェクトにアサインされていたので。
中山：プルリクエストとレビューの質は変わりましたか？
筒井：UI系のプルリクエストは、動作確認のために動画やスクショを頻繁に上げるようになりました。レビュー側も状況が分かりやすくなるので、これはかなり良かったです。
田中：私はAIレビュー導入が一番の変化でした。特にテストコードの質が上がった感覚があります。以前はAIの出力が読みにくいこともあったんですが、参照させたい既存テストが増えたことで、出力も良くなってきたなと思います。
中山：AIと開発ルールの調整ってどうしてます？
田中：AIが生成するコードとPHP CS Fixerの相性で、無限ループみたいな問題が起きたことがあって。claude.local.md に独自ルールを追記してます。たとえば「use文は最後に追加する」みたいな指示を入れて、AIが先にuseだけ足す→CS Fixerが消す→またAIが足すのループを避けるためです。
中山：それ、私も同じの経験をしました。
中山：筒井さんはどういう観点でレビューしましたか？
筒井：レビュー観点としては、型や命名規則はよく見ます。自分がレビューで指摘された経験が効いていて、そこは特に意識しています。
直近の苦戦
中山：直近の苦戦の話に移りましょう。チャノックナンさん、ヒートマップでプルリクエストのクローズが多かったと聞きました。何が難しかったですか？
チャノックナン：新規実装なんですけど「旧実装と全く同じ結果を出す」要件が難しかったです。旧実装の出力やスタイルを参考にしつつAIも使って修正しましたが、AIに任せても品質が良くないことが多くて。結果、クローズが増えました。
中山：クローズ判断の背景は何かありますか？
チャノックナン：リリースが近くて焦りがあったのと、旧実装との比較が甘かった反省があります。あと、元の実装自体が良くなくて、最終的に「最初からやり直した方が早い」判断になったケースもありました。
中山：確かに、旧実装との一致は沼りやすいですよね。このあたり、みんなそれぞれ苦戦ポイントがありそうですね。次に、田中さんはどうでしたか？
田中：UIリニューアルの分析ページのリーダーを初めてやって、実装以外のタスクが一番きつかったです。特にQAの進め方・必要なものが分からなかった。外部のQA委託会社とのやり取りも、正式依頼が必要でプロダクトマネージャー経由になるので、コミュニケーションがどうしても遅くなる課題がありました。
中山：なるほど、開発以外のコミュニケーションの調整で苦戦したんですね。筒井さんはどうでしたか？
筒井：外部APIの仕様把握に苦戦しました。特定のパラメータがないとデータが取れない仕様が、備考欄に書かれていて見落としそうになったんです。アドホックテスト中に「取れてない」ことに気づいて、仕様書を読み直して判明しました。
中山：リリース前のアドホックテストで拾えたのは大きいですね。
学び
中山：最後に今年1年間の学びを振り返り、整理しましょう。「やって良かったこと」と「反省点」をお願いします。
チャノックナン
- やって良かった：テスト〜リリースまで一連の流れを経験できたこと。QAだけでなく、デザイナー連携やチームで前に進める重要性が分かりました。
- 反省点：ヒートマップの実装にAIに頼りすぎたところ。旧実装一致が必要な場面は、比較・検証をもっと丁寧にやるべきでした。
田中
- やって良かった：インシデント対応やリーダー経験を通じて、広い視野で見られるようになったこと。
- 反省点：QA進行の不明点を抱えたまま進めたこと。早めに型を作り、関係者と握るべきでした。
筒井
- やって良かった：レビュー観点を言語化して、型・命名など基礎品質を継続して見られたこと。アドホックテストの習慣も効きました。
- 反省点：ドキュメントの隅に書かれていたので見逃していた。ドキュメントの細部まで外部APIの仕様を網羅しておくことが大事だと学びました。
中山
- やって良かった：私自身の学びは、UIリニューアルを通して「旧実装と同じ結果を保証するテスト」を書くことの重要性を再確認できました。
- 反省点：AIの調査に頼りすぎると予期せぬ漏れがあるので、自分で調査することの大切さを学びました。
まとめ
今年は企業向け管理画面のUIリニューアルを軸に、並行して複数の開発も進めた一年でした。立ち上がりでは BaseMachina のように、AIだけでは解けない課題にも直面しましたが、相談とレビューを通じて状況を言語化しながら前に進めることも効果的だと、改めて実感できました。
また、24卒・25卒それぞれのこの1年間の振り返りを対談形式で行いました。普段は常に同じプロジェクトにいるわけではないため、データをもとに振り返ることで、普段は聞けない話も引き出すことができました。
We are hiring!
PR TIMES ではカンファレンスジャンキーな PHPer はもちろん、様々なポジションで積極採用中です！まずは気軽にカジュアル面談してみませんか？
