Claude Media
Claude CodeでSwiftUI iOSアプリを開発する手順
Claude Codeチュートリアル

Claude CodeでSwiftUI iOSアプリを開発する手順

Claude Code CLIを使ってSwiftUIのiOSアプリを組み立てる手順です。プロジェクト作成からBashツールへのビルド許可、画面確認の方法まで扱います。

読了目安 約9分

Claude Code CLIはターミナルで動くツールなので、Xcodeのビルド・実行環境はそのまま使いながら、SwiftUIのコード自体はClaude Codeとの対話で組み立てられます。プロジェクトの用意からビルド・実行コマンドの許可、画面確認の方法まで、CLIを中心にした一連の流れをまとめます。

Claude CodeとXcodeの役割分担

Claude Codeが担うのはSwiftファイルの編集とターミナルコマンドの実行で、コンパイルとシミュレーター・実機での実行はXcode側が担います。SwiftUIはStoryboardを使わずコードだけでUIを組む仕組みなので、Claude Codeによるファイル編集との相性がよく、GUIエディタとの往復が発生しません。

Xcode自体にAIコーディング支援を組み込みたい場合は、Xcode 26の「Intelligence」設定からログインするClaude for Xcodeという別の入り口もあります。こちらはXcode本体に統合された機能で、既存のPro・Max・Team・Enterpriseプランでそのまま使えます。本記事で扱うのは、すでにClaude Code CLIを使っている、またはターミナル中心のワークフローでSwiftUI開発を進めたい場合の手順です。

前提条件

必要なのは次の3点です。

  • Apple SiliconのMacとXcode(iOSシミュレーターランタイムを含む)
  • インストール済みのClaude Code CLI(手順はClaude Code installガイドを参照)
  • SwiftUI Appテンプレートで作成したXcodeプロジェクト、または既存のSwiftUIプロジェクト

Claude Codeの公式ドキュメントは、CLIについて「どのターミナルでも動く」と説明しています。Xcodeの統合ターミナルでも、別ウィンドウのターミナルでも、動作に違いはありません。

ステップ1: プロジェクトを用意してClaude Codeを起動する

Xcodeで新規プロジェクトを作る場合は、テンプレート選択で「App」を選び、インターフェースに「SwiftUI」を指定します。プロジェクトフォルダーができたら、そのディレクトリでClaude Codeを起動します。

cd ~/dev/MyLandmarksApp
claude

起動後はいつも通り自然言語で依頼できます。「ContentViewにNavigationStackを追加して、リスト画面と詳細画面を作って」のように、実装したい画面を具体的に伝えるところから始めます。既存のSwiftUIプロジェクトに追加機能を実装させる場合も手順は同じで、対象ディレクトリでClaude Codeを起動するだけです。

ステップ2: Apple公式チュートリアルの構成を下敷きに実装を進める

Appleは長年「Introducing SwiftUI」というチュートリアル(Landmarksアプリを題材にした所要時間4時間25分のコース)を公開してきました。このページ自体が「現在のSwiftUIやXcodeの実践方法をもう反映していない」と明記しており、後継として「Develop in Swift Tutorials」への案内が出ています。

現行の「Develop in Swift Tutorials」は次の順で構成されています。この並びは、Claude Codeに依頼を出す順番の目安としても使えます。

  1. Getting started(プロジェクト作成)
  2. App design(画面設計)
  3. SwiftUI(ビュー階層・状態管理)
  4. Data modeling(SwiftDataによるデータ永続化)
  5. App development(アプリ開発全体の統合)
  6. Machine learning and AI
  7. Spatial computing(visionOS)
  8. App distribution(配信準備)

まずビュー階層とナビゲーションを組み、次にボタンや入力欄で状態管理を試し、SwiftDataでデータの永続化を加え、最後にテストと配信準備に進む、という流れです。

たとえばリスト画面を作る場合、最初に「NavigationStackで一覧画面を作って、モデルはダミーデータでいい」のようにビュー構造だけを依頼します。動きを確認してから「SwiftDataで永続化に置き換えて」と段階的に進めると、Claude Codeが一度に変更するファイル数を抑えられます。Apple公式の学習パスにも「Add functionality with Swift Testing」という章があり、モデルの実装とテストの追加をセットで扱っています。同じ発想で、Claude Codeにモデルを実装してもらったあとは「Swift Testingでユニットテストも書いて」と続けて依頼すると、実装とテストがずれにくくなります。

依頼のたびに同じ前提を説明し直さずに済むよう、プロジェクトルートにCLAUDE.mdを置いておくと効果的です。CLAUDE.mdはセッションの開始時に毎回読み込まれる永続的な指示ファイルで、ビルドコマンドやコーディング規約、プロジェクト構成のような「毎回説明し直すこと」を書く場所だと公式ドキュメントは位置づけています。

# MyLandmarksApp
 
