SwiftUIを学ぶ

無料のインタラクティブなSwiftUI講座です。毎回のレッスンで本物のSwiftUIコードを書き、作った画面をライブのスマートフォンプレビューで確認し、タップして状態が変わる様子を見られます。MacもXcodeも不要で、つまずいたときはAIヒントが助けてくれ、修了すると無料の修了証がもらえます。

学習を始める(無料)

シラバスを見る SwiftUI入門プレイグラウンド

4,075+ 人のcoddersが登録中

50 レッスン46 チャレンジ106 クイズの問題

初心者向け
AIによるコーディングサポート
実践的なインタラクティブレッスン
全レッスンに音声ナレーション付き
知識を確かめるクイズ
無料の修了証明書

シラバス

1 セクション1 プロジェクト50 レッスン46 チャレンジ106 クイズの問題

このセクションは Swift ジャーニーの一部です。シラバス全体にはさらに多くのセクションがあります - 下のプレビューをクリックして、ジャーニーページで確認してください。

セクション 1基礎86 レッスン
セクション 2ロジックとフロー56 レッスン
セクション 3
SwiftUI入門
セクションを始める開始開く閉じるSwiftUIを使ってSwiftでアプリの画面を構築します。ビューとモディファイア、スタックとレイアウト、状態とボタン、テキストフィールドとトグル、リスト、ナビゲーション、共有データについて学びます。すべてのレッスンで実際のSwiftUIコードを扱い、ライブプレビューで確認できます。50 レッスン46 チャレンジ106 問題1 プロジェクト
はじめに
2 レッスン28
01SwiftUIとはチャレンジクイズ
02Appファイルチャレンジクイズ
コンテンツの表示
6 レッスン615
01テキストビューチャレンジクイズ
02テキスト内の数値チャレンジクイズ
03フォントチャレンジクイズ
04カラーチャレンジクイズ
05SF Symbolsチャレンジクイズ
06復習 - 値札チャレンジ
Stackとレイアウト
5 レッスン512
01VStackチャレンジクイズ
02HStackチャレンジクイズ
03配置と間隔チャレンジクイズ
04SpacerとZStackチャレンジクイズ
05復習 - 天気カードチャレンジ
モディファイア
5 レッスン512
01パディングチャレンジクイズ
02背景チャレンジクイズ
03モディファイアの順序チャレンジクイズ
04フレームと図形チャレンジクイズ
05復習 - バッジメーカーチャレンジ
状態とボタン
5 レッスン512
01ボタンチャレンジクイズ
02@Stateプロパティチャレンジクイズ
03真偽状態チャレンジクイズ
04条件付きビューチャレンジクイズ
05復習 - スコアキーパーチャレンジ
ユーザー入力
5 レッスン512
01テキストフィールドチャレンジクイズ
02トグルチャレンジクイズ
03ステッパーとスライダーチャレンジクイズ
04ピッカーチャレンジクイズ
05復習 - 注文フォームチャレンジ
リスト
5 レッスン512
01ForEachチャレンジクイズ
02識別可能な項目チャレンジクイズ
03リストチャレンジクイズ
04項目の追加チャレンジクイズ
05まとめ - 買い物リストチャレンジ
ナビゲーション
5 レッスン512
01NavigationStackチャレンジクイズ
02NavigationLinkチャレンジクイズ
03データの受け渡しチャレンジクイズ
04シートとアラートチャレンジクイズ
05復習 - Plant Guideチャレンジ
データの共有
4 レッスン49
01@Bindingプロパティチャレンジクイズ
02監視可能なオブジェクトチャレンジクイズ
03環境オブジェクトチャレンジクイズ
04復習 - ステップカウンターチャレンジ
プロジェクト - Coddy Coffee
プロジェクト5 レッスン12
01プロジェクト概要チャレンジクイズ
02ドリンク画面プロジェクト
03サイズを選ぶプロジェクト
04数量と合計プロジェクト
05注文するプロジェクト
最終チャレンジ
3 レッスン3
01チップ計算機チャレンジ
02To-Doリストチャレンジ
03真偽ゲームチャレンジ

Swift ジャーニーのシラバス全体を見る

使える機能

コーディングを学ぶために使うすべて

Learn by Doing

Write real code, query databases, build websites, and master AI prompts. Our interactive lessons cover every skill modern developers need.

playground.js

Code Editor

1const greeting = "Hello, Coddy!"

