アウトプット10/19

<今日のカリキュラム>

Rubyドリル

Javascript練習問題

 

<メソッド整理など>

 

<分かっていなかったこと>

XMLHttpRequest

 javascriptからAjaxによるリクエストを送るためのオブジェクトのこと。

・renderメソッド

 JSON形式でデータをサーバーから返却する際には、

 render json:{ post: post}

 とcreate定義に記載する。

・onload

 XMLHttpRequestで定義されているプロパティで、レスポンスの受信が成功した場合に呼び出されるイベントハンドラーのこと。

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

・DOM

 ドキュメントオブジェクトモデルのこと。 HTMLを解析し、データを作成する仕組み。JavaScriptではHTMLを階層として捉えて変換したデータと捉え、そのHTMLの階層を取得し、操作することでプログラムを動かす言語。

・devise_parameter_sanitizerメソッド

 deviseGem時に自分で新しく設定したカラムもストロングパラメーターに含めることが可能。application_controller.rbに記載する。

・ストロングパラメーター

 指定したキーのみをもつパラメーターのみを受け取るように制限するもの。

・requireメソッド

 保存をする際はストロングパラメータで値の許可をする必要がある。ストロングパラメータで二重ハッシュの中身を保存したい場合には、requireとpermitメソッドを使う。 

・permitメソッド

 取得したいキーを指定するときに使う。
 params.require(:モデル名).permit(:キー名, :キー名)

 と記述。requireメソッドと組み合わせることで、対象のモデルから取得したいキーを指定することができる。

 

<気付き>

javascriptの練習問題が難しいけど良い復習問題になってる。明日で終わらせたい。

アウトプット10/18

<今日のカリキュラム>

Ruby on rails エラー修正

・メモ投稿機能のフロント側を非同期通信で実装

 

<メソッド整理など>

・FormData

 フォームに入力した値を取得できるJSのオブジェクト。

・insertAdjacentHTML

 指定したHTMLを特定の要素に挿入できるメソッド。非同期通信により、指定のHTML要素を大元のHTMLに挿入処理することによって更新しなくても投稿内容が反映できるようになる。

API

 Application Programming Interfaceのこと。アプリ同士でデータのやりとりを行うルールのこと。HTMLなどのビューファイルのやりとりを行うのではなく、あくまでデータのやりとりを行うことが特徴。

 

<分かっていなかったこと>

・devise_parameter_sanitizerメソッド

 deviseGem時に自分で新しく設定したカラムもストロングパラメーターに含めることが可能。application_controller.rbに記載する。

・ストロングパラメーター

 指定したキーのみをもつパラメーターのみを受け取るように制限するもの。

・requireメソッド

 保存をする際はストロングパラメータで値の許可をする必要がある。ストロングパラメータで二重ハッシュの中身を保存したい場合には、requireとpermitメソッドを使う。 

・permitメソッド

 取得したいキーを指定するときに使う。
 params.require(:モデル名).permit(:キー名, :キー名)

 と記述。requireメソッドと組み合わせることで、対象のモデルから取得したいキーを指定することができる。

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

・DOM

 ドキュメントオブジェクトモデルのこと。 HTMLを解析し、データを作成する仕組み。JavaScriptではHTMLを階層として捉えて変換したデータと捉え、そのHTMLの階層を取得し、操作することでプログラムを動かす言語。

 

<気付き>

レッスン4を終えられなかったのが残念。また来週から一週間がんばろう。

アウトプット10/17

<今日のカリキュラム>

・非同期通信

 

<メソッド整理など>

・boolean型

 trueまたはfalseの判定を行うデータ形式Ajaxで既読判定時に使用する。

・orderメソッド

 レコードの並び替えに使用。DESCは降順、ASCは昇順。

 .order(id: "DESC")のように記述。

・エンドポイント

 Ajaxにおけるデータ返却のアクションを事項するURLのこと。

・URLパラメーター

 サーバに情報を送るためのURL末尾の文字列のこと。

・queryパラメーター

 「?<変数名>=<値>」として情報を綴るURLパラメーター。

・pathパラメーター

 URLパラメーターの一つ。リソースを識別するときに使用する。

イベントハンドラ

 JSでイベントが発火したときに実行される処理のこと。

XMLHttpRequest

 Ajaxを使えるようにするためのオブジェクトで、サーバーにHTTPリクエストを非同期で行うようにすることができる。

 

<分かっていなかったこと>

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・requireメソッド params.require(:モデル名) # 取得したい情報を指定する

・permitメソッド 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

・DOM

 ドキュメントオブジェクトモデルのこと。 HTMLを解析し、データを作成する仕組み。JavaScriptではHTMLを階層として捉えて変換したデータと捉え、そのHTMLの階層を取得し、操作することでプログラムを動かす言語。

 

<気付き>

1週間終わり。週末はlesson4を終わらせるべく頑張っていきたい。

アウトプット10/16

