ぶうううん's Cafe

どうにかこうにか。備忘録に近い。

2022-01-01から1年間の記事一覧

Docker利用時のReact動作改善(高速化)について

Web

Dockerを利用していると、ローカルでのコード変更がもっさりすることがあります。 そうした際の動作改善について調査する機会がありましたので、少しここに残しておきます。 ホットリロード有効化 以下の何れかの方法でホットリロードを有効化する。 docker…

CakePHPについて

Web

今回はCakePHPについて調べてみました。 CakePHPとは CakePHPはPHP用Webフレームワークの一種であり、MVCモデルを採用しています。個人的な印象では、Laravelに次いで人気なPHP用Webフレームワークという認識です。 初リリースは2005年4月とのこと[1]。Symf…

Symfonyについて

Web

Symfonyとは SymfonyはPHPフレームワークの1つである。ただ、個人的にSymfonyの存在をこれまで知らなかった。PHPフレームワークといえばCakePHPとLarabelのイメージが強く(特にLarabel)、Symfonyについては聞いたことがなかった。調べた限りではMVCを採用…

ReactとWeb Componentの違い

Web

Web Componentのおさらい Web Componentは、コンポーネントを可能な限り再利用可能な形にする手法のことであり、主に以下の3つの技術から成り立っている。 カスタム要素 カスタムされた要素とその動作を定義するためのJavaScriptコード。 シャドウDOM カプセ…

ESLintの部分的無効化について

ESLintは無効化しても良い? 原則的に、無効化すべきではないと私は考えています。当たり前ではありますが、ESLintが存在することによって担保されるコードの保守性等が、無効化によって担保できなくなります。 ただ、一時的な検証等で無効化するのは有りだ…

ReactのuseEffect()の第二引数

多分React初心者なら誰もが気になるuseEffect()の第二引数についてです。私が気になった部分について書きます。 useEffect()についておさらい 副作用に関する挙動を書くReact Hooksである。 レンダリングされたDOMが画面に反映された後に動作する。(同期的…

ReactとNext.jsの関係

ReactとNext.jsは良く比較されているが、よく分かっていなかった(そもそもNext.jsは使ったことがない)ので調査してみた。 Reactの特徴 JavaScriptライブラリである。フレームワークではないらしい。個人的にはフレームワークだと思うけれども...。 仮想DOM…

fetchとaxios

Web

フロントエンドからバックエンドAPIにアクセスする方法はいくつか存在する。今回はReactに限った話ではないが、代表的な手法であるfetchとaxiosについてまとめておく。 共通な部分 非同期通信を可能にする。 Ajaxの実装である。 Promiseを返却する。 fetch …

Reactの仮想DOMについて調べてみた。

仮想DOM(VDOM)とは メモリ上に保持された仮想なUIが、ReactDOMなどのライブラリによって実際のDOMと同期されるプログラミング上の概念である。仮想DOMの場合、実際のDOMはメモリ上に保持された仮想なUIとの差分を基に更新が行われる(差分検出処理)。 仮想DOM…

Remote Containersを導入してVSCodeでのコンテナ開発を快適にする。

pc

VSCodeでのコンテナ開発を快適にする VSCodeに拡張機能のRemote Containersを導入。Remote Containersを導入するとVSCodeからDockerのコンテナに接続ができ、VSCodeを用いたコンテナ開発が行い易くなる。 https://code.visualstudio.com/assets/docs/remote/…

RESTful APIについて

Web

RESTful APIの前提知識を盛大に勘違いしていたので、戒めとして書いておきます。 RESTとは アーキテクチャ上の成約の集合である。 RESTで情報をやり取りする際はHTTP上で、以下の形式で送受信を行う。 JSON HTML XLT Python PHP プレーンテキスト RESTfulで…

パスパラメータ・クエリストリング・リクエストボディの使い分け

Web

フロントからバックに値を渡すときの手段 フロントエンドからバックエンドに値を渡すとき、以下のような方法が存在する。 パスパラメータ クエリストリング リクエストボディ 本記事ではこれら3つの説明とその使い分けについて記述する。 パスパラメータ パ…

RSpecについて調べてみた。

Web

RSpecとは テストフレームワークの1つ。 rspec-railsがRails用。 Gemでインストールできる。 specによって、テストの対象がそれぞれ違う。 統合テスト用にsystem specとrequest specがある。 github.com Unitテスト model spec モデルをテストする。Railsに…