Skip to content

Integration UI overview

Using elements made available by Netlify, you can create an interactive surface for your integration that users can access in the Netlify UI. This is where you can provide context for an integration and where a user can configure the integration.

For example, with the Integration UI you can:

  • add text that introduces the integration
  • provide a link to documentation where users can learn more about the integration
  • add a form to collect configuration values from users

Different tools for Netlify Connect UI

If you’re developing an integration with a connector and want to customize the configuration options that will display in Netlify Connect, use the defineOptions API instead of the Integration UI component.

You can use the Netlify SDK utility tools to run, test, and build your integration as you work.

Once you publish your integration, it will be available for Netlify users to add to their sites or teams.

Documentation

  • Get started: how to generate the boilerplate and add the basic scaffolding for the Integration UI in your integration.
  • Add elements: how to add different types of context and interactions to your Integration UI.
  • Make the UI reactive: how to make interactions with a UI element affect other UI elements.
  • Call API Handlers: how to interact with the Integration API or Netlify API from the Integration UI and modify Netlify entities based on interactions with the Integration UI.
  • Navigate integration routes: how to add separate pages for your integration’s UI.
  • Integration card: overview of how your integration will appear in the Integrations tab of the Netlify UI.