Titanium

Give your Titanium App a Turbo Boost – Part 2

Exploring the power and extensibility of Axway Titanium Alloy

In Part 1 of this series, we talked about the different ways you can use and extend the Titanium platform for building cross-platform native mobile apps. Today, we dig in with a detailed example of how extend the power of Titanium Alloy, the MVC framework created to make building with Titanium even easier.

When we ended up last time, we saw that we could install a local version of Alloy to use with Titanium. To fully demonstrate the power of this seemingly simple step, I’ve created a fork of the open-source Titanium Alloy framework and published it on GitHub here: https://github.com/brentonhouse/titanium-turbo. I’ve called it “Turbo” to go along with the theme of this series, and I’ll walk you through what I’ve done and demonstrate the power of Titanium Alloy.


It is important to note that Turbo is not an official Axway product. Like Alloy, it is an open-source project, but Turbo is supported only by the Titanium development community.


I started this experiment by taking some features from my Alloy wishlist and adding them into Turbo. You can see the full list of implemented features here but I will highlight a couple below:

  • Support installing npm packages in the project root directory
  • Support for extra XML attributes such as fontSize, fontFamily, etc.
  • Replace Underscore.js with Lodash
  • Support for camelCase, snake_case, and kabab-case in XML views.
  • Adding a `` element to XML views that supports JavaScript code in it.

Since starting this series, A LOT of the features have been merged into Alloy already and are marked by this image: Feature Merged into Alloy in the feature list. The features that are exclusive to Turbo are marked with this image: Exclusive Turbo Feature

sparkly new features

A lot of the new features I added for this experiment are superficial changes (like supporting camelCase in XML views 😊) that you might not care about and probably will never make it into Alloy.

That’s OK.

There are some far more serious features that will probably catch your eye as you peruse the feature list.

One of those being npm support.

npm

npm support

What this feature doesn’t do:

What this feature does not do is magically make every package published on npm work in Titanium. For starters, packages on npm don’t even have to have to be JavaScript modules. Also, a lot of JavaScript packages out there are intended for Node.js which depends on the Node.js runtime (and associated global modules) being available. While the Titanium team has created polyfills for some of the Node.js global modules (such as os, path, and process) and they are working on creating more, you can’t just drop in a Node.js package and expect it to work.

What this feature does do:

What this feature does do is it allows you to run npm install your-cool-package in the root of your project. This will install that package as a dependency, add it to the root package.json file, and will make that Titanium-compatible module accessible to you in your mobile app. Just make sure it isn’t a Node.js runtime-dependent package.

Get on with it!

So, if you take the feature I added to install npm packages in the root of the project and now combine that with the all new Titanium 8.1.x feature of being able to install native modules from npm, you have yourself a very sweet dev setup!

Not only is your code repo going to be smaller (because a lot of code will be in node_modules directory, which is (or should be) ignored), but because your project is now very self-contained, you can do some cool, crazy stuff like:

wait for it…

Building and deploying your iOS and Android apps from the cloud!

Yup! With all your dependencies (Titanium, Turbo, native modules, and JavaScript modules) being local, you can use cloud CI workflows (like Azure DevOps and the recently announced GitHub Actions) to build and deploy your iOS and Android apps from the cloud.

So, now you can build, test, and deploy your iOS app to users on TestFlight and in the App Store — all without you ever using a local MacOS computer yourself! You can also build and deploy your Android apps to Google Beta and Google Play as well!

Granted, I wouldn’t recommend this method as a replacement while you are still in the process of developing and debugging your app on a MacOS computer, as the cloud process would be slower. Plus, local development and testing using Titanium LiveView is SUPER FAST. What it’s great for is Continuous Integration (CI) build servers where you need to create a build of the app and have it deployed to testers. It’s very exciting to know that Titanium supports so many options!!

Take Titanium Turbo for a spin

If you want to give Turbo a try, you can create a new project using a template I created:

First, make sure you already have the mobile toolkit already installed (see this post for an overview):

npm install -g @geek/mobile

then run this command to create a new app based on the default turbo template:

mobile app:create my-app-name

OR… if you want to try out a template that includes a lot of what you already need for cloud CI builds, try this:

mobile app:create my-app-name @titanium/template-turbo-next

Because it uses the new npm package features, be sure to run this before building your app as it will then automatically install all your native and JavaScript dependencies.

npm install

You can now build your app the same way you would any other Titanium mobile app project using:

ti build --platform ios --liveview

— OR —

ti build --platform android --liveview

If you chose the next template, you also have this command available to you which is just a shortcut to use with CI build servers that support npm.

npm run build

Take a look at the Titanium CLI documentation for building, if you have any questions about other options.

Conclusion

Axway Titanium Alloy is both powerful and flexible!

With a little effort, we were able to harness this framework to add support for some custom features and were also able to see it fly. Literally! By taking advantage of the power of Titanium, we can now build and deploy apps from the cloud!