Tiggzi Docs > Getting Started with Tiggzi

Getting Started with Tiggzi

Tiggzi Overview

Tiggzi is a cloud-based mobile platform and consists of the following two major components:

  • Tiggzi App builder
  • Tiggzi Backend Services

In order to provide a complete platform for mobile development, Tiggzi integrates leading mobile technologies such as:

  • jQuery Mobile
  • JavaScript, HTML5, CSS
  • Apache Cordova (aka PhoneGap)

Thus, the target app you get after exporting resembles a standard jQuery Mobile, HTML5 and/or PhoneGap app. You can build almost anything in Tiggzi that you can build using Notepad (or vi) with HTML5, jQuery Mobile and PhoneGap.

Tiggzi’s visual development environment makes it super easy and fast to build mobile UI, define REST services and map services to UI, test the app. However you are not limited by the visual builder. You can use any custom JavaScript, HTML or CSS to create any functionality you want! Remember: The resulting app is a hybrid app (with HTML5, jQuery Mobile and PhoneGap) running in the mobile browser.

Steps to Building a Mobile App in Tiggzi

Building an app in Tiggzi usually involves the following steps:

  1. Build the UI with jQuery Mobile, HTML5
  2. Set up REST service
  3. Map the service to UI and invoke it
  4. Test the app in a Web browser or on the device
  5. Export the app to the mobile Web, Android, or iOS

Building the UI with jQuery Mobile, HTML5

Tiggzi comes with various jQuery Mobile components (displayed in the left pane) to make it fast and easy to prototype and build the app UI. You can select any component and drag and drop it into your app. Once the component has been inserted, you can set various properties in the right pane.

You can also use HTML5 elements such as Audio and Video, insert a Google Map component or use the Panel component to insert any custom HTML code. Moreover, you can create multiple pages, navigate between them and write JavaScript.

Setting up REST Service

An app without data may not be very interesting. To get the required data, REST service should be set up.

Setting up REST service includes the following 5 general steps:

  1. Entering service URL
  2. Adding service request parameters
  3. Defining service response structure
  4. Mapping service to UI
  5. Invoking the service

Mapping the Service to UI and Invoking It

To map UI to the service input and then service output (response) back to UI, use visual data mapper.

Invoking the Service

Once the mapping is done, you should define events and add actions to be invoked for UI components. For example, to invoke the service we have set up previously, add Click event and invoke Data Source action to the component. Clicking on the button while the app is running will invoke the remote service.

Testing the App in a Web Browser Or on the Device

To test the app, use a desktop browser, a browser on your mobile device, or the Tiggzi Mobile Tester on your phone

The Tiggzi Mobile Tester app for Android is published in the Android Market. So you can search for it on your device.

Note: The Tiggzi Mobile Tester for iPhone source code is available for downloading as an open source project. You can use the link to see how to install and use it.

Exporting the App to the Mobile Web, Android, or iOS

You can export the App as an archive of all HTML/JavaScript/CSS files, as a PhoneGap project, as an Android .apk file ready to be published to the Android Market, or as iOS binary.

Build this app first

To get a very good idea how Tiggzi works, please try our Building Twitter Search app tutorial. It covers most major features of the builder.

Some commonly asked questions

  1. OK, so what is Tiggzi?
    Tiggzi is a cloud-based app platform. You can build HTML5 or native (hybrid) mobile apps. Tiggzi uses PhoneGap to give you a hybrid app and also access to native device features. Tiggzi also provides Backend Services for creating and hosting app data.
  2. Do I need to download anything?
    No, the builder is cloud-based. There is nothing to download, install or configure.
  3. What’s the technology stack behind Tiggzi?
    It’s very simple. The resulting app is built with jQuery Mobile, HTML5, JavaScript, CSS and PhoneGap (if exporting as hybrid or using native device features). Pretty standard stuff
  4. Does your framework/builder support ABC or can I do XYX with it?
    The simple answer is yes. The app that you are building is a mobile Web app and it’s going to run inside a browser. This means that if some particular feature is not yet available, you can always write some JavaScript, manipulate the DOM, etc and add any custom functionality.
  5. How do I connect to a database or mobile back end?
    Tiggzi Backend Services provides a database or mobile backend. You can also use any other service that’s exposed via REST APIs.
  6. I have this really cool API I want to use. Can I use it in Tiggzi?
    Yes, you can use any REST API. Keep in mind that Tiggzi is just the builder, or the IDE so it doesn’t limit you what API you can use.
  7. Can I use a service that requires oAuth?
    Yes. Read more about oAuth.
  8. My service works inside Tiggzi but doesn’t work on a page. What did I do wrong?
    Most likely a cross-domain security issue. Read this.
  9. OK, I’m still lost. Can you help me?
    Yes! Use our forum or email us.