React Native と Expo を使用してクロスプラットフォームの iOS および Android アプリを構築します。最初のコンポーネントからアニメーション、ネイティブ API、プッシュ通知、App Store への提出まで。
React Native と Expo を使用してクロスプラットフォームの iOS および Android アプリを構築します。最初のコンポーネントからアニメーション、ネイティブ API、プッシュ通知、App Store への提出まで。このトラックでは、初級者（A1）から上級者（B2）まで、30 の段階的なミニコースをカバーしています。短くて焦点を絞ったレッスンと、各コンセプトを定着させるためのクイズが含まれています。
基礎から始まり、中級および上級のトピックへと進み、各コースが前のコースの上に構築されます。すべてのレッスンは実践的で、実際の例と、必要に応じて利用できる AI チューターが含まれています。
各コースは 4 つの焦点を絞ったレッスンに分割されています。1 日に数レッスンを完了すれば、数ヶ月ではなく数週間でこのトラック全体をマスターできます。
AIを活用したツールと機能で学習をパワーアップ
React Native Academyラーニングパスのすべてのコース
Expoを使ってReact Nativeの開発環境を整えます。必要なツールをインストールし、初めてのプロジェクトを作成して、実機またはシミュレーターで実行します。最後には、プロジェクト構成を理解し、初めてのコンポーネントを書けるようになります。
React Nativeのすべての画面を構成する基本要素を学びます。View、Text、Imageコンポーネントを使ってレイアウトを構築し、モバイル画面にコンテンツを表示します。実際のUI構造にコンポーネントを組み合わせる実践的な練習を行います。
JavaScriptオブジェクトとStyleSheetを通じてCSSに似たプロパティを適用する、React Nativeのスタイリングシステムを習得します。Flexboxを使って、iOSとAndroidのさまざまな画面サイズに適応するレスポンシブなレイアウトを構築します。
PropsとStateを使ってReact Nativeのコンポーネント間でデータが流れる仕組みを理解します。Propsで子コンポーネントにデータを渡し、useStateでコンポーネント内の変化する値を管理する方法を学びます。このコースは、インタラクティブなモバイルアプリの基礎と…
モバイル画面でのユーザー操作を取得し、それに応答する方法を学びます。キーボード入力にはTextInput、タップにはTouchableOpacityとPressable、切り替えや選択にはSwitchとPickerコンポーネントを使います。
業界標準のReact Navigationライブラリを使って、React Nativeアプリに複数画面のナビゲーションを追加します。Stack Navigatorをセットアップし、画面間でデータを渡し、アプリの主要セクション向けにタブバーを構築します。
FlatListとSectionListを使って、大量のデータを効率的に表示します。これらのコンポーネントが描画を仮想化し、数千件の項目があってもスムーズなスクロール性能を維持する仕組みと、一般的なリストUIパターンの構築方法を学びます。
useStateとuseEffectの先へ進み、React Nativeで利用できるReact Hooks一式を習得します。useCallback、useMemo、useRef、useReducerを理解し、それぞれのHookがどのような問題に適しているかを学びます。
Reactに組み込まれたContext APIを使い、Prop Drillingなしでアプリ全体のStateを共有します。テーマ用のContextとユーザー認証用のContextを作成し、パフォーマンス上の問題を避けながら複数のContextを組み合わせる方法を学びます。
React Nativeアプリを実際のAPIに接続します。マウント時のネットワークリクエストの実行にはuseEffectを使い、HTTP呼び出しの簡略化にはAxiosを使います。UIでローディング状態、エラー、レスポンスデータを処理する方法も学びます。
現在Reduxを使う公式推奨の方法であるRedux Toolkitを使い、複雑なアプリケーションStateを予測可能な形で管理します。Sliceの作成、ActionのDispatch、Selectorの利用、Redux StoreとReact Nativeコンポーネントの接続方…
Reduxよりもはるかに少ないボイラープレートで使える、最小限で高速な状態管理ソリューションZustandを学びます。ストアの作成、アクションの追加、React NativeコンポーネントへのZustandの組み込みを、わずか数行のコードで行います。
ユーザーデータやアプリの設定をデバイスにローカル保存し、アプリを再起動しても保持できるようにします。AsyncStorageによるキーバリューストレージを使用し、設定を永続化する設定画面を構築し、モバイルにおけるローカルストレージの制約について学びます。
モバイルアプリならではのネイティブハードウェアやOSの機能にアクセスします。Expoのmanaged workflow APIを使ってカメラを組み込み、GPS座標を取得し、ローカル通知をスケジュールします。iOSとAndroidの両方で権限を正しく扱う方法も学びます。
react-hook-formを使って、堅牢でパフォーマンスに優れたReact Nativeフォームを構築します。入力を登録し、バリデーションルールを適用し、フィールド単位のエラーメッセージを表示し、Controller APIでサードパーティ製UIコンポーネントを組み込みます。
組み込みのAnimated APIを使った、滑らかでネイティブ駆動のアニメーションでReact NativeのUIを生き生きと動かします。timing、spring、sequenceアニメーションを学び、opacity、position、scaleの変換に適用します。
React Native Reanimated 3とReact Native Gesture Handlerを使って、ジェスチャーで操作できる滑らかなインタラクションを構築します。swipe、pinch、panジェスチャーを処理し、UIスレッド上だけで実行されるworkletで…
ブラウザやメール、別のアプリにあるURLから、ユーザーがアプリを直接開けるようにします。iOSとAndroidの両方でカスタムURLスキームとUniversal Linksを設定し、受け取ったURLを処理して正しい画面へ遷移させます。
アプリが閉じているときでもユーザーを呼び戻せるよう、ユーザーのデバイスにプッシュ通知を送信します。デバイスをプッシュトークンに登録し、Expoのプッシュサービス経由で通知を送信し、タップ時にアプリ内の正しい画面を開く処理を実装します。
TanStack React Queryを使い、インターネット接続がなくても安定して動作するアプリを構築します。サーバーデータをデバイスにキャッシュし、接続が復旧したときにミューテーションを同期し、ユーザーにシームレスなオフライン体験を提供します。
SupabaseをReact Nativeアプリの完全なバックエンドとして統合し、認証、データベースクエリ、リアルタイムサブスクリプションを扱います。サーバーコードを書かずに、Postgresデータベースを基盤とする認証済み画面を構築します。
React Native Firebaseライブラリを使って、React NativeアプリにFirebase AuthenticationとCloud Firestoreを追加します。ユーザー認証、ドキュメントの保存とクエリ、Firestoreコレクションのリアルタイムなデー…
React Nativeアプリでよくあるパフォーマンスのボトルネックを診断し、解消します。FlipperとReact DevToolsでプロファイリングを行い、不要な再レンダリングをなくし、リストのスクロールを最適化し、JavaScriptバンドルのサイズを削減します。
JestとReact Native Testing Libraryを使って、React Nativeコードの信頼性の高いユニットテストとコンポーネントテストを書きます。コンポーネントを分離してテストし、ネイティブモジュールをモックし、本番環境に到達する前にリグレッションを検出で…
Maestroを使って、デバイスやシミュレーター上の実際のユーザーフローを自動化するエンドツーエンドテストを書きます。フローを記録し、UI要素を検証し、MaestroのテストをCIパイプラインに組み込んで、統合時のバグを自動的に検出します。
SwiftやKotlinでネイティブコードを書き、JavaScriptに公開することで、React Nativeを組み込みAPIの範囲を超えて拡張します。従来のネイティブモジュールパターンと、JSIを使う新しいTurbo Native Moduleアーキテクチャの両方を学びます。
Config Pluginsを書いて、Expo managed workflowアプリのネイティブプロジェクト設定を自動化します。ネイティブファイルを手動で編集することなく、Config PluginからAndroidManifest.xml、Info.plist、ビルドスクリ…
React NativeアプリをiOS App Storeの審査プロセス全体を通して公開まで進めます。署名証明書とプロビジョニングプロファイルを設定し、App Storeのメタデータを準備し、XcodeとEAS Buildを使ってビルドを申請します。
React Nativeアプリを最初から最後までGoogle Play Storeに公開します。署名済みAABを生成し、必要なすべてのアセットを含むPlay Consoleの掲載情報を設定し、初回の本番リリースに向けた段階的なロールアウトを進めます。
このコーストラックで学んだすべてを活用し、ゼロから本番運用可能なReact Nativeアプリを完成させます。アーキテクチャを計画し、認証、データ駆動型フィード、デバイス機能、アニメーションを実装して、両ストアにアプリを申請します。
はい。React Native Academyコースは無料で始められ、インタラクティブレッスンをすべて無料で完了できます。オプションのPRO登録で、高度なAIツールと共有可能な認定資格がアンロックされます。
いいえ。コースは基礎から始まり、より高度なトピックへと進むので、JAVASCRIPTの事前経験がなくても始められます。
実践しながら学びます。短いインタラクティブレッスンは、わかりやすい説明と、リアルタイムで実行される実践的なコード演習が組み合わさっており、24時間対応のAIチューターがわからないときにいつでもサポートします。
はい。PRO学習者は試験を受けて、React Native Academyコースの完了を証明する共有可能な認定資格を取得できます（認証コード付き）。
はい。CoddyKitはウェブとネイティブiOS・Androidアプリで利用でき、どのデバイスでもJAVASCRIPTを学習でき、進捗がすべてのデバイスで同期されます。