[Ruby on Rails] How to install Bootstrap in Rails

What is Bootstrap

-It is a CSS framework developed by Teitter. -You can easily create a site design. -Since commonly used styles are predefined, you can create a well-designed page by using the defined rules.

How to install Bootstrap

1. Add gem

Add the following gem to use Bootstrap. ・ Bootstrap-sass

Gemfile


gem 'bootstrap-sass', '3.4.1' 

Write to the Gemfile and run bundle install. After executing the command, the installation is complete when the clause containing the character string ** "Bundle complete!" ** is displayed at the end.

2. Have the file load bootstrap

Select the css file to which you want to apply Bootstrap. Then enter the code as shown below.

example.css


//bootstrap-import
@import "bootstrap-sprockets";
@import "bootstrap";

When you're done entering the code, change the extension from ** " css " ** to ** " scss " **.

example.scss


//bootstrap-import
@import "bootstrap-sprockets";
@import "bootstrap";

This is the end of bootstrap installation.

Recommended Posts

[Ruby on Rails] How to install Bootstrap in Rails
How to install Bootstrap in Ruby
How to use Ruby on Rails
How to deploy Bootstrap on Rails
How to install Swiper in Rails
[Ruby on Rails] How to write enum in Japanese
[Ruby On Rails] How to reset DB in Heroku
[Ruby on Rails] How to use CarrierWave
How to display a graph in Ruby on Rails (LazyHighChart)
[Ruby on Rails] How to use redirect_to
[Webpacker] Summary of how to install Bootstrap and jQuery in Rails 6.0
[Ruby on Rails] How to display error messages
How to add / remove Ruby on Rails columns
[Ruby on Rails] How to use session method
[Rails] How to install simple_calendar
[Rails] How to install reCAPTCHA
How to create a query using variables in GraphQL [Using Ruby on Rails]
How to implement gem "summer note" in wysiwyg editor in Ruby on Rails
How to debug the processing in the Ruby on Rails model only on the console
How to install Ruby on an EC2 instance on AWS
(Ruby on Rails6) How to create models and tables
How to deploy jQuery on Rails
[Rails] How to install Font Awesome
[Ruby on Rails] yarn install --check-files
How to iterate infinitely in Ruby
How to install ImageMagick on Windows 10
How to install ruby through rbenv
Ruby on Rails Japanese-English support i18n
How to implement image posting function using Active Storage in Ruby on Rails
[Rails] How to install Font Awesome
How to install WildFly on Ubuntu 18.04
How to introduce jQuery in Rails 6
How to run npm install on all projects in Lerna
Apply CSS to a specific View in Ruby on Rails
How to change app name in rails
How to use custom helpers in rails
How to insert a video in Rails
How to install production Metabase on Ubuntu
Ruby on Rails in Visual Studio Codespaces
How to install beta php8.0 on CentOS8
How to use MySQL in Rails tutorial
Deploy to Heroku [Ruby on Rails] Beginner
Preparing to introduce jQuery to Ruby on Rails
[rails] How to configure routing in resources
How to implement ranking functionality in Rails
How to install kafkacat on Amazon Linux2
Beginners create portfolio in Ruby on Rails
[Ruby on Rails] Button to return to top
How to use credentials.yml.enc introduced in Rails 5.2
[Ruby on Rails] "|| =" ← Summary of how to use this assignment operator
Things to remember and concepts in the Ruby on Rails tutorial
[Ruby on Rails] How to avoid creating unnecessary routes for devise
Change from SQLite3 to PostgreSQL in a new Ruby on Rails project
Deploy to Ruby on Rails Elastic beanstalk (EB deploy)
How to write Rails
How to build a Ruby on Rails environment using Docker (for Docker beginners)
Introducing Bootstrap to Rails 5
How to install network drivers on standalone Ubuntu
[Rails] How to use select boxes in Ransack
Introducing Bootstrap to Rails !!
Recommendation of Service class in Ruby on Rails