Blog

Appery.io API Express enables enterprises to easily and securely integrate apps with any back-end system. Recently, the Appery team has published two guides on how to create databases with Microsoft Azure and Google Cloud SQL and then use them with API Express. If you are new to API Express, start with this beginners tutorial. It shows you how to create services based on API Express models and perform CRUD operations.

Check the API Express documentation, and make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

Using Server Code snippets and plug-ins are a great way to save time when making server scripts. Instead of digging through the Server Code documentation, you can simply choose one of the snippets located on the right side of the screen in script editor mode. The set of snippets provided by the Server Code API are the most common, but if you think of other useful snippets, let us know and we’ll add them to the list.

Server Code plug-ins are another way to save time when implementing your logic. To find Server Code plug-ins, go to the Server Code page and then to the Plugins tab. For now, there are two plug-ins. With them, you can quickly integrate with the Twilio or SendGrid API via XHR (XMLHTTPRequest). Simply click “Import” to create the server script based on the plug-in selected, and then customize it by specifying your API keys.

Make sure you check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

To help developers with uploading their files to the Appery.io backend, we have just released the Files Upload plug-in for AngularJS (both Bootstrap and Ionic).This process uses the Input component with afile type. You can click Choose File to select the needed information to enable it appear as list on the page at the end. To upload all files click Upload all, or for single files select Upload selected.

A quick note about configuring the plug-in: the Appery.io database requires a sessionToken for uploading files to the database. To make the plugin simpler to use, use the Master Key.To configure this plugin you should provide the ID of the database that you will be using to store the files, and select the Master Key instead of sessionToken.

However, please keep in mind that for security reasons, we recommend you use sessionToken instead of Master Key.  This plug-in is configured to work with the Appery.io database, but it can be modified to work with any other API provider that allows for file uploads. You will need to change the upload REST API and update any parameters.

As usual, we’ve prepared a detailed tutorial for this plug-in, which you can find here.

If you have any problems with this plug-in or with file uploading in Appery.io, contact our support team for assistance.

Snippet to invoke a REST API

A snippet is a pre-made and reusable section of code that can be quickly inserted into your own code. It is a convenient and time-saving way to pull frequently used Appery.io functions.

A recent update has introduced a new snippet – Invoke REST API ($http).  Invoke REST API ($http) is a wrapper for Angular’s($http) and can be used to send AJAX requests. This snippet is described in more detail here.

Shortcuts, like snippets, can save you time. A shortcut allows you to type a few characters that expand into the corresponding code. For example, type $Cg and then press Ctrl+Space or Cmd+Space to quickly add the Config.get function. The shortcut will be translated into:

Apperyio.Config.get( expression/*, default*/ );

You can find the whole list of shortcuts here.

Make sure to check out all of our mobile development tips. Do you want to build apps fast?

Start developing with our trial plan!

The Appery.io team is starting 2016 with new and exciting updates and improvements to the platform!

App Builder enhancements

The latest Appery.io update brings some cool features to the visual App Builder.

New Ionic components

Two new UI components for Ionic were just released: Card and Text.

The Card can be used to visually separate information on a page. It allows for more control and flexibility, and can even be animated. This new component is based on Google’s Card UI design.

The Text component can be used to conveniently place any custom text or AngularJS expression (wrapped with {{...}}) on the page.

The Ionic Button has obtained new property – Icon Only. It makes a button look like an icon. This property converts a button to an icon by changing Icon Style and Style properties, and ignoring the Text property.

It’s now possible to copy and clone components in the App Builder. To create a full copy of a UI component with all nested children, (including other components), click the clone icon on the top right of the component:

Cloning a component

Ionic page templates

When creating a new page in Ionic, you can choose a blank page or a page with ionContent. The blank page is a simple page without any extra components. Use it when you don’t need to make any special adjustments to the scroll or scrollbar settings. The page with ionContent is a multi-tool page with a ion-content directive and many settings provided by Ionic. Use it when you need to make flexible adjustments to page scroll behavior.

You can find more detailed templates description in our docs.

Read the rest of this entry »

When building AngularJS apps (with Ionic or Bootstrap frameworks) using Appery.io, you can easily extend app functionality by adding native device features. Features such as push, geolocation, camera, etc., can be added by importing the appropriate plug-ins. To do this, go to CREATE NEW > From plug-in and select the appropriate plug-in. The native features come from the Cordova library, which is automatically installed in every app.

For each plug-in we have documentation as well as detailed tutorials on native device features. You can find the docs here.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

Appery.io is the best mobile app development platform out there. Get the most out of it with our webinars. We’ve put together six so far to kick off the new year. The first two cover the most used frameworks on the platform. The next webinar delves into our service for making enterprise assets like SQL databases into REST services. Our last three webinars cover different backend services we offer on the platform that you can use in your apps. Register now and get ready for mobile enlightenment.
Read the rest of this entry »

One way to customize your app is to use a custom push notification icon. By the default, the push notification icon is your app icon.

Setting a custom icon for incoming push notifications is available only for Android OS and only for version 3 libraries (jQuery Mobile).

To set a custom push notification image:

1. Upload your custom image (for example: icon.png) into the ANDROID/project_name/res/drawable/ folder to set it as a push image. If there is no drawable folder, simply create it:
   
2. On the Source tab, open the WEB_RESOURCES > app > startScreen.js file.
3. Find the PushNotification.init function and add an icon property with 'icon' value:
   
4. Now your app has a custom push notification icon!

Read more about Appery.io push notifications in our documentation and make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!

In this post, we’ll show you how to open a URL received in a push notification message for both jQuery Mobile and AngularJS apps.

This tutorial assumes you are familiar with how to send and retrieve push notifications. If you are not, this tutorial will show how to send your first push notification message.

Let’s start with a jQuery Mobile app.

To open a URL when a push notification message is received, use the Load page event and add the following JavaScript code:

$(document).on("push-notification", function(event, data) {
   window.open(data.message, "_blank");
});

This is how the event looks in the App Builder:

Code to read Push Notification message and navigate to a URL

Read the rest of this entry »

In the “Appery.io under the Hood” series, we’ll be explaining in detail how Appery.io works. We hope that this information will give you a deeper insight into how to make better apps by giving you a deeper understanding of the platform.

Loading resources when needed

When developing big scalable web apps, the question of how to manage tons of libraries and services arises pretty quickly. There are a few key reason why a powerful and flexible dependency management tool becomes mandatory:

• The vast majority of libraries dictate their own requirements for dependencies. This makes it critically important to load and launch resources in the appropriate order
• Loading all the libraries and other resources at once increases network traffic and should be avoided when possible. This is even more important for mobile apps
• App loading time can be significantly decreased when loading only the required libraries:
  • A ready event will be fired only once for all the required resources
  • For mobile devices and apps, page size can be optimized as much as possible to prevent browser or OS failures
  • Overloading the device CPU by loading unnecessary libraries will decrease battery life
• The bigger the development team, the more complicated library dependency management becomes

This is why Appery.io has chosen RequireJS to solve the cumbersome process of dependency management. Let’s see how RequireJS is used in Appery.io apps.

RequireJS

RequireJS implements an AMD (Asynchronous Module Definition) approach and allows the declarative description of dependencies among app modules. RequireJS also guarantees that all module dependencies will be resolved before module execution. In the AMD pattern means each module has its own isolated variables area. This makes your app more stable by reducing the possibility of namespace conflicts. 

Read the rest of this entry »