これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org クリーンアップを有する副作用 外部のデータソースへの購読をセットアップしたい場合、メモリリークが発生しないようにクリーンアップが必要。 メモリリークを避けるためにクリー…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org クリーンアップを必要としない副作用 ReactがDOMを更新したあとで追加のコードを実行したいという場合があるので例を見ていく。 フックを使った例 import React, { useState, use…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org クリーンアップを必要としない副作用 ReactがDOMを更新したあとで追加のコードを実行したいという場合があるので例を見ていく。 クラスを使った例 Reactのクラスコンポーネントで…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org 副作用フックの利用法 副作用フックによって関数コンポーネント内で副作用を実行することができるようになる。 サンプル import React, { useState, useEffect } from 'react'; f…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 まとめ useStateフックをReactからインポートする。そうすることで関数コンポーネント内でローカルstateが使えるようになる。 Example コンポーネント内…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 state の更新 クラスでは、this.stateを使うとcountステートを更新する。 <button onClick={() => this.setState({ count: this.state.count + 1 })}> Click me </button> 関数内ではすで…

www.kindaikagaku.co.jp 少しずつ読んでいたのをようやく読み終えた。 その昔テストケースを考えてあれこれやっていた頃にこういうこと知ってればなーというのが体系的に書かれており、 自分の記憶の答え合わせのようで面白かった。 テストの考え方や、どう…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 state の読み出し クラス内で現在のカウント値を表示したい場合、this.state.countを読み出す。 <p>You clicked {this.state.count} times</p> 関数内の場合はco…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 state 変数の宣言 クラスを使った動作では、コンストラク内でthis.stateを{ count: 0}にセットする方法で、 stateであるcountを０へと初期化する。 関数…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 フックとは何か？ ReactからuseStateをインポーするところから始める。 フックとはReactの機能に接続するための特別な関数。 例えばuseStateによってReac…

これは sora-unity-sdk-samples を Android で動かした手順をまとめた記事です。 目次 目次 GitHubへのリンク この記事はどこまで？ 実行環境 事前準備 準備完了からシーンオープンまで 接続先の設定 Sora Laboの使い方 ビルド準備 動いた おわりに GitHubへ…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org ステートフックの利用法 クラスによる同等の例 フックでできることをクラスでやった場合の例 class Example extends React.Component { constructor(props) { super(props); this…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり その他のフック 使用頻度低めなものの便利なフックは存在している。 useContextを使うとReactのコンテクストをコンポーネントのネストなしに利用できるようにな…

www.diamond.co.jp 超面白かったので数時間ぐらいで一気に読んでしまった。 元任天堂企画開発者と言うこともあって、有名なゲームを引き合いに出しながら、体験をデザインするとは何か？を解説してくれている。

勧められてスタートしたこのブログ、1 年が経ちました。(ちょっと遅くなってしまいましたが...) 毎回自己満足のために続けているのですが、結構楽しくてもっと続けてみたいなーと思っています。 書くネタも増やしていきたい。 1年といえど特に何もなく淡々と…

ちょっと理解しきってない部分があったので、再読。 だいぶ理解したと思うけど、たぶんまた何回も読むことになると思う。 良書は何度読んでも発見と知恵を授けてくれるけど、そんな感じの本です。 もっと早く出会ってたらもっと違ったと思うって何度読んでも…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり 独自フックの作成 state を用いたロジックをコンポーネント間で再利用したい場合 高階コンポーネントとレンダープロップを使って解決することが多かった。 カス…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり ✌️ フックのルール フックは JavaScript の関数だが2つルールがある。 フックは関数のトップレベルのみで呼び出すこと フックは React の関数コンポーネント内部…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり ⚡️ 副作用フック Reactコンポーネントの内部から外部データの取得などをする場合、他のコンポーネントに影響が出ることがある。 useEffectは副作用のためのフック…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり 要するにフックとは？ フックとは関数コンポーネントにstateやライフサイクルといったReactの機能を接続するための関数。 フックはReactをクラスなしに使うための…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり 複数の state 変数の宣言 配列の分割大入稿ぶんを使い、useStateを呼び出して宣言したstateの変数に異なる名前をつけることができる。 こうした名前はuseStateの…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フック早わかり ステートフック 例 import React, { useState } from 'react'; function Example() { // Declare a new state variable, which we'll call "count" const [count…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フックの導入 段階的な採用戦略 開発する側は逐一リリースされる機能を確認しているかというとそうでは無い。 なのでチュートリアルなどが揃うまで採用は待っておくのも一つの手…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フックの導入 動機 フックが導入されるきっかけとなった要素がどんなものかみていきます。 ステートフルなロジックをコンポーネント間で再利用するのは難しい Reactは再利用可能…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フックの導入 互換性のない変更はありません フックは互換性のない変更ではない。 完全にオプトイン。既存のコードに影響なく、フックを試すことが可能。 100％後方互換。破壊的…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org フックの導入 React16.8で追加された新機能 フックの導入 参考 import React, { useState } from 'react'; function Example() { // Declare a new state variable, which we'll …

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org JavaScript 環境の要件 React16はコレクション型Map、Setに依存しており、これらをネイティブに提供しないIE11や、 古いブラウザをサポートする場合にはグローバル環境のポリフィ…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org リファレンス testInstance.props 当該インスタンスに対応するコンポーネントのprops コンポーネントがあった場合、propsは{size: 'small'} となる。 testInstance.parent 名前の…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org リファレンス testInstance.type 当該点ストインスタンスに対応するコンポーネントの型 <Button /> はButton 型を持ってる。 コンポーネントの型を知りたいとかに使うのかな。 今日はここま</button>…

これは Reactのガイドを読んでいく記事です。 ガイドのリンク ja.reactjs.org リファレンス testInstance.findAllByProps() 与えたpropsを持つ全ての子テストインスタンスを検索する testInstance.findAllByProps(props) とすることで()内のpropsを検索し、…