演習課題「投稿フォームで名前を表示する」
右の環境には、Sinatraで投稿フォームプログラムが作成してありますが、投稿フォームに名前欄が表示されません。form.erbを修正して、名前欄を表示するように修正してください。
採点して、すべてのジャッジに正解すれば、演習課題クリアです！
※ 採点時は、サーバーを起動し、問題文に関するページにアクセスできる状態にしてください。
＃02:投稿フォームを作ろう
ここでは、WebサーバーとWebブラウザのデータ転送方式であるGETメソッドとPOSTメソッドについて学習します。そのために、Sinatraで簡単な投稿フォームを作ってみましょう。
Webブラウザからのリクエストを送る場合、フォームの情報などがあれば、「GETメソッド」では、URLの後ろにパラメータとして追加します。GETメソッドは、Webページを取得したり、検索キーワードを送信したりする時に使われます。http://example.net/form?article=hello&name=paiza
「POSTメソッド」では、URLとは別に、メッセージボディに追加して送信します。このメソッドは、Webフォームの内容を送信する時などに使われます。http://example.net/form
article=hello&name=paiza
# 投稿フォームを作る
require 'sinatra'
require 'sinatra/reloader'
require 'erb'
get '/' do
erb :form
end
<h1>フォーム</h1>
<form action="/" method="post">
<label for="article">投稿</label>
<input type="text" name="article">
<p></p>
<label for="name">名前</label>
<input type="text" name="name">
<button type="submit">送信する</button>
</form>
- [GETメソッドとPOSTメソッドの違い | 酒と涙とRubyとRailsと]
http://morizyun.github.io/blog/get-post-method-compare-parameter/index.html
- [HTML/CSS入門編3: HTML要素を学ぼう | paizaラーニング]
https://paiza.jp/works/html/primer/beginner-html3
- [基本的なフォーム -- ごく簡単なHTMLの説明]
http://www.kanzaki.com/docs/html/htminfo31.html
- [初めての HTML フォーム - ウェブ開発を学ぶ | MDN]
https://developer.mozilla.org/ja/docs/Learn/HTML/Forms/Your_first_HTML_form
- [Code of Resistance!!: SinatraでWebリクエストを取得してみる。]
https://daruiapprentice.blogspot.jp/2015/05/sinatra_15.html
- [Code of Resistance!!: Sinatraで入力フォームのデータを取得する。]
https://daruiapprentice.blogspot.jp/2015/05/sinatra_18.html