Going Jamstack with Kyma Runtime & building a high-performance web app
Some common goals of web development projects are to build fast, secure, scalable and high-performance websites and apps. At the same time, there’s also a need for delivering value faster.
Thankfully, these days, there are many tools and technologies readily available to help us.
This post demonstrates an example that uses the following state-of-the-art technologies to help achieve these goals and is inspired by the Jamstack architecture — “the modern way to build Websites and Apps that delivers better performance”.
- Next.js — “gives you the best developer experience with all the features you need for production”
- Chakra UI — “gives you the building blocks you need to build your React applications”with “less code”and “more speed”
- Go Programming Language — language of choice for backend microservices
- Gin – an HTTP web framework written in Go that “features a Martini-like API with much better performance — up to 40 times faster”
- SAP HANA Cloud — a “high-performance in-memory database”
- SAP Event Mesh — “a fully managed cloud service that allows applications to communicate through asynchronous events”
- Kyma — “a cloud-native application runtime that combines the power of Kubernetes with a set of best-in-class tools and open-source components”
- Kubernetes — “an open source container orchestration engine for automating deployment, scaling, and management of containerized applications”
- Cloudflare CDN — “stops malicious traffic”, “optimizes the delivery of website resources”, “routes visitor requests to the nearest Cloudflare data center” and “provides security”
Next.js app with Kyma Eventing & Go backend connected to SAP HANA Cloud database
This example illustrates the following major components of SAP BTP, Kyma Runtime and its goal is to help you to get familiarized with some of the key features of SAP BTP, Kyma Runtime and to help you use your learnings in your own experiments using a free SAP BTP Trial account.
- Containerized Microservice exposed via an API Rule — a Next.js app used as a client-side web app
- Go Containerized Microservice — a Go app used as a backing service
- Node.js Serverless Function
- Kyma Eventing using either NATS (available with a free SAP BTP Trial account) or SAP Event Mesh (requires a paid account)
It is modelled as a simple conference registration system that stores user information in an SAP HANA Cloud database and sends a confirmation email to the user.
Its front-end is powered by a Next.js app that is deployed as a microservice on Kyma Runtime with a client-side user interface and an API endpoint.
Form submissions are sent via the API endpoint to Kyma Eventing, which can be either NATS by default, or optionally SAP Event Mesh.
A Serverless Function consumes events from the queue and sends a confirmation email to the user after saving the user’s details to an SAP HANA Cloud database via a Go Microservice — a REST API Server microservice that is implemented in Go using Gin Web Framework.
The Go Microservice is exposed as a Kubernetes service with ClusterIP ServiceType (by default) and can be accessed via a hostname that is only accessible within the Kubernetes cluster, with the following format: <service-name>.<namespace>.svc.cluster.local
Note: Mutual TLS (mTLS) is enabled mesh-wide by default in Kyma Runtime. To be more specific, the mTLS mode is set to STRICT in a PeerAuthentication policy within the root istio-system namespace. As a result, all internal service to service communication within the Kubernetes cluster is encrypted by default using Transport Layer Security (TLS).
Build and deployment steps
This web app can be deployed using a free SAP BTP Trial account via the following steps that will also help you learn how the major components of Kyma Runtime work together.
Note: Click the links below for more details.
- Step 1 – Pre-requisite SendGrid setup steps
- Step 2 – Build & deploy the Conference Registration app (Next.js app) — this step includes the link to the source-code repository
- Step 3 – Deploy the Event Consumer function
- Step 4 – Apply the Event Registration Subscription
- Step 5 – Create an instance of SAP HANA Cloud
- Step 6 – Deploy the Registrations REST API Server
- Step 7 – Connect your web app running on Kyma Runtime to a domain via Cloudflare — optional step
- Step 1 – Verify that all the resources of the app are running
- Step 2 – View the environment variables in the config map
- Step 3 – View the environment variables in the secret
- Step 4 – View the API Rule
- 🎈 🎉 Step 5 – Launch the app and Register to attend the Tech Conference via the app
Using Cloudflare CDN
The DNS provider of the namespace needs be set as Cloudflare to use Cloudflare CDN.
For more Information, refer to: Step 7 – Connect your web app running on Kyma Runtime to a domain via Cloudflare.
Superb performance of the user facing app
Without Cloudflare CDN
Even without Cloudflare CDN, Google’s PageSpeed Insights tool gave a Performance score of 100 to the Next.js web app for Desktop.
With Cloudflare CDN
With Cloudflare CDN, the time to interactive and total blocking time were reduced even further.
Blazing fast performance of the backing service
Although this web app only uses the HTTP POST API call of the Go Microservice to save customer records to the SAP HANA Cloud database, the Go Microservice has all the CRUD operations (Create, read, update and delete) implemented in it for the sake of demonstration.
The HTTP POST and PUT API calls of the Go Microservice had an almost similar response time. In order to not create too many records in the database during load testing, the HTTP PUT API calls were load tested, which make update requests and they had an average response time of 27.33 ms with 143.4 Hits per second when tested with BlazeMeter.
That is, on average each request was executed within about 1/36th of a second, which is blazing fast for a backing service — and that too with using a free SAP BTP Trial account!
Implementing the Jamstack architecture using the Kyma Runtime and an SAP HANA Cloud database results in extremely fast performance, which can be fine-tuned even further by either using caching services such as Redis or by horizontal as well as vertical scaling — key features of Kubernetes that can be easily configured. The added benefit of using the Kyma Runtime is the seamless connectivity provided by it to various SAP solutions as well as to services of other hyperscalers such as Google Cloud Platform, AWS & Azure using service operators — a great topic that is covered in the following blog post: Using Kubernetes operators with SAP BTP Kyma runtime.
As a next step, you could try to customize this example or put together the different components of Kyma Runtime that were covered in this example and build a web app for another use case using the Jamstack architecture.
If you’d like to dive deeper into some of the key topics that were covered in this blog post, you may find the resources listed in the Further Readings section below interesting.
Also, if you’d like to access the Go Microservice via a public URL from outside the Kubernetes cluster for testing it using an API client such as Postman, then you’ll need to create an API Rule and expose the registrations-rest-api service. To do that, select the conference-registration namespace in the Kyma console. Next, under Discovery and Network, select API Rules. Then, click on Create API Rule. When creating the API Rule, you could also select to set its access strategy to OAuth2 to secure it. If you do that, you’ll also need to create an OAuth client to be used to access it. You can do that by selecting Configuration and then OAuth Clients from the left menu in the Kyma console.
Kindly provide your feedback or feel free to ask clarifying questions related to this post in the comment section below. Additionally, I’d like to invite you to submit any broader Kyma related questions in the Q&A area of the SAP BTP, Kyma runtime topic.
If the SAP BTP, Kyma runtime topic interests you, here are some other links that you may like:
Lastly, if you liked this post, kindly hit the like icon, leave a comment below or share this post. Thank you!
- Jamstack: For fast and secure sites
- Next.js by Vercel
- Chakra UI
- Gin Web Framework – GitHub
- SAP HANA
- What Is SAP Event Mesh?
- Kyma – An easy way to extend enterprise applications on Kubernetes
- Kubernetes Documentation
- How Cloudflare works
- SAP Learning Journey: Developing Applications Running on SAP BTP Using SAP HANA Cloud
- Ride the SAP HANA Wave: Fundamentals and Insights into Cloud Databases
- Introducing SAP HANA Cloud By Raja Gupta, Denys van Kempen
- Jumpstart Jamstack Development By Christopher Pecoraro, Vincenzo Gambino
- Next.js Quick Start Guide By Kirill Konshin
- Real-World Next.js By Michele Riva
- Software Architecture Patterns for Serverless Systems By John Gilbert
- Hands-On Microservices with Kubernetes By Gigi Sayfan
- Hands-On Software Architecture with Golang By Jyotiswarup Raiturkar
- Hands-On RESTful Web Services with Go – Second Edition By Naren Yellavula
- Building Distributed Applications in Gin By Mohamed Labouardy
Hi Saatae, congratulations for the interesting blog post that explore the cloud native architecture with Kyma! Could you share the source code of this example?
Thanks for your kind words! Here's a link to the source code of this example.
It’s my pleasure!