Textastic: Code Editing on the iPad

I know that you’re sick of reading this. Frankly, I’m sick of writing this, but it bears repeating: the iPad can be used for something besides watching videos, reading, or other leisure activities. While it certainly excels at those types of tasks, it can also be used to create things as well.

Enter Textastic. Textastic is a text editor for the iPad that allows you to write in several different programming languages, with many of the features of a desktop text editor. If you’re ready to begin coding from your iPad, Textastic just might be the place to start.

The Essentials: Syntax Highlighting

No matter what language you’re writing in, syntax highlighting is the programmer’s godsend. By highlighting important aspects of the language with different colors you can quickly view what parts of your code are performing a certain function and are written properly, or which spots could use some work.

Since right now I only write with a bit of HTML and CSS I’m going to give some specific examples from those languages. Let’s say that I’m writing a CSS rule for my website’s title. It might look something like this:

Look at the colors, not the poor code.

Look at the colors, not the poor code.

Notice how certain elements are highlighted and are colored separately from the other elements. This lets me know that my code is working properly. If I write something improperly – say, I forget a closing semicolon – I get this:

One of the colors disappeared!

One of the colors disappeared!

Syntax highlighting is an easy, visual way to see if there are any obvious issues with your code. This code isn’t that complicated (or even complete) but you should get an idea for how syntax highlighting works.

The Essentials: Preview

Okay, so you’ve written something with one of Textastic’s supported languages (seen below). If you happen to have been writing something with HTML or Markdown you’re able to get a web preview of your document, much as you would with other applications.

Looking at some sample text with the web preview.

Looking at some sample text with the web preview.

If syntax highlighting isn’t your cup of tea, or you just want to see how a blog post will render in the browser, this web preview can be essential. Many languages won’t utilize this feature, but it helps cement Textastic as a fully-capable code editor for beginners.

Digging Deeper: Customization

We all have certain ways that we like to work. I prefer writing in fairly simple applications with little background noise, preferably somewhere with a decent chair and some form of caffeinated beverage easily available. So far as writers go that’s fairly laid back; programmers, though, are entirely different beasts.

Look at all the different monospaced fonts available.

Look at all the different monospaced fonts available.

Some people simply can’t stand writing with anything but their favorite typeface. To the untrained eye many of these typefaces look the same, but to the programmer it’s a bit like telling an interior decorator that those two whites are the same; you’re probably going to want to exit the room quickly, as that frustrated scowl turns into a snarling, frenzied beast.

A darker theme can make it a little easier on your eyes.

A darker theme can make it a little easier on your eyes.

Thankfully, Textastic should have enough options to keep most people happy. There are five different typefaces that one can write with, and you’re given control over the size of the font, whether or not line numbers are shown, themes for the colors shown, etc. If you can’t get your environment close enough to just right within Textastic you might need to consider what’s important to you while you’re trying to work.

Digging Deeper: Tools

That’s a lot of semicolons. Every time I end up looking at someone else’s code I can’t help but think that coding is a practice in repetition, as you are forced to reiterate factors multiple times in a single document.

TextExpander support is absolutely necessary for an app like this.

TextExpander support is absolutely necessary for an app like this.

Thankfully there are tools that can save you some mind-numbing time. First is a requirement for just about any text editor that might be used by serious writers, and that’s support for TextExpander. If you haven’t heard of TextExpander, it’s a suite of apps that allows you to write abbreviations and have them automatically replaced with the full text.

Let’s say that I get sick of typing Textastic. With TextExpander I can create a shortcut like ‘ttc’, and every time I activate that shortcut ‘ttc’ will be replaced with Textastic. Applied to code, this means that instead of typing ‘font-color:’ a thousand times over you could type something like ‘fc:’ and have the proper code inserted right away.

An extra row of keys with all of the punctuation shortcuts that you could ever need.

An extra row of keys with all of the punctuation shortcuts that you could ever need.

On top of that, Textastic features an extra row above the virtual keyboard (similar to iA Writer’s extra row, but aimed at coders) that gives you shortcuts to common symbols that you may need to type. There are plenty of options here, as the row scrolls to the left and right. Sometimes it’s frustrating to reach up for something and have it slightly to the left of where you’re used to, but for the most part it’s a non-issue.

Miscellanea

Let’s say that you want to edit a remote file. This isn’t all that uncommon (it may actually be a common use case), and you’re going to want your text editor to be capable of performing such a routine task. Textastic allows this, but in a slightly roundabout way. Instead of linking up with the file Textastic will download and re-upload the file when you’re finished, which can take a bit of time on a slow connection.

Browsing local and server-side files.

Browsing local and server-side files.

Given the app’s ability to access your server to edit those remote files, you might want an extra layer of protection from prying eyes and disastrous two-year-olds. You have the option of requiring a password when Textastic is launched; desirable if you have it linked to a remote server or don’t want someone accidentally deleting all of your hard work.

Conclusion

Look, I’m not going to beat around the bush: Textastic isn’t perfect. While I enjoy the app and it does everything that I need it to, I can’t see myself coding a website or whatever completely within the app. The iPad’s software keyboard is certainly usable, but I still find it uncomfortable for long writing.

Where Textastic finds its market is with people that might want to write blog posts within the app, or have remote access to their server when a computer isn’t available. Maybe you have a sudden inspiration or some time to kill with your iPad handy, and you want to bang out some code while you have the chance. That’s Textastic’s window of opportunity: quick fixes, ease of use, and proximity.

Still, who knows; maybe you’ll be able to code an entire site in Textastic. It’s certainly possible; pair the iPad with an external keyboard and I’d say that it’s even a viable option. Would you be able to use Textastic to create something, or is even attempting to code without a bona fide computer mind boggling to you?


Summary

Textastic is a fully-featured text/code editor for the iPad featuring syntax highlighting, high customizability, and an extra row of keys on top of the virtual keyboard to help you write your code.

7
  • Michał

    How does it compare to apps like Gusto or Markup?

    • raint

      Never used Markup before but I think Textastic is trying to mimic TextMate, and Gusto trying to mimic Coda

      Textastic, Gusto and Koder are the best 3 code editors for iPad so far IMO

  • Arno nyhm

    Why is there only ipad and no iphone app.
    I like to code onthr go with my iphone (this i have always with me)

    • raint

      Gusto has an iPhone version I think

      • Greg

        It does indeed, I’m rocking gusto on pad and phone

  • Pingback: Brainstorming, Designing, and Building a Website With Your iPad | iPad.AppStorm

  • Pingback: Best of AppStorm in January | androide.rs

theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow