tenonekoAIのてならい帖
はじめての人へ

Xcode と SwiftUI のはじめ方｜プロジェクトを作って、Claude Code とシミュレーターで動かす

コース5 iPhoneアプリ編 2 / 6・読む時間 約9分・最終確認日

このレッスンの要点

  • Xcode は Mac App Store から入れます。新しいプロジェクトは「App」を選び、画面のしくみ（Interface）は SwiftUI にします
  • Xcode で作ったプロジェクトのフォルダで Claude Code を起動し、CLAUDE.md にアプリの決めごとを書いておきます
  • Claude Code が書いたら、Xcode で行き先（シミュレーター）を選んで Run。エラーが出たら、その文を Claude Code に貼ります

Xcode を入れて、プロジェクトを作る

は Mac App Store から入れます。開いたら、新しいプロジェクトを作ります。メニューの File > New > Project を選び、Choose Template を押して、iOS の「App」を選びます。すると、下の項目を入れる画面が出ます。

入れる項目何を入れるか
Product Nameアプリの名前。App Store にも出る名前（あとで変えられる）
Team署名に使うアカウント。いまは空でもよい（レッスン3で設定）
Organization Identifier自分用の目印。アプリを見分ける「バンドル ID」になる。ほかの人と重ならないものにする
InterfaceSwiftUI
LanguageSwift
「Choose options for your new project」の画面で入れる項目（イラスト）。

ひな形にはいくつか種類があり、データの保存に SwiftData を使うアプリのひな形もあります。このコースでは、いちばん基本の「App」から始めて、保存はレッスン4で足します。最後に保存する場所を選んで Create を押すと、すぐにビルドできるプロジェクトのフォルダができます。

Choose Template を押さずに「App」を選ぶと、この画面は出ずにプロジェクトができます。そのときは、名前は File > Save Project で保存するときに入れ、バンドル ID はあとでプロジェクトの General のタブで変えられます。バンドル ID がほかの人と重なっていると、レッスン3で iPhone の署名を設定するときに警告が出て先へ進めません。例の jp.example の example は、自分の名前のローマ字などに変えておきます。

SwiftUI のアプリの作り

のアプリは、アプリ全体を表す「App」と、画面の部品を表す「View」でできています。ひな形のプロジェクトにも、この2つのファイルが入っています。

Appアプリ全体。起動したら、どの画面を出すかを決める
View画面。文字・画像・ボタンなどの部品を組み合わせる
部品Text（文字）・Image（画像）・List（一覧）など
アプリ → 画面 → 部品、の順に入れ子になっています。

コードの書き方そのものを覚えなくても進められますが、Apple の入門の教材「Develop in Swift Tutorials」を眺めておくと、Claude Code が書いたコードが読みやすくなります（英語です）。

プロジェクトのフォルダで Claude Code を起動する

ターミナルで、Xcode が作ったプロジェクトのフォルダに移ってから Claude Code を起動します。フォルダへの移り方はコース2のレッスン1、起動のしかたはコース2のレッスン3でくわしく説明しています。

ターミナル
cd ~/Documents/MyFirstApp
claude
このフォルダのファイルを、やさしい日本語で説明して
最初の画面のファイルと、アプリ全体のファイルがあります。…
最初は「説明して」から。中身がわかってから頼むと、まちがいが減ります。

最初に、アプリの決めごとを に書いてもらいます（作り方はコース2のレッスン4）。「画面は SwiftUI」「保存は SwiftData で端末の中だけ」「ビルドや提出は人が Xcode でやる」と書いておくと、毎回説明しなくてすみます。作業を終えるときは /exit と打ちます（exit でも終われます）。

Xcode に戻って、シミュレーターで動かす

Claude Code がファイルを書いたら、Xcode に戻ります。ツールバーの行き先（run destination）で iPhone の を選び、Run のボタン（またはメニューの Product > Run）を押すと、ビルドしてシミュレーターでアプリが動きます。止めるときはツールバーの Stop を押します。

1Claude Code が書く
2Xcode で Run
3エラーが出たら、その文を Claude Code に貼る
4直してもらって、もう1回 Run
この行き来が、アプリ作りの毎日の作業です。

ビルドが止まったときは、ツールバーのしるしを押すとエラーの一覧が見られます。その文をそのまま Claude Code に貼って「原因を説明してから直して」と頼みます。シミュレーターは便利ですが、本物の iPhone と同じ速さや機能があるわけではありません。実機で動かす方法はレッスン3で説明します。

よくある勘違い

「プロジェクトの土台も Claude Code に一から作らせる」のは遠回りです

空のフォルダで Claude Code に「アプリを作って」と頼む
Xcode のプロジェクトの設定ファイルは細かく、手で直すことになりがちです
土台は Xcode で作り、中身を Claude Code に書いてもらう
Xcode の「App」のひな形から始めれば、すぐにビルドして動かせます

やってみよう

  1. Mac App Store から Xcode を入れて開きます
  2. File > New > Project を選び、Choose Template を押して、iOS の「App」を選びます
  3. Product Name にアプリの名前を入れ、Organization Identifier に自分用の目印（例 jp.example の example を、自分の名前のローマ字などに変えたもの）を入れ、Interface が SwiftUI になっていることを確かめて、保存する場所を選びます
  4. ターミナルでそのプロジェクトのフォルダに移り、claude で Claude Code を起動して、下の依頼文で CLAUDE.md を作ってもらいます
  5. Xcode に戻り、上の行き先（run destination）で iPhone のシミュレーターを選んで Run を押します
CLAUDE.md を作ってもらう依頼文（Claude Code に）このフォルダは Xcode で作った SwiftUI の iPhone アプリのプロジェクトです。CLAUDE.md を作って。中身は：アプリの1文「（だれが・いつ・何をするアプリか）」／画面は SwiftUI で書く／データは SwiftData で端末の中だけに保存する／ビルド・シミュレーター・実機・提出は人が Xcode でやる／1回に1つの画面だけ変える／ファイルを足したり消したりしたら、どのファイルかを最後に教える。いまあるファイルの説明も、やさしい日本語で教えて
Xcode のエラーを直してもらう依頼文（Claude Code に）Xcode でビルドしたら、次のエラーが出ました。どのファイルの何が原因かを説明してから直して。直したら、私が Xcode でもう1回ビルドします。（ここにエラーの文を貼る）

確認問題

Q1. Choose Template から作るときに入れる「Organization Identifier」は、何に使われる？
Q2. シミュレーターで問題なく動きました。iPhone で確かめる必要はある？
今日の練習

作ったプロジェクトを、シミュレーターの機種を変えて（小さい iPhone と大きい iPhone）2回動かしてみましょう。

前のレッスン
1. iPhoneアプリができるまでの全体図

この記事の用語

コース5 iPhoneアプリ編の目次

  1. 1iPhoneアプリができるまでの全体図
  2. 2Xcode と SwiftUI のはじめ方
  3. 3画面を作る
  4. 4データを保存する
  5. 5TestFlight で試してもらう
  6. 6審査に出して配信する