Flotiq Webhook examples

Webhooks are useful if you want to extend the system functionality or integrate quickly with other apps that fit your business process. You can enable or disable webhooks at any time without any effort.

Now, you can easily define webhooks with Flotiq.

Check out our examples and use them in your projects or treat them as a signpost for your work:

1. Trigger a Gatsby preview when site content was changed.
2. Trigger a Gatsby production build when a Build production button was clicked.
3. Trigger a Netlify build when a Build site button was clicked.
4. Send a RocketChat notification when the contact form was submitted.
5. Trigger AWS Lambda serverless function when entry is changed.

Note
If you are new in webhooks, read the Flotiq Webhooksintroduction first.

1. Trigger a Gatsby preview when site content was changed

Prerequisites: We assume, that you have Product Content Type Definition in Flotiq.

In the Gatsby Cloud dashboard:

Go to your site settings.
In the General -> Webhook menu find a Preview webhook URL:

In the Flotiq dashboard:

1. Go to the Webhooks page and click Add new webhook.
2. Name the webhook (e.g. Gatsby Preview) and paste obtained Preview URL as a webhook URL.
3. As a trigger, choose Create, Update and Delete actions on the Product and save the webhook:

Check the result

After the Create, Update, Delete action on the Product, Gatsby Cloud Preview will be triggered automatically.

2. Trigger a Gatsby production build when a Build production button was clicked

Prerequisites: We assume, that you have Product Content Type Definition in Flotiq.

In the Gatsby Cloud dashboard:

1. Go to your site settings.
2. In the General -> Webhook menu find a Builds webhook URL:

In the Flotiq dashboard:

1. Go to the Webhooks page and click Add new webhook.
2. Name the webhook (e.g. Gatsby Build Production) and paste obtained Builds URL as a webhook URL.
3. As a trigger, choose Custom action on the Product and save the webhook:

Check the result

Now, the Gatsby Build Production webhook button will be available in the Edit Product form.

After clicking the Gatsby Build Production button in Flotiq, the Gatsby Production build will be triggered:

3. Trigger a Netlify build when a Build site button was clicked

Prerequisites: We assume, that you have Product Content Type Definition in Flotiq.

In the Netlify dashboard:

1. Go to your site settings.
2. In the menu Build & Deploy -> Continuous Deployment find section Build hooks.
3. Add a new build hook (the name is up to you).
4. Click Save, and copy your custom hook URL (like https://api.netlify.com/build_hooks/xxxxxx):

In the Flotiq dashboard:

1. Go to the Webhooks page and click Add new webhook.
2. Name the webhook (e.g. Build Site) and paste obtained URL as a webhook URL.
3. As a trigger, choose Custom action on the Product and save the webhook:

Check the result

Now, the Build Site webhook button will be available in the Edit Product form:

After clicking the Build Site button in Flotiq, the Netlify build will be triggered:

Note
Choosing actions Create, Update, Delete, the build will be triggered automatically. The button Build Site is visible only when you choose a Custom trigger.

4. Send a RocketChat notification when the contact form was submitted.

Prerequisites: We assume, that you have Contact Form Content Type Definition in Flotiq with the message attribute.

In the RocketChat dashboard:

1. Go to the Administration -> Integrations.
2. Click Add new integration.

3. Fill the form with the following values:
   

4. Make sure to check Script enabled and paste the code that transforms Flotiq Payload to required by RocketChat form (more in the RocketChat docs):
   

class Script {
  process_incoming_request({ request }) {
    return {
      content: {
        text: `New message: ${request.content.payload.message}`, // assuming your CTD have `message` field
       }
    };
  }
}

1. Save webhook and copy your Webhook URL.

In the Flotiq dashboard:

1. Go to the Webhooks page and click Add new webhook.
2. Name the webhook (e.g. Chat Notification) and paste obtained Webhook URL as a webhook URL.
3. As a trigger, choose Create action on the Contact form and save the webhook:

Note
As the next step, we recommend creating the Contact Form with Flotiq Forms. It is an easy-to-use form generator, that adds customer input directly to your Content Objects.

Check the result

After the Create action on the Contact form (or submitting Contact Form based on Flotiq Forms) the RocketChat notification will be triggered:

5. Trigger AWS Lambda serverless function when entry is changed

To integrate Flotiq Webhooks and AWS Lambda follow the steps below:

1. Set up AWS Lambda to receive HTTP requests. We prepared a simple AWS Lambda webhook example code for you.

2. Copy the endpoint URL that represents your service, returned by serverless deploy command:
   

3. In the Flotiq dashboard go to the Webhooks page and click Add new webhook

4. Name the webhook (e.g. Notify AWS Lambda) and paste obtained endpoint URL as a webhook URL.

5. As a trigger, choose Create, Update and Delete action on the multiple Content Types:
   

Check the result

After any action on the Content Objects, you will be able to see logs in the AWS Lambda CloudWatch. Now you can use the received payload to implement your own business logic.

Notes
This is a simple example without authentication. You can add it by yourself or set up API keys using AWS. that allows you to track the API Keys usage, throttle the requests or use a quota for your applications.

Register in Flotiq to create your webhook