Progate PHP学習レッスンⅠ (2回目④)

Sans

こんばんは。
一日お疲れ様です。
今日もProgate先生からPHPを教えて貰います。
一昔前だと、何かを勉強しようと思ったら、本での学習を除いては教室までいかないと勉強できなかったですが、便利な世の中になりました。
Progate先生はブラウザからアクセスしたら、いつでもどこでも教えてくれるのでドラえもんみたいな存在です。
たまに分からないところがあるのは自分の理解力の問題なので精進します。

以下勉強メモです。

PHP学習レッスンI

  • 20.formタグ

    • フォームを作る時には、はじめにHTMLの<form>タグを使う。

    • formタグにはaction属性とmethod属性があって、action属性には送信先を、method属性にはgetかpostを入れる。

    • この時点で意味が分かりません、先生。なんでurl入れるの？なんのurlを入れるの？

    • こんな時は、Google先生にも聞いてみよー。

    • なんか、それっぽいの出てきた。(*1)

    • ざっくり、解釈してみると、メール送信はHTMLとは別のWebサーバーかプログラムから行う必要があるらしく、メールプログラムが存在するサーバーのurlを入れるっぽい。

    • まだ、methodのgetとpostの使い分けが分からない。どうやら送信される値がurlに表示されるかされないかの違いがあるようだが・・・。

    • サイトには、そこの違いも説明してくれている(*2)

    • 確かにurl見える見えないの差がある為、データ送信する場合にはpostの方が安全そう。getはサーバーデータを取得する時に使うっぽい。

    • 自分が理解できなかったのは、メールを送るサーバーが独立して存在していることを理解できていなかったから。CGIプログラムはHTMLで書かれている場所とは別の場所にある。

    • 5年前の記事・・、書いてくれた方ありがとうございます！

    • HTMLの表記だからか、<form action="url" method="post or get">フォームの内容</form>と書かれていて、;や.は存在しない、割と見やすい書き方

    • 演習問題 : action = sent.phpになっている。メールサーバーで無く、phpのプログラムに値を渡す為の表記と理解。この時はフォームの内容もいらなさそう。

(*1)
action属性
・formタグに指定する属性で、必ず指定しなければならない
・フォームの送信ボタンを押して送信されるデータの送信先を指定する
データの送信先のことをURIという
・指定するのはデータを受け渡す処理をしてくれるサーバーのCGIプログラムのURI
CGIプログラムCommon Gateway Interface(コモンゲートウェイインターフェイス)の略
・CGIとはWebサーバーかプログラムを実行するときのルールのこと
・CGIの仕組みによって起動されるプログラムのことを主にCGIプログラムという
・メールフォームの場合は、メールフォームに入力されて送信されたデータを受け取ってあとの応答をCGIプログラムで処理される
・CGIプログラムはRubyやJava、C言語など様々なものを使用して記述できる

formタグのaction,method属性の使い方と特性〜html,slimでの記述方法〜
https://qiita.com/miku66/items/f3126380d3340f3d8a2b

(*2)
■method属性-post
formタグのmethodをgetに指定すると、入力したフォーム内容はURIとは別の場所に保管されてデータが送信される
・入力したフォーム内容のデータは外側からの表示では見ることができないので安全性が高い
■getとpostの違い
・getには送信するデータ量の制限がある
・getは送信したデータ内容が送信先のサーバーにログとして残ってしまうことがある
・postには送信するデータ量の制限がない
・一概には言えないがgetはサーバー側にあるデータの取得に適している
・一概には言えないがpostはユーザー側が情報を送信するのに適している

formタグのaction,method属性の使い方と特性〜html,slimでの記述方法〜https://qiita.com/miku66/items/f3126380d3340f3d8a2b


  • 21.テキストボックス

    • テキストボックスを作る時には<input type = "text">の構文を使う。

    • name属性には入力された値を取得する時に使用するとのこと。

    • <input type = "text" name="email">

    • 入力されたemailの値がnameに格納される。

    • このnameに格納した値をPHPに渡したり、メールサーバーに渡すんだろう。きっと。

    • 難しいのきた。

    • やっていることとしては、さっきの<form action = "sent.php" method =""post> </form>の間に<textarea name ="content"></textarea>が入っている。よく理解できない・・。

    • 改行を含む文章の為のテキストボックスと書いてあるので・・、文字通りemailみたいに1行文章でなく、何かコメントとか感想残す時に必要なタグになるのかな。きっと。

    • 演習 : 早速インプットタブの書き方忘れて、スライドを見る。inputタグは閉じタグいらない。いきなり、typeとnameに入れる。textareaのタグも見ながらじゃないとかけず。textareaは閉じタグがいる。閉じタグいるものと要らないものの差がよく分からない。

    • 調べてみると、void要素と呼ばれるものらしく特に重要なものとして6種類あるらしい。(*3)

    • こういったことまとめてくれる人、凄いよな～。全てに手が届くというか・・。

