Courier Live: Sending notifications from a Jamstack site
For our September 16th Courier Live, Paul Chin, Jr joined me to talk about Begin. Begin helps you effortlessly ship web apps and APIs on AWS. Paul recently updated his 5 year old LAMP stack Ghostbusters site into a functional FASTstack application using Begin. While updating the contact form, he decided he'd rather it send a Slack message instead of sending an email. He decided to use Courier to handle this. Together we walked through creating a new Begin application that included an HTML contact form and configured it to send using Courier.
Check out the video below to watch us:
Create a new Begin application
Add an HTML Form and handle the submit using a serverless function
Set up a new Slack Application to handle sending direct messages
Create a new Courier notification and connect it to the serverless function
Add a conditional SMS channel for urgent messages without changing any code
Check out the full project code available on GitHub.
Be sure to Like the video and Subscribe to our YouTube channel.
Handling Contact Forms with Courier
It's easy to set up a contact form using Begin. Begin will store your static assets in an S3 bucket and help you create the serverless function needed to handle the form submit. It's easy to get started by signing in to Begin and clicking Create new app and selecting a minimal app.
You can add a form like the following to your app.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<form id="main-contact-form" method="post" action="contact-form">
<div><input type="text" name="name" placeholder="Name" required /></div>
<div><input type="email" name="email" placeholder="Email" required /></div>
<div><input type="text" name="subject" placeholder="Subject" required /></div>
<div>
<textarea
name="message"
class="form-control"
rows="8"
placeholder="What seems to be the problem?"
required >
</textarea>
</div>
<div>
<input type="checkbox" name="urgent" value="true" />
<label for="urgent" >Urgent</label>
</div>
<div><button type="submit">Send Message</button></div>
</form>And then create a serverless function using Begin with the same name as the form action.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
let tiny = require('tiny-json-http')
let arc = require('@architect/functions')
let sendCourier = async function (req) {
let body = req.body
let url = 'https://api.courier.com/send'
let headers = {
"authorization": `Bearer ${process.env.COURIER_AUTH_TOKEN}`,
"content-type": "application/json",
}
let data = {
event: `praisecage-contact`,
recipient: 'pchinjr',
profile: {
slack: {
access_token: `${process.env.SLACK_TOKEN}`,
email: 'paul@praisecage.org'
}
},
data: {
name: `${body.name}`,
email: `${body.email}`,
subject: `${body.subject}`,
message: `${body.message}`,
urgent: `${body.urgent}`
}
}
let response = await tiny.post({ url, data, headers })
console.log(response)
}
let route = async function (req) {
return {
statusCode: 303,
location: '/'
}
}
exports.handler = arc.http.async(sendCourier, route)
This function will handle the form submit and send it to Courier. From there, you can use the Courier application to create your notification.
You can sign up for a free account on both Courier and Begin. I hope this stream has given you a taste of what is possible when you build your app with Begin and Courier. It's never been easier to build on top of AWS, so get started and be sure to share with us what you create.
Is there something you’d like to see us do using Courier? Let us know and it might be the subject of our next Courier Live. We stream a new Courier Live every Wednesday at noon Pacific. Follow us on Twitch to be notified when we go live.
-Aydrian
More from Courier Live
Courier April Product Release Updates: In-app Inbox, Preferences, and Automations
In this update, Aydrian and Nate (Head of Customer Success) as cohosts cover what is new with the in-app notifications API, our new preferences component, and our automations API, which is now GA.
Aydrian Howard
May 20, 2021
Courier Live: Content, Notifications, and IoT
On February 2nd and 3rd, Shy Ruparel joined Aydrian for another Courier and Contentful crossover stream. This time, they decided to play around with an IoT E-ink display and use it to show the latest posts from Contentful and send notifications using Courier.
Aydrian Howard
February 10, 2021
Comparison Guides
Developers
© 2022 Courier. All rights reserved.