Railsで戻るボタンを実装する方法を現役エンジニアが解説【初心者向け】
初心者向けにRailsで戻るボタンを実装する方法について現役エンジニアが解説しています。Railsで戻るボタンを実装するには、link_toのリンク先を:backに指定します。後はButtonタグやCSSでボタン風に装飾すると完成です。
テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査
Railsで戻るボタンを実装する方法について解説します。
そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。
なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。
今回は、Rubyに関する内容だね！
どういう内容でしょうか？
Railsで戻るボタンを実装する方法について詳しく説明していくね！
お願いします！
戻るボタンとは
ブラウザの戻るボタンクリックや、スマホでスワイプすると前のページに戻ることができますが、ウェブページ内に前のページに戻るボタンを設置することができます。
Railsで戻るボタンを実装する方法
Railsで戻るボタンを実装するには、link_toのリンク先を :backに指定することで実現可能です。
= link_to "戻る", :back
ですが、これだけではただのリンクとなるため、ボタンにするには<button>タグと組合せたり、CSSでボタン風の装飾をするなどの工夫が必要です。
[PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中
実際に書いてみよう
<button>タグと組合せて書いてみましょう。
link_to メソッドはlink_to “表示テキスト”, “リンク先” のように、表示テキストとリンク先を引数で指定できます。
今回のように「戻るボタン」に対してリンク先を指定したい場合にはlink_to “リンク先” do とすることでdo以降の内容に対してリンクを設定することができます。
<%= link_to :back do %> <button>戻る</button> <% end %>
CSSでボタン風の装飾をする方法はここでは解説しませんが、background-colorやborder、border-radiusなどを適切に指定すればボタン風にすることができますので、興味のある方は挑戦してみてください。
筆者プロフィール
| メンター稲員さん
フリーランスエンジニア。 経験言語：Ruby、Rails、Python、C/C++、Java、Perl、HTML/CSS3、JavaScript、CoffeeScript,Node.js。 |
内容分かりやすくて良かったです！
ゆかりちゃんも分からないことがあったら質問してね！
分かりました。ありがとうございます！
TechAcademyでは、初心者でもRuby on Railsを使ったプログラミングを習得できるオンラインブートキャンプRuby講座を開催しています。
挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。
プログラミングを独学で学習していて、このように感じた経験はないでしょうか？
- ・調べてもほしい情報が見つからない
- ・独学のスキルが実際の業務で通用するのか不安
- ・目標への学習プランがわからず、迷子になりそう
テックアカデミーでは、このような
学習に不安を抱えている方へ、マンツーマンで相談できる機会を無料で提供
しています。
30分間、オンラインでどんなことでも質問し放題です。
「受けてよかった」と感じていただけるよう
カウンセラーやエンジニア・デザイナー
があなたの相談に真摯に向き合います。
「自分に合っているか診断してほしい」
「漠然としているが話を聞いてみたい」
こんなささいな悩みでも大丈夫です。
無理な勧誘は一切ありません
ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。（1週間限定）
