diff --git a/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts b/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts index a9a53500320..676be0ee00b 100644 --- a/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts +++ b/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts @@ -577,7 +577,16 @@ export const functions = { name: 'Connecting directly to Postgres', url: '/guides/functions/connect-to-postgres', }, + ], + }, + { + name: 'Third-Party Tools', + url: undefined, + items: [ { name: 'Dart Edge on Supabase', url: '/guides/functions/dart-edge' }, + { name: 'Browserless.io', url: '/guides/functions/examples/screenshots' }, + { name: 'OpenAI API', url: '/guides/functions/examples/openai' }, + { name: 'Upstash Redis', url: '/guides/functions/examples/upstash-redis' }, ], }, { diff --git a/apps/docs/pages/guides/functions/dart-edge.mdx b/apps/docs/pages/guides/functions/dart-edge.mdx index 36efc06b31b..b8f3012560f 100644 --- a/apps/docs/pages/guides/functions/dart-edge.mdx +++ b/apps/docs/pages/guides/functions/dart-edge.mdx @@ -10,6 +10,15 @@ export const meta = { > ⚠️ WARNING: Dart Edge is an experimental project - it's probably not ready for production usage unless you're okay with living on the 'edge'. Open issues on [Dart Edge repo](https://github.com/invertase/dart_edge) if you encounter any issues. +
+ +
+ ## **Pre requirements** Make sure you have [the edge CLI](https://docs.dartedge.dev/#getting-started) installed in addition to [the Supabase CLI](https://supabase.com/docs/guides/cli#installation). diff --git a/apps/docs/pages/guides/functions/local-development.mdx b/apps/docs/pages/guides/functions/local-development.mdx index e3e77c95105..9cb55927208 100644 --- a/apps/docs/pages/guides/functions/local-development.mdx +++ b/apps/docs/pages/guides/functions/local-development.mdx @@ -6,6 +6,52 @@ export const meta = { description: 'Run your Edge Functions locally.', } +## Setting Up Your Environment + +You can follow the [Deno guide](https://deno.com/manual@v1.32.5/getting_started/setup_your_environment) for setting up your development environment with your favorite editor/IDE. + +When developing with VS Code inside of an existing application, you can utilize [multi-root workspaces](https://code.visualstudio.com/docs/editor/workspaces#_multiroot-workspaces). + +
+ +
+ +For example, see this `edge-functions.code-workspace` configuration for a CRA (create react app) client with Supabase Edge Functions. You can find the complete example on [GitHub](https://github.com/supabase/supabase/tree/master/examples/edge-functions). + +```json +{ + "folders": [ + { + "name": "project-root", + "path": "./" + }, + { + "name": "client", + "path": "app" + }, + { + "name": "supabase-functions", + "path": "supabase/functions" + } + ], + "settings": { + "files.exclude": { + "node_modules/": true, + "app/": true, + "supabase/functions/": true + }, + "deno.importMap": "./supabase/functions/import_map.json" + } +} +``` + +## Running Edge Functions locally + You can run your Edge Function locally using [`supabase functions serve`](/docs/reference/cli/usage#supabase-functions-serve): ```bash @@ -15,7 +61,7 @@ supabase functions serve # start the Functions watcher The `functions serve` command has hot-reloading capabilities. It will watch for any changes to your files and restart the Deno server. -### Invoking Edge Functions locally +## Invoking Edge Functions locally While serving your local Edge Function, you can invoke it using curl: diff --git a/apps/docs/pages/guides/functions/quickstart.mdx b/apps/docs/pages/guides/functions/quickstart.mdx index 9563322a715..17f0ca95de5 100644 --- a/apps/docs/pages/guides/functions/quickstart.mdx +++ b/apps/docs/pages/guides/functions/quickstart.mdx @@ -88,6 +88,50 @@ const { data, error } = await supabase.functions.invoke('hello-world', { After invoking your Edge Function you should see the response `{ "message":"Hello Functions!" }`. +## Setting Up Your Environment + +You can follow the [Deno guide](https://deno.com/manual@v1.32.5/getting_started/setup_your_environment) for setting up your development environment with your favorite editor/IDE. + +When developing with VS Code inside of an existing application, you can utilize [multi-root workspaces](https://code.visualstudio.com/docs/editor/workspaces#_multiroot-workspaces). + +
+ +
+ +For example, see this `edge-functions.code-workspace` configuration for a CRA (create react app) client with Supabase Edge Functions. You can find the complete example on [GitHub](https://github.com/supabase/supabase/tree/master/examples/edge-functions). + +```json +{ + "folders": [ + { + "name": "project-root", + "path": "./" + }, + { + "name": "client", + "path": "app" + }, + { + "name": "supabase-functions", + "path": "supabase/functions" + } + ], + "settings": { + "files.exclude": { + "node_modules/": true, + "app/": true, + "supabase/functions/": true + }, + "deno.importMap": "./supabase/functions/import_map.json" + } +} +``` + ## Database Functions vs Edge Functions For data-intensive operations we recommend using [Database Functions](/docs/guides/database/functions), which are executed within your database