How do I implement user authentication in my app? | Aquro Help Center

Implementing user authentication in your app can be as simple as adding a few pages to your app along with some Visual Coding Scripts.

You may use the Materialize with authentication template to get a jump start for your app with a template that contains all functions needed to implement user authentication inside an app.

This article will not go into details about how you add pages, add components or working with Visual Coding Scripts. If you are unfamiliar with any of these concepts please first read up on this topics before you continue and implements user authentication in your app.

In this article we will cover all the steps needed to implement user authentication in one way, there are a lot of different ways this could be done:

  1. Configuring your Home page to validate if the user have logged in
  2. Adding the functionality for a user to sign up in your app
  3. Adding the functionality for a user to sign in into your app

Prerequisites

This sample app will include 4 different pages. If you like to follow along and create the app as described in this article first create a new app and create these pages:

Configuring your Home page

In this concept we will use the Home page just to check if the user is signed into the app or if the user is unauthenticated. Per default Home is the first page loaded by a application this would be a great place check the status of user authentication.

This is done by these steps:

  1. Open the Home page
  2. Adding the Aquro:LoadEvent component to the page
  3. Edit the Visual Coding Script for the Load event on the Aquro:LoadEvent component
  4. Create a script that uses the Cloud.Auth.IsLoggedIn manger to check if someone is logged in. If a user is logged in use the Page.Load manager to load the Start page, if no user is logged in use the Page.Load manager to load the SignIn page.

Adding sign in functionality

On the SignIn page we will create a field for the e-mail and password. Then we will use the a Visual Coding Script to sign in the user with the Cloud.Auth.Login manager. This is done by these steps:

  1. Open the SignIn page
  2. Add input fields for the email and password
  3. Add a sign-in-button
  4. Edit the Visual Coding Script for the Click event on the button
  5. Create a script that tries to sign in the user by using the Cloud.Auth.Login manager. If the user is successfully signed in use the Page.Load manager to load the Start page.

Adding sign up functionality

On the sign in page you should add another button there users may click if they like to sign up in your app. When clicking that button the SignUp page should be loaded. On that page a user registration form with a e-mail and a password field. Then we will use the Cloud.Auth.Create manager to create a user and finally load the Start page.

This is done by these steps:

  1. Open the SignIn page
  2. Add a sign-up button to the page and add a Visual Coding Script to load the SignUp page when clicked.
  3. Open the SignUp page
  4. Add input fields for email and password
  5. Add a sign-up button
  6. Create a Visual Coding Script for the click event on the sign-up button that uses the Cloud.Auth.Create manager to create a user. If the user was successfully created use the Page.Load manager to load the Start page