Build a mobile app with language translator service without coding

I recorded a 3-part video that shows how to build a mobile application without any code. I’m very passionate about Low Code/No Code platforms. I think there is a resurgence of Low Code/No Code tools. As demand for more applications is only going to grow, Low Code tooling can help technical people (and non-technical) to build applications much faster.

In this 3-part video you will learn:

  1. How to create a Watson Language Translator service on the IBM Cloud
  2. How to create a backend with the Language Translator service using Appery.io API Express
  3. How to build a mobile app using Appery.io App Builder

All three videos together are under 17 minutes – so it’s very quick if you want to give it a try.

If you would like to build this application you will need:

  1. A free IBM Cloud account. Sign up for an account (or sign into an existing account)
  2. Appery.io account. Sign up for a free trial account here

Click the menu-icon in the upper-left corner to see all videos in the playlist.

Let me know if you have any question. I will be publishing more videos like this.

Why Do HTML5 Mobile Apps Have a Bad Reputation?

A great post by Josh Morony (site, Twitter) on why HTML5 mobile apps get bad reputation. The truth is HTML5 is great for mobile apps, make sure to read the article.

Build and Publish HTML5 Mobile App with Local Storage in 5 Minutes

This video shows how to build an app with HTML5 local storage and publish the app using Appery.io hosting.

Check out the entire Build in 5 Minutes series.

How to Host Your HTML5 Mobile App

When you build HTML5 mobile app in Appery.io you can instantly publish (host) the app to a URL. You get a couple of options here. First, out of the box you can publish your app to Appery.io URL such as mycoolapp.app.appery.io or you can also use a custom domain:

Screen Shot 2015-05-07 at 3.46.36 PM
Appery.io hosting

Continue reading “How to Host Your HTML5 Mobile App”

Get Hackathon Ready: Learn How to Build a Complete Hybrid App with Appery.io

Happy New Year!

Get hackathon ready. This video shows how to build a complete HTML5/hybrid mobile app. This video was recorded as part of AT&T Bootstrap Week in preparation for the AT&T Summit 2015 in Las Vegas. The video shows:

  • Building the app UI with Appery.io visual app builder
  • Integrating with Twilio API to send SMS messages from the app
  • Integrating with Appery.io backend services to save SMS messages into a cloud database
  • Testing the app
  • Exporting the app for iOS or Android

90% of All Apps In The Enterprise Will Be Hybrid or HTML5

We the People API, Creating HTML5 Mobile App Over Lunch

The United States Government is offering 100s of APIs as part of its Next.Data.Gov iteration:

As I navigated the site I came across Government APIs page:

2013-07-17_1557

I always love trying new APIs and wanted to see what kind of API “We the People” provides. The API seemed to be pretty straight forward and next I figured let me try and build a mobile app that shows the petitions as well as details for each petition using Appery.io platform. I literally finished the app within 35 minutes or during my lunch.

Creating the pages

After creating a new app in Appery.io, I designed the Petition page:

2013-07-17_1610
Petition list page
  • A List component with a Label inside to display the petition name is used. 

Next is Details page:

details
Petition details page
  • The Label at the top displays the petition name (only border is shown)
  • The Collapsible Block has three sections:
    • Details – petition texst
    • Signatures – signature threshold, signature cound, and signtaures needed
    • More Info – link to petition page

The last page is Settings (popup):

settings
Settings page
  • Allows to select how many petitions to show

Defining REST API services

Two services are used in this app:

  1. Service to get a list of all petitions
  2. Service to get petition details

The service to get all petitions:

service_petitions
Petitions API

The service has one request parameter to determine how many petitions to load:

service_pettion_request
Petition service request parameters

Service response:

service_response
Petition service response parameters

The other service is to load petition details:

service_details
Petition details service
  • The {id} is the petition id which was selected

To learn more about We the People API.

Binding services and pages

Once we get all the petitions, we map the data returned to the page:

petition_mapping1
Petition service to page mapping

On Details page we show information about a particular petition and thus get the petition id from local storage (it was stored when the petition was selected from the list). Request mapping is shown:

service_mapping_details
Mapping local storage variable to service request

The response mapping for Details page looks like this:

service_mapping2
Petition details service mapping to page

Invoking the service

Once the service-page bindings are done, the last step is to invoke the service. For Petitions page, the service is invoked on ‘page load’ event:

petition_invoke
Invoking service

For Details page, the service is also invoked on ‘page load’ event.

Testing the app

Testing is as simple as clicking the Test button:

testing
Testing the app in browser

It’s as easy to test the app on the device by scanning the QR code.

Publishing the app

Appery.io comes with instance app hosting feature:

hosting
HTML5 app hosting

Go ahead and try the app: http://wethepeople.app.appery.io.

An app over lunch?

Yes.

Gone are the days when you had to spend days downloading and configuring dev. tools. Gone are the days when you had to spend days downloading and configure software. With a cloud platform such Appery.io you can quickly build a real HTML5 mobile app, connected to real API, and host the app.

Build And Publish a jQuery Mobile App In 5 Minutes

I’m going to show you how to build and publish a jQuery Mobile app in under 5 minutes.

Building the app

  1. Sign up for Appery.io Starter plan
  2. Create new app by entering its name and clicking Create:
    Selection_217
  3. Build the mobile UI by dragging components form the palette into the page:
    Selection_219
    Note the highlighted changes.
  4. Select the button and open Events tab
  5. Add Run JavaScript action (don’t forget to click Add event button):
    Selection_220
  6. Click Test button to launch the app in the browser:
    Selection_222
  7. Save.

Hosting the app

  1. To exit, click Back to project list button
  2. Open Hosting tab:
    Selection_224
  3. Click Change project type to mobile web button to switch the app type to Mobile Web.
  4. Enter app name and click Publish:
    Selection_225
  5. Now go to http://helloworld.app.appery.io using mobile or desktop browser

Coming Soon: New Cloud-based Mobile App Builder Written in HTML5 and JavaScript

For the past couple of months we have been working on a really exciting project. We are re-creating the Tiggzi app builder in HTML5 and JavaScript. The current version is pretty slick and many people ask us if that’s JavaScript, but all you need to do is to right-click and you will that Tiggzi uses Flash/Flex.

You might be wondering why would we use Flash? Tiggzi was started some time ago. We actually started with a simple cloud-based web prototyping tool, then moved to mobile prototyping and then made it an actual cloud-based app builder. When we were starting, Flash was the best technology to achieve the functionality we wanted. We couldn’t have achieved the same feature set with HTML and JavaScript.

A few months ago we have realized that Flash wasn’t helping us any more, in fact, it was slowing and complicating development. Adding new features became difficult. It was slow, loading the Flash player and the project could sometime take over one minute. Not to mention that Flash has been slowly reaching the end of life.

A few months ago we started recreating the app builder portion in HTML5 and JavaScript. I personally can’t wait for the HTML5/JavaScript version to be released — it’s really awesome! The project is super interesting but also pretty challenging. Why challenging? Well, because no one out there (to my knowledge) has attempted to create a visual, drag and drop app builder using HTML5 and JavaScript. There are JavaScript-based code editors and there are some visual tools for building the UI — but no tool combines building the UI, adding REST API services, visual data binding, and testing into one service. Plus, you will have integration with Tiggzi Backend Services.

Here is a very (very) early version of the HTML5 app builder, most everything will change before it is released in the fall: