実務未経験者 共同開発2ヶ月間まとめ

1.はじめに

PHP、Laravelを学習し、LAMP環境での共同開発に参加しました。
共同開発の2ヶ月間をまとめて学んだことをアウトプットします。
これから共同開発に参加する方の参考になれば幸いです。

共同開発で行ったこと

• 環境構築（LAMP環境）
• GitFlow
• 開発
• 企画（オリジナル機能）
• テスト
• デプロイ

2.自己紹介

• 前職は某メディア会社で営業、企画・編集（紙、Web）
• 学習期間3ヶ月(5/8時点)
  • Progate 1.5ヶ月
  • PHP学習 0.5ヶ月
  • LaravelでWebアプリ開発 1ヶ月
• 転職に向け学習中
• 実務未経験

3.共同開発の概要

概要

• 開発期間:2ヶ月（5/8〜7/7）

  • 全体MTG 週1
  • 講師主催の作業会 週1
  • チームMTG 週1

• 構成メンバー

  • 講師:現役プログラマー2名(レビュアー)
  • 開発チーム：未経験3名　×　3チーム

4.成果物について

ネット大喜利サイト「GiriGiri」を共同開発しました。

お題と回答が投稿でき、更にフォローやイイねすることもできます。（要ユーザ登録）
閲覧だけなら誰でも可。

トップ画面

お題投稿画面

回答投稿画面

ユーザー詳細画面

成果物URL
https://girigiri.fly.dev/

5.タスク・スケジュール管理

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

6.環境

テキストエディタ
VSCode

インフラ
Docker
phpMyAdmin(mysqlの管理ツール、DBをプラウザ上で確認)

サーバーサイド
PHP 7.4.33
Laravel Framework 6.20.44

フロントエンド
HTML
CSS
Bootstrap

管理ツール
GitHub

デプロイ
fly.io

7.GitFlow

GitHubを使用して共同開発を行いました。

• mainブランチは使用しない
• チームのdevelopブランチから機能ごとにブランチを切る
• feauture/ota(開発者の名前)/(追加機能名等)でブランチを切り、各自開発
• プルリクを出し、講師がレビュー、マージ※
• 適宜developをマージしてコンフリクト解消

※流れ

1. 機能が完成したらチームのdevelopブランチへpush
2. プルリク、Slackで講師へ連絡
3. 講師がコードレビュー
4. 修正、指摘があれば修正後、再度push
5. 問題がなければ、講師がdevelopへマージ

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

8.開発

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

• users（ユーザ）テーブルのマイグレーションとシーダー作成　
• posts（投稿）テーブルのマイグレーションとシーダー作成　
• 共通ファイル作成　
• ヘッダー・フッター & トップページのみ表示
• ユーザ新規登録　
• ユーザログイン・ログアウト　
• バリデーションメッセージの日本語化　
• トップページの投稿表示　
• ユーザ詳細　
• ユーザ編集画面・更新　
• 投稿新規作成　
• 投稿削除　
• 投稿編集画面・更新　
• ユーザ退会　
• フォロー機能　
• コメント機能
• イイね機能
• ユーザー詳細ページのタイムライン変更（投稿、コメント、フォロー中、フォロワー、イイね）
• フラッシュメッセージの実装
• 全体テスト〜修正　
• Flyデプロイ

自分が実装担当したものは以下でした。
　★★は途中追加した機能

1.users（ユーザ）テーブルのマイグレーションとシーダー作成　
2.　ユーザ新規登録　
3.　トップページの投稿表示　
4.　投稿新規作成　
5.　投稿削除　
6.　フォロー機能　★★
7.　コメント機能　★★
8.　イイね機能　★★
9.　ユーザー詳細ページのタイムライン変更　★★（投稿、コメント、フォロー中、フォロワー、イイね）
10.　全体動作テスト〜修正
11.　Flyデプロイ

9.テスト

４つのテストを実施しました。

1. 画面遷移テスト(画面が想定通り遷移されるか)
2. レイアウトテスト(レイアウト崩れがないか)
3. バリデーションテスト(バリデーションエラーが正しく表示されるか。または設定したバリデーション通りになっているか)
4. URLテスト(URLを直接に入力した際におかしな挙動をしないか)

10.デプロイ

以下ツールを利用してアプリケーションの公開を行いました。

利用インフラ
Fly ---- 開発したWEBアプリケーションを公開するためのサーバー等を提供するサービス（無料）

デプロイアプリ
https://girigiri.fly.dev/

11.共同開発で良かったこと

①Gitを使った共同開発を経験できたこと​

• GitFlowを経験​
• 通常のGit操作では困らなくなった​

特によく使ったコマンド
git branch
git status
git add .
git commit -m"#000 イシュー名＋メモ"
git push origin feature/ota/イシュー名
git cheakout develop_team_c
git pull origin develop_c_satsuki_rab
git cheakout -d feature/ota/イシュー名
git checkout .
php artisan migrate:fresh --seed
composer dump-autoload

②週３回のMTGに向けて作業を止めず進められたこと​
-　次回までに完了させるタスクを細分化して期日を決めて進行した
-　リモートでの開発業務を擬似体験できた​（Git,Slack,zoom,meet)

③​講師やチームメンバーの存在​
-　講師に褒めてもらえたり、メンバーの進捗状況が共有できるので気持ちが途切れなかった

12.共同開発で大変だったこと

共同開発において大変だったことと、自分の対策について紹介します。

①エラーの対応

②フォロー機能の実装（多対多）

①エラーの対応

起きたエラーに対応に試行錯誤しているうちに別のエラーが出るなど、はじめはエラー解消に1時間以上かかることも何度かありましたが、1ヶ月ほどで、主なエラーのパターンも見慣れてきて、変数名や関数名の間違いが原因であることが多いと気づきました。

手を動かすうちに、MVC＋ルーティングの構成や、変数名も頭に入ってきたので、焦らず原因を探せるようになりました。

特に多かったエラーパターンと対応

Undefined variable: ○○○ ～
「○○○という変数が定義されていません」→変数名を間違えているか、変数の記述漏れ

Call to undefined method ～
「未定義の関数が呼び出されています」　→ 関数名を間違えている

Parse error: syntax error, unexpected ～
「構文・文法エラー」→セミコロンの記入漏れ、カンマやカッコが抜けている

Trying to get property ‘○○○‘ of non-object ～
「プロパティが存在しません」→「$変数->○○○」の「$変数」自体がない、「○○○（プロパティ）」が定義されていない

②フォロー機能の実装（多対多）

フォロー機能は特に記述内容が多く、着手からマージまで2週間かかりました。

一度完成した後に、ビューファイルで記述が似た箇所は@includeで共通化するようレビュアーから依頼があり、Controllerの変数名を共通にするなど試行錯誤した結果、数日かかりました。

そのおかげで、後でコメントへのイイね機能を実装する際は、2日で実装完了できました。

実装したコードについても、別の記事でまとめたいと思います。

13.今後に向けて

今後は開発実務案件に2ヶ月（7/18〜９/17）参画する予定で、その後就職活動を行います。

これまではviewファイルも含めての実装でしたが、今後はバックエンドに専念（フロントエンドは専属がいる）するので、json形式のリクエスト・レスポンスなど、環境の違いに早く慣れていきたいです。

また、開発するWebアプリのER図や変数名を早めに理解して、エラーやコンフリクト解消も落ち着いてできるようにしたいと思います。