Schematic Docs

https://docs.schematichq.com
Admin
Schematic provides tools and resources to implement billing and feature flags in your applications....
Tokens:514,207
Snippets:1,032
Trust Score:7.9
Update:1 year ago
Show doc for...
Tokens:
Raw
### Environment Variable Setup

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Configure your project's environment variables by copying the example file and setting necessary keys for Schematic and Clerk integration, including publishable and secret keys.

```bash
cp .env.example .env
NEXT_PUBLIC_SCHEMATIC_COMPONENT_ID="your-component-id"
NEXT_PUBLIC_SCHEMATIC_PUBLISHABLE_KEY="api_"
SCHEMATIC_SECRET_KEY="sch_dev_"
CLERK_SECRET_KEY="sk_test_"
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY="pk_test_"
```

--------------------------------

### Install Dependencies

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Install project dependencies using your preferred package manager: npm, yarn, or pnpm. This step is crucial before running the development server.

```bash
npm install
# or
yarn
# or
pnpm install
```

--------------------------------

### Run Development Server

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Start the local development server to view your application. This command is compatible with npm, yarn, pnpm, and bun.

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```

--------------------------------

### Install Schematic React SDK

Source: https://docs.schematichq.com/quickstart/setup-sdk

Install the Schematic React SDK using npm, yarn, or pnpm. This command adds the necessary package to your project's dependencies.

```bash
npm install @schematichq/schematic-react
# or
yarn add @schematichq/schematic-react
# or
pnpm add @schematichq/schematic-react
```

--------------------------------

### Python SDK: Installation and Setup

Source: https://docs.schematichq.com/developer_resources/sdks/python

Instructions for installing the Schematic Python SDK using pip and setting up the client for basic usage. This involves importing the SDK and initializing the client with your API key.

```bash
pip install schematic-python
```

```python
from schematic import Schematic

client = Schematic(api_key="<your-api-key>")
```

--------------------------------

### Initialize SchematicProvider

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Wrap your client-side application with the SchematicProvider component, passing your publishable key to initialize the Schematic SDK.

```jsx
<SchematicProvider publishableKey={schematicPubKey}></SchematicProvider>
```

--------------------------------

### Install Schematic Go Library

Source: https://docs.schematichq.com/developer_resources/sdks/go

Installs the Schematic Go library using the go get command. This is the first step to integrate Schematic into your Go application.

```bash
go get github.com/schematichq/schematic-go
```

--------------------------------

### Go SDK: Core Functionality

Source: https://docs.schematichq.com/developer_resources/sdks/go

This section covers the essential functionalities of the Schematic Go SDK, including installation, setup, identifying users and companies, tracking events, and checking feature flags. It serves as a guide for integrating Schematic's core features into your Go projects.

```go
// Installation and Setup
// Usage examples
// Sending identify events
// Creating and updating companies
// Creating and updating users
// Checking flags
// Other API operations
// Testing
// Offline Mode
// Webhook Verification
// Verifying Webhook Signatures
// DataStream
// Key Features:
// How to Enable DataStream
// Example:
// Configuring Redis Cache
// 1. Single Redis Instance
// Example:
// 2. Redis Cluster
// Example:
// Errors
```

--------------------------------

### Install Project Dependencies

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_python

Installs all required Python packages using requirements.txt and Node.js packages using npm. npm is used for task running and TailwindCSS support.

```bash
pip install -r requirements.txt
npm install
```

--------------------------------

### Install Schematic and Stripe Libraries

Source: https://docs.schematichq.com/components/set-up

Installs the necessary Schematic components library and the Stripe React library for checkout components. Supports npm, yarn, and pnp package managers.

```npm
npm install @schematichq/schematic-components @stripe/react-stripe-js
```

```yarn
yarn add @schematichq/schematic-components @stripe/react-stripe-js
```

```pnp
pnp add @schematichq/schematic-components @stripe/react-stripe-js
```

--------------------------------

### Install schematic-react

Source: https://docs.schematichq.com/developer_resources/sdks/react

Installs the schematic-react library using npm, yarn, or pnpm. This is the first step to integrate Schematic into your React application.

```bash
npm install @schematichq/schematic-react
```

```bash
yarn add @schematichq/schematic-react
```

```bash
pnpm add @schematichq/schematic-react
```

--------------------------------

### Install Schematic Python Library

Source: https://docs.schematichq.com/developer_resources/sdks/python

Instructions for installing the Schematic Python Library using pip or poetry.

```shell
pip install schematichq
```

```shell
poetry add schematichq
```

--------------------------------

### Install Schematic C# SDK

Source: https://docs.schematichq.com/developer_resources/sdks/csharp

Installs the Schematic C# client library using .NET CLI or NuGet. This is the first step to integrate Schematic into your .NET application.

```csharp
dotnet add package SchematicHQ.Client
```

```csharp
nuget install SchematicHQ.Client
```

--------------------------------

### Enforce Feature Entitlements with useSchematicFlag

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Conditionally render UI elements based on feature entitlements using the `useSchematicFlag` hook. This example checks if the 'humidity' feature is enabled.

```jsx
const humidityFlag = useSchematicFlag("humidity");

