TECHCAMP名古屋7日目 基礎カリキュラム95％まで

7日目に学んだことです。

HTML/CSSで16個、Rubyで5個、Ruby on Railsで8個のことについて学びました。

★HTML/CSSで学んだこと★

1.CSSの基本的なフォーマット
セレクタ{
プロパティ: 値;
}
セレクタかっこプロパティコロン値セミコロンかっこ閉じるです。

2.リストの黒点を消す方法
list-style: none;

3.ブロックの要素を横並びにする方法
(親要素で)
display: flex;

4.文章を左右中央寄せにする方法
text-align: center;

5.文章を上下中央寄せにする方法
height:60px;のとき、
◯line-height: 60px;
×text-height: 60px;

6.ブロックを左右中央寄せにする方法
margin: 0 auto;

7.ブロック要素のどこがコンテンツ、パディング、ボーダー、マージンか覚える方法
カピバラと覚える。
C、P、B、Rをもじってカピバラと読む。
これはブロックの内側にある順でブロックの要素を表す。
Cはコンテンツ
Pはパディング
Bはボーダー
Rはどれにも属さないのでマージン

8.ブロック要素を横並びにし、左右にスペースを入れずに等間隔で並べる方法
(親要素で)
display: flex;
justify-content: space-between;

9.相対位置でブロックを配置する方法
position: relative;

10.リセットCSSが必要な理由
ブラウザは最低限の見た目を保証するために、
デフォルトのCSSを持っている。
しかし、ブラウザごとに異なるデフォルトのCSSによって、
意図しない表示となってしまうことがある。
リセットCSSを使用することで、
デフォルトのCSSを打ち消すことができ、
ブラウザごとに同じ見た目にすることができる。

11.CSSを読み込む方法
<link rel="stylesheet" href="reset.css">

12.文字を太字にする方法
font-weight: bold;

13.aタグで下線を消す方法
text-decoration: none;

14.1行の入力フォームを作成する方法
1.formタグを記述する。
2.inputタグを記述する。
3.typeを”text”にする。
<form>
<input type="text">
</form>

15.入力フォームに初期表示を設定する方法
inputタグのplaceholderに文字を入れる。
<input placeholder="初期表示を設定できます。" type="text">

16.送信ボタンを作成する方法
1.formタグを記述する。
2.inputタグを記述する。
3.typeを”submit”にする。
valueを指定すると表示名を変更できる。
<form>
<input type=“submit” value=“Send”>
</form>

★Rubyで学んだこと★

1.rubyの特徴
動的型付け言語
オブジェクト指向言語
生産性の高い言語

2.chompメソッド
chompは日本語でムシャムシャ食べるという意味。
chompメソッドは、文字列の末尾の改行コードを削除する。

3.ハッシュを配列の末尾に挿入する方法
1.配列を作成する
2.ハッシュを作成する
3.配列の右にひらがなのくの字の括弧を2つ並べ、
更にその右に作成したハッシュを記述する

books = []
book = { author: author, title: title, price: price }
books << book

4.配列の要素数を取得する方法
lengthメソッドを使用する。
books = [0,1,2]
puts books.length
=> 3

5.privateメソッド
class内部でprivateと記述すると、それ以降に定義したメソッドはclassの外部から呼び出せなくなる。
privateメソッドを利用するメリットは、外部から呼ばれたら困るメソッドを守ることができる。
外部から呼び出されるメソッドを探す時に、private以下の部分は目を通さなくて良くなるため、可読性が上がる。

★Ruby on Railsで学んだこと★

1.他のフレームワークと比較した場合のRuby on Railsの特徴
railsはrubyにおけるフレームワークとしては最大のシェアを誇る。
ポピュラーなフレームワークであるため、コードの調査をする際なども非常に容易。
コードの記述量が短くシンプルで、メンテナンスが容易。
ベンチャー企業における小規模開発、プロトタイプの作成などには非常に重宝される。
アプリケーション設計の決まりがはっきりしているので、迷いが少ない。
コードの記述量が少ないので、開発スピードが早い。
開発補助ツールが豊富。日本語の参考文献が多い。
処理速度は速くないため、大規模サービスには向いていない。

2.link_toでdeleteメソッドを呼び出す時に気をつけなければならないこと
link_toメソッドでmethodオプションにdeleteを指定すること。
×<%= link_to 'LOGOUT', “/users/#{user.id}" %>
◯<%= link_to 'LOGOUT', “/users/#{user.id}", method: :delete %>

methodオプションにdeleteを指定しないと
getを指定したのと同じになり、ルーティングが不正になる。
<%= link_to 'LOGOUT', “/users/#{user.id}" %>は、
<%= link_to 'LOGOUT', “/users/#{user.id}", method: :get %>と同じ

3.deviseGem使用時にユーザーがサインインしているかどうかを取得するメソッド
user_signed_in?
ハテナを忘れずにつける。

4.requireメソッド
DBを更新する時に不要なパラメーターを取り除くためのメソッドのうちの1つ。
日本語で必要とするという意味。受け取るパラメータ群を指定する。
params.require(:user).permit(:name, :age)

5.permitメソッド
DBを更新する時に不要なパラメーターを取り除くためのメソッドのうちの1つ。
日本語で許可する、という意味。利用可能なパラメータ名を指定する。
params.require(:user).permit(:name, :age)

6.空白をDBに保存しないためのバリデーション
validates :image, :title, presence: true

7.投稿日時が新しいもの順にデータを並べ替えてDBから取得する方法
orderメソッドを利用する。
作成日時を表すcreated_atと、降順を表すDESCを使用。
order("created_at DESC")

8.Pending migration error
実行していないマイグレーションファイルがあるときに起こるエラー。
マイグレーションすると消える。