Dive into Altogic integration with Flutter

Hi there,👋welcome back to a new arcticle. In this article, we are gonna build🚀 a simple application showing authentication flow using Flutter and Altogic.

Before starting with building application first let’s explore about Altogic and the features that is supported.

What is Altogic?

Altogic is a backend as a service platform that allows developers to build, deploy and manage scalable backends applications. Altogic provides a visual development tools to build and manage your backend applications and a cloud platform to hosts and runs these applications.

Features Provided

  • No-code business logic modeling: CRUD Operations
  • Data management
  • Caching
  • Realtime Messaging
  • Session management
  • Endpoint access management
  • File management
  • Asynchronous services and scheduled jobs
  • App developments
  • App security
  • Expressions & Functions

Here is the document link to explore each feature in depth: Altogic Features

Set up the backend

Create an app in Altogic

First things first: To use Altogic, we need to create an app in Altogic. We can create an app in Designer easily. We have to give an application name, select the domain, choosing the development location, selecting the pricing plan, and a basic template or blank app.

Backend Setup

For integrating our backend application with flutter application we need API Base URL and that can be get by clicking the environment details page button which is at the bottom corner and then simply click on Development. You will find the base url at the bottom of this section.

We can get the clientKey by clicking on the App Settings button in the left-bottom corner of the Designer and clicking on the Client library keys section.

Set up the application

To integrate Altogic backend application with our flutter application we need to use Altogic Client Library. So for that we will add altogic_flutter package in our application.

Step 1: Add the dependencies

Add dependencies to pubspec.yaml file.

dependencies:
flutter:
sdk: flutter
altogic_flutter: ^0.0.9​

Step 2: Create an instance of altogic client library

We need to create an instance of AltogicClient to authenticate user while register or login.

 AltogicClient client = createClient(
'YOUR_URL',
'YOUR_CLIENT_KEY');
runApp(const MyApp());
}

Step 3: Authentication
To register and login any user we need AltogicClient instance and then can authenticate it using the specified providers methods.

For Register:

 void onTapBtnRegister(context) async {
var res = await client.auth.signUpWithEmail(
emailController.text,
passwordController.text);
print(res.user);
print(res.errors);
if(res.user!=null){
Navigator.push(context, MaterialPageRoute(builder: (context) => HomePage(user: res.user!)));
}
}

For Login:

void onTapBtnLogin(context) async {
var res = await client.auth
.signUpWithEmail(emailController.text, passwordController.text);
if (res.user != null) {
Navigator.push(context,
MaterialPageRoute(builder: (context) => HomePage(user: res.user!)));
}
}

Here is the source code that you can clone and use for your application. Github Link: Altogic Integration

Please Follow 💙 and clap 👏, if you find the article useful. And get notified of my upcoming articles.

Follow me on Twitter: @SnehalS_ and Github: Snehal Singh to hear about my projects.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Snehal Singh 👩‍💻

SDE - 1 at DhiWise | Flutter Developer 💙 | Women Techmakers Ambassador | Technical Writer & Instructor at Udemy