ContextQMD
Back to Supabase

Use Supabase with Hono

apps/docs/content/guides/getting-started/quickstarts/hono.mdx

1.26.042.2 KB
Original Source
<StepHikeCompact>

<StepHikeCompact.Step step={1}>

<StepHikeCompact.Details title="Create a Hono app">

Bootstrap the Hono example app from the Supabase Samples using the CLI.

</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```bash name=Terminal
  npx supabase@latest bootstrap hono
  ```

</StepHikeCompact.Code>

</StepHikeCompact.Step>

<StepHikeCompact.Step step={2}> <StepHikeCompact.Details title="Install the Supabase client library">

The `package.json` file in the project includes the necessary dependencies, including `@supabase/supabase-js` and `@supabase/ssr` to help with server-side auth.

</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```bash name=Terminal
  npm install
  ```

</StepHikeCompact.Code>

</StepHikeCompact.Step>

<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 publishable key.

Lastly, [enable anonymous sign-ins](/dashboard/project/_/auth/providers) in the Auth settings.

<ProjectConfigVariables variable="url" />
<ProjectConfigVariables variable="publishable" />


</StepHikeCompact.Details>
<StepHikeCompact.Code>


  ```bash name=Terminal
  cp .env.example .env
  ```

<$Partial path="api_settings_steps.mdx" variables={{ "framework": "", "tab": "frameworks" }} />

</StepHikeCompact.Code>

</StepHikeCompact.Step>

<StepHikeCompact.Step step={4}> <StepHikeCompact.Details title="Start the app">

Start the app, go to http://localhost:5173.

Learn how [server side auth](/docs/guides/auth/server-side/creating-a-client?queryGroups=framework&framework=hono) works with Hono.

</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```bash name=Terminal
  npm run dev
  ```

</StepHikeCompact.Code>

</StepHikeCompact.Step> </StepHikeCompact>

Next steps