Reactの学習リソースまとめ

はじめに
Reactを勉強する際に活用できそうなドキュメント、学習サイトについてまとめる。
GitHubリポジトリ

クイックスタート
公式サイトにて公開されているReactのクイックスタートガイド。
チュートリアルを含みかなりのボリュームがある。このページをざっとハンズオン形式で学習するだけでReactの約8割のコンセプトを学ぶことができるとのこと。
全体的に見やすく体系的にまとまっているので一読の価値あり。

Getting started with React
MDNが公開しているReactのドキュメント。上記リンクは日本語翻訳されているもの。公式ドキュメントと合わせて読みたい。

実際に触って覚える
React at CodePen
オンラインエディタで有名なCodePenが用意しているReactテンプレート。上記リンクにアクセスするだけですぐにコードを書き始めることができる。
Create React App
公式が提供するReactプロジェクト雛形生成ツール。Node.jsの実行環境が以下のコマンドで簡単にReactの雛形プロジェクトを生成できる。
$ npx create-react-app my-app
オプションで簡単にTypeScriptのテンプレートに置き換えることもできる。
$ npx create-react-app my-app --template typescript
2023年5月現在、更新が止まっているためViteなどのビルドツールでReactアプリの雛形を作成したほうがいいかもしれない。

React + TypeScript
ReactにTypeScriptを導入するときに使えそうなドキュメント。
React+TypeScript Cheatsheets
GitHubで多くスターを獲得しているReact+TypeScriptのチートシート。
React - TypeScript Deep Dive
本家
翻訳版
TypeScript Deep Diveが提供するReact + TypeScriptドキュメント。本家は英語だが有志によって日本語化された日本語版がある。

YouTube
新・日本一わかりやすいReact入門【基礎編】Reactの基礎知識
YouTubeのvideoIDが不正です
トラハック氏(@torahack_)が手掛けるReact解説動画シリーズ。
最新の動画にアップデートされており、プレイリストになっているのでとても見やすい。
ReactJSクラッシュコース2021
Traversy Mediaが提供しているReactの解説動画。音声はすべて英語だが日本語訳字幕あり。