みんなだいすきLaravel
PHPフレームワークのビッグネームであるLaravel。GitHub上でのスター数は51,559(2019/04/16時点)、Google Trendsでも2013年以降破竹の勢いで人気を醸しているのが分かる。仕事するにあたっても、執筆時点では「WebエンジニアならPHP。Laravel × Vue.jsがベスト」なんて言われてたり言われてなかったり。
まぁ食いっぱぐれないっていう意味でも、紳士の嗜みとしてLaravelを触っておくのはよいかなと思う。デフォルトで使える機能がかなり充実しているし、構造的に改修しやすい。開発もスピーディにできるのでステキである。
というわけで今回はLaravelのいいところをどんどん伝えていこう…とは思っていない。そんなのは世のブロガーが山ほど書いてるし、もううんざりするほど読んでるはず。今回の内容はそういうのではなく、これからLaravelを使おうと思っている人、もしくはもうLaravel使ってるプロジェクトに参画した初心者、そもそもWebアプリケーションって何っていう人向けのアレだ。Laravelのプロジェクトの作り方とかを解説してるわけではないので、そっちは適当にググって解決して欲しい。
長くなった、本題に入ろう。テーマはズバリ、「Laravelがリクエストを受け取ってからhtmlを返すまでの流れ」だ。Laravelを元につらつら書いてはいくものの、ここで書いているのは他のフレームワークにも使える考え方だ(もちろんフレームワーク使わず生で書いてる場合にも言える話だ)。つまり、「Webアプリケーションってどうやってうごいてるんだっけ」っていう部分を理解するために書いてある。だから、これからWebアプリつくるやでっていう人は、此処から先を是非読み込んで、早くLaravelでWebアプリ作れるようになってほしい。駆け出しエンジニアっていうキーワードが人気のようだけど、まさにそういう人に読んで欲しいやつだ。大枠を理解して、げきつよエンジニアになって早くおじさんを助けておくれ〜。
前座: ブラウザからアクセスして画面を表示するまでの動き
いきなりだがここではLaravelは一旦置いておいて、まずは超ざっくりとブラウザからアクセスして画面を表示するまでの動きをみてみよう。図にすると以下のようになる。
意味分かった？「Webサーバー」や「Webアプリ」とか出てきて混乱する人もいるかも知れないけれど、「そういうものがあるんやなぁ」くらいでまずはOK。ここで理解してほしいのは以下の2つ。
- 必ずしも全部の矢印部分を通るわけじゃない
- 同じ経路を複数回通る可能性もある
コレが分かればとりあえずはOK。2については後で触れるとして、1で言っているのは「以下の3つのような流れのパターンがある」ということ。
いきなり「静的」だの「動的」だのいう言葉が出てきて戸惑った？クソざっくり解説するからﾀﾞｲｼﾞｮﾋﾞﾀﾞｲｼﾞｮﾋﾞ(適当)
この2つの言葉の違いは何かというと、「アクセスのたびに結果が変わる可能性があるかどうか」という点。簡単に言うと以下のようになる。
- 静的 … 何度アクセスしても結果が変わらないもの、状態
- 動的 … アクセスのたびに結果が変わる可能性があるもの、状態
この定義のもと上の3枚の画像を見直して見ると、上の3つのパターンは
- 何度アクセスしても結果が変わらないサイト、ページ
- アクセスのたびに結果が変わる可能性のあるサイトのうち、何度アクセスしても結果が変わらないページ
- アクセスのたびに結果が変わる可能性のあるサイトのうち、アクセスのたびに結果が変わる可能性のあるページ
となる。…といわれてもまだよく分からないと思うので、具体例を示してみる。
どうだろう。ちょっと分かった？分からなかった？…まぁいい、ひとつひとつ見ていこう。
まずは1番目から…といいたいところだが、概念の理解には3番目から見たほうが分かりやすいのでそちらから見ていこう。
動的サイトの動的ページ
3番目、つまり「動的サイトの動的ページ」にあたる例は、ワシのTwitterページ。
このページは例えばワシがTwitterで何かつぶやく、もしくはプロフィールの画像を差し替えるたびに表示内容が変わる。これは、呟いた内容やプロフィール画像などをTwitterがデータベースに保存していて、そこから情報を取ってきているからだ。データベースの情報が変われば表示内容も変わる。アクセスするユーザーによっても表示内容が変わることがあるよね。
つまり動的ページは、HTML上にユーザーの情報やツイート情報などといったデータを取ってきて埋め込んだり、ログインしているユーザーによって表示を変えたりする必要があるページだ。ここに必要な情報を取ってきたり、情報を加工して埋め込んだりするのはWebアプリの仕事。だから3番目はこんな感じの流れになるんだね。勉強になった？じゃあTwitterフォローしろ(パワハラ)
それと、例えば1つのページを表示するために複数の情報が必要な場合。例えばログインユーザーの情報と、それとは全く関係ないが今Twitter上でログインしてツイートしているユーザーの情報が必要な場合は、複数回データベースにアクセスすることになる。これはつまるところ、上述の「同じ経路を複数回通る可能性もある」のパターンだ。必要な情報が全て揃った段階でHTMLを返すようにWebアプリが動くというわけだね。
動的サイトの静的ページ
次、2番目。同じTwitterのページだが、こちらは何が違うのか。
さっき「動的ページは、HTML上にユーザーの情報やツイート情報などといったデータを取ってきて、埋め込む必要があるページ」と言ったが、規約ページの内容は誰がアクセスしても同じ内容が表示されるし、いつアクセスしても内容に変化はない。変化があるとすれば、「Twitter社が規約を変更して規約ページのHTMLを書き換えたとき」くらい。Laravelで実際にWebアプリの作成したことある人ならイメージつくかもしれないが、コンパイル前からpublicディレクトリの中に置かれているhtmlファイルがコレにあたる。自前で404ページ作るとき、404.htmlとかはここに置くよね。「何言ってるかわからない」っていう人はそれでもOK。
とにかく、「Webアプリが管理してるページなんだけど、Webアプリが何か情報の処理をしたり、情報埋め込んだりしなくても良いページ」って思ってもらえればいい。
静的サイト、ページ
で最後、GAOGAO gateのLP。「いやいや、静的っていいながらめっちゃ動いてるじゃん！」って思う人もいるかもしれない。でもそれは見た目の話、装飾部分の話。ワシが言ってる「動的」とはちょっと意味合いが違う。静的サイトは何度アクセスしても結果が変わらないと言ったが、それは「コンテンツの中身が変わらない」という意味である。Webサーバーは、アクセスがあったらWebサーバー上にあるHTML/CSS/JSをそのまま返すだけ。何も加工しない。裏側で特に動きがないので静的ページなのだ。
ここまでちゃんと読んでくれてたら、動的と静的の違い、アクセスしてから画面が表示されるまでの動きのイメージはつかめたかな。これでも分からん、もしくはもっと知りたい！っていう人は自分でググれ(投げやり)エンジニアなんだろ、ググり力くらいつけろ。生きるすべだぞ(上から目線おじさん)
とまぁこんな感じで今回は終わり。次はLaravelで実際アクセスをどうさばいてるのかという話をしていこうと思う。じゃあの。