IT技術

【Laravel入門】Formの書き方

前回の記事「効率よくLaravelを勉強する方法」でお話したことについて、今回は少し掘り下げてお話していきます。

具体的には、「勉強すべき順序」についてのお話です。

「作る」部分について優先的に勉強しましょうという旨のお話をしましたが、その「作る」部分の中でも様々な機能があります。その様々な機能の中で、Webアプリケーションで必須と言っても過言ではないフォームについて今回はお話していきます。

HTMLタグを使ったフォームの書き方

フォームの書き方には何種類かあります。
まずはその中でも一番簡単なHTMLタグを使った書き方を見てみましょう。

 

<form method="post" action="test.php">
<input type="text" name="inputbox">
<input type="submit" class="submit-btn" value="登録">
</form>

 

Webについて少し勉強している方なら簡単に理解できるかと思います。
formのデータはtest.phpへとPOSTされるという動作になります。

Laravelにおけるフォームの書き方

では、次にLaravelではどう書くのでしょうか。
前回の記事でご紹介した「はじめてのLaravel5.6」ではこのように表現されてます。

 

{!! Form::open(['url' => 'test']) !!}
{!! Form::text('inputbox',null) !!}
{!! Form::submit('登録', ['class' => 'submit-btn']) !!}
{!! Form::close() !!}

 

HTMLで書いたものとかなり違いますね。
でも、実際ブラウザで表示させてみると、HTMLで書いたものと同じになります。

初めてフレームワークに触れる方はこの書き方になかなか慣れないと思います。
私もまだ全然慣れてなくて、出てくる度に意味を調べながら書いてます(笑)

ちなみに、この書き方は「LaravelCollective」というパッケージを使った書き方になります。

Laravelにおける表現方法の法則を見つける

この4行だけのコードだけではわかりづらいかもしれませんが、「はじめてのLaravel5.6」を進めていると表現方法の法則性が見えてきます。
例えば、変数を別メソッドに渡す時、通常のPHPではメソッド名($変数名)のように記述してましたが、Laravelの場合メソッド名(‘変数名’)といった記述で表現されています。
また、メソッドに引数を渡す時は[ ]で囲って表現されています。

このフォームを表現するコードを見てみると、openとcloseで囲まれているのは<form></form>にあたるのだとわかりますし、[‘url’ => ‘test’]はPOST先のURLを示しているんだとわかります。
つまり、openメソッドを呼び出して、引数でPOST先を指定することによってそこからHTMLタグに変換してるんだと予測ができます。

このような感じで、一見訳がわからないような記述でも、一度ブラウザに表示してHTMLと見比べてみることで法則性を見つけてそこから理解へと落とし込むことができます。

最後に

このフォームの記述方法は学び始めたばかりの人にとって1つの鬼門になるんじゃないかなと勉強していて感じました。私もまだ結構理解が怪しいです(汗)
ぱっと見では確かに複雑に見えて全然わかりませんが、表示されたものとコードを見比べることで仕組みを理解することができるので、諦めずに頑張りましょう!

独学で勉強するのがつらいと感じてませんか?

わからない部分があるとき、誰かに質問ができると効率よく勉強を進めることができるようになります。

TechAcademyであれば、1週間無料でプログラミングスクールの体験をオンラインで受けることが可能です。

この期間に詰まっている部分の質問をするのもいいですし、プログラミングスクールの雰囲気を体験するのもいい刺激になるので、とりあえず試してみるのもありかなと思います。

>> TechAcademyの無料体験はこちら

どこからでも開発できる環境を作りませんか?

ConoHa VPSを使えば、クラウド上に自分だけの開発環境を構築することができます!

ConoHa VPSのメリット
  • 1回環境を作ればマシン毎に作り直す必要がなくなる
  • 開発途中のコードを外出先からでも簡単にいじることができる
  • 従量課金制で使うこともできる
  • 従量課金制で使った場合でも上限を超えることはない
定額プランでも月額620円から使うことができるので、コスパ最強!
\今なら初期費用無料/

ConoHa VPS公式ページ >>