💻

iPadでの開発環境を整える

2021/08/27に公開

iPadのMagic Keyboard買いました!!
自分はiPadAirですが、快適に使えています。

https://www.apple.com/jp/ipad-keyboards/

MacBookAirよりは小さくて軽いこのマシンで開発したくなります!
自分の持っているカバンだと、MacBookを持ち出すには少し大きめのカバンを使う必要があり、少し持っていくのがめんどくさいのです。

そこで自分がiPadでの開発環境を構築したので紹介します。

私のMacBookでの開発環境

MacBookではVScodeを利用して開発を行なっています。ファイルツリーを左側に表示して、下にはターミナルを表示しています

最終系

それiPadでの開発環境じゃねぇじゃん!!って突っ込まれそうですが、紹介します。

code-server

MacにDockerでcodeーserverをホストして、iPadからはそれに繋いでいます!!

https://github.com/cdr/code-server

https://hub.docker.com/r/codercom/code-server

そしてcodeーserverは下にターミナルを表示できるので、そこからMacにsshしています

正確にはiPadからMacにsshして開発をしているということです。

これのメリットは、自分のメインマシンに書いたコードを保存できるというところです。
仮にiPadのローカルに開発環境を作成すると、MacとiPadを行き来することになります。どうせiPadで本格的な開発は行わないので、いちいちGitHubなどを使って同期するのもめんどくさいです。

こちらがDocker環境です。
自分はMacのホームディレクトリにGitHubディレクトリを作成してそこにまとめているので、そこを見えるようにしています。
こうすることで、iPadから全てのコードを書くことができます。

docker-compose.yml
docker-compose.yml
version: "3"
services:
  code:
    image: codercom/code-server
    restart: unless-stopped
    environment:
      PASSWORD: "password"
    ports:
      - 8080:8080
    volumes:
      - ~/GitHub:/home/coder/ # code-serverからみえるように
      - ~/GitHub/code-server:/home/coder/.config/code-server # code-serverについている設定をみえるように

あとはdocker-compose up -dをすることで、Macのlocalhost:8080でcodeーserverを利用することができます。
MacのローカルIP:8080にiPadからブラウザでアクセスできます。iPadのローカルIPの調べ方は次に紹介します。
おすすめのiPadブラウザはSafariです。ホーム画面に追加してあたかもアプリかのように利用できますし、ブラウザともショートカットキーが被りません。

Chromeだと下のほうが隠れて使いづらかったです…

Macにsshを許可する

iPadからMacにsshするためには、Macの方で設定する必要があります。

システム環境設定 > 共有 からリモートログインを許可すればOKです。
ここにローカルIPが書いてあります。

MacのIP固定固定

MacのローカルIPを固定しないと、毎回変わってしまうと困ります。

システム環境設定 > ネットワーク > Wi-Fi > 詳細(右下にある) 
詳細設定で、TCP/IPのIPv4の設定をDHCPサーバーを使用(アドレスは手入力)にします。
自分は、最初に設定されていたIPv4アドレスにしました。

これで固定完了です。

試した方法

最初はiPadのローカル環境だけで解決させようとishというiOSアプリを利用しようとしました。

https://ish.app

そしてセットアップ用のスクリプトも書きました。

https://github.com/t-sakurai816/setup-for-ipad-ish

エディタはvimを利用しようとして、友人のvimmerと協力して、vscodeっぽいvimを作成してもらいました。

https://github.com/yCroma/saku-vim

しかし、ishでこのvimを利用するには重すぎました…
vimコマンドを打って立ち上がるのに、4〜5秒ほど時間がかかります。
そして私はvimをあまり使いこなせず、なかなか活かすことができませんでした。vscodeと勝手が違いすました。そのため、このvimの設定はMacで利用することにしました。(ありがとう友よ)

外から使うときはどうすんの?

外出先から使うときはどうすれば良いでしょうか。
ローカルIPに対して接続しているので、 LAN外からは利用することができません。
ルーターのポートを開けても良いですが、パスワード認証のcodeーserverに勝手に接続されても困りますし、セキュリティ的に不安が残ります。

そこで私はvpnが利用できるルーターを利用していることを思い出します。(今まで使ったことなかった。)
(アフィリンクではないので安心してください。)
https://www.amazon.co.jp/dp/B08BHPVZRB/ref=cm_sw_em_r_mt_dp_dl_0SWHSVYPEESYBE0NBSVY?_encoding=UTF8&psc=1

これでVPN設定をすることで、外出先からでも安全にMacに接続することができます。

このご時世なので、まだ外出して試していませんが、テザリングして外部ネットワークから接続することはできました!

終わりに

Macにcodeーsererを構築することで、完全にMacと同様の環境を整えることが出来ました。最初はサーバー借りてcodeーserverをホストしようか悩みましたが、コードの同期や料金を考えるとあまりしたくなかったです。
「それiPadでの環境構築って言えるのかよ」というツッコミはあると思いますが、大目に見てください。どうせiPadでは本格的な開発はしないので、これくらいでいいのです。

そしてこの記事は練習の意味も込めて、iPadで書きました!意外となんとかなるもんですね

もしiPadでの開発環境で上手いやり方をしている方がいらっしゃいましたら、コメントやTwitterなどで教えてください!!

GitHubで編集を提案

Discussion