Memorandum of Chapter 5
Rails 6.0.3 Ruby 2.6.3
1 Rails Helper 2 BootStrap introduced 3 partial 4 Asset Pipeline 5 Route URL explanation 6 Layout link test commentary
1.1 link_to
<%= link_to "Sign up", signup_path, class: "btn btn-lg btn-primary" %>
The first argument is the link text The second argument is the URL The third argument is an optional hash (not required) Finally a tag is generated
1.2 image_tag
<%= link_to image_tag("image.jpg ", alt: "image", width: "300px"), "https://example~~.com/" %>
If you want to use images, add the image_tag helper.
Arguments are the image file path and any optional hash (this time alt and width)
The last URL will be the link when you click. The Rails tutorial is set to jump to the official website.
** Keep images in the `app/assets/images /` directory! !! ** **
Added bootstrap-sass to Gemfile
Gemfile
gem 'bootstrap-sass', '3.4.1'
Run bundle install to install Bootstrap
bundle install
Add Bootstrap CSS to your scss file
app/assets/stylesheets/~~~.scss
@import "bootstrap-sprockets";
@import "bootstrap";
3 partial By dividing the code into units and managing them in each file, readability and changes can be facilitated. This feature is called partial in Rails.
:app/views/layouts/_header.html.erb
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
.
.
</div>
</header>
There is a naming convention that puts an underscore at the beginning of the file name to be divided.
app/views/layouts/application.html.erb
.
.
<body>
<%= render 'layouts/header' %>
<div class="container">
<%= yield %>
</div>
</body>
</html>
When adding a partial, use the render helper.
It also looks for the `app/views/layouts/_header.html.erb``` file in 'layouts/header' ``.
** Note that you don't write underscores! !! ** **
The asset pipeline is a function that enhances the productivity and management of static content such as CSS, JS, and images. Both Webpack (a bundler that organizes JS assets) and Yarn (a manager that manages JS dependencies) work fine.
It has three main functions: asset directory, manifest file, and preprocessor engine. This time I summarized the first two.
Rails uses three standard directories.
app/assets: Current application-specific assetslib/assets: Assets for libraries created by your development teamvender/assets: Third-party assets (not by default)When developing individually, app/assets is the main
A file that tells Rails how to combine static files (assets) into one file.
app/assets/stylesheets/application.css
.
.
*= require_tree .
*= require_self
*/
The first line indicates that the CSS file in app/assets/atylesheets is included in application.css.
The second line indicates that application.css itself should be included in the target.
Setting a root (named) URL allows you to reference the URL in two different methods.
root_path -> '/'
root_url -> 'https://www.example.com/'
Basically use _path.
Use _url when redirecting (because the HTTP standard requires a full URL when redirecting)
test/integration/site_layout_test.rb
require 'test_helper'
class SiteLayoutTest < ActionDispatch::IntegrationTest
test "layout links" do
get root_path
assert_template 'static_pages/home'
assert_select "a[href=?]", root_path, count: 2
assert_select "a[href=?]", help_path
.
.
end
end
The flow is
** The point is that ? Is replaced with a later path **
In addition, the number can be added as an option
Recommended Posts