Using Appery.io to quickly build apps with DreamFactory

In recent posts about DreamFactory power user Crystal Taggart, we highlighted the ways she uses our open source platform to quickly build effective app architecture and add features on the fly. By using the power of Appery.io and Dreamfactory together she gets a useful visual interface for building apps in days instead of months.

Appery.io and DreamFactory test harness workflow

“One of my favorite things about DreamFactory is that it provides a test harness and documentation to connect your data. Not only does DreamFactory give you APIs, but also a fantastic test harness. So I can build things in Appery.io and test it in DreamFactory. I will never need to code a REST service ever again.”

Crystal chose to install DreamFactory on Google Cloud. DreamFactory then automatically generated API documentation for her API. In the Admin Console, API Docs is a top-level tab. Let’s take a dive into her process so you can set it up for yourself.

User APIs automatically generated in the Live API Docs.

Let’s start with how it looks in Appery.io. To create a service, add a new service within the Appery.io panel. The URL for the service maps to the DreamFactory API Endpoint. In this example this is a POST transaction to register a new user account.

Set up Headers for the DreamFactory service under the Request tab, under Headers.

The X-DreamFactory-Application-Name enables you to specify which DreamFactory API you are connecting to and the services available to it. The X-DreamFactory-Api-Key allows you to connect to that service in your app. In Appery.io you can specify Settings which allow you to store your URLs and credentials in a central location. In the screen below Crystal has the {app_name} and {api_key} stored as settings. This made it easy to change her URL endpoints from an IP address as she was testing to an SSL url so she can protect her user information.

DreamFactory Service set up in Appery.io.

In the Body of these new Headers, set up the REST API parameters for the app. To add new parameters for your service, just click the Add button and it’s that easy to enhance your REST API.

Parameters for a REST API.

With the power of DreamFactory and Appery.io, their are two ways to test REST API endpoints: either in the DreamFactory instance or in the Appery.io service. By testing in the Appery.io service, you can import the response JSON making it easy to map your service through the Appery.io GUI.

In Appery.io, you can test your DreamFactory Service.

Appery.io makes it very easy to map your DreamFactory service. You can setup custom API calls based on different events - either a page load, button click, or any HTML-driven event. For events, you can use the Appery.io mapping tools to send data from your screen into a service and process the results. In the screenshot below, the left side of the screen shows the fields and local variables from the form, the right side of the screen shows the mappings to the DreamFactory services. If you can drag and drop, you can create a REST endpoint with no coding!

This is the service mapping for the Create Account. DreamFactory’s User API also automatically detects if the email account is in use for the user and sends back an error response.

Example Error Message from DreamFactory User API

The Appery.io Service automatically catches the error event and allows for custom scripting to handle the error.

Crystal opted for a javascript library that maps the error message returned from the jqXHR service back to a ‘user friendly’ error message. Tools such as Appery.io don’t limit you to GUI only integrations. When it’s time to add custom code, they can be powerful platforms to iterate fast.

As with any frontend platform, having a versatile and well constructed backend is critical for the flow of development. DreamFactory empowered Crystal to focus on building her app, instead of getting bogged down in technical debt and infrastructure issues.