2function sayHi(name) {

3 return greeting + " " + name

Test #1

Test #2

Test #3

Input

"Alex"

Output

"Hello, Coddy! Alex"

Build Your Streak

Stay consistent and watch your progress grow! Track your daily coding habit, protect your streak with freeze days, and earn rewards for showing up every day.

12 days streak

Return tomorrow to keep your streak!

January 2026

Double or Nothing

Day 5 of 7

Streak Freeze

2 left

Code Anywhere

Take your coding journey on the go! No setup, no downloads - just open and start coding. Available on iOS, Android and Web with 4.9 star ratings.

250

Variables

CONTINUE

4.9

Rating

You're Not Alone

Compete on global leaderboards, invite friends to earn rewards, and celebrate each other's wins. Coding is better with friends!

Challenger LeagueTop 7 advance

Alex7+ Days

2840

Jordan7+ Days

2650

Sam7+ Days

2420

Casey

2180

Morgan7+ Days

1950

Promotion zone

Every way to learn

Read, listen, test yourself, ask the AI, or look up anything you've already covered. Every lesson meets you where you are.

Intro to Variables

Audio

A variable is a named container that stores a value you can reference later in your program.

In Python, you create one by writing the name, an equals sign, then the value you want to store.

The value can change over time - reassigning the name simply points it to a new value.

1xSarah

Earn a Certificate

Earn certificates for every course you complete. Add them to your LinkedIn profile and resume to showcase your coding expertise to employers.

Certificate of Completion

This certifies thatJohn Doehas successfully completed

Python Fundamentals

DateJan 2026

Add to LinkedIn

CoddyでSwiftUIを学ぶ理由

iPhoneアプリの画面をブラウザで作れます。Macも、Xcodeも、シミュレーターのセットアップも不要です。コードは私たちのサーバーでコンパイルされ、プレビューにそのコードが表す画面が表示されるので、WindowsやLinux、ChromebookでもSwiftUIを学べます。
どの画面でも使うSwiftUI:テキスト、フォント、カラー、SF Symbols、スタック、配置とSpacer、モディファイアのチェーンと順番が大切な理由、ボタンと@State、テキストフィールド、トグル、スライダー、ピッカー、ForEachとList、NavigationStack、シートとアラート、そしてビュー間でデータを共有する@BindingとObservableオブジェクト。
タップできるライブプレビュー。プレビューでボタンを押したりトグルを切り替えたりすると、ビューが新しい状態で再描画されるので、宣言的UIの仕組みを読むだけでなく目で確かめられます。スマートフォンのフレーム表示に切り替えて、作った画面のスクリーンショットを保存することもできます。
途中で小さなアプリをいくつも作ります。値札や天気カードから、スコアカウンター、買い物リスト、植物図鑑まで。最後は複数画面のコーヒー注文アプリを最終プロジェクトとして作り、セクションを修了すると無料のSwiftUI修了証がもらえます。

SwiftUI学習に関するよくある質問

SwiftUIとは何ですか?

SwiftUIは、Swiftでアプリの画面を作るためのAppleのフレームワークです。要素をひとつずつ手作業で配置・更新する代わりに、現在のデータに対して画面が何を表示すべきかを記述すると、SwiftUIがそれを描画し、データが変わるたびに再描画します。画面はビュー、つまりbodyを持つ小さな構造体でできていて、スタックで組み合わせ、モディファイアで見た目を整えます。同じコードでiPhone、iPad、Mac、Apple Watch、Apple TV、Vision Proの画面を作れます。

ここでSwiftUIを学ぶのにMacやXcodeは必要ですか?

いいえ。すべてのレッスンはブラウザで動きます。コードは私たちのサーバーでコンパイルされ、エディタの横のプレビューにそのコードが作る画面が表示されるので、Windows、Linux、Chromebookでも問題ありません。実機のiPhoneでアプリを動かしたりApp Storeに公開したりするには、いずれXcodeの入ったMacが必要になりますが、ここで学んだことはそのまま活かせます。

プレビューはXcodeのものと同じですか?

役割は同じですが、iOSシミュレーターではありません。プレビューは、講座で扱うSwiftUIビューをCoddyが独自に実装したもので描画され、レッスンを採点するのと同じ実行結果から作られるので、画面に見えているものがそのままテストで確認される内容です。ボタンやトグル、リンクへのタップはあなたのコードに対して再生されるため、@Stateの変化もアプリと同じように表示されます。対象はレッスンで扱うビューとモディファイアで、SwiftUIフレームワークのすべてではないので、Xcodeの代わりではなく学ぶための場所と考えてください。

SwiftUIの前にSwiftを学ぶべきですか?

はい、少なくとも基礎は必要です。SwiftUIはSwiftのコードです。ビューは構造体で、@Stateはプロパティを包み、リストは配列をループし、コンパイラの型エラーはSwiftのエラーです。このセクションは、変数、型、関数、構造体、オプショナルを扱うSwiftジャーニーのFundamentalsセクションのすぐ後にあるので、Swiftが初めてならそこから始めましょう。

SwiftUIとUIKit、どちらを学ぶべきですか?

まずはSwiftUIから始めましょう。新しい画面を作る方法としてAppleが推奨しており、同じ画面でも必要なコードがずっと少なく、最近のチュートリアルやサンプルコード、Appleのセッションの多くもSwiftUIを使っています。UIKitは多くの既存アプリを支える古いフレームワークなので仕事で出会うこともありますが、SwiftUIとUIKitはひとつのアプリの中で一緒に使えますし、最初の一歩としてはSwiftUIのほうが簡単です。

SwiftUIは難しいですか?

基本はすぐに身につきます。数行でテキストや画像、ボタンを画面に出せて、プレビューで編集のたびに結果を確認できます。練習が必要なのは状態で考えることです。ビューを自分で変えるのではなく、データを変えてビューに再描画させます。そのためこのセクションでは、@Stateから@Binding、Observableオブジェクトへと一歩ずつ進み、各章の最後に小さなアプリを作ります。