Formcake

Introduction

Formcake is an easy way to collect data from your users without spinning up a whole backend. You can use it with traditional server-side rendered sites as well as SPAs / JS-based form solutions.

Definitions

Form - The backend services that Formcake provides

Presentation Layer - The HTML or javascript your users interact with to POST to a form

Submission - The data POSTed to a form via your presentation layer

Action - Components within a form used to process each submission sent to it

How it Works

Any website, application, or device that has internet access can use Formcake. Forms accept both application/x-www-form-urlencoded and simple application/json content. Each POST to a form is considered a submission. Each submission is passed to every action which then manipulates or transmits that data depending on its configuration. Actions run simultaneously on every submission and do not depend on one another.

Quick Start

1. Create a Form

Create a form, click 'save', and copy the submission endpoint. The submission endpoint will always be similar to https://api.formcake.com/api/form/501a916d-b47a-4e98-b53c-17ae9bdee5f6/submission

2. Configure Your Presentation Layer

You can either add the submission endpoint to a <form method="POST" action="submission endpoint"> tag or as the target for your presentation layer's POST.

3. Submit Data

Using your presentation layer POST to the submission endpoint.

Next Steps

It's really that easy to get started with Formcake! Make your presentation layer more effective by learning about forms and all the options they have including restricting submissions to specific domains and configuring how users are redirected. Utilize the full power of Formcake by learning about actions and connecting to other services.

Example

Following the steps in the quick start guide, here's a simple presentation layer:

Go ahead and try it out! With nothing more than HTML and a bit of CSS, we have a fully functioning presentation layer:

<form
    method="POST"
    action="https://api.formcake.com/api/form/501a916d-b47a-4e98-b53c-17ae9bdee5f6/submission"
>
    <div class="md:flex md:-mx-2">
        <input
            class="c-input w-full mb-2 md:w-1/2 md:mx-2"
            name="email"
            type="email"
            placeholder="Your Email"
        />
        <input
            class="c-input w-full mb-2 md:w-1/2 md:mx-2"
            name="feedback"
            type="text"
            placeholder="Tell us what you think"
        />
    </div>
    <input class="c-submit" type="submit" value="Submit" />
</form>

Welcome to Formcake