devlog

フロントエンドエンジニアの技術ブログ

JavaScript

react-router-dom で ルーティングを実装する

React で ルーティングをする為のライブラリでデファクトスタンダードとなっているのが react-router です。 そして、Web 上で利用できるように DOM にバインディングができるライブラリが react-router-domです。 reacttraining.com github.com ちなみに、r…

React コンポーネントをカスタムフックで Presentational Component と Container Component に分離する

Presentational Component(コンポーネント) と Container Component(コンテナー) Presentational Component(コンポーネント) Container Component(コンテナー) カウンターコンポーネントを Presentational Component(コンポーネント) と Container Component…

Redux Form の reduxForm() で mapStateToProps と mapDispatchToProps を渡す方法

これに結構ハマったのでメモ。 reduxForm()が返してくる関数の引数にconnect()で mapStateToProps と mapDispatchToProps を指定する。 import React, { Component } from 'react'; import { reduxForm } from 'redux-form'; import { connect } from 'react…

Qiita投稿 - 配列の中にある配列の値をキーにして新しいオブジェクトを作る

Qiitaへ「React + Redux の基本的な状態管理を Reducers を起点に考える」という記事を投稿しました。 qiita.com

Qiita投稿 - React + Redux の基本的な状態管理を Reducers を起点に考える

Qiitaへ「React + Redux の基本的な状態管理を Reducers を起点に考える」という記事を投稿しました。 qiita.com

create-react-app で作成したプロジェクトの React Component で propTypes を指定すると WebStorm で 「Unresolved variable isRequired」とエラーが表示された件

create-react-app で作成したプロジェクトの React Component で propTypes を指定すると WebStorm で 「Unresolved variable isRequired」とエラーが表示されました。(エディター上のエラー) ググって見ると他にも「Unresolved variable string」とエラー…

React Component における default props と props types の指定方法

default props props を使用している React Component で props が渡されたなかった場合のフォールバックとして default props を指定する事ができます。 default props は、 [コンポーネント名].defaultProps = {}と指定します。 (functional component で…

addEventListenerの第三引数に渡すオプションオブジェクト、`passive: true`について調べた。

同僚が書いているコードを眺めていた所、addEventListenerの第三引数にオブジェクトとして{passive: true}を渡していました。 「あれ?第三引数って、useCaptureを真偽値で設定するんじゃなかったっけ。」と思いながらこの記述について調べてみたところ、、…

Qiita投稿 - Vuexのモジュールを使用してストアを管理する

Qiitaへ「Vuexのモジュールを使用してストアを管理する」という記事を投稿しました。 Vuexのモジュールを使用してストアを管理する - QiitaVuex で状態管理を行っているアプリケーションでは、基本的にストアは1つだと思います。 アプリケーションが大きく…

@ 2019 devlog