124
82

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

CursorでiOSアプリを開発してみよう!ホットリロードもできちゃうよ!

Last updated at Posted at 2024-10-26

はじめに

アプリ開発にはCursorはあんまり関係ないかな〜。なんてったって我々にはXcodeがいますからね!という気持ちがあり、Cursorには触れてきていませんでした。

しかし、やっぱりAIの力を借りられるのなら借りたい!爆速開発したい!個人開発ももっと高速でやりたい!そう思いCursorでのモバイル開発の可能性を探りに行きました。

Cursorとは

VSCodeライクなAIエディターです。普段VSCode使ってるよという人は移行しやすいと思います。

モバイルエンジニアズの我々はあまりVSCodeに馴染みがない人もいるかもしれません。でも初期設定時にAndroidStudioっぽくショートカットを設定することもできます。残念ながらXcodeは選択肢にありませんでした。

とりあえず触ってみる!くらいであれば無料なのでぜひ使ってみてください。
今回の記事で紹介する機能を使うのも無料で使えます。

Cursorの便利な機能

いろんな機能がありますが個人的にこれめちゃよい!と思ったものを紹介しておきます。

Docs

Docs機能は自分の好きなドキュメントを読み込ませてそれについて、教えてもらえる機能です。

Editor右側にあるChat機能で@docsと打ちDocsを選択します
スクリーンショット 2024-10-26 17.22.46.png

+Add new docを選択します
スクリーンショット 2024-10-26 17.24.33.png

ページのURLを入力し、呼び出し時の名前を決めます。
あとは、chatでドキュメントを呼び出して質問すれば回答を得られます

スクリーンショット 2024-10-26 17.28.31.png

Composer

Composerは複数ファイルにまたがってコードを書いてくれる機能です。

command+iでComposerのウィンドウを開くことができます。あとはここにプロンプトを書くだけです。Docで読みこんだPokeAPIを使ってみます。MVVMでファイルも分けるように指示すると、その通り作ってくれます。

スクリーンショット 2024-10-26 18.00.41.png

こんな感じで生成されます。Acceptを押すとコードの変更が反映されます。コードを修正して欲しい場合は指示をすることで書き直してくれます。

スクリーンショット 2024-10-26 18.07.36.png

ビルドどうする?

Xcodeからビルドする

Xcodeからビルドすることはもちろん可能です。
ただ、作成しているプロジェクトがFolder管理かGroup管理かでちょっと手順が変わります。

そもそもFolder管理Gruop管理って何?と言う人向け

とりあえず以下の認識でいいと思います。

Xcode16で作ったプロジェクト→Folder管理
Xcode15以前で作ったプロジェクト→Group管理

Folder管理にするとファイル追加とかでコンフリクトしなくなったみたいです。
Group管理しているものもFolder管理に変換する機能がXcode16で追加されているようです。
僕もまだ詳しくは理解していません...

Group管理

Group管理の場合はCursorからファイルを追加しても、Xcodeでプロジェクトを開くとファイルが表示されていません。
以下の画像のようにAdd Files ToからCursorで作成したファイルを追加してあげることでXcodeから読み込み、ビルドができるようになります。
スクリーンショット 2024-10-26 16.44.15.png

Folder管理

Folder管理の場合はGroup管理の時のようにファイルを追加するという作業を挟む必要がありません。Cursorで追加したファイルはそのままXcode側から参照できます。Cursor開発の場合はFolder管理の方が楽そう。
まだFolder管理にして不便なところがあまりわかってないので、どこかで不便ポイントが出てきたりするかも。

Cursorからビルド

VSCodeの拡張であるSweetPadを導入することで、Cursorから直接ビルドすることができるようになります。Folder管理しているならこれを使えばサクッとCursorからビルドできるはずです。

手順

Sweetpadのインストール

Cursorエディタ内のマーケットプレイスからSweetpadをインストールします。

スクリーンショット 2024-10-2616.51.02.png

エディタの下部にプロジェクト名の表示があり、そこからビルドスキームを変更できます。また、シミュレーターの機種も変更できます。僕は現在iOS18の端末と実機では端末ではビルドできていますが、iOS17のシミュレーターでビルドしようとするとそんなのないと言われてしまいます。
スクリーンショット 2024-10-26 17.02.23.png

