Quickly Build HTML5 and PhoneGap Mobile Apps

From an Idea to Android Market in 40 Minutes [Webinar recording]

Posted: November 20th, 2011 | Author: | Filed under: Events | Tags: , , , , , | No Comments »

Recording of our webinar from November 16th: From an Idea to Android Market in 40 Minutes.


From An Idea to Android Market In 40 Minutes [Webinar]

Posted: November 10th, 2011 | Author: | Filed under: Events | Tags: , , , , , , | 1 Comment »

When: November 16, Wednesday, 11am US Pacific Time
Register: https://​www1​.go​tomeeting​.com/​r​e​g​i​s​t​e​r​/​4​6​6​4​2​5​672

One of the great things about Tiggr Mobile Apps Builder is its support for end-to-end development, going all the way from an idea in one person’s mind to an app running in thousands of phones. In this webinar, we’ll show you exactly how it’s done (and how easy it is) by walking you through a hands-on example. The focus will be on exporting options for apps. In this case, we’ll export an Android binary (.apk) and publish to the Android Market. Of course, we’ll quickly build an app first, so you can learn or refresh your memory about how to build the UI with jQuery Mobile, connect to REST services, and test the app.


Tiggr at AnDevCon and Mountain View JavaScript Meetup

Posted: November 4th, 2011 | Author: | Filed under: Events | Tags: , , , , | No Comments »

We just returned from app world conference in New York which was a great success. Next week we are heading to 2 more great events: AnDevCon conference and Mountain View JavaScript Meetup.

AnDevCon

Tiggr Mobile Apps Builder (Exadel) is going to be at AnDevCon II (The Android Developer Conference) in San Francisco Bay Area, November 6-9. Stop by our booth and learn how to build Android apps ready for the Android Market using cloud services, all in about 5 minutes. It’s really awesome, I promise.

Mountain View JavaScript Meetup Group

Building apps with Tiggr, A Cloud Service for Building Mobile Apps

Wednesday, November 9, 2011, 7:00 PM

In this cool session you will learn how to build HTML5 and native apps using Tiggr. Tiggr is a cloud-based mobile apps builder that uses HTML5, jQuery Mobile, REST, and PhoneGap to build apps. A real mobile app will be built during the session, which attendees will be able to run and test on their own devices.

Sign up to attend this Meetup.


Working With HTML Events Just Got Much Easier When Building A Mobile App

Posted: October 28th, 2011 | Author: | Filed under: Features | Tags: , | No Comments »

One of the key features in Tiggr is the ability to add HTML events such as value change, click, blur and others to components on the screen and then invoke any of the actions:

  • Set HTML Attribute
  • Set Property
  • Set Local Storage Variable
  • Navigate to Page
  • Navigate to Link
  • Open as Popup
  • Close Popup
  • Invoke Data Source
  • Run Custom JavaScript

If there is a page that has numerous components with defined HTML events and action, then trying to view or edit a specific event/action requires selecting the component and then switching to Events tab (in Properties). Although it allows to view a particular event/action, it doesn’t give you a full picture, it doesn’t show other components and thier events/actions. Well, we made it much simpler now. A few weeks ago we introduced a new Events tab, which will show you all the HTML events and actions defined for all components on the current screen.

Above you can see two components and their events and actions. mobilesearchbar1 component defines value change event and Set Local Storage Variable action. mobilebutton1 defines click event and Run Custom JavaScript action.

To go back to the phone, simply click the Design tab.

As you can see, it’s much simpler now to view and edit HTML events and actions. And, you can also add new events and actions. Select the component, add event, pick and action and click Add:


Mobile App Prototyping With Tiggr - 5 Innovative Features [Article]

Posted: October 25th, 2011 | Author: | Filed under: Articles | Tags: , , , | No Comments »

Ask anyone involved in making applications as a developer or a customer: Would you like to see how the app looks and behaves before we actually build it? The answer is an overwhelming yes. We humans are very visual. For us, to understand something better, we would rather look at a prototype than just read a description. That’s exactly why prototyping is hugely important today.

Even though prototyping is crucial to any project, a real prototype is rarely fully developed. Why? There are a number of reasons. First, lack of the right tools. Second, most of the tools that do exist today just enable you to create a static mockup. And third, some believe it’s a waste of time, as the real app usually looks very different from the prototype, so why even bother with it. These are all valid concerns, but a new prototyping tool solves these problems. This prototyping tool is Tiggr Mobile Apps Builder.

Tiggr is cloud-based service for building mobile apps. It enables you to quickly and easily build real mobile Web and native apps, entirely in the cloud. Mobile prototyping and prototype testing is a major part in this cloud-based service.

Continue reading: http://uxmovement.com/resources/innovative-features-in-tiggr-mobile-apps-builder/


Using the PhoneGap API in Tiggr App Development [Webinar]

Posted: October 19th, 2011 | Author: | Filed under: Events | Tags: , , , , , , | No Comments »

PhoneGap is one of the foundation technologies for Tiggr Mobile Apps Builder. Tiggr’s extensive capabilities in JavaScript customization allow developers an easy way to use the PhoneGap API to make native apps that access device features (like using the camera). In this webinar, we’ll show you how it’s done with hands-on examples and then you’ll have the chance to ask questions.

Register for the webinar.


Tiggr: a simplified cloud service for building mobile applications [Article]

Posted: October 19th, 2011 | Author: | Filed under: Articles | Tags: , , , , , , | No Comments »

