Easy Guide to SMS Confirmation using Twilio — No Stress, Just Success

We are here once again, this time with an easy-to-follow, stress-free tutorial on setting up SMS confirmation using Twilio. And exciting news – we also have a video tutorial for you to follow along with!

How to configure SMS verification for the app registration feature

Remember how we learned to set up SMTP server settings for email confirmations? Today, we’re switching gears to play with Twilio, allowing us to securely verify sign-up attempts via SMS. Cool, right? Let’s jump in!

Step 1: Getting to Know Twilio

Our journey starts with Twilio. Never heard of them? They are experts in sending out SMS verification codes.

  • Head over to the Twilio website and sign up for their free trial account. Once you’re registered and logged in, you can start personalizing your setup. You can either use an existing account or create a new one. I whipped up a new account I like to call SMS Confirmation.
  • Don’t forget to verify your phone number within Twilio. Just drop your number in, await the verification code via SMS, and then pop the received code into the website.
  • You’ll find a few more easy-peasy questions to answer and then hit Get started with Twilio. Congrats, you’re now ready for action!
  • Your Twilio dashboard will display a special phone number. This number is outgoing only and will be used to send confirmation messages to your own app users.
  • While you’re there, note down your Account SID, Auth Token, and your new Twilio phone number.
  • Lastly, ensure that you’ve listed the phone number you are using for testing in the ‘Active Numbers’ list (Phone Numbers > Manage), and that your Verified Caller IDs tab has the verified number ready to receive the authentication codes.

Step 2: Bring On the App Builder

Now that Twilio is all set, let’s put the App Builder to work.

  • Go to the Server Code tab then open the StarterLib library, which was created just for us. We’re planning to send out confirmation SMS, so we’ll need to replace EMAIL with SMS for the confirmation type in the StarterLib script.
  • Next, hop back over to the Twilio console and one by one, copy your Account SID, Auth Token, and Twilio phone number into the corresponding variables on the script in the StarterLib section. Hit ‘Save’ and voila — you’re all set!
  • The moment of truth has arrived. Click TEST on the App Builder page, fill in the sign-up page details, and then wait for the verification code on your mobile device. Once received, drop it into the app, and bingo! Your user is registered.

As you can see, setting up SMS confirmation using Twilio is easier than a walk in the park.

We hope that this short guide will make your app development experience even better.

Remember, we provide a handy two-week trial giving you plenty of time to experiment with our Starter App Template. Plus, you can subscribe to our YouTube channel for even more handy tips.

Thanks for coming aboard this guide, and see you again very soon!

Your Appery.io Team!

Google reCAPTCHA Now on Appery.io: Boost Your Site Security:

In the fast-paced app world, safety is crucial. At Appery.io, we’re thrilled to introduce Google reCAPTCHA plugins for added web app protection.

About Google reCAPTCHA: Quick Overview

Google reCAPTCHA is a strong tool to tell real users from bots, adding an extra security layer. It stops spam and guards your sites from fake activities.

Easy Integration with Appery.io: Simple and Effective

Our App Builder now easily adds Google reCAPTCHA plugins, both version 2 and version 3. To start, sign up with Google reCAPTCHA to get unique keys, ensuring a secure and personalized app integration.

Why Go for reCAPTCHA Plugins on Appery.io?

  1. Strong Defense: Shield your web app using advanced security from Google reCAPTCHA.

  2. User-Friendly: Our App Builder simplifies the process for all-level developers.

  3. Version Choices: Customize security with options for version 2 or version 3 based on your needs.

Getting Started: Easy Guide

  1. Open App Builder: In Appery.io App Builder, go to the Plugins section.

  2. Find reCAPTCHA: Look for reCAPTCHA plugins (version 2 and version 3) in the Appery.io catalog.

  3. Sign Up and Get Keys: Before adding the plugin, sign up with Google reCAPTCHA to get keys for secure app integration.

  4. Pick Your Version: Choose either version 2 or version 3 based on your security preference.

  5. Simple Configuration: Customize plugin settings in the Appery.io App Builder, including adding keys from Google.

  6. Test and Deploy: Ensure a smooth user experience before deploying your web application.

You can find more details on the Plugins page.

Or check out our YouTube video tutorial if you need visual assistance!

Stay Tuned for More Upgrades

This is just the beginning! As we focus on security and user experience, more enhancements and features are coming soon to Appery.io.

Thank you for using Appery.io and Happy Developing!

Your Appery.io Team

How To Add Custom Pop-Ups to Ionic 4 Apps | Appery.io

Check out our new tutorial that shows you how to add custom pop-ups to your Appery.io app. You can add error or success messages, custom notifications, prompt windows, and more — all by installing the SweetAlert2 module to your app.

How to Add Apple ID Login to Ionic 4 Apps | Appery.io

Appery.io allows developers to create apps that support sign in with Apple ID. To add this feature to your application, you simply need to install and configure our new Login with Apple plug-in.

Keep Calm…and Code Using Ionic 4 and Appery.io

