Blog

When it comes to creating mobile apps, Appery.io is a name you need to know. In this article, discover how our latest features can transform your app development process. Appery.io is all about making app building easier and faster.

Enjoy our Search

First, let’s talk about our new search functionality. This tool lets you find anything in your project, whether it’s code, styles, or components. With a quick search, you save time and avoid frustration. You can focus on the creative aspects of your project.

Methods ngOnInit and ionViewWillEnter are now at Hand

Next, our editor now includes hot adding of the methods that are common in app development: ngOnInit and ionViewWillEnter. Previously, setting them up took time. Now, Appery.io has automated this. You can set up your project with one click on the needed method. This means less manual work for you.

Using Alerts is Simpler Now

Another exciting update is in user alerts. Handling these interactions used to be tricky. Now, our system streamlines the process. The code is clear and easy to read. Managing user prompts is now a breeze, enhancing your app’s user experience.

DB Queries Caching is Here Too

Performance is key in any app. That’s why our caching feature is a game-changer. For this, two new parameters have been added to our arsenal: cache and saveInCache.

This feature stores database queries so apps run smoothly, online or offline. It improves speed and ensures data is always there, even when the internet connection isn’t.

With these tools, Appery.io empowers developers at every level. You’re free to focus on what matters. The platform is evolving. Our commitment is to support your creative journey. We provide the tools you need to build apps that stand out.

To learn more about these new features, see our detailed Youtube video:

You’re not alone. Join the Appery.io community. Together, let’s bring your app ideas to life. Explore our tutorials, templates, and intuitive editor. We’re excited to see what you will create!

Have you heard about OpenAi o1-preview? This revolutionary model is making waves in the tech world, and we’ve discovered how to harness its power using Appery.io, the leading no-code app-building platform.

OpenAi o1-preview, the early release of the OpenAi o1 model family, boasts enhanced reasoning abilities in mathematics, coding, and science. It outperforms previous models by using reinforcement learning to perform complex reasoning tasks, making it a game-changer for app development.

In our latest YouTube video, we demonstrate how to combine OpenAi o1-preview with Appery.io to create a mobile app that tests and compares this new model’s capabilities with the well-known ChatGPT-4o. The results are astonishing!

Imagine building powerful apps without writing a single line of code. With Appery.io, it’s possible! Our video showcases how we set up an app to compare the reasoning skills of OpenAi o1-preview and ChatGPT-4o. You’ll be intrigued to see which model comes out on top.

But we won’t spoil it for you here. To get all the exciting details and see the models in action, head over to our YouTube channel and watch the full tutorial. You’ll discover how OpenAi o1-preview can transform your approach to app development and why Appery.io is the perfect platform to bring your ideas to life.

Don’t miss out on this opportunity to explore the future of app development. OpenAi o1-preview and Appery.io are paving the way, and you can be at the forefront.

Watch our video, subscribe to our channel, and join us on this innovative journey!

Today we are pleased to announce the September release of appery.io with new alias $a of Appery helper, global variable $v and global functions!

Let’s look at what’s new

$a

‘$a’ is an alias for the Appery helper ‘Apperyio’. Now, instead of writing:

this.Apperyio.navigateTo("Screen1");

you can use a much shorter form:

this.$a.navigateTo("Screen1");

$v

‘$v’ is an alias for global variables that were previously accessed through Apperyio.vars.

$v is a place for storing any data as ‘global’. For example, to transfer data between screens.

this.$v.myData = 12345;
this.$v.userInfo = {id: 123, name: 'Joe'};

For more detailed information about ‘$v’, you can refer to our documentation https://docs.appery.io/docs/6-model-and-storage#apperyio-global-variable

Appery Helper

The list of functions and properties for the Appery helper ‘$a’ has been significantly expanded. This expansion greatly simplifies the invocation of the most commonly used operations. For example, if you need to display a modal window and pass parameters to it, this can now be achieved in a single line of code:

let data = await this.$a.modal("EditUser", {name: 'john'});

If you need to display a loading indicator, a simple call will do:

await this.$a.showLoading();

And if you need to perform a GET request:

let res = await this.$a.get("https://mydomain.com/user/12345");

You can explore the full list of available functions on this page: https://docs.appery.io/reference/common-methods-and-properties

Global Functions

Global functions have been added. Now, in the Functions section under Modal and Storage, you can define a function, for example ‘sum’, which will be accessible on all screens, custom components, services, etc., using this.$v.sum()

For more detailed information about global functions, you can refer to our documentation https://docs.appery.io/docs/6-model-and-storage#global-functions

We believe this new feature will be of great value to our users. We appreciate your continued use of Appery.io, and we wish you a happy developing!

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

We’re excited to announce the introduction of the latest Appery.io release, which includes support for Android 13 (API level 33).

