• IT助成金利用
  • 無料デモ紹介ZOOM等オンラインでのご相談も可能です
  • お問い合わせ

※ ワンダーロボ設計書および関連する自動開発手法について、すべての著作権はワンダフルフライ株式会社に帰属します。

1.6　Freecode iOS Swiftソース生成


Freecode iOS生成


⚙️事前準備


ツール準備


Xcodeが必要です。もしインストールしていない場合は以下のリンクよりインストールしてください
Xcode

設計書準備

今回は「案件管理システム」の設計書を基に説明していきます。

↓↓ 「案件管理システム」の設計書 ↓↓

画像の説明


⚙️ソース生成


iOSがサーバーと連動できるように、事前に同じ設計書でSpring Bootのソースを生成してください。 Spring Bootのソースの作成方法については、以下の記事を参考にしてください。

Freecode Springbootソース生成


iOS(swift)ソース生成開始


Spring Bootのソースはすでに生成済みのため、AI分析をスキップして、直接ソース生成に進みます。


↓↓ ソース生成 ↓↓

画像の説明

iOS(swift)ソース生成中

生成進捗はポップアップ画面で確認できます。

↓↓ ポップアップ画面 ↓↓

画像の説明

iOS(swift)ソース生成完了

「処理完了」と表示されれば、生成は完了です。

↓↓ 「案件管理システム」の設計書 ↓↓

画像の説明


⚙️iOS(swift)ソース出力


iOS(swift)ソース出力開始


フリーコードのソース生成画面で、以下の手順でiOS(swift)ソース出力を行います。

  • step1：「iOS(swift)」を選択する
  • step2：「iOS出力」ボタンをクリックする


↓↓ ソース出力 ↓↓

画像の説明

iOS(swift)ソース出力中

iOS(swift)ソースを出力する際に、出力進捗を確認できます

↓↓ 出力進捗 ↓↓

画像の説明

iOS(swift)ソース出力完了

iOS(swift)ソース出力完了すると、進捗が100％になり、ZIPファイルがダウンロードできるようになります。

↓↓ ZIPファイル ↓↓

画像の説明


⚙️iOSプロジェクトの起動と確認


ソース解凍


Xcodeでプロジェクトを新規作成して、Freecodeから生成されたソースフォルダを新規プロジェクトにコピペします


Xcodeでプロジェクトを新規作成


必要なテンプレートを選択し、指定プロジェクト名を入力してからプロジェクトを作成します。


↓↓ 初期画面 ↓↓

画像の説明


↓↓ 次の画面 Appを選択 ↓↓

画像の説明


↓↓ 指定プロジェクト名を入力してからプロジェクトを作成 ↓↓

画像の説明


↓↓ 任意の場所にプロジェクトを作成 ↓↓

画像の説明


Freecodeから生成されたソースフォルダを新規プロジェクトフォルダに展開


既存のソースを新しいプロジェクト構成に合わせて配置します。


1:作成したプロジェクトを空にする


いくつかファイルが自動的に生成されるため、削除します


↓↓ 作成したプロジェクトのフォルダを開く➡指定したプロジェクト名のフォルダをクリック ↓↓

画像の説明


↓↓ 初期フォルダ内 ↓↓

画像の説明


↓↓ すべて選択してゴミ箱へ ↓↓

画像の説明


2:Freecodeから生成されたソースファイルを新規プロジェクトに移動


Freecodeから生成されたソースフォルダ内のファイルを作成したプロジェクトの指定の場所にコピーします


↓↓ 「Podfile」を移動 ➡ 前節で空にしたフォルダに移動 ↓↓

画像の説明


↓↓ 「Podfile」以外を移動 ↓↓

画像の説明


3:Podライブラリーのインストール


Podファイルにはプロジェクト名が記載されており、そのプロジェクト名はStep1で作成したプロジェクト名と一致している必要があります。一致していないと、今後のインストール時にエラーが発生します


↓↓ Podfileクリック ↓↓

画像の説明


↓↓ ターゲット名の変更 ↓↓

画像の説明

    ↓↓ インストール手順 ↓↓

  • step0：CocoaPods をインストール（step1のコマンドが使用できない場合）
    ➡コマンド：「sudo gem install cocoapods」
  • step1：「ターミナル」を開いてcdコマンドで作成したプロジェクトディレクトリに移動し、Podライブラリのインストール
    ➡コマンド：「pod install」
  • step2：インストール確認


