# Custom Authentication
> This page is about FlutterFlow Studio (the visual builder), not FlutterFlow (the app builder you use by describing your app).
URL: https://docs.flutterflow.io/integrations/authentication/custom-authentication
Learn how to add custom authentication in your FlutterFlow Studio app.
Custom authentication allows you to manage auth-related data (login details) while utilizing your own backend to authenticate users.
:::tip[concepts]
Understanding the concept of [**Token**](https://docs.flutterflow.io/integrations/authentication/tokens) is essential for grasping how secure access and user verification work in an application.
:::
## Adding custom authentication
Let's see how to add custom authentication by building an example that looks like this:
The steps to add custom authentication are as follows:
1. [Enabling custom authentication](#1-enabling-custom-authentication)
2. [Building pages](#2-building-pages)
3. [Authenticate users](#3-authenticate-users)
4. [Save auth data](#4-save-auth-data)
5. [Access auth data](#5-access-auth-data)
6. [Update auth data](#6-update-auth-data)
7. [Logout](#7-logout)
### 1. Enabling custom authentication
To enable custom authentication in FlutterFlow Studio:
1. Open **Setting and Integrations** () **>** **App Settings > Authentication**.
2. Turn on the **Enable Authentication** toggle and set **Authentication Type** to **Custom**.
3. To ensure that your users are directed to the appropriate pages based on their login status, you must set the initial pages.
4. By default, the **Persist Auth Sessions** option is enabled, which means users remain logged in until they actively log out. With this option enabled, your app will automatically open to the homepage whenever it's restarted.
5. After successful authentication, your backend typically sends login details like an authentication token, a refresh token, and user details. To keep the user logged in within your app, you must store this data. You can achieve this by enabling **Associate User Data Type** and setting **User Data Type** to the [Custom Data Type](https://docs.flutterflow.io/resources/data-representation/custom-data-types). **Note** that the structure of your Custom Data Type should closely resemble the structure of a successful authentication's JSON response. At the very least, it should include critical fields like the authentication token.
### 2. Building pages
Let's add a page that allows users to create accounts and log in. To speed up, you can add a page from the template. Here is the page added from the templates, and after some modification, it looks the below:
Also, see how to [build a page layout](https://docs.flutterflow.io/concepts/layouts) in case you want to build a page from scratch.
### 3. Authenticate users
On each page, on click of a button, you can add appropriate authentication related [API calls](https://docs.flutterflow.io/resources/backend-logic/rest-api). For this example, we use [this](https://dummyjson.com/docs/auth).
### 4. Save auth data
After successful authentication, you can save the auth related data using the 'Log in' action. Here's how you do it:
1. Inside the **TRUE** branch of the [previous API call](#3-authenticate-users), add the **Log in** (under *Backend/Database > Custom Authentication*) action.
2. Under the **User Auth Properties**, you can set values for **Authentication Token**, **Refresh Token**, **Token Expiry Time**, and **User UID**. **Note that for the 'Persist Auth Sessions' option to work, you must set the Authentication Token**.
3. **Set User Data** to store the result of the previous API call (i.e., auth details) in a Custom Data Type. See how to get the [JSON into Data Type](https://docs.flutterflow.io/resources/backend-logic/rest-api#json-to-data-type).
### 5. Access auth data
To access the auth data after a user logs in, open the **set from variable** menu **> Authenticated User >** choose **from Auth Properties** or **User Data Fields**.
### 6. Update auth data
You may want to update the auth data in situations like updating the access token with the new one after it has expired. You can do so using the **Update Authenticated User** action.
Here's exactly how you do it:
1. Once you get the 401 status code, i.e., unauthorized user error, ensure to make an API call to renew the access token.
2. On getting the new access token, add a new action named **Update Authenticated User**.
3. Under the **User Auth Properties**, you can update a value for the **Authentication Token** with a new access token.
### 7. Logout
You can logout a user by adding the **Log Out** action.