In today’s time of unprecedented troubles and uncertainty we are happy to be able to give some bit of satisfaction to the Appery.io community: a bunch of new Ionic 4 tutorials have arrived so that you can immerse yourself in a new level of programming and be more optimistic about your future.

Over time we have been working hard to document Appery.io Ionic 4 components as thoroughly as possible. This documentation will help you understand better how the Ionic 4 app UI can be managed in the best possible way for your particular project.

App Template Tutorial

If you are only starting on your Appery.io programming journey, you will definitely find our pre-defined Ionic 4 app templates useful. To get oriented on this topic review: Ionic 4 App Templates.

Cordova Plug-in Tutorials

We have also published several easy-to-follow tutorials that demonstrate the effective use of Cordova plug-ins in Appery.io Ionic 4 projects:

Ionic 4 Calendar plugin Tutorial

Ionic 4 Document Scanner and File Read Plug-ins Tutorial

Ionic 4 Social Sharing plugin Tutorial

More Sample App Tutorials

These tutorials describe how to develop some cool Ionic 4 apps:

Just take a look at how intriguing these examples are as you work through them!

Note: Most of the tutorials come with app backups that make the tutorials easier to go through.


We hope this “to-do list” of Appery.io tutorials will help you get through these trying times and make your #StayAtHome times less burdensome and as efficient and pleasant as possible.

Stay with us and hope for better times soon!

Check Out Our New Ionic 4 Tutorials

Recently we rolled out a new Google Maps Tutorial for Appery.io’s Ionic 4 Builder. But, today, the Appery.io team can offer more help for our valued users to get the most out of Ionic 4! We have always tried to make developing with our platform as easy as possible, and, this time, we do so by presenting two more step-by-step tutorials on building with Ionic 4:

Ionic 4 ngx-translate Tutorial

The first tutorial will guide you through the process of creating an app using the ngx-translate third-party internationalization (i18n) library to build a spectacular multilingual application:

Ionic 4 SweetAlert2 Tutorial

The second tutorial will help you add the SweetAlert2 external module to display modal windows in your Ionic 4 app:


Both of these topics have often been requested as tutorial subjects, so we look forward to seeing a lot more implementations in Appery.io apps. We also hope our tutorials help you build up a broader understanding of how everything works with Appery.io backed up by Ionic 4 features.

Learn How to Use the Google Map Component in an Ionic 4 App

We have some good news for Appery.io users. Another tutorial on Ionic 4 has arrived!

You should have already seen that Appery.io offers an Ionic 4 Google Map component. In this new tutorial, follow step-by-step how to use this component in creating an Ionic 4 app with the Geolocation service to show current coordinates on a map. (Google Maps API key required.) Working with this component is easy. Simply drag it to the page, configure it via the PROPERTIES panel like any other UI component, and then use it with the Google Maps API via JavaScript.And, as a bonus, please check our new instructional video that shows how to use a Google Maps component in Ionic 4 apps here.

How to Use Geolocation in Your Mobile App

geolacation_map

 

Geolocation is one of the most widely used APIs in mobile apps today. From weather to Uber and Lyft, the device location is crucial information and many APIs use it to determine what services and products are available in a given location. When building a mobile app in Appery.io, using the Geolocation API is simple. Apache Cordova library is built-in in every new Appery.io app. Invoking Geolocation will return the latitude, longitude (and other) information which can then be passed to any REST API. The following two short videos show how to use and invoke Geolocation in an Ionic and jQuery Mobile apps:

Looking for more videos like that? Check out our YouTube channel for many more videos.

How to Expose a SOAP Service as a REST API

apiexpress-soap

Appery.io API Express make it fast and simple to connect to an enterprise data source and expose it via a REST API. With API Express you can quickly create an API for:

  • A relational database
  • A WSDL service (SOAP)
  • An existing REST API

In this tutorial, I’m going to show how to expose an existing WSDL service as a REST API and then build a mobile app using the API.

Read the rest of this entry »

PayPal Secure Payments for Your Ionic & AngularJS App

paypal_logoPayPal API is one of the most popular Appery.io plug-ins, and now it’s also available for Ionic & AngularJS!

Our users have frequently requested the ability to add payments to their Ionic & AngularJS mobile apps more quickly, for example, to create an online shop. Now, with the help of this plug-in, you could build an online shop (for instance) to be used by your Ionic & AngularJS app really easily.

A few notes about the security implemented in this app:

  • Authentication with PayPal occurs via a Server Code script. It takes your PayPal app credentials and sends XHR to PayPal. The token is stored to the database.
  • By using the Secure Proxy feature, the actual token value will be substituted on the server side. This way any PayPal API can be triggered.
  • Because of the server-based authentication, sensitive data such as the client secret or token value will never be shown in the app, which eliminates the possibility of theft.

Finally, a few, more general, notes:

  • The flow implemented in this plug-in is similar to PayPal’s flow.
  • We have a PayPal API plug-in tutorial here. Check it out to configure the plug-in.
  • The plug-in is configured for a test environment, so use the PayPal guide too see what you need to do when going live.