Build Your Mobile Apps in the Cloud With GoTiggr

One of the benefits of the focus on developing mobile apps is that there is a huge effort in making writing apps an much easier process. The recent beta release of Tiggr Mobile Apps Builder takes this to the next level, making it possible for you to create your apps from within your own browser. I spoke with Max Katz to find out more about this amazing product.

DZone: What's the main hook for Tiggr Mobile Apps Builder?

Max Katz: It’s simple, with Tiggr Mobile Apps Builder you can build mobile web and native apps entirely in the cloud. The main features are:

• Web-based, nothing to install
• Build mobile web or native apps for any platform, device
• Easy to use visual jQuery Mobile components editor for building the UI
• Collaborate and share with development teams and customers, get feedback
• Connect to existing data services with REST or Web services
• Visual data binding between UI components and data sources
• Test the app in desktop or mobile browser

To make it very easy to start and understand how Tiggr works, we came up with 5 steps (yes, just 5) on how to approach building a mobile app. You'll find these steps at the end of the Q&A. I’d like to say that any one can (and should -- it’s really cool) try Tiggr Mobile Apps Builder today.  It’s in beta today but also free. Just go to http://gotiggr.com and click on Sign Up Now under Mobile Apps Builder. 

DZone: What does the architecture look like?

Max Katz:Tiggr Mobile Apps Builder uses JSF/RichFaces on the front (for pages such as login, project list, etc) and for the actual mobile editor we use Flex. On the back end we use Seam with Hibernate. Few weeks ago I did an interview with Tiggr chief architect Sasha Piskun where he describes the architecture in more detail. You can find the interview here.

DZone: So, the creation of the app is done right in the browser?

Max Katz: Exactly - that’s one of the “wow” things that we get from users when they try Tiggr Mobile Apps Builder. You build and test your mobile in the browser. Now, some steps still need to be completed outside Tiggr such as packing to be deployed to Android market. But, we are working on a whole set features where you will be able to do everything inside Tiggr such as packaging, signing, etc.

DZone: What is the application output?  What binaries are supported?

Max Katz: You can get a mobile app which means you will export HTML, JavaScript and CSS.  You can also get Android .apk file. We are working on making it possible to import iOS project, other mobile platforms and also project source, as Maven project.

DZone: Is there an emulation mode available?

Max Katz: The really great thing is that you don’t need one! Any point during development you can test the app in desktop browser or in mobile browser.

DZone: Does the application look the same on all platforms, or does it use the native widgets?

Max Katz: Mostly yes. Tiggr uses jQuery Mobile components for the UI which are optimized for various platforms and large number of devices.  Now, to get a native app,  we use PhoneGap library to wrap the HTML/JavaScript/CSS, so you end up with the same look and feel for native app as well. On a very high level, PhoneGap wraps the mobile wraps and provides access to underlying mobile platform.

DZone: Can I create native mobile apps using Tiggr Mobile Apps Builder?

Max Katz: Yes, we use PhoneGap library under the hood to generate a native app by wrapping HTML/JavaScript/CSS for various platforms.

DZone: How much does this cost?

Max Katz: Right now Tiggr Mobile Apps Builder is free. Later this year we will introduce a subscription-based plans.

I’d like to invite everyone again to try Tiggr Mobile Apps Builder at http://gotiggr.com.  We are very interested in user’s opinion and what features we should add. You can tell us what you think on http://getsatisfaction.com/gotiggr or via email: support@gotiggr.com. Or, via any of the resources below.

Docs, and getting started guides: gotiggr.com/apps_help
Follow Mobile Apps Builder on Twitter: @gotiggr
Like us on Facebook: facebook.com/gotiggr
Read our blog: blog.gotiggr.com
Road map: blog.gotiggr.com/roadmap

Five Steps To Create  A Mobile App With GoTiggr

Here are the 5 steps:

1. Build the UI with jQuery Mobile components
   
   
   
   Tiggr comes with various jQuery Mobile components (left-hand side) to make it easy and fast to build the app UI. Select any component and drag and drop it into the phone. Once a component is inserted, you can set varies properties, actions and events (right-hand side).
2. Define data sources
   
   An app without data, well, is not very interesting. Adding a data source is very simple in Tiggr. From Non Visual palette, drag and drop Data Source component, then set data source URL, other parameters and security if needed. Once a data source is defined, map input UI components to service request parameters, and response data is mapped to output UI components to for displaying the result.
   
   a. Mapping input UI components to request parameters:
   
   b. Mapping response data to output UI components:
3. Define JavaScript functions
   
   Although not required, we know some of you may want to write some custom JavaScript so we made it very simple. Write a custom JavaScript function or use any existing JavaScript library in your mobile app.
4. Glue it together with events and actions
   
   Define events and add actions to be invoked such as Execute Communication to invoke the data source when a button is clicked.
5. Test the app in browser or in Tiggr Mobile Tester app
   
   Test your mobile app inside your browser (desktop or phone) or using Tiggr Mobile Tester on your phone.
   
   Tiggr Mobile Tester for iPhone source code is available for download as an Open Source project from Subversion repository Please follow the instructions outlined in readme.txt on “How to Build an iOS Binary”.
   
   Tiggr Mobile Tester for Android is published in the Android App store. Source code of the Mobile Tester for Android is released as an Open Source and can be found at the same location as iPhone app source code.
   
   a. Lastly, export HTML, source code or get the binary for the app 

Max Katz is a Senior Systems Engineer and Lead RIA Strategist at Exadel. Max is a well-known speaker appearing at many conferences, webinars, and JUG meetings.

Max leads Exadel’s RIA and mobile strategy. Part of this role is working as developer advocate for Tiggr Mobile Apps Builder (gotiggr.com), a cloud-based application for building mobile Web and native apps for any device. In addition, Max leads Exadel’s open source projects (exadel.org) such as Fiji, Flamingo, and JavaFX Plug-in for Eclipse.

Max has been involved with RichFaces since its inception, publishing numerous articles, providing consulting and training, and authoring 2 “Practical RichFaces” books (Apress, 2008, 2011). Max also co-authored the DZone RichFaces 3 Refcard and the DZone RichFaces 4 Refcard. You can find Max's writings about RIA and mobile technologies on his blog, mkblog.exadel.com, and you can find his thoughts about these topics and others on Twitter at @maxkatz.

Max holds a Bachelor of Science in Computer Science from the University of California, Davis and an MBA from Golden Gate University.