ヤマカサのプログラミング勉強日記

プログラミングに関する日記とどうでもよい雑記からなるブログです。

[N予備校]【2019年度】プログラミング入門 Webアプリその１２

N予備校

【2019年度】プログラミング入門 Webアプリ

やっている内容が僕には高度なので大変ですが、頑張ります。

第3章サーバーサイドプログラミング

14. HTML のフォーム

HTML の form タグを使ってアンケートを作成し、POST メソッドでデータを送信しました。

15. テンプレートエンジン

Pug というテンプレートエンジンを使ってページを制作しました。変数を使うことでフォーマットが同じようなページを複数作ることが簡単にできるようになりました。

<!DOCTYPE html>
<html lang="jp">
<head>
   <meta charset="UTF-8">
   <title>アンケート</title>
</head>

<body>
    <h1>どちらが食べたいですか？</h1>
    <form method="post" action="/enquetes/yaki-shabu">
        名前: <input type="text" name="name">
        <input type="radio" name="yaki-shabu" value="焼き肉" /> 焼き肉
        <input type="radio" name="yaki-shabu" value="しゃぶしゃぶ" /> しゃぶしゃぶ
        <button type="submit">投稿</button>
    </form>
</body>

</html>

doctype html
html(lang="ja")
  head
    meta(charset="UTF-8")
    title アンケート
  body
    h1 どちらが食べたいですか？
    form(method="post" action="path")
      span 名前:
      input(type="text" name="name")
      input(type="radio" name="favorite" value=firstItem)
      span #{firstItem}
      input(type="radio" name="favorite" value=scondItem)
      span #{secondItem}
      button(type="submit") 投稿

感想

なかなか進まないし、理解が追いつかないです。