While many of the Appery projects were upgraded automatically, we aimed to keep manual application changes to a minimum to ensure a smooth transition for all users.
– Please ensure that you have not manually modified the config.xml file in the source tab. If any modifications were made to this file, kindly follow these steps: Remove the file and execute the “Undo all source changes” operation for the CORDOVA folder.

– Additionally, for some users, it may be necessary to access the App Settings. From there, navigate to Cordova Config, then proceed to the Android tab. Ensure that the property “GradlePluginKotlinVersion” is present with the value “1.6.20” (refer to the provided image for visual guidance). If this property is missing, kindly add it manually.

We believe this new feature will be of great value to our users. We appreciate your continued use of Appery.io, and we wish you a happy developing!

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

Dear Appery.io Community,

We are excited to announce that our first Release of 2023 is already live and you are free to check out what new features and upgrades are already available to all Appery.io users!

First things first: we have successfully upgraded our App Builder to Ionic 6 and Angular 15, which resulted in many useful functional improvements and new features for your app-building experience. Most of them are not immediately noticeable, except in a few cases, but innovative and qualitative.

• The first improvement we would like to introduce is related to the system capability: thanks to upgrading to Angular 15, there will exist no limitations in importing npm packages and modules to your apps anymore.

Check here for some examples of how you can add the npm-modules to the projects created with Appery.io.

Updated Preview Page:

•  The serious upgrade that will hopefully be noticed and welcomed by you: our App Builder now has a very modern-looking editor mobile frame design. Besides, it now comes with an upgraded app preview page that is now user-friendlier and offers more functionality. From the preview page, now not only can you adjust your app’s UI on the device screen with further easy testing it on your device but also publish and share your app right from the preview:

• Moreover, those who decide to publish their project as a mobile web app will be able to share it right from the preview.

New and updated UI Components PALETTE

• Next, we are proud to announce that two new UI components have been added to our App Builder for Ionic: Audio and Video. These new components offer you rich customization options for your multimedia resources:

• The existing Datetime component has also been upgraded and now comes with two views to select from, Inline which opens an inline calendar, and Open in modal which opens the modal with a calendar and an editable label:

• One more enhancement: all the components that offer the option of entering strings now allow users to edit them inline right in the mobile frame, and that is a very handy time saver:

• The next three features refer to the components’ properties upgrades: 1) the Position property was added to many UI components like Checkbox, DataTable, etc.; 2) many UI components that contain labels, for example, Input and Link received the Font Size and Font Weight properties; 3) the Text in Editor property was added to several UI components. With this feature enabled, you will be able to finetune your app UI right in the editor even if this component also has some functional code added as its Text property:

Filtering feature added to OUTLINE and Mapping editor

• The OUTLINE view now comes with a useful feature of filtering components added to the screen. Just start typing the name of the component to retrieve its parent(s) on the tree and quickly locate the component you are looking for:

• Users struggling with cumbersome mappings may find the new Mapping editor option of filtering components (similar to how it is realized in the OUTLINE) particularly useful:

Other enhancements

• The next improvement is minor but comfortable: the Method selection can be changed after the function has been created in the CODE panel:

• Our last enhancement might also seem rather minor, but will definitely be found useful by our users: the ability to double-click on many of the UI components added to the mobile frame of our App Builder in order to speed up the process of customizing them. By double-clicking the Image component, for example, you can immediately access the Media Manager window and thus work with your custom image files more easily:

Oh man, that list was impressive, wasn’t it?

Well, we tried to do our best to make the features above functional and easy to use as much as possible, and hope you’ll enjoy using them.

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

Dear Appery.io Community,

We are excited to announce the new features included into our new release, which is already here. So, please make sure you do not miss them:

• Ionic 5 Text Area component. This is something that many of you have been asking for. The component is available to all our users and can be found in the App Builder PALETTE.
• Improved performance of Ionic 4/5 preview. And this is great news since loading the project preview takes less time now, making your development experience even more positive and productive.
• Improved Ace editor with added autocomplete option: 
• Added rich editor for variable’s value in Ionic 5 projects. Now, if you need to provide a long line of code or add some object or array to your variable, just click the three-dot button next to the Value field:
• Full support of Android 11.
• A bonus feature is the possibility to quickly add the predefined dark theme for your apps by using our Dark Theme plug-in:

And, the last but not the least: bug fixes (not too much, though).

Today we had a small but very important release. We added the auto-update feature for our most progressive framework – Ionic 4. Also, we fixed a few important and annoying bugs.

docs.appery.io/docs/ionic-4-overview

Winter has come, so it’s time for our newest release! Here are some of our new features:

New build log

We added the ability to view and download your full build log. If your app suddenly has an error that doesn’t allow app compilation, you can check the entire log to see exactly what went wrong. There’s no longer a need to ask support to find the cause. 

Bundled Projects

