Slide 1
Slide 1 text
最初にもらったフロントのタスクは
半年以上かかりました
2024/05/27 #みんなのしくじり大賞
株式会社HRBrain 岡田 光博
Slide 2
Slide 2 text
2
AGENDA
● 自己紹介
● 最初にもらったフロントのタスクは半年以上かかりました
○ アサインされたタスク
○ 何が起きたか
○ 何をすればもっと短くゴールできたか
● 実装中のぷち学び（marginの責務）
● まとめ
Slide 3
Slide 3 text
自己紹介
Slide 4
Slide 4 text
4
自己紹介
● 岡田光博（みつ）
● 現在、新規プロダクトでバックエンド！
○ 少し前まで、フロントエンド！
○ HRBrainで初めてエンジニアに。
● 最近の趣味
○ カメラ
○ 音楽（最近は、R&B）
○ 食べ飲み歩く
● 最近あったこと
○ 午前にGitHubでやらかしてきました....
Slide 5
Slide 5 text
アサインされたタスク
Slide 6
Slide 6 text
6
アサインされたタスク
これまで
● 特定のユーザーを検索する時、検索フィルターを使っていた。
Slide 7
Slide 7 text
7
アサインされたタスク
やりたかったこと
● 頻繁に利用すると考えられるステータスのみでの絞り込み機能の対応
Slide 8
Slide 8 text
何が起きたか
Slide 9
Slide 9 text
9
何が起きたか（ざっくり）
タスク着手・・・
Slide 10
Slide 10 text
10
何が起きたか（ざっくり）
2022年12月スタート→2023年7月マージ（PR上げるまでも2, 3ヶ月）
Slide 11
Slide 11 text
11
何が起きたか（ざっくり）
実装が8ヶ月、検討が2、3ヶ月
時間かけすぎ...w
Slide 12
Slide 12 text
12
何が起きたか（ざっくり）
一言でいうと、エンジニア経験がなさすぎて
何を聞いて良くて、何を聞いちゃ駄目なのか
分かってなかった。
Slide 13
Slide 13 text
13
何が起きたか（原因）
● シンプルに「Git難しすぎ」
○ HEADの向いている先を間違えて大量の差分
○ 修正のためにreflogとresetがいいらしいことを聞いて使ったらめっちゃ
コード消えた・・・
● シンプルに「React難しすぎ」
○ ReactのuseStateがよく分からず、値が連動しなかった。
● シンプルに「チーム開発難しすぎ」
○ 一度、approveもらったが他の修正を重ねてコミットすることでどんどん
レビューしてもらえるまでの時間が伸びていった。
Slide 14
Slide 14 text
14
何が起きたか（原因）
● シンプルに「Git難しすぎ」
○ HEADの向いている先を間違えて大量の差分
○ 修正のためにreflogとresetがいいらしいことを聞いて使ったらめっちゃ
コード消えた・・・
● シンプルに「React難しすぎ」
○ ReactのuseStateがよく分からず、値が連動しなかった。
● シンプルに「チーム開発難しすぎ」
○ 一度、approveもらったが他の修正を重ねてコミットすることでどんどん
レビューしてもらえるまでの時間が伸びていった。
Slide 15
Slide 15 text
15
何が起きたか（原因）
・・・
Slide 16
Slide 16 text
16
何が起きたか（原因）
● シンプルに「Git難しすぎ」
○ HEADの向いている先を間違えて大量の差分
○ 修正のためにreflogとresetがいいらしいことを聞いて使ったらめっちゃ
コード消えた・・・
● シンプルに「React難しすぎ」
○ ReactのuseStateがよく分からず、値が連動しなかった。
● シンプルに「チーム開発難しすぎ」
○ 一度、approveもらったが他の修正を重ねてコミットすることでどんどん
レビューしてもらえるまでの時間が伸びていった。
Slide 17
Slide 17 text
17
何が起きたか（原因）
● シンプルに「Git難しすぎ」
○ HEADの向いている先を間違えて大量の差分
○ 修正のためにreflogとresetがいいらしいことを聞いて使ったらめっちゃ
コード消えた・・・
● シンプルに「React難しすぎ」
○ ReactのuseStateがよく分からず、値が連動しなかった。
● シンプルに「チーム開発難しすぎ」
○ 一度、approveもらったが他の修正を重ねてコミットすることでどんどん
レビューしてもらえるまでの時間が伸びていった。
Slide 18
Slide 18 text
何をすればもっと短くゴールできたか
Slide 19
Slide 19 text
19
何をすればもっと短くゴールできたか
● [聞けば良かった] シンプルに「Git難しすぎ」
○ → 分からないときは恥と思わず、聞けばよかった
○ → というより、聞いていいよって言われてた。
● [自分の技術不足] シンプルに「React難しすぎ」
○ → 仕方ない。
○ → 技術的に分からない部分は、ひたすらインプット
● [テクニック] シンプルに「チーム開発難しすぎ」
○ → 大きめの修正が入る時は、branchを切って対応
Slide 20
Slide 20 text
実装中のぷち学び（marginの責務）
Slide 21
Slide 21 text
21
実装中のぷち学び（marginの責務）
● Webサイトは下にコンテンツを積んでいく
● 「絞り込み」ボタンの下にではなく、「フィルタ」の上に余白をつける
Slide 22
Slide 22 text
まとめ
Slide 23
Slide 23 text
● 分からない時は、先輩を頼る！
● 技術的なインプットは、常に絶やさない！
● CSSの余白も「ただの余白」と思わず、理由を考えよう！（By先輩）
● あと、、、頑張る！（精神論）
○ GitHubで事故を起こさないように、、、とか！
23
まとめ
Slide 24
Slide 24 text
ご清聴ありがとうございました！