Laravelで新しいアプリを作成した記録
お題:「もう一つアプリを作ってください」
またまた新しいお題が出ました。「もう一つアプリを作ってください。」とのこと。
今回は要件定義からスタートです。
レビューをしてもらった結果、内容が盛りだくさんすぎたため、1週間で開発できるレベルまで機能を削ることになりました。
ふと思うと、1週目で作ったアプリよりも理解が深まっているな、と感じています。
振り返り: 1週目のラフな作り方
1週目はひたすらGPTに聞いてはコピペを繰り返していました。
その結果どうなったかというと……。
- 「blueprint」を「bluepoint」と読み間違えるなど、基礎的な部分での理解が浅いまま進んでいた。
- GPTのコードは動くから問題ないけど、書いたり話したときに「あれ?」となることが多々あった。
新しい作業フローを試す
そんな反省を踏まえ、今回は作業フローを変更しました:
- GPTに質問 → コード生成。
- 生成されたコードをしっかり読む。
- 分からない箇所は追加で質問。
- 納得したら手で模写(コピーせずに自分で書く)。
これ、めっちゃ良い!
手で書くことで、「さっき理解した内容」を復習できるから、すぐ忘れてもまた確認できる。2度美味しいフローだ。
と思ったが、すでに掲示板で少し書き方を見ている可能性もあることに気がついた。
慣れてきていることにはかわりない。
環境構築スタート!
早速、作った要件定義とシステム設計書をGPTに投げつつ進めた。
まずは環境構築の確認から。
確認した項目
- PHP → 動作OK。
- Composer → Laravelプロジェクト作成に必須。
-
Node.jsとnpm:
- Node.jsって、サーバーサイドでJavaScriptを動かせる。
- npmはVue.jsとかReactとか、ライブラリを管理するツール。
- Git → バージョン管理。
Node.jsって結局なに?
ここでちょっと脱線。
- Node.jsは「JavaScriptをサーバーサイドで動かせるもの」。
- PHPでショッピングサイトを作ったときには使っていなかった。
- だから「Node.jsってどういう時に使うものなんだ?」という疑問が湧いた。→Progateで少し触ってみている。
今の理解
- まだ「へー、こう書くんだ」程度の浅い理解。
npmとViteについても少しだけ調べた
-
npm (Node Package Manager):
- Vue.js、React、Bootstrapをインストールして管理するツール。
-
Vite:
- ビルドツールで、Laravelではフロントエンドの最適化に使う。
- 圧縮や統合をして、動作を早くする役割があるらしい。
PHPとNode.jsを比べてみた
調べていると「サーバーサイドでJSを動かす?」という話題に。
「え、PHPもサーバーサイドで動くじゃん。じゃあ重複してるの?」と思ったら、以下のような違いが。
PHPの特徴
- 同期的な処理: リクエストを1つずつ順番に処理。
-
Webサーバーとの連携: ApacheやNginxと連携して動く。
- 過去にPHPでXAMPPを使った経験がある。
Node.jsの特徴
- 非同期的な処理: 複数のリクエストを同時に処理可能。
- 自分でWebサーバーを作れる: JavaScriptでHTTPサーバーを構築できる。
今Laravelを使っていてApacheとか使ってないからJavaScriptでサーバー構築してるのかな?と思ったら違った。
「php artisan serve」というコマンドで簡易サーバーが立ち上がることを知る。
Laravel環境構築手順
-
Laravelプロジェクトを作成
composer create-project --prefer-dist laravel/laravel calorie-busters
-
ディレクトリを移動
cd calorie-busters
-
簡易サーバーを起動
php artisan serve
気づき
- PHPもNode.jsも同じサーバーサイドの処理ができるけど、得意分野が違う。
- 違う発見があるな笑
- npmやViteの役割も少し分かってきた。