Web Development on the iPad Pro — 2018
I got my 11 inch iPad Pro to serve as my only computer, which means I need to be able to work from it as well as consume content, write emails etc. I’m a React developer, but occasionally work in WordPress and static HTML. I got the swanky keyboard case, and positively love flipping it open and consuming content.
Apple often touts the iPad Pro as a device that heralds the doom of “computers”, and it’s gorgeous. I mean you only need to look at their marketing to see what I mean:
I can’t argue with that first part — but we’ll come back to it a bit later. The new iPad Pro really is the best iPad Pro they’ve ever made, and it’s more capable than ever. I think by now we’ve learned that the new iPad Pro has more power than we’re even capable of using, and I feel like that’s really the crux of the issue with this device:
The hardware is years ahead of the software.
Web development doesn’t need super hardware. In fact, we’re fortunate to be one of the few development professions that can get by with quite modest hardware. So the iPad ticks every box (and more) that we need on the hardware front. So far so good.
In order to give this post some semblence of order, I’ll break it down into chapters based on common requirements we have, and what’s possible on the iPad Pro. I’ll skip things like browsers as we all know the iPad has Safari, Firefox, Chrome and the big names.
Writing Code
Let’s talk IDEs (isn’t that the sexiest question you’ve heard today?)
There are a couple of great IDEs available on iOS, but in my opinion the best falls between Coda or GoCoEdit. Both of these apps are great for writing code, and have syntax highlighting for most languages/frameworks, as well as the usual creature-comforts of desktop apps (code completion, snippets, etc)
Hell, they’ll even do FTP/SFTP so you don’t need to worry about working on remote servers.
We live in a connected world, and as web developers we require connectivity as part of our work, so I don’t rate the argument of the iPad doesn’t have a filesystem as a particularly bothersome deal for us.
For example, I can just SSH into a server, install NodeJS and then install whatever I like and get going in no time at all. If I need images, both these apps support iCloud Files, Dropbox, Google, you name it. Trust me, you can get your images onto a server with very little trouble.
Developer Tools
So, developer tools. They’re up there with oxygen on the must-haves list, and if you look at any guide on using the built-in developer tools for iOS Safari you’ll see that it requires you to have a Mac that you connect to over USB. Essentially you tether the iPad to the Mac, and use Safari on the Mac to display the tools.
Ouch.
If you had a Mac, why are you trying to dev- OK, lets avoid that tangent. Chrome to the rescue? No luck here, either. Mobile Chrome doesn’t yet support developer tools (and doesn’t plan to either, from what I can see).
You know how there’s an app for everything? Well, you’re in luck! Inspect Browser makes developer tools accessible for a low entry-fee. It also has a javascript console, which is a bonus!
So we can write code, send files to the remote server, and debug our working code in the browser. I’d say we’ve reached MVP for the bread and butter development and so far my feeling is that although things take a bit more effort, they’re workable.
Here’s where things get sour, though. And I need to clarify — I’m not looking to dash your hopes, and indeed if I’m wrong about any of this please correct me in the comments, but we need a quick reality check.
Back to the marketing shot
It’ll make you rethink what an iPad is capable of — and a computer is capable of.
Right — just about any computer on Earth supports something called a mouse. It’s my firm belief that anyone who doesn’t think this is an issue, hasn’t spent time coding on an iPad.
The iPad is one of the best ways to consume web content — but not create it. Reaching up to tap the screen so often gets fatiguing far quicker than you’d believe. Little things like selecting the wrong line, or failing to properly highlight a row of text get more frustrating, and take longer to fix than when using a mouse or a trackpad. Generally speaking, you have to become more precise, on a smaller screen area, while your arm is hovering.
It isn’t a great situation, and it’s one that bothered me a lot.
Most computers also let you extend your display area by adding another monitor. The iPad Pro lets you connect to an external display, and it’s up to the developers to support this in any way they see fit, but currently no app lets you run the IDE on one screen, and the preview browser on the other. It seems simple, and would be a much better way to work, but it isn’t here — yet.
Speaking of browsers, the iPad Pro — for all its “Pro” nature — runs the same baby browser versions as the iPhone, and the regular iPad.
Think the version of Chrome your iPad Pro runs is the same as Chrome on Mac? Think different. (Please tell me you see what I did there)
Also, as much as we might rail on it, Internet Explorer and Edge are still used by the masses, and we can’t natively preview any of this on the iPad. Sure, there are third party tools we can use for browser testing, but they all fall short of interactive tests, so we won’t include them.
Back to Developer Tools
Do you build React/Vue/Angular apps? Use Redux at all? Sadly even with developer tools, none of them allow you to install packages for your favourite frameworks — meaning in my case developing apps in React just wasn’t possible.
React and Redux devtools are lifesavers, and although it’s technically possible to get by without them, your job becomes much slower, and time is money. Every moment you choose to develop on the iPad Pro you’re costing yourself money, and this isn’t a wise choice to make in most situations.
The whole workflow problem
Here’s another issue I faced, which made me go from frustrated to defeated.
I open GoCoEdit and SSH into my server. Do some work, apply some changes, the usual. Then I open an image in Photos, do a quick edit, export it to iCloud. Open GoCoEdit again and FTP it to the server. Open Safari, then Chrome, give it a quick test, find things aren’t looking right so I copy the link to the page, open Inspect Browser, do the same stuff again and seem to know what the issue is. Go back to GoCoEdit, and because of iOS’ intelligent memory usage it’s kicked me out of FTP and SSH, and I have to reconnect before I can do anything again.
Trust me, it’s more pain than it’s worth.
You quickly realise that even if you did nail the workflow, you’re still coding for baby versions of the proper, desktop browsers. So you’d still need to get on a computer to make sure they’re OK.
I can totally see the iPad Pro being used as an emergency device to make quick edits to sites. You can totally do that. WordPress is super flexible, and you can quickly create and edit template pages if you need to. You can even FTP something a client emails you to get it on the server almost immediately.
I wouldn’t do my day job on it, though.
Give me closure, what did you do?
As sad as I am to say it, the iPad Pro is headed out. I replaced it with a Surface Pro and so far the experience is better in almost every way. I can’t justify keeping both as the cross-over is just too much, and I’m not so locked into the Apple ecosystem that I can’t adapt.
I really hope you found this article helpful. As I said, I don’t want to dash your hopes, and indeed if you find that these problems don’t matter to you, or you think “damn him, I have to try!”
To that I can only say — “OK. I hope you accomplish your dreams and go on to do great things on the iPad Pro where I wasn’t able to.”
