iPadへの開発環境の移行と顛末

akichan
11 min readDec 4, 2022

--

この記事は🎅GMOペパボエンジニア Advent Calendar 2022の4日目の記事です。昨日はいのうえ(@inoway46)さんの【入社エントリー】ペパボカレッジを全力でおすすめしてみるでした。私も2018年にペパボカレッジ枠で入社しており、同じように想像以上に刺激を受ける環境に驚いたことを思い出しました。

昨年、自作PCを組みNieRシリーズやstray catなどのゲームを楽しんでいます。せっかく強いマシンを買ったので、プライベートの開発や検証もこのマシンでできるようにしようと思い、WSLの環境等を整えたところ十分満足できるレベルで使えるようになりました。その結果、以前は開発用途でメインに使っていたMacBook Airの出番がめっきり減ってしまいました。また、ここ数年外出の機会もかなり減り外で作業する機会もあまりないため、iPad とMagicKeyboardの組み合わせで十分まかなえそうとひらめいてしまいました。そこで、思い切ってiPadでソフトウェア開発できる環境を整えることにしました。

デバイスの見直し

所有していたiPad mini 6ではコードを書くには画面が小さいと感じたため、より大きい画面のiPadに買い換えることにしました。買い替えをiPadに限定したのは、いくつかの理由があります。

  • 書籍は基本的に電子版しか購入しないため、iPadをメインの電子書籍リーダーとして使っていた。Androidタブレットなども試したことがあったが結局一番使いやすかったのがiPadだった。
  • 電子書籍リーダー兼ラップトップの2つの役割を集約させたいため、個別に充電しなくてよく、脱着が用意なiPad向けMagicKeyboardが両方の用途をまかなうのに最適と考えた。

買い替えの候補としては、MagicKeyboardが利用できるiPad Air (M1)とiPad Pro(M1)が上がりました。Touch IDかFace IDかの違いの他、画面のリフレッシュレートやスピーカーの数などの差異があり悩みましたが、悩んだときは一番強いやつを買えという経験則に基づきiPad Proを選択しました。また、電子書籍リーダーとしての用途を考えると、12.9インチだと大きすぎると考えたため11インチモデルを選択しました。

これに合わせて、持ち運びのバッグも新調しました。今まではMacbook Airの持ち歩きには通勤の際にも利用しているAer Day Pack、iPad miniだけの場合はARC’TERYIX mantice2を利用していました。iPad Pro 11インチを持ち運ぶのには大きすぎあるいは小さすぎだったので、ちょうどiPadを持ち運ぶのに最適なサイズのAer Day Sling Max 3を購入しました。

Aer Day Sling Max 3

iPad Pro 11' (M1, Wifi+Cellular)とiPad用Magic Keyboardの購入にあわせ、Macbook Air (M1, 16GB RAM)とiPad mini 6(Wifi + Cellular)はメルカリで売却したのですが、ちょうどApple製品の値上げとかぶっていたため想定以上に高く売れたのは嬉しい誤算でした。

iPadでの開発環境候補

iPadでソフトウェア開発をする方法がいくつか考えられました。

iOS/iPadOS向けの開発環境アプリ

PythonistaやRubyist等のアプリが該当します。私は主にGolangを書くのですが、iOSでそれを実現できそうなアプリは見つけられませんでした。また、ファイルシステム等の制約が多いのもあり、このようなアプリを利用するのは諦めました。

Rasberry Piに直結

USB-CでRasPiにiPadを直結し、code-serverを使うようなやり方です。オフラインで動作するのがメリットですが、持ち物が多くなるのと、Rasberry Piの性能以上のことができないことから選びませんでした。(絶対にいらないけど、浪漫を感じでしまったのでやってみたくなりました。絶対にいらないのだけど…)

Web IDE

AWS Cloud9codespaceなどを利用する方法です。セットアップは非常に簡単です。しかし、Cloud9は操作感が馴染みませんでした。またこれらは従量課金のため、あまり軽い気持ちで開かなくなってしまい本末転倒になりそうと感じて選択しませんでした。また気軽にローカルにk8sクラスタ建てるのも難しそうというところも見送ったポイントです。

リモート接続して開発

VPSや自宅サーバーなどに接続する方法です。Blink等のSSHアプリで接続するか、ブラウザでVSCodeを使えるcode-serverを立ててアクセスする方法が考えられます。初期コストはかかりますが、最も自由度が高い選択肢です。

