Until recently adding a little backend to your Gatsby site meant 2 options:
- Climbing the AWS learning curve
- Rewrite with NextJS
With version 3.7 Gatsby gained the /api directory. Pop a JavaScript or TypeScript file in src/api, export a handler, and you've got a serverless function.
// src/api/hello.js
module.exports = function handler(req, res) {
return res.status(200).json({ hello: req.query.name })
}
You can call that as an API request from your site. Great for 3rd party integrations with secret tokens, user reactions, authentication, and anything else you can't do in the browser.
I joined Queen Raae on a bonus episode of her Gatsby Summer Functions webinar series to explore how all this works.
We started with my crappy implementation of a function that takes a form submission and:
- sends an email
- sends a few texts
- saves your message to a firestore
We refactored this serverless function so it's faster and more reliable. While refactoring we talked about:
- how to architect your functions
- when to put code on the frontend or the backend
- why distributed transactions are hard
- when you should worry about absolute correctness
- when's it make sense to leverage AWS
- how using small functions gives you greater flexibility
And I drew a sketch, live 🤘
with event listeners, your database can be a queue pic.twitter.com/SM3zkzH9u5
— Swizec Teller (@Swizec) August 23, 2021
Enjoy the webinar, hit reply if you have questions.
And if you'd like a deeper introduction to serverless, the Serverless Handbook is full of sketches like that.
Cheers,
~Swizec
PS: yes, there's options between AWS and NextJS like Firebase or Netlify cloud functions. And even tougher climbs like hosting your own servers. Adding those made the intro too long ✌️
Continue reading about Build simple backends with Gatsby Serverless Functions
Semantically similar articles hand-picked by GPT-4
- Go full-stack in 5min with your first cloud function
- If you can JavaScript, you can backend
- Modern backend is a JavaScript function
- How serverless beats servers
- Your serverless questions, answered
Want to dive into serverless? Not sure where to begin?
Serverless Handbook was designed for people like you getting into backend programming.
360 pages, 19 chapters, 6 full projects, hand-drawn diagrams, beautiful chapter art, best-looking cover in tech. ✌️
Learn how to choose the right database, write cloud functions, think about scalability, gain the architecture mindsets for robust systems, and more.
Leave your email to start with a free chapter and email crash course 👇
Serverless Handbook for Frontend Engineers – free chapter
Dive modern backend. Understand any backend.
Serverless Handbook taught me high-leveled topics. I don't like recipe courses and these chapters helped me to feel like I'm not a total noob anymore.
The hand-drawn diagrams and high-leveled descriptions gave me the feeling that I don't have any critical "knowledge gaps" anymore.
~ Marek C, engineer
Start with a free chapter and email crash course ❤️
Have a burning question that you think I can answer? Hit me up on twitter and I'll do my best.
Who am I and who do I help? I'm Swizec Teller and I turn coders into engineers with "Raw and honest from the heart!" writing. No bullshit. Real insights into the career and skills of a modern software engineer.
Want to become a true senior engineer? Take ownership, have autonomy, and be a force multiplier on your team. The Senior Engineer Mindset ebook can help 👉 swizec.com/senior-mindset. These are the shifts in mindset that unlocked my career.
Curious about Serverless and the modern backend? Check out Serverless Handbook, for frontend engineers 👉 ServerlessHandbook.dev
Want to Stop copy pasting D3 examples and create data visualizations of your own? Learn how to build scalable dataviz React components your whole team can understand with React for Data Visualization
Want to get my best emails on JavaScript, React, Serverless, Fullstack Web, or Indie Hacking? Check out swizec.com/collections
Did someone amazing share this letter with you? Wonderful! You can sign up for my weekly letters for software engineers on their path to greatness, here: swizec.com/blog
Want to brush up on your modern JavaScript syntax? Check out my interactive cheatsheet: es6cheatsheet.com
By the way, just in case no one has told you it yet today: I love and appreciate you for who you are ❤️