{
humidityFlag && <p>Humidity: {weatherData?.humidity}%</p>
}
```

--------------------------------

### Initialize Schematic Go Client

Source: https://docs.schematichq.com/developer_resources/sdks/go

Shows how to create a new Schematic Go client instance with an API key and optional datastream configurations. It includes setting up cache TTL for the datastream.

```go
import (
	schematicclient "github.com/schematichq/schematic-go/client"
	schematicoption "github.com/schematichq/schematic-go/option"
	"time"
)

func main() {
	apiKey := "your-api-key"

	options := &schematicoption.DatastreamOptions{
		CacheTTL: 5 * time.Minute, // Set the cache TTL (time-to-live)
	}

	client := schematicclient.NewSchematicClient(
		schematicoption.WithAPIKey(apiKey),
		schematicoption.WithDatastream(options),
	)

	defer client.Close()
}
```

--------------------------------

### Track Events

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Log specific user actions or events within your application using the `track` function from the `useSchematicEvents` hook. This example shows tracking a 'weather-search' event.

```javascript
track({ event: "weather-search" });
```

--------------------------------

### Display Customer Portal with SchematicEmbed

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Embed the customer portal directly into your application using the `SchematicEmbed` component. It requires an `accessToken` and the `componentId`.

```jsx
<SchematicEmbed accessToken={accessToken} id={componentId} />
```

--------------------------------

### Initialize Environment File

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_python

Copies the example environment configuration file to create a new .env file for your project settings.

```bash
cp .env.example .env
```

--------------------------------

### Identify User and Company Context

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Use the `identify` function from the `useSchematicEvents` hook within a `useEffect` hook to set the user and company context for event tracking and feature flagging. This requires access to authentication context.

```jsx
const { identify } = useSchematicEvents();
const authContext = useAuthContext();

useEffect(() => {
  const { company, user } = authContext ?? {};
  if (company && user) {
    void identify({
      company: {
        keys: company.keys,
        name: company.name,
      },
      keys: user.keys,
      name: user.name,
      traits: user.traits,
    });
  }
}, [authContext, identify]);
```

--------------------------------

### Issue Temporary Access Token (Backend)

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_nextjs

Implement a backend route to generate a temporary, company-scoped access token for embedded components. This uses the `SchematicClient` to exchange a secret token for a temporary one, requiring resource type and lookup details.

```typescript
import { SchematicClient } from "@schematic-ai/schematic-js";
import { NextResponse } from "next/server";

// Assuming apiKey, orgId are available in the backend context
const schematicClient = new SchematicClient({ apiKey });
const resp = await schematicClient.accesstokens.issueTemporaryAccessToken({
  resourceType: "company",
  lookup: {
    clerkId: orgId,
  },
});
const accessToken = resp.data?.token;
return NextResponse.json({ accessToken });
```

--------------------------------

### Initialize Synchronous Client

Source: https://docs.schematichq.com/developer_resources/sdks/python

Demonstrates how to initialize the synchronous Schematic client by providing your API key.

```python
from schematic.client import Schematic

client = Schematic("YOUR_API_KEY")
```

--------------------------------

### Get or Create Company Membership (TypeScript)

Source: https://docs.schematichq.com/api-reference/companies/get-or-create-company-membership

Example of how to use the Schematic client in TypeScript to get or create a company membership. It requires an API key and the company and user IDs.

```typescript
import { SchematicClient } from "@schematichq/schematic-typescript-node";

