1. この記事の背景

約500時間ほどのRuby学習を終えてからPHPへ切り替えた。総合学習は800時間を超えている。
共同開発を通して学んだことや反省点などを振り返っていく。
またこの記事で共同開発ではどういったことが学べるのかを参考になれば嬉しい。

2.自己紹介

学習期間2年(RubyからPHPに切り替える)
一度開発系の企業に就職するが会社都合で退職
実務未経験(共同開発時)
Qiitaで技術記事を発信し、300記事以上投稿(学習を継続)
オンラインコミュニティーで勉強会を主催する
IT企業に勤務し、プログラマーを目指し学習中
共同開発では初学者と経験者がいる中でリーダーを務めた

3.Qiitaアカウント

4.学習記録

5.概要

●メンバー
・開発チーム3名(未経験2名、経験者１名)
・現役プログラマー(現場では開発リーダー)１名のレビュー

⚫︎概要
・開発期間:2ヶ月
・週1回の全体ミーティング
・2回のチーム打ち合わせ

6.成果物

大谷翔平選手応援掲示板をチームで開発。
大谷選手の人間性、プロ意識の高さを見習って自分のキャリアに活かしていこうという思いで
私がこの掲示板を企画した。Youtubeの画像は他のメンバーが実装したが、それ以外のデザインなどは
私が考えた。赤色のサイトにした理由は大谷選手が2023年6月時点で在籍しているエンゼルスの色に
合わせたからだ。

7.タスクとスケジュール管理

プロジェクトの管理はツールのGitHubのProjectsを使用。
想定開発時間と期限を設定し、プロジェクト全体を管理した。

8.環境

テキストエディタ

インフラ

サーバーサイド

フロントエンド

管理ツール

・GitHub

デプロイ

・FLY

9.GitFlow

GitHubのブランチ機能を使用した開発をした。

・mainブランチはリリース用。(こちらは開発メンバーは使用しない)
・developブランチは開発共有用
・feauture/〇〇(開発者の名前)/△(追加機能名等)で機能開発
・マージはレビュアーの現役プログラマーのみ

①機能開発が完成したら、pushし、コードレビューをもらいチームメンバーにPRをする。
②修正、指摘があれば修正後、再度push
③問題がなければ、developへマージする。

機能開発が全て終わるまでこれを繰り返しました。

10.開発

主な開発機能、タスクは以下の通りです。

・users（ユーザ）テーブルのマイグレーションとシーダー作成　
・posts（投稿）テーブルのマイグレーションとシーダー作成　
（※掲示板のテーマが決まるまでは、一旦作成者が自由に投稿内容を決める）
・共通ファイル作成　
・ヘッダー・フッター & トップページののみ表示
・ユーザ新規登録　
・ユーザログイン・ログアウト　
・バリデーションメッセージの日本語化　
・トップページの投稿表示　
・ユーザ詳細　
・ユーザ編集画面・更新　
・投稿新規作成　
・投稿削除　
・投稿編集画面・更新　
・ユーザ退会　
・フォロー機能　
・フォローによるタイムライン変更　
・その他追加機能
・フラッシュメッセージの実装
・ファビコン作成　　
・検索機能
・全体修正　
・Flyデプロイ　

11.テスト

４つのテストを実施
①画面遷移テスト(画面が想定通り遷移されるか。)
②レイアウトテスト(レイアウトがおかしくないか。)
③バリデーションテスト(バリデーションエラーは正しく表示されるか。または設定したバリデーション通りになっているか)
④URLテスト(URLを直に入力した際におかしな挙動をしないか。)

12.デプロイ

以下ツールを利用してアプリケーションを公開はこちらの都合で今現在公開できない状態です。
近日公開します。

13.実装したこと

・共通ファイル作成
・ヘッダー・フッター & トップページの表示
・ユーザログイン・ログアウト
・ユーザ編集画面・更新
・ユーザ退会
・フラッシュメッセージ
・投稿の検索機能

画像で説明していきます。

●ヘッダー・フッター & トップページの表示
ヘッターとフッターなどをBootstrapやFontAwesomeなどで実装

●ログイン、ログアウト機能
ユーザーのログインとログアウト機能の実装

●ユーザー編集機能
ユーザーの更新画面をクリックするとユーザーのデータが更新される。
名前、メールアドレス、パスワードの更新とバリデーションがかかっているかを確認できる。

●ユーザー退会機能
退会するボタンを押すと退会確認モーダルが出てきてクリックすると退会処理がされる。
ユーザー退会と同時にユーザーが投稿した内容も削除される。

⚫︎ユーザー情報更新完了、登録完了、ユーザーログイン、ユーザー退会時のフラッシュメッセージ

⚫︎シーダーの中身の変更とページのデザイン作成
サイトのデザインを考え、修正した。画像は概要に書いてあるデザインと同じ

⚫︎ファビコン作成
左から2番目の野球ボールを作成。

⚫︎投稿の検索機能
今回の検索機能は部分一致にした。文字が1文字一致すれば検索できるようにした。

14.指摘されたこと、学んだこと

・git pushをする時push先を注意する
・ChatGPTに頼りすぎない
・何か削除する時はリーダーに確認
・タスクは１つずつやる
・不要な空行は消す
・インデントをしっかりつける
・メッセージの配置などをしっかり確認
・ddなどのデバックを使ってエラーの原因を探す
・タイプミスに気をつける
・バリデーションのテストをやる
・動作確認忘れずに
・不要なファイルは消す
・コードを説明しながら書く
・仮説と検証をする
・仮説は根拠が大切
・他人が見やすいコードにする
・PRの一連の流れ
・細かい点に注意(インデントなど)
・変数名やメッセージは具体的に書く(拡張性や汎用性のため)

