はじめに
ポートフォリオとして、タスク管理ができる。Todoアプリをつくりました。
以下の技術を選定したので以下で説明していきたいと思います。
技術選定を中心に書いていこうと思います。
機能
- CRUD機能
- カテゴリーごとにタスクを見ることができる機能
- LINEのアカウントでログインできる
- LINEに作ったタスクをチャットボットとして投げることができる。
使用技術
フロントエンド:HTML5 CSS TailwindCSS-Daisyui
バックエンド:PHP 8.1.2 Laravel9 Breeze
インフラ:Docker nginx MySQL8.0 / phpMyAdmin ConoHaVPS
デプロイ:Laravel forge
技術選定理由
フロントエンド
フロントエンドは、TailwindCSSを採用しました。
TailwindcssはCSSのフレームワークです。
なぜこれなのか、理由は以下です。
- クラス名を考える時間を抑えたかったから。 → クラスに意味のわからないものを当てるのはアンチパターンですよね。TailwindCSSが提供しているものを使うことで、クラス追加するだけで定義が可能になります。
- クラスに直でHTMLに書き込むことができるため
圧倒的にコードの記述量が減っていいなと実感しました。
自分が使ったものは以下になります。使いたい方どうぞ笑
バックエンド
バックエンドはLaravel9 (Breeze・Vite)で実装しました。
なぜこれなのか、理由は以下です。
- WordPress→PHP→Laravelと学習していたので、とっかかりが早かったことです。(学習コスト削減)
- 当初、Laravel6で作っていましたが、リリースされた時にはBreezeと呼ばれるものが出た。(技術的挑戦)
- MVCモデル最強すぎでしょ笑 → どこでどんな責務をしているのかが明白で良いと思いました。 (モデルでデータベース保存関連の処理だけ行うなど..etc)
インフラ
[開発環境はxamppからDockerに]
- 作って破壊が楽(スクラップ&ビルドが楽) → 右も左もわからない自分が、とりあえずこれは、ここでいいのかなとか、ボリュームってこれであってるなど、試行錯誤できるのがすごくよかったです。
- 仮想マシンと比較して軽量で、作業が効率的 → コマンド一つでサクッと立ち上がるのがいいなと思いました。
- 技術的トライをしたかった → クロスプラットフォームのxampp様にお世話になっていましたが、PCをMacにした時に使ってみたいなと思い、チャレンジしました。(習得に1年かかりました笑)
[EC2 → ConoHaVPS]
- ブログのサーバーでConoHaを使っているため(学習コスト削減) → ちょうどキャンペーンをやっていて、月の運用がとても安かったのもあります。(個人利用は○)
- 従量定額課金制のEC2で高額請求がきたため → 逆求人イベントの際、自分のアプリを色々な企業さんに触っていただきました。それはいいのですが、翌月の請求が7000円になっているのに気づかず、請求アラートを無視`していました。怖くなって、ConoHaに変えました笑 (料金設定関連に、もう少し詳しくなりたいので勉強中です。)
デプロイ
- 公式の海外サービスを使ってみたかった → CI/CDツールは様々あると思いますが、日本語の説明が少ない純正ツールにトライしてみたくやってみました。
- サービスプロバイダ、複数から選べる → Digital Ocean、AWS、conoHaVPSなど色々試せる自分にはうってつけでした。