deve.K

エンジニアが未来を切り開く。

React.jsの欠点を理解する 基礎

Reactには多くの利点がありますが、考慮すべきいくつかの欠点がございます。 React.jsを使用する前にそれらReactの全体像を把握するために学んでおきましょう。

React.jsでのインポートとエクスポートとは 基礎

React.jsでのインポートとエクスポートの扱い方・概念・重要な理由など初学者様に解説致します。

React JSXでのループ処理 基礎

React JSXでループ処理する方法を初学者様向けに解説致します。 for・forEach・マップ関数でのループとなります。

React 18について 知っておくべき事

最近ではReact 18がリリースされたばかりです、当ブログでは知っておくべき必要のあるすべてを解説していきます。

React.jsのpackage.json 基礎

package.jsonとは? React(CRA)package.jsonの中身 node_modules 以前でのReactアプリの作成は中々に大変なプロセスでした。 webpackとBabelを使用し、様々な構成をしていく必要がありました。 ですが優れた構成を備えられた非常に便利なモジュールであるCre…

React 環境構築 Webpack + Babelなぜ必要?

React開発者になるには欠かせない、Webpack&Babelについて、なるべくざっくりと解説致します。 まずはなぜ必要なのかを理解していきましょう。

React 複数でのuseEffect 基礎

複数での副作用の場合『useEffect』は1つにまとめて組み合わせるのではなく、『useEffect』を複数呼び出し分けなければいけません。

React Hook useCallback 基礎

React Hook useCallbackの基礎になります。

React.js 中級者なりたての方へ私からの提案

React.jsの中級者になりたての方、向けにこれから何を学ぶかを私からの提案でございます。

Reactフック useRef 使い方 基礎

ReactフックのuseRefが何に役立ち、そしてそれをどのように扱うのか解説致します。

React Hook useEffectとuseLayoutEffectの違い 基礎

React Hooksの『useEffect』と『useLayoutEffect』の違いを解説致します。

React useReducerフックとは 使い方

useStateの理解ができた方はさらに1ランク上の状態管理へいきましょう! React Hookの『useReducer()』の解説を致します。

React Hook【useContext 】基礎

本日はReactのHookでよく用いられる、『useContext』でのデータ共有になります。 useContextフックは、React16.8以降のバージョンで使用可能です。 useContextとは useContext使用例 useContextとは 本来Reactでの親コンポーネントから子のコンポーネントへ…

React オススメ開発者ツール

React開発者オススメ便利ツール

React Hook まとめ

react hooksでよく用いられるのをざっくりで説明させて頂きます。

Reactでのエラー処理について

Reactでのエラー処理にお困りの方はまずこちらを学んでから、別の解決策に進んで下さい。

React クラスと関数(Hook)との違い 脱初学者

Hookのstateは複数の状態を作れる!! 常にリロードしちゃう 副作用Hook 独自Hook 本日はReactのクラスコンポーネントと関数コンポーネントとの違いを私なりに分かりやすくまとめていきます。 内容はほとんど初学者さん用となっております。 Hookのstateは複…

React create-react-appのディレクトリ構成の解説

本日はReactの学習でSPA開発する際に手軽にプロジェクトの雛形を提供してくれるCLIツールである create-react-appテンプレのディレクトリ構成の中身を解説します。 こちらは完全な初学者用もしくは現在学ばれてる方々用になります、そこはご了承下さい。 公…

React Hooks API fetchで取得

本日はReactのHooksでfetchを使用しAPIを叩いてみましょう。 Hook useEffectフックとは ReactのクラスではAJAXコールというのがあります AJAXライブラリをReactと組み合わせます。 AJAX コールでのデータ取得はcomponentDidMount のライフサイクルメソッドを…

Reactでの簡単すぎるタブ実装 react-tabs

簡単にタブ実装したいなら間違いなくreact-tabs、初学者でも覚える所が少ないのですぐに実装が可能となります。

React 基礎 State(状態管理)について

State Props Reactの状態管理 それの何が良いのか? 状態管理の変化 Hooks Context API ?? ReactのStateでの状態管理はReactをやっていく上ではもっとも重要となりますStateを制する者はReactを制すると言っても過言ではありません。なのでReactの状態管理に…

React 仮想DOM【Virtual DOM】の仕組み

本日は 仮想DOMとリアルDOMの違いを初学者様に解説致します。DOMはあらゆるWebサイトの不可欠な部分となっています。DOMの概念は、フロントエンドプログラミングでは非常に重要となっており、それがどのように機能するかを知ることは、Web開発者にとって非常…

React【SPA】react-router-dom v6でルーティング

React react-router-dom v6でのルーティング方法の解説となります。 v5は古いので学ぶなら間違いなく最新のv6から学びましょう!。

React基礎 Bind(バインド)方法と使い方

Bind(バインド)とは Bind(バインド)とは ThisのBindなぜ必要?? 別の回避方法 直接ボタンタグにBindする コールバック内にアロー関数を使用する イベントハンドラに引数を渡す バインドはClassコンポーネントでイベントハンドラを設定し他のコンポーネントに…

React 基礎【ライフサイクル】メソッド 使い方

ライフサイクルメソッドの流れ setStateで更新 ライフサイクルメソッドを使う componentDidUpdate() ライフサイクルメソッドの流れReactのライフサイクル??って疑問に思われる方は私が以前に書いたReact基礎の記事に軽く載っていますのでそちらを確認下さ…

Reactのプラグインreact-particles-js【本番環境】について

react-partcles-js 私のローカル表示皆さんこんにちは!記事内容はReactで簡単に動く背景のアニメーションを実装できるプラグインのreact-particles-jsです。前回の私のReactオススメツール・モジュールなどで紹介した記事にReact-particles-jsを載せました…

React【基礎で絶対に欠かせないポイント】まとめ

React.component種類 StateとPropsの理解 State Props Class component Functional component Reactの基礎文法 return内はdivタグでグループ化 classはclassNameと書く 終了タグのない要素は末尾に/で閉じる!! 変数や関数などは{ }で埋め込む 変数は全てキ…

プライバシーポリシー