You can export your Appery.io project with all its dependencies, including Database, Server Code, and API Express projects. This allows you to make a full copy of an existing app in just a few clicks.

Ionic 4 Custom Components

With this release, will be able to create reusable custom components. It can be created in the Create New menu. New screen appears, where you can add predefined components and customize style and logic. And then this set is available to you on other screens in the components palette as a custom component.

New features for the Range component

We added validation of minimum, maximum, and step properties for the Ionic 4 Range component.

Return data object for update operation

Until now we only had the functionality to return the “_updatedAt” field. But since you told us that you want to receive your entire updated object, we are adding the parameter “full_object”  to make that a reality. 

Support for collections JSON 

We have added support for JSON formatting to use for file collection, which allows the following:

Bugs (Less of Them)

No update is complete without bug fixes. Just like we do on all of our updates, we’ve fixed large and small bugs to make your experience smoother. 

Easily import any Cordova plugin

You can now easily add any 3rd party Cordova plugin to your app. This has been one of the most requested features. No more sources digging and long step-by-step guides. This is how quickly you can add any Cordova plugin to your app:

1. Go to the Github page of the plugin and download the latest stable version by clicking “Download ZIP”. It’s important to download the stable or Release version.
2. Go to Resources > Cordova pluginsand click Import Cordova plugin, then: Choose file, locate the downloaded file and click Import plug-in The plug-in will appear under Cordova plug-ins

And you are done — it’s that’s easy.

Quickly add any Cordova plugin

To manage all Cordova plugins for a particular app go to Project > App settings > Cordova plugins and you’ll set the list. On this page you will also see the Core Cordova plugins – these plugins are automatically available in your app. From this page you can easily manage the plugins. You can quickly enable or disable any plugin.

We think it’s a very nice capability that you will like. To learn more, please read the documentation for more details.

API Express enhancements

API Express allows quickly exposing a relational database via REST APIs. In this update we have added a number of important features.

New service builder components

The API Express Service Builder – a visual tool to build your custom services has a number of new components. These components simplify building your service logic.

Easily build custom services with new logic components

You can learn more about the new components here.

Comparison query operators 

A set of comparison query operators were added to Find operation to make your requests more effective. Here is the operators list:

• $eq – Matches values that are equal to a specified value.
• $gt – Matches values that are greater than a specified value.
• $gte – Matches values that are greater than or equal to a specified value.
• $lt – Matches values that are less than a specified value.
• $lte – Matches values that are less than or equal to a specified value.
• $ne – Matches all values that are not equal to a specified value.
• $in – Matches any of the values specified in an array.
• $nin – Matches none of the values specified in an array.

Learn how to use these operators in examples.

API Express project import & export

Now it’s possible to save your API Express project locally by backing it up.The project can be restored from the exported backup as well. It’s really simple, so you have to go to API Express > Settings and click “Export Backup” to save your API Express project locally. Click “From backup” when creating new API Express project and choose previously stored backup to create a project from the backup. A little bit more about these features is here.

Quickly add a REST API to a controller with drag and drop

A faster way to add a REST API to an AngularJS app

When building an AngularJS app, there are useful snippet called “Invoke service”. The code to execute a REST API service will be added to your scope function when clicking on it. All you have to do is change “service_name” to your actual service name:

Drag and drop a service into an AngularJS controller

We now made it even simpler to add a REST API to a function. Just drag and drop the needed service from Services folder (to the left of the screen, where project tree is located) to your function and you’re done! Even the service name will be automatically substituted:

Edit scheduled pushes for faster development

You can now easily edit scheduled pushes. This means you no longer need to delete a scheduled push in order to make a change. There are few ways in Appery.io to send a Push Notification:

1. By sending the REST request using the Push Notifications API.
2. By calling the appropriate methods in Server Code.
3. By using the web console.

All three methods support scheduling pushes. From now, Server Code and Push Notifications API’s were complemented with new methods to get the list of scheduled notifications and to remove them.

By using the web console you can achieve more functionality when editing scheduled pushes. You can remove them as well, but you can also change notifications content and lot of other options including push message, its sound and devices. Read the doc for details.

Push Notifications API changes

If you built an AngularJS app or jQuery Mobile app (library version 3.0), please make sure you are aware of these API changes:

New version of Appery.io Push Notification plugin has different way to read the message. The changes only concerns AngularJS apps and jQuery Mobile app with libraries version 3.0. If you ever wrote the event.notification.aps.alert code, you should replace it with new variant. So, find your code that looks like:

event.notification.aps.alert

And replace it with the next string:

event.detail.message

That’s all if your making the jQuery Mobile app, but for AngularJS one more step should done. Find PushRegisterDeviceImpl JavaScript file (under JavaScript folder) and replace the entire file with the code provided here.

Happy app building with better Appery.io!