自分のニーズとしては、k8s関連の検証を行ったり、カスタムコントローラーを書いたり、その他言語でソフトウェアを書いたりするため、リモート接続して開発する方法を選択しました。リモートのサーバーはちょうど自宅にThinkCentre M75q Tiny Gen2 (Ryzen7 PRO 5750GE, 32GB RAM, 1TB SSD M.2 PCIe-NVMe)が転がっていたのを流用し、code-serverをセットアップすることにしました。

環境構築

code-server

2022年12月現在はVSCode serverが提供されていますが、構築当初はまだPrivate Preview段階だったため、オープンソースのcode-serverを用いました。

公式ドキュメントのインストール手順に従うことで特に迷うことなくセットアップできました。TLSや認証などは後述のCloudFlare Zero Trustでいい感じになるので設定はしてません。

サーバーの外部公開

出先などからアクセスしたいため、自宅のサーバーを外部からアクセスできるように公開する必要があります。しかし、我が家はいわゆるインターネット無料の賃貸で、グローバルIPをサーバーに割り当てることができませんでした。

このようなケースの回避方法として、ngrok等のトンネリングツールを用いることで外部公開が可能です。しかしngrokは無料プランではランダムなドメインが割りあてられるため、外出中にサーバーが再起動した場合など不意にドメインが変わる可能性が考えられ、その度にドメインを確認するのは手間です。カスタムドメインが割りあて可能なProプランは月額$20で、ホビー用途で使うにはやや高いと感じたため選択しませんでした。

自分の用途に合ったngrokの代替を探したところ、Cloudflare Zero TrustのAccessサービスを見つけました。Cloudflareにドメインを移管する必要がありますが、自分の用途だと無料でトンネリングを実現できました。また、GitHubアカウント等のOAuthを設定する事も簡単にでき、セキュアに外部公開が可能です。(ほんとに無料でいいのこれ…)

Cloudflareにアカウントを作成しドメインの設定をしたら、こちらの手順に従い、サーバーにcloudflaredのインストールと設定を行います。

その後、self-hosted applicationの設定を行い、サーバー上でlocalhost:8080で待ち受けているcode-serverにプロキシするよう設定します。認証は自前でやるよりCloudflareに任せるのが安心と考え、Oauthの設定も行いました。

使ってみての感想

よかったこと

思ってたよりはまともに使えました。先日のCNDT2022の登壇で紹介したk8s Operatorは半分くらいこの環境で作成しました。ターミナルをフルスクリーンにすればネイティブのSSHアプリ代わりとしても十分利用できました。なにより荷物がかなりコンパクトになったので、身軽に外出できるようになったのが良かったです。課金を気にすることなく高スペックの環境が使えるというのも良かったです。

不満

数ヶ月、出先でこの環境で過ごしていくつか不満もありました

  • サンプルコードを写経するような作業はslide overでの表示を工夫するなどしても画面が狭く向かない
  • キーピッチが狭く無理な姿勢になるため健康に害がありそう
  • MagicKeyboardを装着した状態では重心がiPad本体側になり、膝の上におくような姿勢ではかなりぐらつき安定しない。テーブルのあるような環境での利用が前提となり、自宅のソファですこし作業したいみたいなケースで使いにくい
  • slide overなどをした際に、稀にcode-serverの表示が崩れたり言語切替が反映されなかったりとストレスに感じる
  • MagicKeyboardを使ったときのiPadの電池もちが良くない

結論

つい先日、M2 Macbook Airの発送通知が届きました。この記事が公開される頃には届いているでしょう。iPad Pro 11インチもiPad mini 6に再度リプレースされる予定です。

しばらく使ってみて、自分の用途だとストレスを感じるところがあり合わずに諦めることになりましたが、興味を持った方がいればぜひ試してノウハウを共有していただきたいです。

今から自前のサーバーでセットアップするにはVScode serverを利用するのが良いでしょう。今回Cloudflare Zerotrustで行ったトンネリングや認証等も提供されています。また、BlinkはローカルでVSCodeを立ち上げcodespaceなどにつなぐことも可能なのでそのような使い方が馴染む方には良い選択肢かもしれません。

Cloudflare ZeroTrustは素晴らしいサービスなので、ぜひ使いましょう。

--

--