Laravelのポートフォリオサイトを公開しました

Laravelのポートフォリオサイトを開発したので、色々まとめます。約1年ぶりの投稿になりますが、お付き合いくださいませ(^-^)

 

 

 

サイトURL→https://www.life-changing-movie.net

Githubのリポジトリはこちら→https://github.com/Wataru9029/life_changing_movie

開発理由

自社開発系企業での採用を勝ち取るためです。

 

一応、昨年10月からWeb制作会社でインターンしていたのですが、典型的なレガシー企業でした。具体的には、

  • バージョン管理をしていない(Gitを使わない)
  • コードレビュー文化がない
  • VagrantやDockerは使わず、ローカルで開発し、FTPソフトでそのままアップロード

といった感じ。

コードこそ書かせて頂けたものの、これ以上働いてもスキルが向上しないと感じたので、自社開発系企業で働こうと思いました。後はWordPress案件や得意でないフロントエンドの仕事を多くやらされたことも、転職理由の一因です。

 

言語/FWに関しては業務でも使用していたPHP+Laravel一択。一通り法人向けWebサイトを作ったことはあるので、Docker、Github、WebAPI辺りの勉強も兼ねて、基本的なCRUD機能を備えた基本的なメディアサービスを作成することにしました。

 

サービス概要

一言で表すと「人生を変えた映画を投稿できるWebサイト」です。

 

取り立てて作りたいサービスがなかったので、シンプルなメディア系Webサービスを開発することにしました。基本的には”KENTA / 雑食系エンジニアTV“さんの動画を大いに参考にさせて頂きました、有益な情報ありがとうございます↓

 

また、マナブさん(https://manablog.org)の「あなたの人生を変えた本(https://change-life.io)」からインスピレーションを強く受けており、僕の場合は”人生を変えた映画”をテーマにしてみました。+αとして、映画用のWebAPIを導入してみたり、Laradockを使ってみた感じです。

 

使用技術・ツール・API

  • フロントエンド:HTML/CSS, Bootstrap, jQuery
  • バックエンド:PHP/Laravel
  • バージョン管理:Git
  • リポジトリ管理:Github, Sourcetree
  • 開発環境:Docker
  • サーバー(Webサーバー):xserver(Apache)
  • DB:MySQL
  • API:OMDb API

みたいな感じです。

 

全体的なデザインに関してはBootstrapテンプレートを使用しました。0からコーディングまでしていたら相当時間掛かっていたと思うので、本当に有難い

https://startbootstrap.com/themes/agency/

 

行きたい会社さんではDockerを採用しているようなので、今回初めて使ってみました。Vagrantは使ってましたが、Dockerは初めてだったので勉強になりましたね。

とはいえLaradockをgitクローンしてから設定ファイルを少しいじるくらいだったので、1日掛からず環境構築できました。この辺りが参考になったです

https://qiita.com/kurkuru/items/6ce0b9c4632b944347b8

 

Gitも業務ではほぼ使わなかったので、Sourcetreeに頼りつつ、開発ブランチを切ったりしてみました。プルリクとかはさっぱりなので、一度ざっくり勉強してみようかなと。普通の会社さんなら共同開発で必須でしょうし。

 

後サービスの性質上、映画情報を取得してくる必要があったので、WebAPIを組み込むことにしました。これまた初めての経験です。

http://www.omdbapi.com

Amazonか楽天のAPIを使おうと思いましたが、「OMDb API」が簡単そうだったので採用。クエリーを渡せばjsonデータが取得でき、ポスター画像やタイトル含め、各種情報が返って来る感じです。めっちゃ簡単でした。

が、英語タイトルでの検索しか出来ないため、日本語対応させるには別のAPIと掛け合わせる必要がありそうです。

 

主な機能

  • 記事一覧表示機能
  • 記事投稿機能
  • 管理ユーザー登録機能
  • 管理ユーザーログイン機能
  • 画像ファイルのアップロード機能
  • DBテーブルのリレーション機能
  • DBトランザクションの制御機能
  • ページネーション機能
  • いいね機能

みたいな感じです。

 

単体テスト、統合テストを書いていないことが不安材料の一つなので、ググりつつ、主要な機能に関してはテストコードを追加で書いてみようかと思っています。

 

一度実装してみたかったので、いいね機能実装してみました。思ったより簡単だったので、後はjQueryで非同期通信できるようにしようかなと。SNSログインも「Socialite」というライブラリを使えば実装できるので、余力があれば追加予定です。

 

開発を終えた後の所感

私事ですが人間関係でのいざこざがあり、集中して時間が取れず、実質1~2週間くらい掛かりました。本腰入れてポートフォリオサイトを作ったのは初めてだったのですが、新しい機能やツールを導入したわりには、それなりにスムーズだったかなと。

 

今回「自社開発系企業での採用を勝ち取る」という強い動機があったため、完成させることができ、自走能力が結構養われたと思います。Progateやドットインストールは素晴らしい教材ですが、1番スキルは伸びるのは成果物を作ることですね、ほんとに。

 

というわけで、こちらを携えて面接受けて来ようと思います。前職は「未経験採用」の文字に釣られ、レガシー企業で半年無駄な時間を過ごしてしまいましたが、今回は狙ってる企業に潜り込めるように頑張ります!

 

とはいえ、実際に働き始めるのは最短でGW明け〜中旬とかなので、それまでLaravelのテストかGo、Swiftにめちゃくちゃ興味あるので一通り触ってみたいなあと。

 

そんな感じでした( ´ ▽ ` )ノ