import { Layout } from "@/components/docs/Layout";
import { Fence } from "@/components/shared/Fence";
import { Callout } from "@/components/shared/Callout";

export const meta = {
  title: "Custom Survey",
};

<Callout title="Visual Form Builder in progress" type="note">
  We're working on a visual form builder so that you can create custom forms within Formbricks. Sign up now to
  stay in the loop!
</Callout>

## Purpose

Build custom forms without the backend: Use Formbricks to gather and analyze form submissions. Pipe the data where you need it.

## Formbricks Approach

- Custom forms allow 100% customizability (duh!)
- Use Formbricks backend as endpoint
- Use Formbricks Data Pipelines to forward data where you need it.

## Creating and updating a submission via our API

Create your frontend the way you want it and send the data to our API. For this we provide two endpoints, one for creating a new submission and one for updating an existing submission.

You can send all the data at once to our endpoint to create a submission or if you want to build a multipage survey you can send the data for each page separately. Then you use the first API call to create a new submission and the second API call to update the submission with the data from the next page.

Please refer to [Create Submission](/docs/api/create-submission) and [Update Submission](/docs/api/update-submission) for more information.

## API docs

To fetch data from the API (e.g. submissions or forms) your need an API key. Please refer to our [API documentation](/docs/api/setup).

export default ({ children }) => <Layout meta={meta}>{children}</Layout>;
