「基礎からはじめるReact入門」連載一覧
-
2018/07/17Reduxで非同期処理を行う～ES2017のasync/await構文を使って実装する方法
Reactアプリ開発の基礎を解説してきた本連載。前回の第9回では、Reduxに備わったMiddlewareの仕組みを使って非同期処理を実現する方法について学びましたが、Middlewareを使わずに非同期処理を実現する方法もあります。今回は、ECMAScript 2017のasync/await構文とReduxを併用しながら非同期処理を実現する方法について学んでいきます。
-
2018/06/15Reduxで非同期処理を行う～Middlewareを使って実装する方法
第8回ではFluxの概念を紹介しながらReduxの基本的な使い方を学びましたが、Reduxを実際の業務で使う場合には、実践的なノウハウが必要になります。今回は、よりReduxを現場で使えるツールとして活用するために、Middlewareの仕組みを導入しながら、外部との通信を行う際に必須となる非同期処理を行う方法について学ぶことを目的とします。
-
2018/04/09アプリの状態管理を安全に行うためのFluxとRedux
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。今回は、Propsの型を定義することでコンポーネントの可用性を向上させる方法を学びましょう。
-
2018/03/30「prop-types」でPropsのデータ型を担保する
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。今回は、Propsの型を定義することでコンポーネントの可用性を向上させる方法を学びましょう。
-
2018/03/02Storybookでコンポーネントの品質を向上する
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。今回はStorybookというツールの使用方法を利用してコンポーネントのカタログを作ることで、高速に動作確認を行う方法を学びましょう。
-
2018/02/01React Routerで複雑な画面遷移をシンプルに実装する
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。今回はライブラリ「React Router」を利用して、GUIアプリケーションには欠かせない画面遷移とURLの管理を行う方法を学びましょう。
-
2017/12/28Reactによるフォーム／リストの基本
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。今回はJavaScriptでステートフルなアプリケーションを実装しながら、「リスト」と「フォーム」のWebアプリケーションに欠かせない要素を学びましょう。
-
2017/04/12React×Material-UIでモダンなUIを実装する
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。前回はReactコンポーネントの基本であるPropsとState、およびライフサイクルについて解説しました。本稿ではデザイン性をアップさせてくれるサードパーティー製のコンポーネントセット、Material-UIの使用方法について紹介します。Material-UIは、Googleのデザインガイドラインに則って開発されたコンポーネント...
-
2017/02/09Reactコンポーネントへの理解を深める
Reactはコンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現できるライブラリです。同時に、優れたUIを提供するライブラリでもあります。本稿ではコンポーネントを使いこなすためには避けて通れない、PropsやState、およびライフサイクルについて解説します。
-
2017/01/04Reactの概要と基礎技術要素を理解する
本連載は、Reactアプリを開発するための基礎を身につけることを目的としたものです。Reactは、コーディング方法が少し独特なため、最初のハードルが高めに感じる方も多いかと思います。しかし、一度その方法を身につければ高い開発生産性を発揮します。本連載では、はじめてReactに触れる方でも無理なく開発スキルを身につけられるよう1つずつステップを踏んで解説していきます。連載では、Reactの概念・文法・作法などといった基礎的な事項を学んだ後、Fluxアーキテクチャを採用した本格的なアプリ開発の手法...
