Building a mobile Todo app with Appery.io database and deploying to BitBalloon.com

Posted: February 19th, 2014 | Author: | Filed under: Database, HTML5 | Tags: , | Comments Off

This video shows how to build a mobile Todo app in Appery.io with cloud database and deploy the app to BitBalloon.com – a very nice and easy to use HTML5 hosting service.


Get HTML5 App Hosting In Every Plan

Posted: October 4th, 2012 | Author: | Filed under: Features, HTML5 | Tags: , | Comments Off

When you build an HTML5/jQuery Mobile app in Appery.io, you can instantly host the app. Every plan gets hosting. Yes, even the Free plan.

Simply go to Hosting tab.  You can use app-name.appery.io domain or a complete custom URL if you own a domain.

You can also publish the app right form the builder. If you don’t see that option, go to Hosting tab and convert the app to mobile web type (the default new app comes with PhoneGap. Such app cannot be published as it might be using native device features).


The New Paradigm: Cloud Services, Cloud Tools [Article]

Posted: June 5th, 2012 | Author: | Filed under: API, Articles, HTML5, iOS, JavaScript, jQuery Mobile, PhoneGap, Windows Phone | Tags: , , , , , , | Comments Off

Cloud Services

In the past year or so, we have witnessed a major shift from client-server to client-cloud. This shift is primarily fueled by two factors: mobile devices exceeding desktop computers and the thousands of different APIs available on the Internet today. What started in early 2000 on eBay and Amazon has become a real revolution in 2012 with thousands of companies, from Twitter and Facebook to AT&T, offering cloud-based services.

REST API
One of the most common ways to access private or public service APIs is via REST requests.

In the client-server approach an organization builds applications that consume its own internal content and resources. However, even large IT organizations such as AT&T, Verizon and Amazon have come to realize that they are no match for the social consumer and social enterprise developers out there. By making APIs publicly available, these organizations hope that developers and “citizen developers” will come and build applications and mobile apps on top of their services.

Citizen developers at work
Analysts at Gartner see a trend toward app creation independent of IT. They predict that by 2014, citizen developers – employees outside of IT and software development – will build 25% of new business applications. In 2007, they built less than 5%.

One of the best-known API success stories comes from Amazon: Its cloud service APIs let outsiders access the company’s massive data centers. Twitter, with its deceptively simple 140-character message model, exploded thanks to its API. In fact, you probably read and write tweets via a Twitter application or mobile app rather than going directly to Twitter’s Web site. Facebook’s Graph API has spawned a whole industry of apps to support its hundreds of millions of users.

Continue reading


Building jQuery Mobile Apps with Kinvey Backend

Posted: May 29th, 2012 | Author: | Filed under: API, HTML5, jQuery Mobile, Mobile Backend | Tags: , , , | Comments Off

Kinvey is one of those services that makes building mobile backend way too simple. If you combine Kinvey with a cloud-based app builder Appery.io, you get everything you need to build an awesome mobile app using cloud services. Let me show you what I mean.

To start, sign up for Kinvey, it’s free and then create your first app backend. We re going to create a backend for beers(!).

Next, create a new collection where we are going to store names of beer we like:

Open the collection. When you open it for the first time it will be empty so we need to define at least one column and enter some data. Click on +Col, and add Name column. Then add a few sample entries by clicking +Row. You can simply double click in Name column to enter values (you don’t need to enter anything for _id or _acl).

That’s pretty much all you need to do. Simple, right?

Let’s now go to Appery.io app builder and create a jQuery Mobile app.

Read More >>


Building jQuery Mobile App with StackMob API [New tutorial]

Posted: April 19th, 2012 | Author: | Filed under: HTML5, jQuery Mobile, Mobile Backend, PhoneGap, Tutorials | Tags: , , , , | Comments Off

We just published a very nice hands-one tutorial on how to build HTML5/jQuery Mobile app connected to StackMob API. StackMob is super easy to use service for creating a mobile back-end for your app. Everything you create is instantly exposed as REST.

Give it a try!


Creating HTML5 Mobile App Connected to OpenShift REST API [New tutorial]

Posted: March 29th, 2012 | Author: | Filed under: HTML5, Tutorials | Tags: , , , | Comments Off

We just published a new tutorial that shows you how to build an HTML5 mobile app connected to OpenShift REST API. It’s based on this example.

The app has two pages, and two services. One service gets the current list of users. The second services creates a new user. Give it a try and let us know if you have any questions!


HTML5 Mobile App Hosting With Appery.io

Posted: March 7th, 2012 | Author: | Filed under: Features, HTML5 | Tags: , | Comments Off

When starting a new mobile app in Appery.io Mobile App Builder, you get two choices. You can create a mobile app which is essentially a PhoneGap app, or a mobile web app which is pure HTML5, jQuery Mobile app. When going with a mobile web app, you can easily publish and host your app from Appery.io by clicking the Publish button.

You can create a subdomain such as mycoolapp.appery.io but can also use completely custom domain. This is an incredible feature because you can build the app in the cloud and then do one-click publish. Your app is published in about 3 minutes. Once the app is published, you can continue working and republish the app once the new release (new features) were added.

Mobile app hosting is included in the Pro plan and can be added as an option to the Standard plan for $10/m.

Lastly, if this sort of hosting is not your cup of tea, you can always export the app and host it anywhere else. Either way – it’s super easy and fast.


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 (scan the QR code). Try it on your mobile device as well.

To build the app, I used Appery.io Mobile Apps Builder. If you are wondering why Appery.io? 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 Appery.io 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:

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:

then, to get a value from storage:

This is how the complete file looks inside Appery.io 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:

We first find the input component using jQuery (it’s going to simpler to do that, once we introduce Appery.io 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:

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:

Try it yourself (it’s easy and fun!).