Video: Build Your First Cloud Function

Last week I showed you how to build your first cloud function using IBM Cloud Functions. I also recorded a 5-minute video that shows how to build your first function and a number of ways to invoke it via a REST API. Check it out below and let me know what you think.

Learn How to Build IoT Apps with Node-RED, Watson AI Services – in this Hands-On Workshop

Workshop Social Tile-01

Learn how to build your first IoT application using Node-RED and IBM Watson Services. This workshop will begin with an introduction to Node-RED, a browser-based graphical flow editor of drag-n-drop blocks (called a node) of functionality. Node-RED (nodered.org) is an open-source community project built on top of the Node.js runtime. The workshop will dive into the Watson IoT dashboard to visualize data and Node-RED dashboard to build a UI interface.

AGENDA

12:00 – 12:50pm: Registration and Lunch
12:50 – 1:00: Intro/welcome from Max Katz, IBM Program Director, Developer Advocacy (@maxkatz)
1:00 – 1:30: Let’s Learn about Node-RED, JeanCarl Bisson, IBM Developer Advocate – Bluemix/Watson Developer Ecosystem (@dothewww)
1:30 – 2:30: IoT Starter Lab
2:30 – 3:00: Break
3:00 – 4:00: Watson IoT Dashboard
4:00 – 5:00: Node-RED Dashboard and Advanced Topics

After the workshop, stay for pizza, beer and learn about What’s New In JavaScript: Learn about Distributed Ledgers, IoT and Node-RED.

Appery.io Mobile Resources You Should Know in 2017

Happy New Year!

As we are starting 2017, we want to let you know about all the Appery.io resources available to you, to help you build you app faster and easier. These resources are being updated with new content all the time, so we definitely recommend subscribing to updates or following them. This way you will be always up to date with what is happening. Let’s get to the resources.

