An Event Apart: “The All-Powerful Front-End Developer”

Chris Coyier speaking at An Event Apart Seattle 2018 on April 3, 2018.

The internet is, without metaphor, just a bunch of servers tied together with wires. Without servers, we’d have no way to share our creations with the world. Yet in a bit of a paradox, servers are less essential to our work than they’ve ever been. We can now do things on the front end that used to require a back end. When we do need a back end, our front end skills can be put to work, giving us some surprisingly powerful new abilities. Join Chris on a whirlwind tour of the tools, tech, and code that puts more power than ever into our front-end hands.

Notes

  • FED’s are already very powerful
    • UX is in our hands
    • Performance is in our hands
    • Accessibility is in our hands
    • Execution of the design, animation, and interaction is in our hands
  • You can make an awesome lifelong career out of this
  • The front end developer skillset only starts being limited when you need custom back end development and server ops — but that is getting less and less true with new technology — serverless
  • “Serverless” doesn’t mean there aren’t servers involved — there will always be servers involved, that what the internet is
  • The Power of Serverless
  • Cloud functions (aka “Functions as a service”)
  • You can’t protect your API keys with entirely client-side applications
  • Some APIs don’t need keys, or they keys don’t really need protection
  • Static file host
    • Very inexpensive (or free)
    • Very fast (CDN)
    • Very secure
    • Very front-end developer friendly
    • HTTPS, Git, modern build process
  • Webtask is kinda like CodePen, but for cloud functions and minor data storage
  • AWS Lambda is a cloud function service, just like we looked at with Webtask and Azure cloud functions — Lambda is probably the biggest player
  • CRUD (Create Read Update Delete) app — You need to store a little data, look at it, and be able to change it
  • Webhook = URL — They make use of normal HTTP requests (Ajax) with a JSON payload that includes the message text and some options
  • One reason you might reach for a “traditional” server: there needs to be a way for non-coders to update this website, like some kind of content management system (CMS)
  • Static site generators tend to edge a bit too nerdy — Everyone can learn, but you gotta admit learning Markdown and text editors and Git and all that is a bit much to change a phone number
  • Serverless
    • You can build any size of website
    • You can have any sort of content
    • There are speed benefits
    • There are security benefits
    • You can build any kind of website
    • It’s not all in — it’s a flexible ingredient list
  • Serverless isn’t 100% better all the time for everything. If you don’t like it or it isn’t right for, no big deal. Knowing about things is pretty valuable.

Speaker Links and Resources

Intro

Example of APIs

Examples of static file hosts

Related to cloud functions

Related to hosted forms

Related to static forms

Related to payments

Related to services on top of payments

Related to rolling your own checkout

Regarding comment threads

Related Links