docs: Update key usage in QuickStarts (supabase#44434)

ChrisChinchilla · fadymak · web-flow · commit a725766e6a05 · 2026-04-02T15:53:26.000Z
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES  ## Summary by CodeRabbit * **Documentation** * Updated all quickstart guides and tutorials to reference publishable keys instead of anon keys for Supabase client initialization. * Simplified environment variable setup instructions across multiple framework guides by removing anon key configuration requirements. * Clarified usage of publishable keys in step-by-step setup documentation for various frameworks and platforms.  --------- Co-authored-by: fadymak <dev@fadymak.com>
diff --git a/apps/docs/app/contributing/content.mdx b/apps/docs/app/contributing/content.mdx
@@ -359,12 +359,10 @@ Some guides and tutorials will require that users copy their Supabase project UR
 ```mdx
 <ProjectConfigVariables variable="url" />
 <ProjectConfigVariables variable="publishable" />
-<ProjectConfigVariables variable="anon" />
 ```
 
 <ProjectConfigVariables variable="url" />
 <ProjectConfigVariables variable="publishable" />
-<ProjectConfigVariables variable="anon" />
 
 ### Step Hike
 
diff --git a/apps/docs/content/_partials/api_settings.mdx b/apps/docs/content/_partials/api_settings.mdx
@@ -4,15 +4,16 @@ Now that you've created some database tables, you are ready to insert data using
 
 To do this, you need to get the Project URL and key from [the project **Connect** dialog](/dashboard/project/\_?showConnect=true&connectTab={{ .tab }}&framework={{ .framework }}).
 
+[Read the API keys docs](/docs/guides/api/api-keys) for a full explanation of all key types and their uses.
+
 <Admonition type="note" title="Changes to API keys">
 
 Supabase is changing the way keys work to improve project security and developer experience. You can [read the full announcement](https://github.com/orgs/supabase/discussions/29260), but in the transition period, you can use both the current `anon` and `service_role` keys and the new publishable key with the form `sb_publishable_xxx` which will replace the older keys.
 
+**The legacy keys will be deprecated shortly, so we strongly encourage switching to and using the new publishable and secret API keys**.
+
 In most cases, you can get the correct key from [the Project's **Connect** dialog](/dashboard/project/\_?showConnect=true&connectTab={{ .tab }}&framework={{ .framework }}), but if you want a specific key, you can find all keys in [the API Keys section of a Project's Settings page](/dashboard/project/_/settings/api-keys/):
 
-- **For legacy keys**, copy the `anon` key for client-side operations and the `service_role` key for server-side operations from the **Legacy API Keys** tab.
-- **For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
+**For new keys**, open the **API Keys** tab, if you don't have a publishable key already, click **Create new API Keys**, and copy the value from the **Publishable key** section.
 
 </Admonition>
-
-[Read the API keys docs](/docs/guides/api/api-keys) for a full explanation of all key types and their uses.
diff --git a/apps/docs/content/guides/auth/quickstarts/nextjs.mdx b/apps/docs/content/guides/auth/quickstarts/nextjs.mdx
@@ -56,7 +56,7 @@ hideToc: true
 
         <ProjectConfigVariables variable="url" />
         <ProjectConfigVariables variable="publishable" />
-        <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/auth/quickstarts/react-native.mdx b/apps/docs/content/guides/auth/quickstarts/react-native.mdx
@@ -70,7 +70,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
     <StepHikeCompact.Code>
diff --git a/apps/docs/content/guides/auth/quickstarts/react.mdx b/apps/docs/content/guides/auth/quickstarts/react.mdx
@@ -67,7 +67,7 @@ hideToc: true
 
         <ProjectConfigVariables variable="url" />
         <ProjectConfigVariables variable="publishable" />
-        <ProjectConfigVariables variable="anon" />
+
 
 
     </StepHikeCompact.Details>
diff --git a/apps/docs/content/guides/auth/server-side/creating-a-client.mdx b/apps/docs/content/guides/auth/server-side/creating-a-client.mdx
@@ -43,7 +43,6 @@ Create a `.env.local` file in the project root directory. In the file, set the p
 
 <ProjectConfigVariables variable="url" />
 <ProjectConfigVariables variable="publishable" />
-<ProjectConfigVariables variable="anon" />
 
 <$Partial path="api_settings_steps.mdx" variables={{ "framework": "nextjs", "tab": "frameworks" }} />
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/expo-react-native.mdx b/apps/docs/content/guides/getting-started/quickstarts/expo-react-native.mdx
@@ -61,7 +61,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
@@ -94,9 +94,9 @@ hideToc: true
       import 'expo-sqlite/localStorage/install';
 
       const supabaseUrl = process.env.EXPO_PUBLIC_SUPABASE_URL
-      const supabaseAnonKey = process.env.EXPO_PUBLIC_SUPABASE_PUBLISHABLE_KEY
+      const supabasePublishableKey = process.env.EXPO_PUBLIC_SUPABASE_PUBLISHABLE_KEY
 
-      export const supabase = createClient(supabaseUrl, supabaseAnonKey, {
+      export const supabase = createClient(supabaseUrl, supabasePublishableKey, {
         auth: {
           storage: localStorage,
           autoRefreshToken: true,
diff --git a/apps/docs/content/guides/getting-started/quickstarts/flask.mdx b/apps/docs/content/guides/getting-started/quickstarts/flask.mdx
@@ -59,7 +59,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/flutter.mdx b/apps/docs/content/guides/getting-started/quickstarts/flutter.mdx
@@ -55,11 +55,11 @@ hideToc: true
 
     <StepHikeCompact.Details title="Initialize the Supabase client">
 
-      Open `lib/main.dart` and edit the main function to initialize Supabase using your project URL and public API (anon) key:
+      Open `lib/main.dart` and edit the main function to initialize Supabase using your project URL and publishable key:
 
       <ProjectConfigVariables variable="url" />
       <ProjectConfigVariables variable="publishable" />
-      <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/hono.mdx b/apps/docs/content/guides/getting-started/quickstarts/hono.mdx
@@ -45,13 +45,13 @@ hideToc: true
   <StepHikeCompact.Step step={3}>
     <StepHikeCompact.Details title="Set up the required environment variables">
 
-    Copy the `.env.example` file to `.env` and update the values with your Supabase project URL and anon key.
+    Copy the `.env.example` file to `.env` and update the values with your Supabase project URL and publishable key.
 
     Lastly, [enable anonymous sign-ins](/dashboard/project/_/auth/providers) in the Auth settings.
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
     <StepHikeCompact.Code>
diff --git a/apps/docs/content/guides/getting-started/quickstarts/ios-swiftui.mdx b/apps/docs/content/guides/getting-started/quickstarts/ios-swiftui.mdx
@@ -41,11 +41,11 @@ hideToc: true
 
     <StepHikeCompact.Details title="Initialize the Supabase client">
 
-      Create a new `Supabase.swift` file add a new Supabase instance using your project URL and public API (anon) key:
+      Create a new `Supabase.swift` file add a new Supabase instance using your project URL and publishable key:
 
       <ProjectConfigVariables variable="url" />
       <ProjectConfigVariables variable="publishable" />
-      <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/kotlin.mdx b/apps/docs/content/guides/getting-started/quickstarts/kotlin.mdx
@@ -80,7 +80,7 @@ hideToc: true
 
       <ProjectConfigVariables variable="url" />
       <ProjectConfigVariables variable="publishable" />
-      <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
@@ -91,7 +91,7 @@ hideToc: true
 
       val supabase = createSupabaseClient(
           supabaseUrl = "https://xyzcompany.supabase.co",
-          supabaseKey = "your_public_anon_key"
+          supabaseKey = "your_publishable_key"
         ) {
           install(Postgrest)
       }
diff --git a/apps/docs/content/guides/getting-started/quickstarts/nextjs.mdx b/apps/docs/content/guides/getting-started/quickstarts/nextjs.mdx
@@ -43,7 +43,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/nuxtjs.mdx b/apps/docs/content/guides/getting-started/quickstarts/nuxtjs.mdx
@@ -59,7 +59,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/reactjs.mdx b/apps/docs/content/guides/getting-started/quickstarts/reactjs.mdx
@@ -59,7 +59,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/refine.mdx b/apps/docs/content/guides/getting-started/quickstarts/refine.mdx
@@ -79,7 +79,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/solidjs.mdx b/apps/docs/content/guides/getting-started/quickstarts/solidjs.mdx
@@ -57,7 +57,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
@@ -93,7 +93,7 @@ hideToc: true
       import { createClient } from "@supabase/supabase-js";
       import { createResource, For } from "solid-js";
 
-      const supabase = createClient('https://<project>.supabase.co', '<sb_publishable_... or anon key>');
+      const supabase = createClient('https://<project>.supabase.co', '<sb_publishable_key>');
 
       async function getInstruments() {
         const { data } = await supabase.from("instruments").select();
diff --git a/apps/docs/content/guides/getting-started/quickstarts/sveltekit.mdx b/apps/docs/content/guides/getting-started/quickstarts/sveltekit.mdx
@@ -58,7 +58,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/tanstack.mdx b/apps/docs/content/guides/getting-started/quickstarts/tanstack.mdx
@@ -59,7 +59,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/quickstarts/vue.mdx b/apps/docs/content/guides/getting-started/quickstarts/vue.mdx
@@ -59,7 +59,7 @@ hideToc: true
 
     <ProjectConfigVariables variable="url" />
     <ProjectConfigVariables variable="publishable" />
-    <ProjectConfigVariables variable="anon" />
+
 
     </StepHikeCompact.Details>
 
diff --git a/apps/docs/content/guides/getting-started/tutorials/with-flutter.mdx b/apps/docs/content/guides/getting-started/tutorials/with-flutter.mdx
@@ -155,7 +155,7 @@ import 'package:supabase_flutter/supabase_flutter.dart';
 Future<void> main() async {
   await Supabase.initialize(
     url: 'YOUR_SUPABASE_URL',
-    anonKey: 'YOUR_SUPABASE_PUBLISHABLE_KEY',
+    publishableKey: 'YOUR_SUPABASE_PUBLISHABLE_KEY',
   );
   runApp(const MyApp());
 }
@@ -474,7 +474,7 @@ import 'package:supabase_quickstart/pages/login_page.dart';
 Future<void> main() async {
   await Supabase.initialize(
     url: 'YOUR_SUPABASE_URL',
-    anonKey: 'YOUR_SUPABASE_PUBLISHABLE_KEY',
+    publishableKey: 'YOUR_SUPABASE_PUBLISHABLE_KEY',
   );
   runApp(const MyApp());
 }
diff --git a/apps/docs/content/guides/getting-started/tutorials/with-redwoodjs.mdx b/apps/docs/content/guides/getting-started/tutorials/with-redwoodjs.mdx
@@ -134,7 +134,7 @@ And finally, you will also need to save **just** the `web side` environment vari
 </$CodeTabs>
 
 These variables will be exposed on the browser, and that's completely fine.
-They allow your web app to initialize the Supabase client with your public anon key
+They allow your web app to initialize the Supabase client with your publishable key
 since we have [Row Level Security](/docs/guides/auth#row-level-security) enabled on our Database.
 
 You'll see these being used to configure your Supabase client in `web/src/App.js`:
