Web development on an iPad? It’s possible!
I work on a few side projects (besides this blog) outside of work, my main one being the scrappy, tongue-in-cheek Total Emojis as a Service (also known as TEaaS). I’ve worked on TEaaS on all sorts of different computers over the years, from MacBook Pros to my aging Windows desktop that I’m surprised still runs. These days, my primary non-work computer is actually a 10.5” iPad Pro with a Smart Keyboard. I’m crazy determined to avoid purchasing a laptop when I can do most of what I need and want to do outside of work on an iPad, so I’ve been looking for ways to continue my side project development over the years without an actual laptop. Here’s what I’ve come up with that has worked well for me so far. Note that this article assumes that you know what you need to install and run on a server to get your code running — if you are unsure what needs to be installed, I recommend looking at tutorials like the ones on DigitalOcean to get started.
Step 1: Find a place for the code to run
At this point, there’s no way to run any sort of code locally on iOS without some crazy workarounds (besides Swift via Swift Playgrounds). Because of this, you’ll need to run some sort of computer somewhere that will run the code that you’re working on. There’s a few options to solve this.
Use an old computer laying around your house
If you have an unused desktop (or even laptop) laying around, this is the easiest and likely cheapest option. I’ve recently been using an ancient Shuttle XS36VL in a pinch when I need to run some code when I’m at home. It’s slow and I’m surprised it still works, but it costs nothing besides electricity to run, so I’m happy with it for some small side projects.
Accessing this computer at home outside of your home network isn’t just plug-and-play like it is inside your home network. Depending on your networking setup and your ISP, you’ll likely need to set up some sort of port forwarding on your router in order to access your old-computer-turned-home-server. If your home IP address can change, you’ll likely want to install something like DDClient on your server, and then sign up for a Dynamic DNS service (a list supported by DDClient is here) so you have a constant hostname to access and don’t have to worry about your changing IP. Additionally, some ISPs use Carrier-grade NAT which means there’s no actual way to access your home network from the internet in general, even with a Dynamic DNS service. In this case, you would need to contact your ISP to see if there’s some sort of a workaround (like getting a static IP for example).
Set up a server in the cloud
(There’s some affiliate links in this section, just a heads up)
If you don’t have another computer laying around, or you can’t access your home network from outside your home and you want to code while you’re not home, setting up something in the cloud is the next best option. These days, it’s super easy to get a server set up in the cloud. Two of the simplest options I’ve used with success are DigitalOcean and Vultr. They both offer servers for as low as $5/mo that would work great to run a small side project, and offer all sorts of pre-built images ready to install. You could also go for the big cloud providers like Amazon AWS, Google Cloud, or Microsoft Azure. These providers tend to be more complex to set up, but they offer a huge pile of features that could be used in the future, and often times have a free tier that you can use to run your basic server. They can start getting expensive once you exhaust your free tier, however. There’s also services like Heroku that exist if you don’t want to bother with managing the server itself, and want to find a place to just push code and have it run. Heroku has a limited free option, and tends to be more expensive than the other providers, but it is fully managed and super simple to use.
Step 2: Find a way to edit the code
Once you have a place to run your code set up, it’s time to find a way to edit the code. There’s a variety of ways to do this, I’m going to cover the ones I’ve had success with.
Code Editor by Panic
I frequently use Code Editor (formerly Coda for iOS) by Panic. It is a more expensive solution at $24.99 at the time of this writing, but it’s insanely full featured. It has syntax highlighting for all major languages, auto-completion, ability to open and synchronize files stored on a remote server (like the one you just set up from Step 1), and also lets you edit files that are stored locally on your iPad offline. It also offers a built in SSH terminal, which is super helpful for running anything you code remotely. It does have some flaws — I would like to see local Git support for example — but overall I’ve been very happy with it.
Textastic
While not as fully featured as Code Editor, Textastic is another fantastic, light-weight option. Like Code Editor, it supports syntax highlighting for a ton of languages (80+), and it can import TextMate and Sublime Text syntax definitions. Since it is so lightweight, it’s super fast. It also has a built in SSH terminal, and connecting to remote servers. Offline editing is fully supported as well. From my usage, it doesn’t look to support auto-synchronization like Code Editor does, but if you’re looking for a more minimal editor that is still very full featured, Textastic is a great option.
Vim, Emacs, or some other command line editor
If the editors above don’t match what you’re looking for, or you already have a super customized Vim or Emacs configuration, editing the code directly on the server you’re running the code on is a great option (unless you’re using Heroku, since that’s not an option). There’s a ton of SSH clients available for iPad — one that I prefer is Prompt 2 by Panic ($14.99). It has some neat tricks like a connection keepalive option, font customization (including Source Code Pro), Touch ID / Face ID / Passcode support, the ability to sync configuration between multiple iPads, and ability to store frequently used commands. However, it does lack mosh support, which makes using it (and any other standard SSH client) when you have a poor internet connection quite difficult. I used to code on a commuter train, and any standard SSH session would struggle to keep up when in a tin can going 70mph with iffy cell service. If this is a situation you might find yourself in, you’d want to look for an SSH client that supports mosh. The one that I often use is Blink ($19.99). It’s bare bones when it comes to its interface, but it’s super fast, and even has some commands you can run locally (like scp, curl, tail, tar etc.) to manage files locally on your iPad. It’s also open source! If you’re looking for a free (with a monthly fee required for additional features) SSH client, Terminus is an SSH client I’ve had success with. The free version fully supports ssh and mosh, and all other basic features you’d expect from an SSH client.
Step 3: Start Coding
This is the easy part :)
Step 4: Testing / Previewing your changes
Since iOS has no way to run the code you’ve just worked on locally, and you’ll often want to preview or debug some sort of web component that you’re working on, you’ll need to ensure that the web server you’re running is accessible to your iPad. This means you’ll either need to set up port forwarding via a SSH client, set up some sort of VPN that lets you connect to the server that’s running your code, or expose your application to the internet at large (not recommended). Depending on your SSH client, you can set up port forwarding from your iPad to the server running your code, which is probably the most secure and easy way to privately access what you’re working on. Blink (via the ssh -L command) and Terminus mentioned above support port forwarding, so those are two good options. Exposing your application to the internet is risky, especially if you’re working on something sensitive, but if you don’t mind someone stumbling upon what you’re working on, and are confident that your server is secure and someone couldn’t do something nefarious, then that could be ok. I still don’t recommend it, especially since there are free SSH clients for iOS that support port forwarding. VPNs are obviously secure, but require a lot more set up. Still, it could be a good option for you.
Inspecting pages
This is probably the hardest part about developing on an iPad. If you need something like the Chrome development tools to tweak CSS, see the JavaScript console, or just see what your HTML looks like, your options are fairly limited. One way to do this is to just run the browser on a separate machine and remotely connect to it. You could use a combination of the server you’re running your code on, port forwarding from your SSH client, and a VNC client like VNC Viewer (Free) or Screens ($19.99) to connect to the server and run a browser locally. You’d need to ensure that the server has some sort of window manager installed, and can run a browser (not a worry if connecting to a Mac or Windows machine).
If that’s not an option, you’ll need to look for an alternative solution on your iPad. There are apps like Inspect Browser ($6.99) that give you a lot of what you can get on a desktop — a JavaScript console, HTML and CSS inspector, device / resolution preview, and a network inspector. It’s pretty full featured, and many developers have had success with it.
There’s also free alternatives like MIHTool, but it uses weinre under the hood, which means you’re either connecting to MIHTool’s instance of weinre, or need to host your own. MIHTool provides a very similar experience to Web Inspector and Chrome Dev Tools due to its use of weinre, and also has some extra features on top. If you’re ok with the remote connection for the dev tools and want to use something for free, this option definitely works.
That’s it!
Hopefully this has helped you discover some of the ways that you can do real, full on software development on an iPad. iPads have serious potential to be a great on-the-go development device, so here’s hoping that Apple starts to make it easier to do serious software development locally on an iPad without any workarounds.
