今回のパートではViewportを追加してスマートフォン用のサービス開発環境を整えていきます。
- Viewport - デベロッパーツール
Viewportを導入することでスマートフォン用のスタイルを適用できます。
app/views/layouts/application.html.erbに以下のコードを追加してください。
app/views └── layouts └── application.html.erb
これでviewportの設定は終わりです。
下記の動画のように
http://localhost:3000/ を開いて、メニューバーを開き検証を押してください。
するとデベロッパーツールが出てくるので、デベロッパーツールの左上にあるToggle devise toolbarを押すと、スマートフォンサイズのviewが表示されるようになります。
今回のカリキュラムではスマートフォン用に見た目を整えているので、上記の手順でデバッグしてください。
0 質問