iPhoneが出てからというもの、ソースコードリーディングを暇な時にできればなーとずっと画策していたのですが、なかなかかなわず。

iPadでコードを書ける環境を整備するってのをちょくちょく見かけてたし、つい最近もバズったのがあったんで改めて調べてみました。

いつも「iPad コードリーディング」などと調べることがいいんですが、観点を「読む」から「書く」に変えて「iPad プログラミング エディター」などと調べてみました。

なぜか今まであまり考えたことがなかったけど、プログラミングができるなら読むのだってそれなりにできるはずです。

Working Copy

まずGitHubを参照するにあたり、Working Copyというアプリを入れます。

Working CopyはiOSデバイスで動くGitクライアントでリポジトリをクローンしたり、手元でファイルを変更してリモートリポジトリへPushしたり色々なことができます。

‎Working Copy
‎Access Git repositories on the go. Clone, edit, commit and push while allowing other apps access to repositories. Git is a important part of our work-life and iOS can take part in this. The ability to commit even when offline has added utility on a device that moves in and out of network coverage.…

実はこれ単体だけでもそれなりにコードを読むことができます。ディレクトリツリーを辿ってファイルを開けるし、ある程度シンタックスハイライトしてくれるし、シンボルの検索もできます。

読みたいプロジェクトによってはこれだけでも十分使えるレベルと言えそうです。

キャプチャでちょっと紹介します。

rails/railsをクローンしてみる

中身を見たり検索したり

なかなか、それなりに見えますよね。

iPadでも使える

サイドバーとエディター画面にわかれているのでもう少し使いやすいです。

Working Copyの弱点

iPhoneにしてもiPadにしてもナビゲーションが大変です。ファイルの移動をするのにディレクトリを戻ったり潜ったり。

iPadはサイドバーがありますが、選べるのは同一階層のみ。別階層のファイルを交互に読みたいときなどには適していません。

シンタックスハイライトが弱い

hamlとかvueとか、プログラミング言語そのものではないフォーマットのハイライトができません。

たとえばvueコンポーネントはこんな感じになっちゃってまともに読めません。実は最近Vueアプリのコードを読みたいと思っていたのでこれは困ります。

そこでGoCoEdit

そんな弱点を補ってくれるのがGoCoEditというiOSアプリです。買い切りの有料アプリで、大体1000円ほど。ファイルの移動やシンタックスハイライトもだいぶ快適です。

‎GoCoEdit - Code & Text Editor
‎GoCodeEditor is a Code Editor optimized for fast opening and editing local and remote files (Dropbox, OneDrive, Google Drive, FTP, SFTP/SSH) on your iOS Device. FEATURES: ------------------------------ • Sublime like Code-Editor! • Universal App (use it on your iPad, iPhone & iPod Touch) • iPhon…

iCloud Driveからファイルの読み出しができるほかGoogleDriveやDropboxなどとも連携できますが、なんといってもWorking Copyからファイルをまるっと読み出せるのが良いです。

つまりGitHubからCloneしたリポジトリのコードを全部GoCoEdit側で開くことができ、Working Copyよりも便利にコードを読めるというわけです。

初期設定ではエディター部を選択したときにかならずキーボードが開いてしまいますが、これは設定の「Enable Auto-Keyboard」の設定を無効にすることで回避でき、読むことに専念できます。

参考までにスクショを載せてみます。まずはファイルツリー。

続いてVueコンポーネントのシンタックスハイライト。ちなみにこちらのスクショでは画面上部にファイルごとのタブが見えるのがわかります。開いているファイルはタブで切り替えることも可能です。

この組み合わせでコードリーディングを捗らせたいです。