mirror of
https://github.com/supabase/supabase.git
synced 2026-10-14 05:39:11 +03:00
26248be753
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## Summary Adds two new optional onboarding steps — **Install Agent Skills** and **Install MCP server** — to every framework quickstart guide, right after the "create app" step, so readers are pointed at [Agent Skills](/docs/guides/ai-tools/ai-skills) and the [Supabase MCP server](/docs/guides/ai-tools/mcp) early in the setup flow. **Where each step lives:** - **16 quickstarts that include the shared `quickstart_db_setup.mdx` partial** (Next.js, Astro, Expo/React Native, Flask, Flutter, Hono, iOS/SwiftUI, Kotlin, Laravel, Nuxt, React, Refine, SolidJS, SvelteKit, TanStack Start, Vue): the partial itself now has a step 2 "Install MCP server (optional)" (between project creation and database setup), and each individual file gets its own "Install Agent Skills (optional)" step right after its app-creation step. - **RedwoodJS and Ruby on Rails** (don't use the shared partial): got both steps added inline, in the same order (Agent Skills, then MCP server), since they can't inherit from the partial. - All subsequent step numbers (and the "Step N" cross-references in prose, e.g. in RedwoodJS) were renumbered to stay sequential. ## Test plan - Check the quickstarts locally or in preview. - Any other ideas on how to optimise showing these items? - Does the SQL prefill add anything? - Other ideas on how to simplify without losing the information? - Check the MD output too and see if that also makes sense. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Documentation** * Refreshed multiple getting-started quickstarts with consistent, clearer step sequencing (including renumbering) across frameworks. * Added an optional “Install Agent Skills” step where applicable, plus updated placements of shared environment-variable setup content. * Simplified the database quickstart flow: single “Create a Supabase project” step, streamlined SQL Editor instructions for creating an `instruments` table, enabling RLS, and granting public read access. * Added optional “Install MCP server” steps in the relevant quickstarts. * **Style** * Updated MDX linting rules to allow the uppercase phrase “Agent Skills”. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Jeremias Menichelli <jmenichelli@gmail.com> Co-authored-by: Nik Richers <nrichers@gmail.com>
63 lines
2.0 KiB
Plaintext
63 lines
2.0 KiB
Plaintext
---
|
|
title: 'Use Supabase with Hono'
|
|
subtitle: 'Learn how to create a Supabase project, add some sample data to your database, secure it with auth, and query the data from a Hono app.'
|
|
breadcrumb: 'Framework Quickstarts'
|
|
---
|
|
|
|
<$Partial path="quickstart_db_setup.mdx" />
|
|
|
|
## 3. Create a Hono app
|
|
|
|
Bootstrap the Hono example app from the Supabase Samples using the CLI.
|
|
|
|
```bash
|
|
npx supabase@latest bootstrap hono
|
|
```
|
|
|
|
## 4. Install Agent Skills (optional)
|
|
|
|
Supabase's [Agent Skills](/docs/guides/ai-tools/ai-skills) is a curated set of instructions that give your AI agent procedural knowledge about working with Supabase.
|
|
|
|
To install, run the following command in the root of your project:
|
|
|
|
```bash
|
|
npx skills add supabase/agent-skills
|
|
```
|
|
|
|
## 5. 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.
|
|
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
## 6. 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, which you can get from the helper below, or [from the project **Connect** panel](/dashboard/project/_?showConnect=true&tab=frameworks).
|
|
|
|
Lastly, [enable anonymous sign-ins](/dashboard/project/_/auth/providers) in the Auth settings.
|
|
|
|
```bash
|
|
cp .env.example .env
|
|
```
|
|
|
|
{/* TODO: Not ideal for frameworks that have no entry in Connect */}
|
|
<$Partial path="api_settings.mdx" variables={{ "framework": "", "tab": "frameworks" }} />
|
|
|
|
## 7. 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.
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
## Next steps
|
|
|
|
- Learn how [server side auth](/docs/guides/auth/server-side/creating-a-client?queryGroups=framework&framework=hono) works with Hono.
|
|
- [Insert more data](/docs/guides/database/import-data) into your database
|
|
- Upload and serve static files using [Storage](/docs/guides/storage)
|