Skip to main content

Sign in with Google on Expo React Native Web Client

First make sure you have completed the Quickstart page.
  • We need Supabase to be setup.
1
First of all, you need to create a new project in the Google Cloud Console if you donโ€™t have one already.
Step 1
2
Click the APIs & Services menu.
Step 2
3
Click the Credentials menu.
Step 3
4
Then click the Create Credentials button.
  • Please select OAuth client ID
Step 4
5
But you need to Configure Consent Screen first.
Step 5
6
Go to Supabase Dashboard > Authentication > Providers
  • Select Google
    Step 6
7
Step 7
8
  1. Then you need to select Web Application first.
  2. Fill the form.
  3. Paste your https://<project-ref>.supabase.co/auth/v1/callback in the Authorized redirect URIs field.
  4. Click the Save button.
Step 8
9
Step 9
10
Step 10
11
Step 11
12
End of the setup.
  • You need to add the GOOGLE_OAUTH_CLIENT_ID to the .env file.
#* Google OAuth keys for the app
EXPO_PUBLIC_GOOGLE_OAUTH_CLIENT_ID=some-id.apps.googleusercontent.com
EXPO_PUBLIC_GOOGLE_OAUTH_IOS_CLIENT_ID=some-id.apps.googleusercontent.com             
EXPO_PUBLIC_GOOGLE_OAUTH_ANDROID_CLIENT_ID=some-id.apps.googleusercontent.com
13
You have successfully set up Google OAuth for your Expo React Native Web Client. ๐ŸŽ‰