↓↓ プロジェクトディレクトリに移動 ➡ インストールコマンド実行 ↓↓

画像の説明


↓↓ インストール確認 ↓↓

画像の説明


Xcodeで確認


プロジェクトを開く


「xcworkspace」とついたファイルをクリックしてプロジェクトを開きます


↓↓ 「xcworkspace」とついたファイルをクリック ↓↓

画像の説明


↓↓ クリック後 ↓↓

画像の説明


iOSの最小バージョンの設定


iOSの最小バージョン(13)を指定します


↓↓ バージョン指定 ↓↓

画像の説明


不要なフレームワークの削除


使用しないフレームワークをXcodeの「Frameworks and Libraries」から削除します。


↓↓ 「Frameworks and Libraries」から削除 ↓↓

画像の説明


↓↓ 削除後 ↓↓

画像の説明


ユーザースクリプトのサンドボックスを無効化


「ENABLE_USER_SCRIPT_SANDBOXING」 という項目で「NO」を設定し、スクリプト実行の制限を解除します。


↓↓ 「ENABLE_USER_SCRIPT_SANDBOXING」 という項目をクリック ↓↓

画像の説明


↓↓ 「NO」を設定 ↓↓

画像の説明


↓↓ 設定後 ↓↓

画像の説明


ブリッジングヘッダーファイルのパスの設定


「Swift Compiler -Genaral」の「Objective -C Bridging Header」にプロジェクト内のブリッジングヘッダーファイルのパスをコピーします

  • パス：ankenkanri/Other/bridging.h


↓↓ 「Objective -C Bridging Header」をクリック ↓↓

画像の説明


↓↓ パスをコピー ↓↓

画像の説明


↓↓ 設定後 ↓↓

画像の説明


ドメインの設定


プロジェクトにログイン、APIなどにアクセスできるために、実際のドメインに変更します。変更対象のファイルは下記となります。


↓↓ ドメイン変更場所 ↓↓

画像の説明


Spring Bootはソースを作成した環境に構築しているので、ドメイン設定のIPアドレスソース生成したPCのIPアドレスに切り替え、ymlファイルに記載されているポート番号を付けて保存します。


↓↓ 設定例 ↓↓

画像の説明


アプリのビルド・実行


すべての設定が完了したら、ビルドや実行で動作確認を行います。ビルドや実行は「▶」ボタンや画面上部ツールバーから実行することが可能です

実機で確認する場合は、PCに接続して実行すると、アプリがスマートフォンにインストールされます。


↓↓ 「▶」ボタン ↓↓

画像の説明


↓↓ 画面上部ツールバー ↓↓

画像の説明

ビルドに成功すると「Build sucessed」と表示され、シミュレーション実行でしたらシミュレーターが起動します。


↓↓ シミュレーション画面 ↓↓

画像の説明


⚙️動作確認


前節でビルドとともに作成されたシミュレーターを使用して動作確認を行う例を上げます。

動作確認

ログイン

ユーザーIDとパスワードを入力して、「ログイン」ボタンをクリックすると、ログイン直後の画面が表示され、確認ができます

ログオフボタン
ログイン画面 		ログオフ確認メッセージ
ログイン直後の画面
案件詳細

「案件詳細」ボタンをクリックすると、新規画面に遷移し、案件情報を入力して保存します

ログオフボタン
「案件詳細」ボタン 		ログオフ確認メッセージ
新規画面 		ログオフボタン
案件情報を入力➡保存 		ログオフ確認メッセージ
保存完了メッセージ
案件一覧

「案件一覧」ボタンをクリックすると、先ほど保存したレコードを確認できます

ログオフボタン
「案件一覧」ボタン 		ログオフ確認メッセージ
レコードを確認
案件一覧 選択

「選択」ボタンをクリックして、詳細画面で「A Company」を「B Company」に変更して、保存します。

ログオフボタン
「B Company」に変更 		ログオフ確認メッセージ
保存完了メッセージ 		ログオフ確認メッセージ
保存後の案件一覧画面


まとめ


これでiOSソース生成は完了です！ぜひ活用してください