Swizec Teller - a geek with a hatswizec.com

Senior Mindset Book

Get promoted, earn a bigger salary, work for top companies

Senior Engineer Mindset cover
Learn more

    Modern backend is a JavaScript function

    Many engineers think server-side code is the scary domain of True Engineers. Something newbies, juniors, and frontend engineers shouldn't touch.

    They're wrong. Modern backend is a joy. ❤️

    Why engineers are afraid of backend

    Backend code scares people because it sounds complex. And serious, and critical, and a bit boring.

    Swizec Teller writing a Manning book avatarSwizec Teller writing a Manning book@Swizec
    Here is a version that works

    I really wish that after these 3 hours of hard work I had something better to show than "I am now reasonably certain that when I compare 2 numbers, the comparison is valid"

    But that's not how backend life works.
    Tweet media

    Sometimes you fall into the Deep Backend and that's a dark place. You get your telemetry, a stream of data, a large database, and your job is to make sure they match at 99.999% consistency without dataloss.

    You're fighting against unsolvable paradoxes, flakey servers, and the boredom of watching graphs wiggle around with no other feedback.

    🤮

    You *can* do backend logic

    Most server-side code is not like that. It's JSON bureaucracy.

    You get data from the client, change a few values, run a couple functions, and save it to the database. Trigger a background process or two to poke 3rd party APIs.

    Easy peasy my friend. You do this on the frontend every day.

    Doing it on the backend can be scary.

    You have to set up a server, make sure it stays up, set up Nginx or Apache reverse proxies, configure a database, make sure that stays running, configure permissions, muck around with Docker, drop into Unix commands, set up monitoring, configure domains, set up a CDN for static files, deal with provisioning, configure backup servers, dynamic failover, horizontal scaling, vertical scaling, ....

    Then you're ready to write your code.

    Publish to reddit and your server dies under load 🤦‍♂️

    Times have changed my friend

    The future is already here, it's just not evenly distributed

    ~ William Gibson

    You're standing one foot in the future, one foot in the past. We all are. How we build webapps is changing.

    Serverless computing splashed on the scene with one promise: What if you didn't have to do all of the above? What if you could write your code and nothing else?

    AWS Lambda launched in November 2014. Netlify in April 2015, Zeit/Vercel in December 2015.

    All running towards the same goal: You write your code, we make it run.

    No more funky configuration, no more servers, no more worrying about scale, no more setting up CDNs and deploy pipelines and parallel deploys and pull request previews and ... you write your code, the platform handles the rest.

    What modern server-side code looks like

    Here's what modern backend code looks like at its simplest:

    // /api/helloWorld.js
    module.exports = (req, res) => {
    return res.status(200).send("Hello world")
    }

    module.exports defines exports in Node, req is the request object, res the response. Send back a success status of 200 and a "Hello world" text.

    Vercel cloud function demo

    Deploy to Vercel with vercel and you have a hello world function that runs on the server, has its own URL, and scales great. Try mine: https://hello-world-chi.vercel.app/api/helloWorld

    With Netlify

    You can use the same approach with Netlify. Their cloud functions look like this:

    // /functions/helloWorld.js
    exports.handler = async (event, context) => {
    return {
    statusCode: 200,
    body: "Hello world",
    }
    }

    Export a handler method, get a trigger event instead of the req object. Return your response instead of manipulating the res object.

    Both Vercel and Netlify run cloud functions on AWS Lambda. Vercel uses patterns from the popular ExpressJS framework for its abstraction, Netlify is like using AWS Lambda directly.

    With AWS Lambda

    To use AWS Lambda, you'd write the same JavaScript code and add a configuration file using Serverless Framework or CloudFormation

    # serverless.yml
    service: hello-world
    provider:
    name: aws
    functions:
    helloWorld:
    handler: ./functions/helloWorld
    events:
    - http:
    path: hello
    method: GET

    Both use YAML for configuration. I prefer Serverless Framework because it makes common operations easy and lets you drop into full CloudFormation when you want.

    This file says we're using aws and creating a hello function. Triggered by a GET request, handled by the /functions/helloWorld file.

    Hit AWS and you get infinite-ish scaling, an API Gateway as a reverse proxy, monitoring, distributed logging, and everything else you need. And the full config is part of your code. 😍

    More work, more control, but not too much work 🤘

    What do you think, sound cool? hit reply

    Cheers,
    ~Swizec

    PS: your code gets automatic SSL config in all 3 examples

    Did you enjoy this article?

    Published on September 22nd, 2020 in Serverless, JavaScript, Technical,

    Senior Mindset Book

    Get promoted, earn a bigger salary, work for top companies

    Learn more

    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

    Want to brush up on modern JavaScript syntax? Check out my interactive cheatsheet: es6cheatsheet.com

    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 ❤️

    Created by Swizec with ❤️