Joey Anuff

<h2 data-selectable-paragraph="">Step-by-step serverless setup using Amplify, Netlify, or Vercel, connecting to a free Apache Cassandra-as-a-Service database from DataStax.</h2>
<figure>
<div tabindex="0">
<div>
<div>
<div>
<div><img src="https://miro.medium.com/max/60/1*EXJxZOZlQxWGxbo3CXovVg.png?q=20" alt="" width="2142" height="1098" /></div>
<img src="https://miro.medium.com/max/4284/1*EXJxZOZlQxWGxbo3CXovVg.png" sizes="700px" srcset="https://miro.medium.com/max/552/1*EXJxZOZlQxWGxbo3CXovVg.png 276w, https://miro.medium.com/max/1104/1*EXJxZOZlQxWGxbo3CXovVg.png 552w, https://miro.medium.com/max/1280/1*EXJxZOZlQxWGxbo3CXovVg.png 640w, https://miro.medium.com/max/1400/1*EXJxZOZlQxWGxbo3CXovVg.png 700w" alt="" width="2142" height="1098" /></div>
</div>
</div>
</div>
<figcaption data-selectable-paragraph=""><a href="https://serverlesshandbook.dev/" rel="noopener nofollow"><strong>Serverless Handbook for Frontend Engineers</strong></a><strong>&nbsp;by Swizec Teller (Feb 2021)</strong></figcaption>
</figure>
<p data-selectable-paragraph="">As Swizec Teller warns in the Serverless Handbook, AWS can be a pain. My own frustrations with the AWS dashboard&ndash;as a user but especially as a developer advocate&ndash;led me away from using AWS Lambdas for the OCR function in my comic translation app, as I explained late last year:</p>
<figure>
<div>
<div>
<div>
<div><img src="https://miro.medium.com/max/60/1*v3p0ccNz-j9Xx-totk40Fw.png?q=20" alt="" width="2014" height="986" /></div>
<img src="https://miro.medium.com/max/4028/1*v3p0ccNz-j9Xx-totk40Fw.png" sizes="700px" srcset="https://miro.medium.com/max/552/1*v3p0ccNz-j9Xx-totk40Fw.png 276w, https://miro.medium.com/max/1104/1*v3p0ccNz-j9Xx-totk40Fw.png 552w, https://miro.medium.com/max/1280/1*v3p0ccNz-j9Xx-totk40Fw.png 640w, https://miro.medium.com/max/1400/1*v3p0ccNz-j9Xx-totk40Fw.png 700w" alt="" width="2014" height="986" /></div>
</div>
</div>
<figcaption data-selectable-paragraph=""><strong>And it&rsquo;s still true that your app might not need Lambdas.</strong></figcaption>
</figure>
<p data-selectable-paragraph="">Also true, though: even if your app&nbsp;<em>does</em>&nbsp;need a serverless function&ndash;and even if that serverless function was required to be an official AWS Lambda&ndash;you wouldn&rsquo;t need the AWS dashboard, or an AWS account, to get it up and running. Two of the most popular Jamstack hosting platforms, Netlify and Vercel, offer idiot-proof wrappers for AWS Lambda deployments, each more developer-friendly than the next.</p>
<p data-selectable-paragraph="">Meanwhile, AWS is hardly neglecting their own developer ergonomics. Their Amplify CLI goes far towards relieving many prior headaches, Cognito management in particular. Lambda set-up with Amplify, they rightly brag, takes only two commands.</p>
<figure>
<div tabindex="0">
<div>
<div>
<div>
<div><img src="https://miro.medium.com/max/60/1*deqcU0b1tDnKqG3VaZzeFQ.png?q=20" alt="" width="1990" height="1150" /></div>
<img src="https://miro.medium.com/max/3980/1*deqcU0b1tDnKqG3VaZzeFQ.png" sizes="700px" srcset="https://miro.medium.com/max/552/1*deqcU0b1tDnKqG3VaZzeFQ.png 276w, https://miro.medium.com/max/1104/1*deqcU0b1tDnKqG3VaZzeFQ.png 552w, https://miro.medium.com/max/1280/1*deqcU0b1tDnKqG3VaZzeFQ.png 640w, https://miro.medium.com/max/1400/1*deqcU0b1tDnKqG3VaZzeFQ.png 700w" alt="" width="1990" height="1150" /></div>
</div>
</div>
</div>
</figure>
<p data-selectable-paragraph="">All of which presents 2021&rsquo;s front-end developer with a classic high-quality problem: three distinct but compelling APIs for &ldquo;real AWS Lambda functions&rdquo;&ndash;Amplify&rsquo;s, Netlify&rsquo;s, and Vercel&rsquo;s&ndash;representing three competing visions of simplicity.</p>
<p data-selectable-paragraph="">Having reached the point in my app&rsquo;s development where I&nbsp;<em>do&nbsp;</em>need a Lambda&ndash;to chat with the Apache Cassandra database where I&rsquo;ll be storing my translations&ndash;it seemed worthwhile to feature-compare my walkthroughs of the three APIs.</p>
<h2 data-selectable-paragraph="">AMPLIFY vs. NETLIFY vs. VERCEL: WHICH IS THE EASIEST?</h2>
<figure>
<div>
<div>
<div>
<div><img src="https://miro.medium.com/max/60/1*tsRd_7a4H8MXnadWXdZ3Zg.png?q=20" alt="" width="2086" height="1266" /></div>
<img src="https://miro.medium.com/max/4172/1*tsRd_7a4H8MXnadWXdZ3Zg.png" sizes="700px" srcset="https://miro.medium.com/max/552/1*tsRd_7a4H8MXnadWXdZ3Zg.png 276w, https://miro.medium.com/max/1104/1*tsRd_7a4H8MXnadWXdZ3Zg.png 552w, https://miro.medium.com/max/1280/1*tsRd_7a4H8MXnadWXdZ3Zg.png 640w, https://miro.medium.com/max/1400/1*tsRd_7a4H8MXnadWXdZ3Zg.png 700w" alt="" width="2086" height="1266" /></div>
</div>
</div>
</figure>
<p data-selectable-paragraph="">Putting the platforms through the same paces, I hoped, would reveal a clear favorite, or at least a clear loser&ndash;but they&rsquo;re all three pretty great tools, from teams clearly focused on state-of-the-art DX. There&rsquo;s some variety amongst documentation style, dev servers, and file structures, but given my previous struggles with Lambdas, far fewer gotchas than I&rsquo;d expected.</p>
<figure>
<div>
<div><iframe title="steps.csv" src="https://joeyanuff-33180.medium.com/media/d4ba935e1710ab6dd95e5f58f6d67567" width="680" height="343" frameborder="0" scrolling="auto" allowfullscreen="allowfullscreen"></iframe></div>
</div>
</figure>
<p data-selectable-paragraph="">Lined up next to one another, my crib-sheet above confirms my perception of Vercel having the fewest commands to remember. This is slightly deceptive, in that Next.js already bundles in a dev server (otherwise requiring&nbsp;<em>vercel dev</em>&nbsp;and&nbsp;<em>vercel deploy</em>&nbsp;steps.) More generally, I&rsquo;d break down my most deciding factors for each platform as follows:</p>
<figure>
<div>
<div><iframe title="serverless-comparisons.csv" src="https://joeyanuff-33180.medium.com/media/3841ae48cb4183c378d53f04176158b8" width="680" height="159" frameborder="0" scrolling="auto" allowfullscreen="allowfullscreen"></iframe></div>
</div>
</figure>
<p data-selectable-paragraph=""><strong>Long story short: since I&rsquo;m already using Vercel&rsquo;s Next.js framework for my app&ndash;and Next.js gives you a free serverless API out of the box&ndash;I intend to use Vercel, but it&rsquo;s a close call. (And by no means final: I started my OCR project with Python Lambdas on the AWS Dashboard and I&rsquo;m certain to try other languages and APIs before I&rsquo;m done.)</strong></p>
<p data-selectable-paragraph="">The linked repo collects step-by-step deployment instructions for all three platforms. Where the steps occur on a web dashboard or a CLI, I&rsquo;ve included screencast GIFs to illustrate the interaction.</p>
<figure>
<div>
<div>
<div>
<div><img src="https://miro.medium.com/max/60/1*Xib2m2Id5G8B9DXNFUWSew.png?q=20" alt="" width="2254" height="1744" /></div>
<img src="https://miro.medium.com/max/4508/1*Xib2m2Id5G8B9DXNFUWSew.png" sizes="700px" srcset="https://miro.medium.com/max/552/1*Xib2m2Id5G8B9DXNFUWSew.png 276w, https://miro.medium.com/max/1104/1*Xib2m2Id5G8B9DXNFUWSew.png 552w, https://miro.medium.com/max/1280/1*Xib2m2Id5G8B9DXNFUWSew.png 640w, https://miro.medium.com/max/1400/1*Xib2m2Id5G8B9DXNFUWSew.png 700w" alt="" width="2254" height="1744" /></div>
</div>
</div>
</figure>
<p data-selectable-paragraph="">Taken individually, none of these steps seem too challenging to remember, but I&rsquo;m always amazed how quickly the details slip away. Stack Overflow fixes and key doc pages especially&ndash;which I either bookmark and forget or keep open as Chrome tabs for decades.</p>
<div>
<div>
<div>
<h2>januff/easy-easier-easiest-lambdas</h2>
<div>
<h3>"Where AWS becomes overkill are typical JAMstack apps. A static site with lots of frontend logic. Hosting those on AWS&hellip;</h3>
</div>
<div>
<p>github.com</p>
</div>
</div>
</div>
</div>
<p data-selectable-paragraph="">Getting those out of my bookmarks and into a repo feels good, but if I can help someone get a serverless function running in a day instead of a week, I&rsquo;ll feel even better, so please let me know!</p>

AWS Lambdas: Easy, Easier, Easiest

Joey AnuffML Developer

Share

Share

januff/easy-easier-easiest-lambdas

"Where AWS becomes overkill are typical JAMstack apps. A static site with lots of frontend logic. Hosting those on AWS…

More Technology

How to Build a Crystal Image Search App with Vector Search

Knowledge Graphs for RAG without a GraphDB

How Winweb Built its AI Assistant with DataStax Astra DB and LangChain

Vercel + Astra DB: Get Data into Your GenAI Apps Fast

One-stop Data API for Production GenAI

Joey AnuffML Developer

Share

Share

januff/easy-easier-easiest-lambdas

"Where AWS becomes overkill are typical JAMstack apps. A static site with lots of frontend logic. Hosting those on AWS&hellip;

More Technology

How to Build a Crystal Image Search App with Vector Search

Knowledge Graphs for RAG without a GraphDB

How Winweb Built its AI Assistant with DataStax Astra DB and LangChain

Vercel + Astra DB: Get Data into Your GenAI Apps Fast

One-stop Data API for Production GenAI

"Where AWS becomes overkill are typical JAMstack apps. A static site with lots of frontend logic. Hosting those on AWS…