Skip to main content
Codeezly

Integrations

Codeezly ships several integration surfaces, but they do not all live in a single settings screen. Use this guide to find the right workspace panel for each connection type.

Where Integrations Live

  • Workspace Tools — Figma import and sync live under the Tools menu.
  • Developer Mode → Integrations — Stripe, API Tester, Auth Setup, and quick deployment-provider setup.
  • Publish — custom domains, environment variables, deployment history, and Vercel/Netlify targets.
  • Version Control — GitHub connection, push, pull, and pull-request workflows.

If you prefer an overview first, open the public integrations hub, then come back here for the detailed steps.

Stripe

Accept payments in your generated apps with Stripe.

  1. Open the workspace for the project you want to update.
  2. Switch to Developer Mode.
  3. Open Integrations → Stripe from the workspace header.
  4. Connect your Stripe account and review the available billing/product data.
  5. Ask the AI to generate or refine payment components such as:
    • Checkout forms
    • Pricing tables
    • Subscription management
    • Payment forms

Generated Stripe flows can use your actual prices and products after the connection is in place.

Figma

Import designs from Figma and convert them to React code.

  1. Open the workspace and click Tools in the top bar.
  2. Choose Figma when the Figma integration flag is enabled for your environment.
  3. Authorize Codeezly to access your Figma files.
  4. Paste a Figma file or frame URL and choose whether to import a full page, component, or frame.
  5. Codeezly analyzes the design and generates matching workspace files you can continue editing with AI.

Tip: For best results, keep your Figma designs organized with proper layer naming and auto-layout.

GitHub

Push code, create PRs, and sync with GitHub from the Version Control panel. Use the GitHub button in that panel to connect, then push or pull the active branch.

Deployment Providers

Deployment integrations are split between the Publish panel and the Developer Mode integrations menu.

  1. Click Publish in the workspace toolbar for the project you want to launch.
  2. Use Codeezly CDN for built-in hosting, or connect Vercel / Netlify so publishes run in your own deployment workspace.
  3. Review environment variables, domain configuration, and build diagnostics before launching.

Authentication Providers

Codeezly supports generating authentication flows for multiple providers.

Open Developer Mode → Integrations → Auth Setup to configure the provider scaffolding for the current project.

  • Google OAuth — Sign in with Google.
  • GitHub OAuth — Sign in with GitHub.
  • Email/Password — Traditional email authentication.
  • Magic Link — Passwordless email authentication.

Ask the AI something like "Add Google and GitHub sign-in with a login page" and it will generate the complete authentication flow.

API Testing

Test external APIs directly from the workspace:

  1. Switch to Developer Mode.
  2. Open Integrations → API Tester from the workspace header.
  3. Enter a URL, choose a method (GET, POST, PUT, DELETE), and add headers/body as needed.
  4. Click Send to see the response.
  5. Use the response data to inform your AI prompts (e.g., "build a UI for this API response").

Managing Integrations

Credentials and integration state are scoped to the workspace feature that owns them:

  • Use Tools for Figma import and sync.
  • Use Developer Mode → Integrations for Stripe, Auth Setup, API Tester, and quick provider setup.
  • Use Publish for deployment targets, domains, and environment variables.
  • Use Version Control for GitHub connection, push, pull, and pull-request workflows.

Integration credentials are encrypted at rest and never exposed directly in generated client code. The AI uses the server-side integration services to interact with connected providers.