第1弾
Expo UI SwiftUI 基礎コース
@expo/ui/swift-ui を使って iOS 向けの SwiftUI コンポーネントを扱う方法を、3画面のサンプルを作りながら体系的に学ぶ基礎コースです。
React Native / Expo12本3画面サンプル10分
このコースで学ぶこと
このコースでは、React Native / Expo から iOS 向けの SwiftUI コンポーネントを扱う @expo/ui/swift-ui を学びます。
全12回のレッスンを通して、Today、Tasks、Settings の3つの画面を作りながら、主要なコンポーネントの使いどころと実装方法を身につけます。
ロードマップ
| # | テーマ | 成果物 | ステータス |
|---|---|---|---|
| 1 | Expo UI SwiftUIの全体像 | 学習方針の理解 | 公開中 |
| 2 | プロジェクト準備 | 最小構成のプロジェクト | 公開中 |
| 3 | 3画面タブの作成 | タブ切り替えの土台 | 公開中 |
| 4 | Today画面のレイアウト | 基本的な配置 | 近日公開 |
| 5 | サマリーカードの実装 | コンポーネントの組み合わせ | 近日公開 |
| 6 | 操作ボタンの追加 | インタラクションの基礎 | 近日公開 |
| 7 | Tasks画面のフォーム | 入力系の扱い | 近日公開 |
| 8 | タスク一覧の実装 | リスト表示 | 近日公開 |
| 9 | 行操作の追加 | スワイプやメニュー | 近日公開 |
| 10 | Settings画面のフォーム | 複雑な入力構成 | 近日公開 |
| 11 | 選択UIの実装 | 各種ピッカーの使い分け | 近日公開 |
| 12 | サンプルの仕上げ | 3画面サンプルの完成 | 近日公開 |
Day 一覧
Day 1
Expo UI SwiftUIの全体像
React Native / Expo で iOS 向けSwiftUIコンポーネントを扱う @expo/ui/swift-ui の学習方針を整理し、3画面サンプルで何を作りながら学ぶかを紹介します。
無料公開10分Day 2
Expo UI SwiftUIのプロジェクト準備
Expo の教材用プロジェクトを作成し、@expo/ui/swift-ui の Host と Text を使って iOS で SwiftUI component を表示する最小構成を作ります。
無料公開8分Day 3
Expo UI SwiftUIで3画面タブを作る
@expo/ui/swift-ui の TabView を使い、Today、Tasks、Settings の3画面を切り替えられる最小構成を作ります。各画面では Host と Text を使って、どの画面か分かる状態にします。
無料公開12分