Skip to main content

Adding Authentication

This guide walks you through adding user authentication to your app, allowing users to create accounts, log in, and access their personal data.

What You’ll Build

  • Sign up with email and password
  • Log in to existing account
  • Persistent login sessions
  • Protected routes (only accessible when logged in)
  • Logout functionality

Step 1: Add Auth Screens

Start by asking the AI to create the authentication UI:

Step 2: Connect to Backend

Now add the backend authentication logic:
This creates the necessary API endpoints in Liquid Backend: /api/auth/register, /api/auth/login, and /api/auth/me.

Step 3: Protect Routes

Make certain screens require authentication:

Step 4: Add Logout

Add a way for users to sign out:

Step 5: Add User Profile

Show user information in the app:

Testing Your Auth Flow

Test the complete flow:
1

Sign Up

Create a new account with test credentials
2

Verify Login

After signup, you should be on the home screen
3

Test Persistence

Reload the preview - you should still be logged in
4

Logout

Sign out and verify you’re back at login
5

Login Again

Log in with your test credentials

Common Authentication Patterns

Showing Auth Status

Forgot Password

Social Login

Social login requires additional configuration in Liquid Backend and the respective provider consoles (Google Cloud, Apple Developer).

Apple & Google Login with Supabase

Using Supabase as your backend? Follow the step-by-step walkthrough for Sign in with Apple and Google.

User-Specific Data

Once authentication is set up, associate data with users:

Best Practices

Validate Input

Check email format and password strength

Clear Error Messages

Tell users exactly what went wrong

Loading States

Show loading indicators during auth operations

Secure Storage

Auth tokens are stored securely automatically

Troubleshooting

  • Check the backend logs for errors
  • Verify the account was created successfully
  • Try creating a new account
  • Tell the AI: “The login session is not persisting across app restarts”
  • Verify secure storage is being used correctly
  • Check the auth state logic
  • Verify the auth check runs on app launch

Next Steps

Connect Database

Store user-specific data

Add Payments

Monetize with subscriptions