- 対象: iOS 18以降、SwiftUI Appライフサイクル
- アーキテクチャ: MVVMを基本にする
- ビルド確認: 変更後は必ず xcodebuild でビルドが通るか確認する
- UIコンポーネントは Views/ 配下、データモデルは Models/ 配下に置く

ステップ3: ビルドとシミュレーター実行をBashツールに許可する

Claude Codeはxcodebuildやxcrun simctlのようなコマンドもBashツール経由でそのまま実行できます。ただし初期設定では、コマンドを実行するたびに確認を求められます。

繰り返し使うビルド・テストコマンドは、設定ファイルに許可ルールを書いておくと確認なしで実行されます。公式ドキュメントが示す構文はBash(コマンド *)の形式で、*以降の可変部分を無視してコマンドの先頭部分を一致させます。

{
  "permissions": {
    "allow": [
      "Bash(xcodebuild *)",
      "Bash(xcodebuild test *)",
      "Bash(xcrun simctl *)"
    ]
  }
}

この設定を加えると、ビルド・テスト・シミュレーター操作のたびに確認ダイアログが出なくなります。逆に言えば、Claude Codeがあなたの承認なしにビルド・実行を進められるようになるということです。プロジェクトに慣れて挙動を把握してから追加するのが安全です。xcodebuild test *を別に許可しておくと、ステップ2で依頼したSwift Testingのテストも確認なしで実行でき、実装とテストの往復が速くなります。

ステップ4: 画面の見た目を確認する方法を選ぶ

SwiftUIは書いたコードと実際の見た目が一致しているかの確認が要になります。確認の入り口は使っているClaude Codeの種類によって変わります。

入り口前提特徴
Claude Code Desktop前提macOS版DesktopアプリのCodeタブ特徴アプリをシミュレーターで動かすとiOS Simulatorペインが自動で開く。Accessibility権限は不要
Claude Code CLI + Xcode MCP前提Xcode 26.3以降特徴Model Context Protocol経由でXcodeと接続し、Xcode PreviewsをCLIから離れずキャプチャできる
Desktop Computer Use前提macOS版Desktopアプリ特徴画面全体を操作できる代わりにAccessibility・Screen Recording権限が必要

Xcode 26.3で追加されたMCP経由の連携は、Claude Agent SDKによるXcode統合の一部として提供されています。CLI環境のままXcode Previewsを見ながら実装を反復したい場合に向いています。設定手順や自律実行の詳細はClaude for Xcodeの使い方にまとめています。

SwiftUIの実装にApple Foundation Modelsのようなオンデバイスの機能を組み合わせたい場合は、Apple Foundation ModelsでClaudeを使い分けるも参考になります。

よくあるつまずき

古いチュートリアルのサンプルコードをそのまま参照してしまう

「Introducing SwiftUI」のLandmarksサンプルは、Apple自身が現行の実践方法を反映していないと明記しています。Claude Codeに実装方針を尋ねるときは、古いチュートリアルの構文をそのまま踏襲していないか、生成されたコードを確認します。

ビルドコマンドの確認が毎回出て作業が止まる

xcodebuildやxcrun simctlを都度承認していると、テンポよく反復できません。ステップ3の許可ルールを~/.claude/settings.jsonに追加すると解消します。

Xcode PreviewsのMCP連携が動かない

MCP経由のXcode Previewsキャプチャは、Xcode 26.3以降で追加された機能です。26.0〜26.2系では利用できないため、Xcodeのバージョンを先に確認します。

実機のiPhoneでの確認ができない

Desktop版のiOS Simulatorペインも、Computer Useによる画面操作も、対象はシミュレーターまたはMac自身の画面です。物理的なiPhone・iPadでの動作確認は、Xcodeから自分で実機ビルドして目視するか、スクリーンショットを会話に添付して伝えます。

生成されたSwiftUIコードが古いAPIを使っている

Claude Codeが提案するコードが、非推奨になったモディファイアや古いナビゲーションAPI(NavigationViewなど)を使っていることがあります。CLAUDE.mdに対象OSのバージョンを明記しておくと、この種のずれは起きにくくなります。気づいた場合は「NavigationStackに書き換えて」のように対象APIを名指しして直します。

まとめ

Claude Code CLIでSwiftUIのiOSアプリを作る流れは、プロジェクト作成・CLAUDE.mdでの規約共有・Bashツールへのビルド許可・画面確認方法の選択という4段階に分けられます。Apple公式の「Develop in Swift Tutorials」の構成は、Claude Codeへの依頼の順序を組み立てる目安として使えます。画面確認はDesktop版のiOS Simulatorペイン、CLI版のXcode MCP連携、Computer Useのいずれかから、使っている環境に合わせて選びます。Xcode本体でのAIコーディング支援が目的なら、CLIではなくClaude for Xcodeを使う選択肢もあります。

この記事を共有:XはてブLinkedIn

関連する記事

Claude Code をもっと見る →