リクエストスペックの特徴 HTTP 動詞に対応するメソッド(get 、post 、delete 、 patch)を使う。 capybaraは使わない。 HTTPのレスポンスのステータスコードと実際のデータを含んだレスポンスボディを返す 200: OK - リクエストは成功し、レスポンスととも…

※ セクション8~10はわざわざ纏める必要あるか微妙だったので、一旦パス。 144. フィルターを使用して、一般的なテキストフォーマットを作成する フィルター…テキストをフォーマットするためのもの。文字を全部大文字にするみたいな。 今まではcomputedでやっ…

マインド エンジニアの劣等感との付き合い方 - Qiita 仕事を任せられるエンジニアになるために意識してほしいこと - 食べチョク開発者ブログ 【新人ITエンジニア向け】僕が仕事をする上で大事にしているポイントあれこれ - give IT a try 質問・学習などにつ…

87. 親子間のデータの受け渡しの必要性を理解する 親コンポーネント アプリケーションのApp.vueは親コンポーネント⇄LikeNumber、LikeHeaderは子コンポーネント →App.vueではLikeNumber、LikeHeaderを使っている。 (src/App.vue) <template> <div> <LikeHeader></LikeHeader> <h2>{{ number }}</h2> <LikeNumber :total-number="number" @my-click="incrementNumber"></LikeNumber> </div></template>

74. コンポーネントを使用して、再利用可能なVueインスタンスを作る 第一引数はコンポーネント名 第二引数はコンポーネントに関する情報をオブジェクトでセットする コンポーネントの中でデータを使う時は、データを関数にする必要がある。 以下はグローバル…

67. なぜVue CLIを使う必要があるのか Vue CLI(コマンドラインインターフェイス)...大規模な本格的な開発に必要。 なぜ必要？ ファイルの分割 →大規模な開発で、ファイルを分けたり、くっつけたりしたい。 最終的なコードの軽量化 →改行、空白、コメントアウ…

50. イントロダクション Vueインスタンス Vueインスタンスって複数作れるの？他のjsからアクセスできるの？とかの内容 51. Vue インスタンスは複数作ることができる Vueインスタンスはなるべく複数使用しない方がいい 完全に独立してるなら使ってもおk。 #ap…

37. v-elseを使って、v-ifがfalseの場合の処理を書く <div id="app"> <p v-if="ok">Hello</p> </div> new Vue({ el: '#app', data: { ok: true, } }) 38. v-else-ifを使って、複雑な条件式を作る <div id="app"> <p v-if="ok">OK</p> <p v-elseif="maybeOk">maybe OK</p> <p v-else>Not OK</p> </div> new Vue({ el: '#app', data: { ok: false, maybeOk:…

はじめに 以下にUdemyの動画、超Vue.js2のメモを備忘録として書き連ねていきます。セクション毎に記事を分けます。 1. Vueの良いところ 簡単、柔軟、高性能 HTMLファイル内の一部にVueを取り入れる、一つのファイルをVueだけで作る、アプリ全てをVueにするSP…

jsonのserializerとは？ jsonを生成する仕組みのこと。 この生成したJSONのデータをレスポンスとして返す。 ActiveRecordは ActiveModel::Serialization を include している。 なので、そのまま以下のような記述もできる。 module Api module V1 class Arti…

下記の例文にthisを使ってみる 以下が例文。sayHi関数の結果を出力しているだけ。 <div id="app"> <p>{{ SayHi() }}</p> </div> new Vue({ el: "app", data: { message: "Hello world!", }, methods: { sayHi: function() { return 'Hi' ; } } }) 出力結果 Hi さあ、thisを使おう sayHi…

はじめに 今日もとりあえずVueの内容について殴り書きしていく。 componentとは Webサイトの画面はヘッダー、メイン、フッターなど色々な部品から構成されている。そこで、コンポーネントという機能を使えば、ヘッダーなどの部品(コンポーネント)ごとに、HTM…

transactionとは 複数のSQL文をtransactionという一つの単位にまとめることで、それぞれのSQLの処理が全て成功した場合にのみ、SQLの処理結果をDBに反映するよというもの。 典型的なのは銀行口座の例で、 ①A口座の残高から¥1,000引き落とす ②B口座の残高を¥1…

v-forで配列に要素をマッピング 配列に基づいて、アイテムのリストを描画するために、v-for ディレクティブを使用することができます。v-for ディレクティブは item in items の形式で特別な構文を要求し、items はソースデータの配列で、item は配列要素が…

v-show <タグ名 v-show="条件式">trueなら表示</タグ名> v-ifとv-showの比較 表示、非表示の動作が異なる。 v-ifはDOMレベルで要素が削除され、消えた部分はコメント化される。 v-showはDOMから要素は削除されず、dispay: none;が設定される。 →DOMへの要素の生成と削…

computedとは 関数で算出したデータを返すことができるプロパティ(getterということ) データの加工を伴った取得ができる。 キャッシュが残るから、処理が早くなる。 computed: { 算出プロパティ: 関数のオブジェクト } fullName: function() { return${this.…

Vueのデータバインディング 追記(6/15) バインディングとは、データとUIを結びつけること 双方向とは、データを更新⇄UIを更新 dataで、データを保持させる →name(プロパティ)とvalueのセット。 {{ }}にはjsの式も書ける → new VueはVue.jsの心臓部分みたいな…

クラスの継承 あるクラスを継承して、新たにクラスを作成すること。 よくある例だと、Animalクラスとそれを継承するDogクラス、Catクラスみたいな。 クラスの継承を行うことで、継承元の親クラス(スーパークラス)に定義された機能を、子クラス(サブクラス)で…

ソフトウェア開発においては、RESTの概念が重要 RESTfulとは あらかじめ決められたリソースを定義し、それに沿ってアクションとhttpメソッドを関連づけるという考え方。統一された書き方でコードを記述できる。 URLを先に考えるのであって、ルーティングを先…

RSpecでテストを書く時に、よく使うけど忘れがちな文法とかをまとめていこうと思います。 ※随時書き足していきたい have_selector have_selector 'h1', text: '大事なお知らせ' expect(page).to have_selector 'a[data-method=delete]', text: 'delete' expe…

transactionとは DBを使う場合、安全で確実なデータ操作とデータ管理が重要です。 例えば、お金の入出金で、出金者がちゃんとお金を振り込んだのに、入出金処理の途中で処理が中断され、入金の内容だけデータベースに反映されていない、なんてことが起こると…

local_assignメソッドとは？ ローカル変数を特定の状況に限ってパーシャルに渡したい時に使う。 用途 renderした部分テンプレート内で使える変数を明示したい(明示したいだけで、使わなくてもいけそう) 変数が見つからない時に|| 値とセットしたりできる。 →…

Rakeタスク library rake (Ruby 2.7.0 リファレンスマニュアル). Rails で Rakeタスクを作る. Rails の Rakefile がどのように lib/tasks の rake ファイルを読み込んでいるか. rbenvでRubyをインストールしていれば、Rakeも使える。 Rubyで作られた(記述さ…