ビルドする

command+shift+pで以下のような、実行コマンドの一覧がでるので、ここでSweetPad: Build & Run (Launch)を選択し、実行します。

歯車からショートカットキーを設定することもできます。僕はcontrol+command+rにしました。(command+rは他のとバッティングする)

もしこれでビルドが失敗する場合はxcodebuildのコマンドラインツールを最新にするなどしてみてください。

スクリーンショット 2024-10-26 17.05.27.png

※XcodeGenのコマンドもSweetPad内にあったので、XcodeGen使ってればGroup、Folder関係なくビルドできそうだなぁと思いつつ試してはいません。

ホットリロード

ホットリロードが動いている様子は以下から。

導入方法

このツールを使ってホットリロードを実現します。

手順

パッケージを入れる

ここはサクッと行きます。
SPM

https://github.com/krzysztofzablocki/Inject.git

cocoapods

pod 'InjectHotReload'

BuildSettingsを編集

Xcodeを開いてPROJECT>Build SettingにあるOther Linker FlagsDebug-Xlinker-interposableを追加します。このとき「""」(ダブルクウォーテーション)でそれぞれが囲われていない状態にしてください。おそらく最初入力した時は自動で入ってしまいます。

スクリーンショット 2024-10-26 15.56.56.png

アプリのダウンロード

  • リンクからInjectionIII.app.zipをタップして最新のアプリをダウンロードします

  • アプリはmacのApplicationsフォルダ配下においてください。Applications配下に配置すると画像のようにLaunchPadに表示されます。使用しているXcodeも同じようにApplications配下に置いておく必要があります。

スクリーンショット 2024-10-26 16.05.28.png

Injectionアプリの起動

  • アプリを起動し、Open Projectからホットリロードをしたいプロジェクトのフォルダを選択してください。選択したとき特に何か表示が出たりはしません。選択するのはxcodeprojとかではないのでお気をつけください。画像の2枚目参照
  • ファイルを選択したら、もう一度メニューを開きPrepare Projectを選択します。
  • アラートが出るので「Go ahead」を押します

スクリーンショット 2024-10-26 16.13.52.png

スクリーンショット 2024-10-26 16.14.53.png

動かしてみよう

Cursorからプロジェクトを開いてみましょう。Prepare Projectが正常に動くと#if DEBUG以下のコードが追加されているはずです。

スクリーンショット 2024-10-26 17.52.45.png

ビルドし以下のような表示が出れば正常に動かせています。
僕はDesktopにプロジェクトファイルを置いていたら権限的に〜的なことを言われたので、別のディレクトリに移動させました。

スクリーンショット 2024-10-26 16.21.02.png

あとはCursor側でコードを変更して、command+sを押せばシミュレーターの表示も変わるはずです!いえーい。

これもやっておくと良い

SweetpadのAutcompleteもやっておくと良さそうです。
これは、以下のようにButtonと打つとXcode上では候補を出してくれると思いますが、Cursorではデフォルトでは出ません。それを解決してくれるのがAutocompleteです。

スクリーンショット 2024-10-26 17.17.07.png

手順

以下のコマンドを叩く!

brew install xcode-build-server --head

Cursorでcommand+shift+pを押して、実行コマンド一覧からSweetPad: Generate Build Server Configを実行!!

個人開発にちょっと使ってみた感想

個人で開発しているアプリ(ファイル数50くらい)のプロジェクトを開いて、アプリがどういうものか説明させるとちゃんと自分のアプリの内容を答えてくれます。

こんな感じの処理ってどこに書いてたっけ?と聞けば該当コードの場所を教えてくれます。そして、こうやって変更したいんだけど、と言うとコードの修正案を出してくれます。

触ってみて感じたこと

今のところかなり可能性を感じています。
アプリ開発でネックになるビルドなども、VSCodeの拡張からできるし、ホットリロードもできるし良いっすね。

おわりに

もう少し触って可能性を深掘ります。
おーわーりー!

あ、よかったらいいねもポチッとお願いします!!!!

参考

124
82
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
124
82

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?