I’m sure you’ve heard about platform-as-a-service (PaaS) or cloud-based services like Google Apps Engine,CloudBees, Heruko, Engine Yard, and Cloud Foundry. All are excellent platforms that ease the process of managing, maintaining, and administering the platform on which an application you develop runs. Most tend to be focused on the hosting and managing side of the finished application. But what about a cloud-based service that enables you to build an app, and specifically a mobile app? Well, such a service already exists. The cloud-based service is called Tiggr Mobile Apps Builder.

Read the full article here:
Tiggr: a simplified cloud service for building mobile applications


Building BlackBerry Mobile Apps in Tiggr

Posted: October 18th, 2011 | Author: | Filed under: Features | Tags: , , , | 1 Comment »

One of the most important features in Tiggr is being able to export the app as HTML5 mobile app, Android app or iOS native app. All export features are show by clicking the big Export button:

As you noticed, there is currently no BlackBerry option. But, it turns out it’s pretty easy to get a BlackBerry native app.

Any app in Tiggr, be it for Android, iOS or BlackBerry is built first with jQuery Mobile component, HTML5, JavaScript and CSS. Then, the app is packaged as native with PhoneGap. For BlackBerry, simply export the app as HTML/CS/JS, and to build a native we are going to use PhoneGap Build.

Here are the steps:

  1. Build an app in Tiggr (try getting started guides) and export it as HTML/CSS/JS
  2. Sign up for PhoneGap Builder. A free account is available
  3. Click to create a new app inside PhoneGap Builder.
  4. Enter app name
  5. Select upload an archive or index.html file option and point to the zip file you exported from Tiggr
  6. Click Create to build the app
  7. That’s it. You may have to wait a few seconds before the build completes.

Once the build is complete, you will should see this:


Building a mobile app in the cloud with jQuery Mobile [Video]

Posted: October 11th, 2011 | Author: | Filed under: Tutorials, Video | Tags: , , , , , , , | No Comments »

This video shows how to build a mobile app with Tiggr Mobile Apps Builder.


Getting Started with HTML5 Local Storage

Posted: September 30th, 2011 | Author: | Filed under: Features, HTML5, JavaScript, Tutorials | Tags: , , | 9 Comments »

HTML5′s local storage is undoubtedly one of the most interesting and most talked about features in the HTML5 technology stack. Local storage is part of Web Storage specification and is supported by all modern browsers (destkop and mobile). Although local storage (or Web Storage) sounds rather sophisticated, the functionality is very easy to use. You basically get a map as storage inside the browser (available to all browser windows). You can insert, delete or read key/value pairs. That’s it. Data stored in local storage (localStorage) will be there when you close and open the browser. There is also session storage (sessionStorage). As the name implies, it will be only available as long as the browser window is open, and will be cleared when browser window is closed.

The only other thing to know is that data saved by a page is only available for a pages from the same domain. In other words, a page loaded from abc.com, doesn’t have access to data saved by page from domain xyz.com.

We are going to going to build an app that looks like the screen shot below. In fact, you can try the app here (click the image, or scan the QR code). Try it on your mobile device as well.

To build the app, I used Tiggr Mobile Apps Builder. If you are wondering why Tiggr? Well, because it’s incredibly simple and fast to create a project and build app. If you don’t have an account yet, quickly sign up here.

First build the UI by dragging and dropping jQuery Mobile components from the palette on to the phone. At any point, you can click Test to try the app in browser, or mobile browser.

You can use Tiggr to build real mobile apps without writing any JavaScript. But, for more advanced cases (like ours), you can easily write any custom JavaScript. You can even import 3rd party JavaScript libraries. In our case, we are going to create a new JavaScript file (called asset) with the following content:

// save item
function save(item) {
  var size = localStorage.length + 1;
  localStorage.setItem('key' + size, item);
}
// get storage content
function storage(){
   var output='';
   for (i=0; i <= localStorage.length - 1; i++)  {  
      key = localStorage.key(i);  
      val = localStorage.getItem(key);  
      if (i == 0) {
         output = val;
      }
      else {
         output = output + '\n' +val;
      }
   }
   return output;
}
// clear storage
function clear () {
   localStorage.clear();
}

There are three functions, one for saving a new item (save()), one for getting the current storage (storage()) and one for clearing the content (clear()). Local storage API is very simple. For example, to save an item:

localStorage.setItem('key', 'item');

then, to get a value from storage:

localStorage.getItem('key');

This is how the complete file looks inside Tiggr’s JavaScript editor:

The last step is to invoke JavaScript when the buttons are clicked. We also want to load storage content when the screen is loaded for the first time. Let’s work on the buttons first. To invoke JavaScript on button click, we first add click HTML event to the button:

Then we add Run Custom JavaScript action by clicking the + button:

Click on the action to enter JavaScript code. The code for Save to Local Storage button looks like this:

var item =$('[dsid="input"]').val();
save(item);
var output='';
output = storage();
$('[dsid="storageContent"]').text(output);

We first find the input component using jQuery (it’s going to simpler to do that, once we introduce Tiggr JavaScript API, work in progress). Save the value from the input element, reload storage content so we can display it inside the textarea.

Clear Local Storage button looks like this:

clear();
$('[dsid="storageContent"]').text('');
alert('Local storage cleared.');

Lastly, we also add load event to the screen itself so that we can show storage content when the screen loads for the first time:

var output='';
output = storage();
$('[dsid="storageContent"]').text(output);

Try it yourself (it’s easy and fun!) and try the finished app here.