Developer Documentation and Portal (http://docs.appery.io)

The docs site is the most important resources (obviously). The docs site contains the platform documentation, tutorials, and API reference section. We regularly update the content on this site. If you find a typo or an error, please use the Suggest Edits feature to tell us about it.

The docs site has a blog section (http://docs.appery.io/blog) where we usually post technical information such as API updates or library updates. The information is usually very technical and specific so it doesn’t go on the main blog. We will also post links to tutorials and videos.

The Appery.io blog (http://blog.appery.io)

The blog is one of the most important resources you should read. This is where we post platform updates, announcements, new videos, new tutorials, case studies and anything else. We definitely recommend you follow the blog to stay up to date. Following the blog is very simple. You can subscribe via the RSS feed or subscribe via email (you will get an email every time a new post is published).

YouTube Channel (http://youtube.com/apperyio)

This is our most popular resource. Our YouTube channel has over 200 short videos on various topics to help you build apps faster. Definitely subscribe to get updates when we publish new videos. The videos are organized into playlists:

Most of our videos are no longer than 15 minutes. This allows you to learn about a topic, feature or benefit very fast and you won’t be bored through an hour long example.

Community Forum (http://appery.io/forum)

Our community forum is the place to get help, ask questions and help your fellow Appery.io developers.

Platform Status Page (http://status.appery.io)

Appery.io platform status page shows each platform component and its current status. It’s important to bookmark or follow this page via RSS to always know the status of each component.

Twitter (http://twitter.com/apperyio)

Twitter is where we post important announcements, platform updates, new tutorials, case studies, new videos and anything else. We recommend to follow up on Twitter to always stay up to date.

Facebook Page (http://facebook.com/apperyio)

Facebook is very similar to Twitter. On Facebook we post important announcements, platform updates, new tutorials, case studies, and new videos. We recommend to Like us Facebook to always stay up to date.

LinkedIn Company Page (https://www.linkedin.com/company/appery-io)

On our LinkedIn Company Page we post announcements, new tutorials, case studies, and new videos.

Google+ Page (https://plus.google.com/u/0/104276681162289155352)

Yes, we are still on Google+ :).

Instagram (https://www.instagram.com/apperyio/)

This is a new resource and we will be posting a lot more in 2017.

What’s New Panel

And a bonus resource is our What’s New panel. The What’s New panel can be opened from any platform page from the header. The panel shows you the most recent updates, tutorials, and videos. Check this resource often to learn what’s new.

whatsnew-panel.png
What’s New panel.

 

Tutorial: Building a Todo Mobile App with Ionic, Angular, Appery.io Visual App Builder and Database

For years, developers had to make a choice: build a single hybrid app with a so-so user experience, or build a native app for each platform with a great user experience. Developers don’t have to make this choice anymore. By integrating the Ionic SDK into Appery.io, developers can build enterprise HTML5/hybrid apps on a single code base that offer a native experience across all platforms. The Appery.io platform’s visual tooling lowers the skills barrier, empowering a broader base of developers and business analysts to create effective and intuitive mobile applications.

In this tutorial, you will use the Appery.io platform to build a mobile app. The tool set includes:

  • Ionic – native-like UI components
  • AngularJS – UI logic/binding
  • Appery.io App Builder – cloud-based drag and drop designer
  • Appery.io Backend Services – API backend for the app

What are you building?

You are going to build a todo app. The app will have two pages. On the first page, you will be able to see a list of all tasks and also mark a task complete (delete it). On the second page, you will be able to create a new task. You can see how the app looks below. The first page lists all the tasks. You can also mark a task completed (delete it). On the second page you can add a new task.

Continue reading “Tutorial: Building a Todo Mobile App with Ionic, Angular, Appery.io Visual App Builder and Database”

Did AngularJS Borrow Some Concepts from JSF?

Since Appery.io added support for Bootstrap and AngularJS, I have been using these frameworks a lot. Many years ago I have been using and teaching JSF and RichFaces frameworks. Surprisingly (or not), I see some concept similarities between AnguarJS and JSF. Obviously AngularJS and JSF are very different frameworks, but they do share some concepts. Let’s look at a simple example.

This is how AngularJS page looks:

<html>
<body ng-app="myApp1">
   <div ng-controller="myController">
      <p>Name:<input type="text" ng-model="name"/></p>
      <p>Echo: {{echo}}</p>
      <p>Count: {{count}}</p>
      <p>
         <button ng-click="countAction()">Submit</button>
      </p>
   </div>
</body>
</html>

and this is how JSF page looks:

<html>
<body>
   <h:form>
      <p>Name:<h:inputText value="#{echoBean.name}"/></p>
      <p>Echo: #{echoBean.echo}</p> 
      <p>Count: #{echoBean.count}</p>
      <p><h:commandButton value="Submit" actionListner="#{echoBean.countListner}"/>
   </h:form>
</body>
</html>
  • AngularJS defines the name model via the ng-model directive. The directive extends the functionality of HTML input element.
  • JSF defines the name model via the managed bean. <h:inputText> component extends the functionality of HTML input element.
  • {{echo}} and {{count}} are displayed using expressions and are bound (binding) to AngularJS scope. Both variables are set in AngularJS controller (similar to JSF managed bean)
  • #{echoBean.echo} and #{echoBean.count} are displayed using expressions and are bound (binding) to a managed bean inside JSF scope. Both variables are defined in JSF managed bean (similar to AngularJS controller)
  • ng-click references a function (defined in scope) to count the length of the input
  • actionListener references a function (defined in managed bean) to count the length of the input
  • AngularJS provides directives to extend HTML markup, JSF provides UI components to extend  HTML markup.

As you can see some of the concepts are rather similar even though the syntax is different. Both frameworks define a view (page) that is bound to an object in a scope.

Obviously these are very high level similarities and you can probably argue that many other frameworks share the same concepts. One important difference between the frameworks is that AngularJS is a client-side framework while JSF is a server-side framework.

var myApp = angular.module('myApp1', []);

myApp.controller('myController', ['$scope', function ($scope) {

    $scope.countAction = function () {
        $scope.echo = $scope.name;
        $scope.count = $scope.name.length;
    };
}]);
@ManagedBean(name="echoBean")
@RequestScoped
public class EchoBean {
   private String name; 
   private Integer count;
 
   public void countListener (ActionEvent event){ 
      count = name.length(); }
   }
   // getters and setters
}

You can try the AngularJS example here: https://jsfiddle.net/maxkatz/wbpp331b/

Fast Image Processing For Your Mobile App With Sirv

Appery.io teams up with Sirv for super fast and easy image processing for your mobile app:

Appery.io users can now take advantage of the dynamic imaging, responsive design, zoom and 360 imaging abilities of Sirv.

Images of any size can be generated by Sirv within 1/10th of a second and served to perfectly fit the screen proportions of whatever device the user has. It’s the fast and reliable way to fetch all your image content for your mobile apps (and your websites, blogs and eBay listings).

Read more >>

Accessing App Data and Sending Push Notifications From the Customer Console

The Appery.io Customer  Console allows app owners to edit app data and send push notifications. The app owner could be a business person who doesn’t necessarily want or need to access the development environment to make changes to the app data or send push notifications.

Customer Console features:

  • Instantly edit app data (edit, create, delete)
  • No need to use the developer database console
  • The developer can restrict what collections the app owner has access to. This will minimize errors
  • Set specific access permissions such as read, create, and delete
  • Send push notifications
  • Schedule push notifications to be sent later

The following two videos show how use the Customer Console:

  1. Accessing and editing app data
  2. Sending push notifications

Build a Complete App with the Appery.io Cloud Platform: HTML5 App + Mobile Backend + APIs [AT&T Bootstrap Week]

Date and time:
Thursday, July 25, 2013 11:00 am
Pacific Daylight Time (San Francisco, GMT-07:00)

Register:  
Register for this webinar and more info.

Join us for this Bootstrap Tutorial to learn how to build a complete mobile app with the Appery.io cloud platform. We will build the mobile app UI with HTML5/jQuery Mobile using visual drag and drop builder. Connect to integrated mobile backend services, and to 3rd party APIs. Use Apache Cordova (PhoneGap) for native device features, and deploy the app. This is a live coding session where attendees will be able to test the app as its being built.

What you will learn:

  • How to build mobile app UI with HTML5/jQuery Mobile
  • How to use integrated mobile backend services (database, push, server code)
  • How to connect to 3rd party cloud APIs
  • How to use device APIs (Apache Cardova)
  • How to deploy to mobile web, Android, or iOS
  • How to use and create API plug-ins

Why You Need More Than Backend As a Service (BaaS) To Build a Mobile App

If you have been following the industry, there are over 30 Backend as a Service (BaaS) providers out there. BaaS makes it very easy and fast to create a (mobile) backend for an app. Features include an app storage (database), Push notifications, server code, user management, file management, and many other features. There is no double BaaS makes it very easy to setup a backend for your app. However, you will need more than just a brand new mobile backend when building an app. Equally important is being able to build a nice UI (HTML5, hybrid, native) for the app fast, and quickly connecting to any 3rd party APIs from the app. This includes connecting to enterprise data already exposed via APIs within your organization. As more and more enterprises start building mobile apps, connecting to existing enterprise data sources will become of the highest priority. The future mobile app platform will include: app dev. tools (UI) + BaaS, + APIs (enterprise, 3rd party). A good example of this direction is Facebook acquiring Parse. Facebook obviously provides a very rich API and now it also has a BaaS option.

Tiggzi: Build Windows Phone Apps With jQuery Mobile, PhoneGap

You can now build jQuery Mobile apps in Tiggzi and export the app for Windows Phone (with PhoneGap).

VS Project is a Windows Phone PhoneGap project. We will be adding binary build as well. To get a binary, you have two options: 1) build it yourself; 2) take it to PhoneGap Build.