​
🌐 What is OpenInt?

OpenInt is your go-to solution for embedded product integrations. It empowers teams to ship product integrations in hours, not weeks, using no or low code. With OpenInt, you can read and write data using unified APIs or sync it straight to your database privately.

​
🎥 Quick Demo

Want to see OpenInt in action? Check out our quick demo on YouTube to get a visual overview of how OpenInt can streamline your integrations.

​
🚀 Key Features

Select Integrations

Configure your integrations and connectors via the console app. Choose from a variety of pre-built integrations to get started quickly.

Deploy to Cloudflare

One-click deploy to Cloudflare and connect your Postgres database effortlessly. Enjoy seamless integration with your existing infrastructure.

Invite Users

Share a magic link with your users or embed it in your app for easy access. Simplify user onboarding with intuitive sharing options.

Easy to Integrate

Embed the magic link or use the Embed React component to add integrations to your app.

​
🎉 Why Choose OpenInt?

Speed

Get your integrations up and running in no time.

Simplicity

Use no or low code solutions to minimize development effort.

Security

Keep your data private and secure with direct database syncs.

Frictionless Data Movement

Connect any API in minutes, leaving complex tasks like auth, access management, and data engineering to us.

​
✨ Get Started with OpenInt

Ready to streamline your integrations? Sign up now to start using OpenInt and transform your workflow!

1

Set Up Your Connector

After signing up, navigate to the dashboard and set up your first connector, in this example we’ll use Greenhouse. This is where you can configure your integration settings to match your requirements.

2

Install Dependencies

npm install @openint/connect @opensdks/sdk-openint

yarn add @openint/connect @opensdks/sdk-openint

pnpm add @openint/connect @opensdks/sdk-openint
3

Configure API Key and Token

For Non-React Applications:

  1. Instead of a token, generate a magic link using your backend.
  2. Embed this magic link as an iframe in your application to enable seamless user interactions.
import { initOpenIntSDK } from "@opensdks/sdk-openint";

// Generate a Magic Link and use it within an iframe
      const magicLinkResponse = await openint
        .POST("/connect/magic-link", {
          body: { customerId, validityInSeconds: 2592000 },
        })
        .then((r) => r.data)
        .catch((err) => {
          console.error("Error generating magic link:", err);
          return null;
        });
      const magicLink = magicLinkResponse?.url;

// Example for embedding a magic link
      const iframe = `<iframe src="${magicLink}" />`;

For React Applications:

  1. Use your API key to generate a token on the backend.
  2. Pass this token to the frontend.
// Generate a Token with your API key (on the server)
import { initOpenIntSDK } from "@opensdks/sdk-openint";
import { OpenIntConnectEmbed } from "@openint/connect";

export default async function OpenIntExample() {
  const openint = initOpenIntSDK({apiKey: process.env.OPENINT_API_KEY ?? ""});

  const tokenResponse = await openint
    .POST("/connect/token", {
      body: { customerId: "END_USER_ID" },
    })
    .catch((err) => {
      console.error("Error fetching token:", err);
      return { data: { token: null } };
    });

  const token = tokenResponse?.data?.token ?? "";

  return (
    <section className="flex-1 p-4 lg:p-8">
      <h1 className="text-lg lg:text-2xl font-medium text-gray-900 mb-6">
        Basic Sync Integration
      </h1>
      <OpenIntConnectEmbed
        width={800}
        height={700}
        params={{ token }}
      />
    </section>
  );
}

​
Learn More