15.共同開発で経験できて良かったこと

1.Git操作を実践形式で学べたこと
プルリクエストまでの流れを学んでも実際のコードレビューまでの流れを実践で使ったことで
Git操作を身につけることができた。

2.コンフリクトなどの他のメンバーのことを考えた上での実装を学べたこと
他のメンバーと実装している箇所が」被ったり、先にマージされたりするので、
他のメンバーとの連携やコミュニケーションの取り方を学べた。

3.インプット重視の学習になってしまったのでアウトプットをすることができたこと
インプット中心の学習になってしまっていたので、理解が曖昧な点をクリアにできた。
インプットではよりもアウトプットすることでこの機能がどう使われるのかを理解できた。

4.自分で考えて実装をすることができたこと
自分で調べて考えて実装することができたので、自走力が身についた。
個人学習だけだと自分の都合で実装したり、コードの写経になってしまうことが多かったが、
共同開発で自分の頭で考えて実装することを身につけたことが大きかった。

5.以前よりも質問が上達したこと
レビュアーに質問する時に自分の状況や試したことを言語化でき、
レビュアーが質問が答えやすいと評価をいただいた。

6.自分で仮説と検証ができるようになったこと
自分エラーの原因を仮説を立てることができるようになった。
以前は仮説すら立てることができなかったが、自分で仮説を立てて検証をすることができた。

16.共同開発の反省点

1.インデントなどの初歩的なミスをしたこと
以前はCLなどを使ってコードを整形できたのでインデントに対する認識が甘かった。
インデントを意識することで、他人が見やすいコードを書く力を身につけることができた。

2.基本的なことの理解が曖昧だったこと
不明点を放置してしまっていたり、簡単なGit操作のミスなどPRを出すまでに時間をかけてしまった。
今回の共同開発をきっかけに自分の弱点を明確にできた。

3.細かい点のミスが多かったこと
インデントや誤字脱字など、初歩的なミスでタスクを終えるのが遅くなってしまった。
エンジニアは細かい点が大事だということを学んだ。

4.他の実装者やレビュアーへの配慮が足りなかったこと
読みやすいコードなどを書けば自然とインデントを整えるが、うまく整っていないことがあった。
こうしてレビュアーに負担をかけてしまったことがあった。

5.何かを削除する時の報告や連絡を忘れていたこと
不要なファイルなどを消すときに、このファイルを消していいかを聞かなかったことは反省点。
開発に影響はなかったが、重要なファイルを消すとプロジェクトが止まってしまうので
何かを消したりする前は必ず、上司などに質問をしたい。

6.ChatGptに頼りすぎてしまったこと
ChatGptだけだとトリッキーなコードになってしまって動くけどレビュアーが見づらいコードになって
しまったり、実際に動かないことがあった。
後頼りすぎると自分の頭で考えて実装する経験が減ってしまうので使い方には注意した方がいいと思った。

7.デバックをもう少し使えばよかった
エラーが出たり、想定通りの実装ができない時にデバック機能をもっと使っていれば、
開発スピードを速くすることができたと思った。

8.レビュアーのコメントには返信をすること
実務では返信するかしないかで現場内での評価が分かれるくらい重要です。
コメントの1つ1つ返信をするべきでした。

17.今後の展望

1.実務案件に入るので貢献できるように努力したい
共同開発はあくまで練習なので、実務でチームで貢献できるようにしていきたい。

2.フロントエンドの実装もできるようになりたい
今回はBootstrapなどを使った実装ですが、Reactなどを使って実装できるようになって
フルスタックエンジニアを目指していきたい。

3.AWSの理解も深めていきたい
インフラを学び、アプリがどう動いているのかを深く知りたい。
あと、今回はAWSの環境での開発ではなかったのでAWSを使って実務をこなしていきたい

4.開発チームを引っ張っていけるようになりたい
1年以内に独り立ち、3年以内に後輩や他のメンバーに教える立場になり、
5年以内に開発リーダーになっていきたい。

5.業務改善提案なども出せるようになりたい
言われたことを実装するだけではなくて、業務改善なども提案できるようになっていきたい

18.工夫したこと、積極的に取り組んだこと

●リーダーとしての主な取り組み
チーム3名(自分以外は初学者1名、開発経験者1名)、
レビュアー1名で共同開発ではリーダーとして開発経験者と初学者を引っ張っていた。

1.コーディングのアドバイス

2.Gitの操作のアドバイス

3.打ち合わせ時に議事録を作ってメンバーに共有したこと

4.自分のQiitaの発信に影響されて他のメンバーも技術の情報を発信始めた

19.共同開発をきっかけに読み始めた本(リーダブルコード)

この共同開発をきっかけにリーダブルコードを読み直すことにした。
コードの品質にこだわるエンジニアになっていきたい。

20.まとめ

共同開発でのの経験をまとめてみました。
このような記事を書いてみた感想として開始する前と比べ、大きな成長ができたと感じました。
1番はコードに妥協してはいけないことが学びになりました。他の人が読みやすくするだけでなく
1つコードがいい加減になるとそこからどんどんコードが悪くなり、サービスの品質が落ちたり、
後から入る開発メンバーに迷惑をかけてしまます。コードには妥協しないようにしていきたいです。
このような貴重な機会をいただいた講師、開発メンバーに深く感謝致します。
また最後まで記事を見て頂き本当にありがとうございました。

未経験エンジニア必読!実務未経験の時に共同開発で学んだこと(Laravelでの開発)