const client = new SchematicClient({ apiKey: "YOUR_API_KEY" });
await client.companies.getOrCreateCompanyMembership({
  companyId: "company_id",
  userId: "user_id"
});
```

--------------------------------

### Run the Billy App Locally

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_python

Starts the Billy application locally. Access the running app at http://127.0.0.1:5000/ after execution.

```npm
npm start run
```

--------------------------------

### Get Plan Entitlement (TypeScript)

Source: https://docs.schematichq.com/api-reference/entitlements/get-plan-entitlement

Example of how to retrieve a specific plan entitlement using the SchematicClient in TypeScript. This requires an API key and the plan entitlement ID.

```TypeScript
import { SchematicClient } from "@schematichq/schematic-typescript-node";

const client = new SchematicClient({ apiKey: "YOUR_API_KEY" });
await client.entitlements.getPlanEntitlement("plan_entitlement_id");
```

--------------------------------

### Set Up Python Virtual Environment

Source: https://docs.schematichq.com/developer_resources/sample_apps/sample_python

Creates and activates a Python virtual environment for managing project dependencies. This isolates project packages from the global Python installation.

```bash
python3 -m venv venv
. venv/bin/activate
```

--------------------------------

### Get Company Override (TypeScript)

Source: https://docs.schematichq.com/api-reference/entitlements/get-company-override

Example of how to retrieve a company override using the SchematicClient in TypeScript. It requires an API key for authentication and the company override ID as a parameter.

```TypeScript
import { SchematicClient } from "@schematichq/schematic-typescript-node";

const client = new SchematicClient({ apiKey: "YOUR_API_KEY" });
await client.entitlements.getCompanyOverride("company_override_id");
```

--------------------------------

### Initialize Schematic Client

Source: https://docs.schematichq.com/developer_resources/sdks/go

Initializes the Schematic Go client using an API key obtained from the Schematic app. The API key is typically loaded from an environment variable.

```go
import (
	"os"

	option "github.com/schematichq/schematic-go/option"
	schematicclient "github.com/schematichq/schematic-go/client"
)

func main() {
	apiKey := os.Getenv("SCHEMATIC_API_KEY")
	client := schematicclient.NewSchematicClient(option.WithAPIKey(apiKey))
	defer client.Close()
}
```

--------------------------------

### Get Feature Usage by Company (TypeScript)

Source: https://docs.schematichq.com/api-reference/entitlements/get-feature-usage-by-company

Example of how to use the Schematic client in TypeScript to retrieve feature usage data for a company. Requires an API key and specifies company keys.

```TypeScript
import { SchematicClient } from "@schematichq/schematic-typescript-node";

const client = new SchematicClient({ apiKey: "YOUR_API_KEY" });
await client.entitlements.getFeatureUsageByCompany({
  keys: {
    "keys": "keys"
  }
});
```

--------------------------------

### Initialize and Use Async Client

Source: https://docs.schematichq.com/developer_resources/sdks/python

Shows how to initialize and use the asynchronous Schematic client for non-blocking API calls, including an example of fetching company data.

```python
import asyncio
from schematic.client import AsyncSchematic

client = AsyncSchematic("YOUR_API_KEY")

async def main() -> None:
    await client.companies.get_company(
        company_id="company_id",
    )

asyncio.run(main())
```

--------------------------------

### Use SchematicProvider in React App

Source: https://docs.schematichq.com/quickstart/setup-sdk

Wrap your React application with `SchematicProvider` to make the Schematic instance available to all components. Ensure you use a client-side rendering context.

```javascript
`use client`

import { SchematicProvider } from "@schematichq/schematic-react";

ReactDOM.render(
<SchematicProvider publishableKey="your-publishable-key">
<App />
</SchematicProvider>,
document.getElementById("root"),
);
```

--------------------------------

### Create Plan using Schematic TypeScript SDK

Source: https://docs.schematichq.com/api-reference/plans/create-plan

Demonstrates how to instantiate the SchematicClient and call the createPlan method to create a new plan. Requires an API key for authentication.

```typescript
import { SchematicClient } from "@schematichq/schematic-typescript-node";

const client = new SchematicClient({ apiKey: "YOUR_API_KEY" });
await client.plans.createPlan({
  description: "description",
  name: "name",
  planType: "plan"
});
```
Tokens:
Raw