Useful APIs to know when building a JAMstack app

The JAMstack is a new way of building websites and apps that delivers better performance, higher security, lower cost of scaling, and better developer experience. It achieves this by keeping most of the key functionality on the client side and abstracting all other functionalities to third-party API’s. Basically, all the heavy lifting is done by the API’s.

It’s more than just a new trend, it is actually shifting the way we think and build for the web. For more information on why you should even be using JAMstack, check out this article.

In this article, we will be focusing on some of these third-party APIs (service products) that have helped JAMstack achieve its speed.

“As a service” products

Usually, we hear the phrase “as a service” being thrown around a lot at conferences or at stand-ups but what does it mean to have a product as a service? When the term is used before a word, it is mostly associated with that thing being made available to a customer from the cloud and this means it doesn’t need to be installed on the system.

Now that we’ve cleared that up, let’s look at some services that help make JAMstack apps so easy to use.

Authentication

If you’ve ever tried to build your own authentication system, you know it’s a lot of work and it’s really stressful, some might say, terrible. I personally love that I will never write an auth system again. Let’s check out some of the awesome Authentication as a Service platforms.

Auth0

Auth0  is an authentication and authorization management platform available for the web, IoT, mobile devices and legacy apps. The universal identity platform for enterprises supports B2B, B2C, B2E as well as a combination of these.

The platform works well for developers and allows them to authenticate APIs and apps with various identity providers on different platforms. The software solution also uses advanced technologies and best practices to help clients comply with the strictest industry regulations and standards.

It also comes with a simple and easy to understand documentation. Auth0 exposes two APIs for developers to consume in their applications:

• Authentication: Handles identity-related tasks
• Management: Handles management of your Auth0 account

Firebase

Firebase is a Backend as a Service (BaaS) platform that has a lot of cool APIs so it might be used for different purposes such as real-time databases, file storage and of course, authorization.

Firebase Authentication provides backend services, easy-to-use SDKs, and ready-made UI libraries to authenticate users to your app. It supports authentication using passwords, phone numbers, popular federated identity providers like Google, Facebook and Twitter, and more.

It integrates tightly with other Firebase services, and it leverages industry standards like OAuth 2.0 and OpenID Connect, so it can be easily integrated with your custom backend. It comes with a very simple easy-to-use API for various platforms (web, iOS, Android).

You can find implementations in the docs.

Media storage / optimization

Handling media on the web is a lot of work when it comes to delivery and optimization. It seems impossible to always know what quality or format is most suitable for various platforms: building a website is cool but having attractive images that are optimized are awesome. Let’s look at some useful platforms that help create a better image experience for users.

Cloudinary

Cloudinary is an end-to-end image management solution for your website and mobile apps. Cloudinary covers everything from image uploads, storage, manipulations, optimizations to delivery. You can easily upload images to the cloud, automatically perform smart image manipulations without installing any complex software.

Cloudinary besides housing images also helps perform transformations that manipulate your images to fit the graphic design of your website or mobile application. These transformations also cover videos. They recently launched a Dynamic Media Platform that automates numerous media-management components so you don’t need to build them. This platform has comprehensive documentation and SDKs to help build quickly and is easy to set up.

Instant deployment

Netlify

Netlify is a cloud computing company that offers hosting and serverless backend services for static websites. It features continuous deployment from Git across a global application delivery network, serverless form handling, support for AWS Lambda functions, and full integration with Let’s Encrypt.

Netlify is a cool new way to deploy sites directly from your Git repository stemming from the branch you select to trigger a build and it handles this in simple steps. Get started with Netlify to deploy your JAMstack apps. It also has other features that are worth checking out.

Backend services

Backendless

The Backendless API handles the generation and management of client-side APIs for services running in Backendless, by using what it calls an API engine.

Now you can take your own server-side code and deploy it into the API engine and it will automatically generate APIs and native libraries for your server-side code that is running inside API engines, this comes in handy when you’re trying to transform a platform from a native server client.

Form processing

Typeform

Typeform makes collecting and sharing information comfortable and conversational. It’s a web-based platform you can use to create anything from surveys to apps, without needing to write a single line of code. Online forms are boring – Typeform fixes that by using cool transitions.

It has awesome features like creating your own form API and accessing the form data with a response API. Learn to use this service by reading the docs.

Headless CMS

Contentful

This is a powerful digital tool that is used to store and manage the components that make up your website or application in any device that content can be delivered. The advantage of Contentful over other CMSs is that the content is organized into smaller pieces this makes it flexible. It also keeps your content secure.

The platform is cloud-native which means that content is stored in the cloud. It has a simple way to implement APIs which include Content Management API (CMA), Content Delivery API (CDA), Content Preview API (CPA).

More information on how to implement can be found in the docs.

Conclusion

Abstracting functionality to third-party APIs to increase performance and security in the JAMstack is one of its key features. I have shared some of the APIs I use to create awesome high-speed apps and I would strongly recommend checking these APIs out when building.

Plug: LogRocket, a DVR for web apps

LogRocket is a frontend application monitoring solution that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay the session to quickly understand what went wrong. It works perfectly with any app, regardless of framework, and has plugins to log additional context from Redux, Vuex, and @ngrx/store.

In addition to logging Redux actions and state, LogRocket records console logs, JavaScript errors, stacktraces, network requests/responses with headers + bodies, browser metadata, and custom logs. It also instruments the DOM to record the HTML and CSS on the page, recreating pixel-perfect videos of even the most complex single-page apps.

Try it for free.