Volt MX を自学自習していくシリーズです。 前回までの記事で Iris という開発ツールのインストールが完了しました。 今回は Iris が提供するHikesというチュートリアル機能を使ってモバイルアプリを作っていく話となります。 実際には作るというよりはMarketplaceからサンプルアプリをインポートしビルドしモバイルデバイスで起動する一連の流れを体感することができました。
目次
HCL 社のチュートリアル
まずはHCL社が提供するチュートリアルを参考に進めていきます。
基本的にはチュートリアル通りに進めるだけなので具体的な手順、細かい手順の紹介はしません。 自分の備忘のためにポイント絞ってメモ的に残していきます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/image.png)
Hikes について
HCL社のチュートリアルはIrisで提供されるHikesというチュートリアル機能に基づいて進めることになります。言い換えればこのHikesをHike(ハイキング)することでVolt MXでできることを把握したり実際に開発したり体感・体験できるということです。
Iris を起動しチュートリアルを始めていきます。 今回はMac 環境(Mac mini M1,Ventura 13.3.1) で作業を進めます。
Irisを起動するとVolt MX へのサインインが求められます。 demoライセンス取得時のアカウントでサインインします。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/c1e703b7105fd88fbb61296b123fe5aa-1024x709.png)
起動後に”コマンドラインデベロッパツールが必要です”とのことなので案内に従いインストールを進めます。これは環境により必要が無いこともあるでしょうし一回だけの作業になると思います。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/d237d93bf2a1f4bfef4a1f6bf7010081.png)
チュートリアルはIris が提供するHikesというチュートリアル機能を利用していくことになります。左メニューの一番下の山みたいなアイコンからHikesにアクセスします。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/d379f227f3afb1fbf90daefc1dad3b35.png)
Hikesが起動しました。 今回は左上にある”Launch your First Mobile App”をHikeします。 11ステップで11分間の作業時間と目安も案内されていて良いですね。
またカテゴリ”BUILD YOUR FIRST MOBILE APP”には”Launch your First Mobile App”以外にも10個のメニューが準備されています。合計約240分、4時間程度で修了できるということになります。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/cfa6e977b9452be776cf44ed3ddedc65-1024x647.png)
他のカテゴリも簡単に紹介していきます。
“BUILD YOUR FIRST WEB APP”。こちらはWeb App 開発に関するもの。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/9f0e3d4b7b5a6fe2e9641988091e0109-1024x351.png)
“DEVELOP THE FRONT END”。こちらはフロントエンド開発に関するもの。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/837b6dd88cf35fc22c7daaf753f1b3ff-1-1024x345.png)
“MANAGE BACK-END SERVICES”。こちらはバックエンド開発に関するもの。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/719ea3a7cd69c07d1156e7be298f4a23-1-1024x248.png)
“ADVANCED CONCEPTS”。 ネイティブアプリからSDKを呼び出す仕組みとなるNFIに関するもの。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/ddcfde23259cc338a895490d6c636c3f-1024x128.png)
Launch your First Mobile App
早速Hikeしてみました。 ”Launch your First Mobile App”を起動し、STARTから始めていきます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/17ddbfcf8ec934322321b7584d2f6910-1024x785.png)
あとは画面からの指示通りに進めていきます。 ちなみにFirst Mobile App はAccountsとRecipientsのリストを表示するアプリとのこと。 事前にやることとして、Volt MX App をモバイルデバイスにインストールしておくこととサンプルのCSVファイルのダウンロードとなります。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/e0f98e3e2d9fb21519cea82ee6ffb3a4-1.png)
最初のステップはVolt MX MarketplaceからRecipients Mobileを入手することです。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/db3564815cd49f883b7853bfeb6b4dd3-1.png)
検索したRecipients Mobile インポートしていきます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/f9b0502d9f7fe491950bd102073686fa-1024x356.png)
インポート後にProjectを開いたとこところ”RecipientsMobile”は古いバージョンで作られたものでアップグレードが必要とのこと。”OK”で先に進めます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/fa5df6f3bf403d3533dec9125995109e.png)
”RecipietnsMobile”がSTORYBOARDビューで開きます。 Hikesの説明ではIrisでの開発はこのSTORYBOARDビューとDESIGNビューの2つで進めていくとのこと。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/d0673477a1aa35a22f21a1f57c9e7a3a-1024x597.png)
以下がDESIGNビューです。 Formを具体的に指定し構成していくことが出来ます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/2d30d4c8b4a8348f7da8bb6949d690ab-1-1024x683.png)
次はIdentity Serviceにユーザを追加していきます。 手順はHikesからの案内通りに進めるだけですがここで最初にダウンロードしたCSVファイルをIMPORT USERSからインポートします。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/bcf695c3620724b52b9a5584ea83d4f6-5.png)
次はIrisを実行しているMAC とモバイルデバイスをUSBケーブルで接続します。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/69d5c9bd20fee5358bd1d11b6d63bac0-2.png)
Live Preview Settingsからビルドするターゲットの環境、今回はiOSとAndroid、を選択しビルドを進めます。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/8530c5b7f5dabd85e268e355ea3a5673.png)
モバイルデバイスでアプリ動作を確認していきます。 iPhoneのVolt MXアプリからLive Previewにより起動されたRecipietns Mobile にログインします。 ログインで使用するアカウントはCSVファイルからIdentity Serviceにインポートしたjohn.doe@woodburn.com アカウントです。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/S__2801670-1-576x1024.jpg)
アプリ上でのログインに成功し、情報が表示されました。
![](https://www.bigriver.jp/wp-content/uploads/2023/04/S__2801672-2-576x1024.jpg)
まとめ
HCLが提供するチュートリアルに従い、Hikesを実際に1つやってみました。 英語ではあるものの基本的にはHikesから案内される内容をそのまま進めていくことで Volt MX の開発を体験、体感することが出来ました。
今回の”My First Mobile App”のHikeでわかったことは以下です。
- Iris にはHikesという充実したチュートリアル機能がある
- Marketplaceから雛形となるアプリをインポートすることで一からアプリを作成する必要がない
- モバイルデバイスでのアプリ起動および動作確認もLive Preview機能を利用することで簡単にテストできる
- 今後のVolt MXの技術習得にはHikesは有用そう(もうちょっと数をこなすことでHikesが向くレベル感などがわかってきそう)
以上