React Hooksで作ったWeb版ニュースアプリをTypeScript化
以前React Hooksを使ってWeb上で動作するニュースアプリの開発について記事にしました。そのニュースアプリをTypeScriptで書き直しましたので今回記事にしました。 以降前提としてNode.jsとパッケージ管理に使うyarnはインストール済みとしています。 ソースコードはGitHubにあ […]
CATEGORY
React
React HooksでWebニュースアプリを作ってみる
UdemyにあるReact Nativeでニュースアプリを作るeラーニングコースに触発され、学習目的でReact Hooksを使ったWeb版ニュースアプリを作ってみました。 グローバルステート管理にReduxは使わずHooksのみで実装しています。 ソースコードはGitHubで公開していますので、よ […]
React公式チュートリアルのアプリをHook化してみる
Reactの公式チュートリアルで作成する完成版アプリをHookを使って書き直してみました。 あまり大したことはやっていないのですが、Hook化するにあたりクラスコンポーネントを関数コンポーネントに書き直し、ステート管理はHookのuseStateを使いました。関数は全てアロー表記で書いています。 H […]
React公式チュートリアルアプリをPWA(Progressive Web Apps)化する
本記事はReactの公式チュートリアルアプリ(完成版)をローカル環境に構築してからGitHub Pagesに公開し、さらにPWA(Progressive Web Apps)化する手順を紹介します。 先行作業として別記事に書いたGitHub PagesにReactの初期ページを公開するところまで完了し […]
Reactの初期ページをGitHub Pagesで公開(デプロイ)する方法
本記事はcreate-react-appを使って作成したReactの初期段階のページをGitHub Pagesを使ってインターネットに公開(デプロイ)する方法を紹介します。 GitHub Pagesは静的ページをGitHubのリポジトリから直接ホスティングしてくれるGitHubのサービスです。無料で […]
React公式チュートリアルを図解
React.js(React)の公式サイトにあるチュートリアル(三目並べゲーム, tic-tac-toe)を図解してみました。チュートリアルの理解の助けになれば幸いです。 React公式サイト チュートリアルへのリンク React公式チュートリアルの図解 チュートリアルのファイル関係は下図のようにな […]
React.jsの始め方
React.jsをとりあえずさっさと試してみたい場合の方法(CDNの利用)とこれから本格的に開発していこうという場合(create-react-appの利用)に分けてReact.jsの始め方について今回記事にしました。 CDNの利用 (サクッと始めたい方向け) 開発時は以下の未圧縮スクリプトファイル […]