Bootstrap グリットレイアウトの応用

対応サイズの指定

576px以上 col-sm 
768px以上 col-md 
992px以上 col-lg   
1200px以上  col-xl 
全大きさ  colのみ

一定の大きさで見えないようにする

iPad以上の大きさで見えないようにする場合

d-lg-none

一定の大きさで見えるようにする

iPad以上の大きさで見えるようにする

d-none  (全体で見えないように設定)
d-lg-block(iPad以上の大きさで表示)

row以下の順序を入れ替える

.row
  .col-3.bg-info
    1
  .col-4.bg-success
    2
  .col-5.bg-danger
    3

f:id:takehann:20180801195211p:plain

.row.mt-5
  .col-3.bg-info
    1
  .col-4.bg-success
    2
  .col-5.bg-danger
    3
.row.mt-3
  .col-3.bg-info.order-3
    1
  .col-4.bg-success.order-2
    2
  .col-5.bg-danger.order-1
    3

order-[数字]
と、することで数字の小さい方から左寄せとなる f:id:takehann:20180801195207p:plain

Bootstrap 使えるclass色々

bootstrapの色指定

f:id:takehann:20180801183828p:plain

文字色を指定

text-????とすることで文字の色を指定

<p class="text-primary">.text-primary</p>水色の文字になる

text-????とすることで文字の色を指定

background-colorの指定

bg-????で背景色を指定

<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>水色の背景になる

margin・paddingの指定

margin・paddingの指定のしかた

[m/p][location]-[数字]
~location~ 
 right  → r  
 left  → l  
 top  → t  
 bottom → b  

 width → x  
 height  → y

Rails Active Record マイグレーション

マイグレーションファイルの作成

マイグレーションファイルを生成するときは

rails generate migration テーブル名(複数形)

とすることで以下のようなマイグレーションファイルが生成されます。

class Createテーブル名 < ActiveRecord::Migration
  def change
    create_table :テーブル名 do |t|

      t.timestamps null: false
    end
  end
end

timestampsとはcreated_at カラムとupdated_atカラムの2つをさしておりこの2つはデフォルトで生成されます。   また、モデルににカラムを追加したい場合は、、、

rails generate migration Addカラム名To追加するテーブル名 カラム名:データ型

とすることで

class Addカラム名To追加するテーブル名 < ActiveRecord::Migration
  def change
    add_column :追加するテーブル名, :カラム名,:データ型
  end
end

というようなマイグレーションファイル が生成されます。 また逆に モデルのカラムを削除したい場合は

rails generate migration Removeカラム名To追加するテーブル名 カラム名:データ型

とすることで

class Removeカラム名To追加するテーブル名 < ActiveRecord::Migration
  def change
    remove_column :追加するテーブル名, :カラム名,:データ型
  end
end

というようなマイグレーションファイル が生成されます

Rails Active Record の基礎をまとめてみた 1

Rails Active Record とは?

Active Record とはMVC(Model・View・Controllerの略)のModelにあたる部分でビジネスロジックと呼ばれる、データベース上のデータに対する処理手順を示したものでORM(オブジェクト リレーション マッピング)と呼ばれる、データベースの作成や利用を簡単に行えるようするものです。

つまりActive Recordとは、、、

データベースとのやりとりを簡単にするもの!

例えば booksテーブルがあり、そこのデータを全て取り出したい場合、、、
SQL文を使うと

SELECT * FROM books;

Active Recordを使えば

Book.all

と、直感的でわかりやすくデータベースからデータを操作することができます。

Active Recordのできること

  • Modelの内容をわかりやすく表記する
  • テーブルの作成・検索・更新・削除などの操作
  • テーブル同士の関連付け(アソシエーション)を簡単に行える
  • 加筆するレコードに対して制約(バリデーション)をかけられる
  • Model同士の継承を簡単に行える

    Active RecordのCMC

    CMCとはConvention over Configuration(直訳 : 構成に関する条約)の略でつまりActive Recordのルールについてです。

命名規則

  • テーブルの名前は複数形で最初の文字が小文字(本のテーブルならbooks)
  • テーブルの名前が複数単語となる場合はスネークケースと呼ばれるアンダーバーで単語同士を繋げる記述方法で記述し最後の単語のみ複数形(本の写真を写真のテーブルならばbook_images)
  • モデルのクラス名は単数形で最初を大文字にする(本のモデルのクラス名はBook)
  • モデルクラス名が複数の単語となる場合キャメルケースと呼ばれる単語の最初を大文字にして単語同士を繋げる記述方法(本の写真のモデルクラス名はBookImage)

    スキーマのルール

  • デフォルトで主キーと呼ばれるinteger型のidという名前を持つカラムが生成される
  • テーブル同士の関連付け(アソシエーション)を行うときなどはテーブル名の単数形_idとしなければならない