閉じタグのない「void要素」の一覧(*3)
★br
★hr
★img
★input
★link
★meta
その他（area, base, col, embed, param, source, track, wbr）

【初心者でもわかる】HTML（HTML5）で閉じタグがいらない要素の一覧
https://naruweb.com/coding/endtag/

  • 22.$_POST

    • <input type = "submit" value ="送信">に関する勉強

    • valueに入力した値がボタンに表示されるとのこと。

    • ボタンの名前を決めるところ。

    • その手前に<input type ="text" name ="email" value ="">と書いてあるinputタグがあって、このvalueに入力された情報をsubmitで送っているよう。

    • さらにそれをform actionで囲って、送信先をsent.phpにしているところを見ると、このformの中で、入力されたemailアドレスをphpに送るみたいな機能を果たしていそう。

    • やばい・・、配列と一緒に難しいの出てきた。PHP側に移ったからか。

    • 頑張って理解しよう。

    • ここで、本題となる$_POSTの登場。

    • $_POSTは受け取る時に使う

    • 何を受け取るかというと、さっきHTMLフォームで書かれた名前とかemailアドレス。postされたやつ。

    • よく考えたら、どっちもpostか、大文字と小文字の違いはあるけど。

    • 二つの情報(emailアドレスと名前)があるので、連想配列として扱っている。form内のインプットの数増やしたら、その分配列数増えるって感じなのかな。

    • よくよく見たら、$_POSTの中身がというかそれ自身が連想配列になっている。ようやく追いついてきた・・。

    • HTMLのinputタグで入力した時の属性値が、PHPの$_POSTに渡されるとkyeになっていて、HTMLでフォームに入力された値がPHPのvalueになっている。ここで受け渡しているのね。なるほどー。

    • 演習 : phpに書き込むとき<?php ?>を入力してないの、progateさんに注意された。ありがとう。

    • 演習 : $_POSTは連想配列だから[""]で囲まないとダメ！

  • 23.セレクトボックス

    • 選べるって良いよね

    • 人生を選びたい。

    • <select></select>の中に<option></option>を入れる。

    • オプションはどうなさいます～という感じのイメージを持った。

    • PHPが絡んでくると複雑になる・・。

    • selectタブもphpにデータを送るformに囲まれているよう。

    • $_POST(連想配列)に渡してあげる為に、keyとvalueに対応付ける属性が必要になっているのかな。

    • selectにはnameをoptionにはvalueをそれぞれ設定している。

    • selectには箱の名前が、optionには実際の中身が入っているとよと$_POSTに教えてあげている感じか。

    • 演習 : スライド見ずに一発合格！

  • 24.フォームを完成させよう

    • ついに来た・・。2回目の最後。次こそは

    • 繰り返し処理と変数展開で多数のoptionタグを作る

    • 例文を見ると、for構文使って、option valueをエコーしまくってる。

    • ここでややこしいのが、echo先の<option value>・・・は変数展開する為に、""を使うけど、value='{$i}'はシングルコーテーションで囲んでる。

    • phpの中で受け取った値をechoしまくっている理由が今一つ分からない・・・。調べてもさっと分からないので・・、一端スルーして演習へ

    • 演習に来て分かった・・・。optionタグをHTML内に量産する為だ。HTMLはマークアップ言語でforとか使えないから、phpの力を借りて、optionタグ量産してる。echoするとprintみたいに表記されるからそれでecho連発してたんだ。

    • echoのあとに"入れると、下が一気に色変わるから怖い。

    • forの力偉大過ぎる。one noteの整理とかでも使いたい・・。

    • <option value =""></option>のタグについて、valueの表記を忘れない。value大事。

    • foreach文との再会

    • スライド見ないと書けなかったが、次はパット思い出せた。

    • .なんだっけと思って、機能のnote見直したら、結合演算子ちゃんと調べてた。昨日の自分ナイス！ただ、今回は使用しない。分からない時にスライドに戻してくれる、progate先生に感謝。結合演算子思い出せました。

    • <?php ?>をちゃんと書き忘れなかったことをほめてあげたい。(誰もいってくれないので）

    • echo $_POST[""];は;ついてたっけとスライドを見直す。HTMLのタグにはつかない記号だからどっちだっけって思ってしまう。PHPでは;忘れない。

    • 無事クリア！

学習範囲 : PHP学習レッスンI 19～24
学習時間 : 19:29～21:39(2時間10分)
備考 : 2周目するとき、Noteに書きながら勉強してほんとに良かったと思います。なんだっけと振り返るときちんと調べた履歴も残っているので。あと、分かりにくいところは、いろんな先生が解説してくれているので助かります。

この記事が気に入ったらサポートをしてみませんか？