Slide 1

Slide 1 text

三年間の関わりから見る PR TIMES エンジニアリングの変化 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 1

Slide 2

Slide 2 text

Shogo SENSUI (shogosensui.com) Advisor at PR TIMES, Inc. Advisor at Macromill, Inc. Advisor at JR West 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 2

Slide 3

Slide 3 text

Shogo SENSUI @1000ch·フォローする X の皆さんご無沙汰しています。@PRTIMES_JP での支援が 始まって早三年が経ったので、書きました / “三年間の関 わりから見る PR TIMES エンジニアリングの変化 | PR TIMES 開発者ブログ” developers.prtimes.jp 三年間の関わりから見る PR TIMES エンジニアリングの… Technical Advisor の @1000ch です。私がジョインしたの が 2021-09 なので、気… 午前9:45 · 2024年9月25日 54 返信 リンクをコピー Xでもっと読む 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 3

Slide 4

Slide 4 text

遡ること 2021 年 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 4

Slide 5

Slide 5 text

機能追加もままならないプロダクト レガシーでモノリスな PHP に jQuery で振る舞いを実装した古き良き Web アプリ クラウドではなくオンプレでホストされ、CI/CD も組まれていないシステム Frontend/Backend どうこう以前に、エンジニアリングの方向性が示されていない 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 5

Slide 6

Slide 6 text

エンジニアリングの梃入れに伴い参画 現 CTO が参画し、セキュリティを優先にシステム課題および優先度の明確化 古い PHP のアップグレードや React の導入など、大まかな方向性が決定 2021 年の夏頃に依頼があり、Frontend を中心にサポートを開始 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 6

Slide 7

Slide 7 text

状況の把握と支援の模索 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 7

Slide 8

Slide 8 text

未開拓のシステム 古く大きな PHP に jQuery で実装された Frontend 実装を開拓 React を部分的に導入したものの、先々の方向性は不明確な状態 未成熟のチーム この状況に置かれた、所謂 Frontend なソフトウェアエンジニアは新卒 3 人 「アドバイザーらしき人が来たらしいが、どう協調すれば良いかわからない」 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 8

Slide 9

Slide 9 text

Frontend 領域の確立に向けたチーミング まずは継続的に対話する場を設け、何が起きて何に困っているのかを把握分析 とにかく自己開示の機会を増やし、領域内外の関係構築を促進 「やりたい」で終わらない課題解決に向けて 課題の解像度を高め、取捨選択を繰り返すように議論を補助 個人の WANT ではなく組織の SHOULD、短期ではなく中長期を優先 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 9

Slide 10

Slide 10 text

唯一やった型化「背景 → 課題 → 提案」 現状を整理して俯瞰 抽象度を高めた課題を抽出 課題の対処方法を考案 如何なる課題解決にも適用できる思考の基本でありフレームワーク 起案のフォーマットとし、議論を繰り返す。これで議論の質が徐々に向上 これが伴わないアイデアは、考えることを放棄した思い付き 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 10

Slide 11

Slide 11 text

取り組みが徐々に結実 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 11

Slide 12

Slide 12 text

Backend と同居していた Frontend 実装を別リポジトリ に分離 Shogo SENSUI @1000ch·フォローする レガシーな実装だった PR TIMES のフロントエンドが徐々 に、そして着実に改善されている。モダン化に向けて一気に 修正することが難しい中で、このフロントエンドを切り離す 一手の意義は大きい。 / “PR TIMESにおけるフロントエンド 開発基盤の構築 | PR TIMES 開発者ブログ” developers.prtimes.jp PR TIMESにおけるフロントエンド開発基盤の構築 こんにちは、21新卒エンジニアの柳(@apple_yagi)です。今月から新卒2年目と なり、一年早かったなとし… 午前10:38 · 2022年4月14日 24 返信 リンクをコピー 1件の返信を読む 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 12

Slide 13

Slide 13 text

正解のない議論に時間を費やし ていた ESLint による lint を xo へ置換 Shogo SENSUI @1000ch·フォローする みんなでコツコツ進めて、ようやく適用完了した。しっ かり目のルールをこの行数のファイルに適用できたのは 凄い 確かにフルスキャンは重いけど、基本はテキスト エディタの拡張機能と、変更差分に適用できれば大丈夫そ う やなぎ@apple_yagi フロントエンドのLintツールをXOに統一した話 developers.prtimes.jp/2024/02/09/fro… 午後10:59 · 2024年2月9日 7 返信 リンクをコピー Xでもっと読む 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 13

Slide 14

Slide 14 text

Frontend で積み重ねた改善の数々 Frontend の実装を集約するリポジトリを作成し、分割統治 webpack によるビルドを esbuild を経てVite に移行し、高速化 終わりのないルールの議論に時間を割いていた ESLint から xo へ移行 Frontend が支配的だった GitHub Actions の実行時間を分析し改善 Output/Outcome 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 14

Slide 15

Slide 15 text

ソフトウェア以外の副次的な変化や成長 仲間も増えて Frontend という技術領域が確立し、経験だけでなく信任が蓄積 バックエンドエンジニアがフロントエンド開発・フロントエンドエンジニア がバックエンド開発に相互でコミット 課題の解像度を磨き続けた ことで「やらなければ良かった」が体感的に減少 困難な状況下でも結果を積み重ねた自信が、個人や組織としての主体性 に 潜在的な技術負債を予め察知し対処できている Outcome/Outgrowth 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 15

Slide 16

Slide 16 text

まだ終わらない改善 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 16

Slide 17

Slide 17 text

アドバイザーとしての支援を振り返った雑感 焦点はマインドセットや課題解決で、実のところ「The 技術」の提供は少ない 100 点の正解は持ち合わせていないし、劇的な課題解決からは程遠い それなりに重要な役割でありながら、 (良い意味で)放任ベースだった 変化に相応の忍耐力が問われる中で、皆が根気よく向き合ってきた 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 17

Slide 18

Slide 18 text

個人や組織の更なる発展に向けて コミットの賜物で負債は着実に減っている アクセシビリティをはじめとした、更に発展的な非機能要件への取り組み 個人での頑張りから組織としての協調へ 開発に留まらない、事業や採用などの領域への関心と観点の拡大 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 18

Slide 19

Slide 19 text

お気軽にお声がけください キャリアの悩み、チームの課題、PR TIMES のこと、etc 三年間の関わりから見る PR TIMES エンジニアリングの変化 by @1000ch 19