これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.createRef refの作成をする。 作成したrefはref属性を介してReact要素に取り付けることが可能。 class MyComponent extends React.Component { constructor(props) { super…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.Fragment React.Fragment コンポーネントを使用することでDOM要素の追加をしなくても render()メソッドで複数の要素を返すことができる。 フラグメントも<> という短縮構文…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.Children データ構造が非公開のthis.props.childrenを扱うためのユーティリティを提供する。 以下のような種類がある。 ・React.Children.map ・React.Children.forEach ・…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.Children データ構造が非公開のthis.props.childrenを扱うためのユーティリティを提供する。 以下のような種類がある。 ・React.Children.map ・React.Children.forEach ・…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.Children データ構造が非公開のthis.props.childrenを扱うためのユーティリティを提供する。 以下のような種類がある。 ・React.Children.map ・React.Children.forEach ・…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.Children データ構造が非公開のthis.props.childrenを扱うためのユーティリティを提供する。 以下のような種類がある。 ・React.Children.map ・React.Children.forEach ・…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org isValidElement() React.isValidElement(object) オブジェクトがReact要素であることを確認する。 true/falseが戻り値になる。 React要素かどうか判断して条件分岐させるときに使…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org createFactory() React.createFactory(type) React.createElement()と同様のtypeを受け、与えられた型の React 要素を生成する関数を返す。 機能としては残っているがレガシーの…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org cloneElement() React.cloneElement( element, [props], [...children] ) elementから新しいReact要素を複製して返す。 結果の要素は元のpropsと新しいpropsが浅くマージされたも…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org createElement() React.createElement( type, [props], [...children] ) ```` 与えられた型の新しいReact要素を作成して返す。 typeにはタグ名の文字列、React component、React …

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.memo React.PureComponentと似ているが、クラスではなく関数コンポーネント用の高階コンポーネントになる。 propsを与えられたあるコンポーネントが同じ結果をレンダーする…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React.PureComponent React.Componentと似たReact.PureComponentは propsとstateを浅く比較することでReact.Componentが持っていない shouldComponentUpdate()を実装していること…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org リファレンス 前回までは概要でした。 今回から詳細を見ていきます。 React.Component ES6クラスを用いて定義されていた場合React.Componentが基底クラスになる。 -例- class Gre…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 概要 サスペンス サスペンスを使用するとコンポーネントはレンダー前に何かを待機できる。 サスペンスがサポートしているユースケースはReact.lazyを使ってコンポーネントを動的…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 概要 要素を変換する Reactの要素を操作するためのAPIを提供している。 ・cloneElement() ・ isValidElement() ・React.Children フラグメント (Fragment) Reactはラッパーなしで…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 概要 React 要素を作成する UIがどのように見えるべきかを記述するためにJSXの使用が推奨されている。 ずいぶん昔にやったやつですね。 ja.reactjs.org JSXのそれぞれの要素は Re…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 概要 コンポーネント Reactコンポーネントを使用するとUIを独立した再利用可能な部分に分割してそれぞれを個別に考えることができるようになる。 React.ComponentまたはReact.Pur…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React の最上位 API ReactはReactライブラリのエントリポイントになる。 タグからReactを読み込む場合、これらの最上位APIをフローバルのReactから利用できる。 npmとES6を使う場…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org Web Components で React を使用する 参考コード class XSearch extends HTMLElement { connectedCallback() { const mountPoint = document.createElement('span'); this.attach…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org React で Web Components を使用する WebComponentsで公開されているAPIを使うためにrefを使う。 サードパーティ製のコンポーネントを使う場合はWebComponentsのラッパーとしてRe…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org Web Components Web ComponentsとReactは異なる課題を解決するために構築されたものである。 Web Componentsはコンポーネントをパッケージ化して高い再利用性を与える。 ReactはD…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ファイル input タグ HTMLでは<input type="file">を利用してユーザに1つ以上のファイルをデバイスストレージから選択してサーバにアップロードしたり、FileAPIを通じてJavaScriptで操作する。 React…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org デフォルト値 Reactのレンダーライフサイクルを見るとフォームにあるvalue属性はDOMno値を上書きする。 非制御コンポーネントでは、Reacに初期値設定をするが、後続の更新処理に…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 非制御コンポーネント 非制御コンポーネントはフォームデータをDOMが扱う。 ただ基本的にはReactを使うときには制御されたコンポーネントを使うのが良い。 非制御コンポーネント…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org レガシーなコンテクスト API の検出 レガシーは使うなってことらしい。 この章全体で語られていたことだけれど、これから新たにReactを使っていく人は古い仕様に合わせてもいいこ…

これはWebRTC Native Client MomoをWindowsで動かした手順をまとめた記事です。 ※手順については開発が進んだ段階で変更となるかもしれませんので現時点でのものとご理解ください。 目次 目次 GitHubへのリンク 参考 この記事はどこまで？ 実行環境 事前の事…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 意図しない副作用の検出 Reactは２つのフェーズで動作する。 レンダーフェーズ 変更対象にどのような変更が必要か決める。 Reactはrenderを呼び出して前回のレンダー結果と比較を…

これはなに 支払調書っていう存在を知ったのでなんなん？ってのを自分で解釈したのをまとめたものです。 下記参考のfreeeさんのやつがわかりやすかったように思います。 支払調書どんなものか 個人事業主からすると源泉徴収票に近いもの 提出は雇用主側(報酬…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 非推奨な findDOMNode の使用に対する警告 Reactにはクラスのインスタンスをもとにツリー内のDOMノードを見つけるfindDOMNode がサポートされていたが、DOMノードにrefを付与でき…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org レガシーな文字列 ref API の使用に対する警告 これからReactを始める場合はそこまで気にする必要はないが、Reactはrefを管理する方法としてレガシーとコールバックの二つのAPIを…