<今日のカリキュラム>

Rubyドリル

 

<メソッド整理など>

 

・attr_readerメソッド

インスタンス変数を呼び出すメソッドを定義するメソッド。

attr_reader :インスタンス変数 と記載すれば定義できるので簡単。

 

<分かっていなかったこと>

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・requireメソッド params.require(:モデル名) # 取得したい情報を指定する

・permitメソッド 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

・DOM

 ドキュメントオブジェクトモデルのこと。 HTMLを解析し、データを作成する仕組み。JavaScriptではHTMLを階層として捉えて変換したデータと捉え、そのHTMLの階層を取得し、操作することでプログラムを動かす言語。

 

<気付き>

1週間終わり。週末はlesson4を終わらせるべく頑張っていきたい。

アウトプット10/15

 

<今日のカリキュラム>

Javascriptの周辺知識

 

<メソッド整理など>

コンポーネント指向

 Javascriptにおけるライブラリに関する考え方。必要な機能を切り分けて考えることで組み合わせをしやすくする。

・仮装DOM

 直接DOMを変更する処理をするのはアルゴリズムまで考慮して考える必要があり非効率。仮装DOMを用いてDOMの変更を変更するとアルゴリズムが最適化される。

 

<分かっていなかったこと>

・DOM

 ドキュメントオブジェクトモデルのこと。 HTMLを解析し、データを作成する仕組み。JavaScriptではHTMLを階層として捉えて変換したデータと捉え、そのHTMLの階層を取得し、操作することでプログラムを動かす言語。

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・requireメソッド params.require(:モデル名) # 取得したい情報を指定する

・permitメソッド 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

 

<気付き>

移動が多すぎて疲れた。1日1拠点までにしよう。

アウトプット10/13

<今日のカリキュラム>

正規表現

 

<メソッド整理など>

・subメソッド

 //で囲んだ文字を置き換える。

・gsubメソッド

 subメソッドでは最初に該当する文字のみ置き換えになってしまうが、gsubは全てを置き換える。

・matchメソッド

 //で囲んだ文字が含まれているかどうか。

・各種表現

[a-z] アルファベットの aからzまでのいずれか1つにマッチするかを確認

\d 数値を表す特殊文字

{n, m} 少なくともn回、多くともm回マッチする確認

i 大文字・小文字を区別せず検索する。

. 全ての英数字にもマッチする。

+ 直前の文字が1回以上繰り返す場合にはマッチする。

  .+ 何かしらの文字が1回以上繰り返すものにマッチする。

 

<分かっていなかったこと>

 

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・requireメソッド params.require(:モデル名) # 取得したい情報を指定する

・permitメソッド 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

 

<気付き>

移動が多すぎて疲れた。1日1拠点までにしよう。

アウトプット10/12

<今日のカリキュラム>

JavaScript上でHTML要素を取得する方法を学ぼう

rubyドリル

 

<メソッド整理など>

・オブジェクトはプロパティ属性(名前や年齢)とメソッド(機能)をもつ。プロパティの追加方法は、

 オブジェクト名.プロパティ名 = 値

 オブジェクト名[プロパティ名] = 値

・windowオブジェクト

 JavaScriptにおける最上位のオブジェクト。ブラウザの情報を持っている。

・documentオブジェクト

 ブラウザ上に表示されたHTMLを操作することができるオブジェクト。

・DOM

 HTMLを解析し、データを作成する仕組み。

・absメソッド(ruby)

 返り値を整数に変換する。

 

<分かっていなかったこと>

 

 

<理解していないこと>

・「placeholder」は、文字をうっすら表示する時に利用

・送信ボタンの実装

・requireメソッド params.require(:モデル名) # 取得したい情報を指定する

・permitメソッド 

・references型/外部キー制約

 中間テーブルのマイグレーションファイルに記述する。

 t.references :room, foreign_key: true
 t.references :user, foreign_key: true

・ルーティングのネスト

・mergeメソッド

・N+1問題

・fill_inメソッド

・have_selector,have_contentの違い

 指定したセレクタがあるかないかを判断するマッチャがhave_selector。have_contentは指定した文字列があるかどうかを判断するマッチャ。

・クラスメソッドとインスタンスメソッド

 クラスメソッドではインスタンス変数(@〇〇)が使えない。

 ・sliceメソッドとslice!メソッド

 array.slice(1) →配列の中から1番目の数値を取り出す。但し配列に影響はない。

 array.slice!(1) →配列の中から1番目の数値を取り出す。取り出した数値は配列から削除される。

・afterメソッド 

 任意の処理の後に指定の処理を実行するメソッド。テストコードでFactoryBot後に画像を保存するコードを作るときなどに使用する。

・requireメソッド

 ライブラリやクラスを読み込むための記述

 ・whileメソッド

 無限ループを作るメソッド。条件式が真である間は処理を繰り返す。

 

<気付き>

 順調でいい感じ。