Serverless form submission via AWS Lambda to Slack channel

Preparations

Before deploying serverless backend for a web from you need

Google reCAPTCHA
Register yoursite for Google reCAPTCHA and get your site key and secret key.
Slack webhook for posting the form to a Slack channel
Register Slack workspace and create an incoming webhook for posting to a channel
(optional) Route53 zone for a custom name for the backend
(optional) ACM certificate at us-west-1 to match your custom name

If you don't want to have custom name, leave both 3 & 4 empty and you will get standard name https://RANDOM_STRING.execute-api.AWS_REGION.amazonaws.com/API_STAGE

Setup

Once you have all above preparations done

Build Cloudformation stack with feedbackapi.yaml -template
Template will take 5 parameters

APIStage is just a name for your API stage. You can leave it as default "prod" or call it whatever you want.
ReCaptchaSecret is the SECRET key you got when registered your site to Google reCAPTCHA.
Webhook is URL of webhook for posting to Slack channel.
CustomDomain is optional parameter. If you have Route53 domain you can register a custom name for the API Gateway backend. Full name of your API will be STACKNAME.CustomDomain, e.g. feedback.example.com
CustomCert is optional parameter. If you supplied CustomDomain this must be an ARN of matching ACM certificate at us-east-1 -region. Stack itself can be built into any region you choose.

Once stack is ready, you will find the URL of API in stack outputs.

Modify feedback.html -sample form
Replace __reCaptchaSitekey__ and https://URL/TO/YOUR/AWS/APIGW/ with real values you obtained earlier.

          <button type="submit" class="g-recaptcha form__button"
		    data-sitekey="__reCaptchaSitekey__"
            data-callback="handleFormSubmit">Submit</button>
        </form>
      </td>
    </tr>
  </table>

  <script src='https://www.google.com/recaptcha/api.js' async defer></script>
  <script>
    var handleFormSubmit = function () {
      var formApiEndpoint = "https://URL/TO/YOUR/AWS/APIGW/"
      var successEl = document.querySelector('.form__success')

Open feedback.html in your browser and submit the form to your Slack channel!

kallu/lambda-form-submission

Serverless form submission via AWS Lambda to Slack channel

Preparations

Setup