Recently I recognized that some SaaS (Software as a Service) products use AWS Amplify which helps them to build serverless full-stack applications. I think serverless computing will be the future of apps and software. Therefore, I wanted to gather some hands-on experience, and I built a serverless application using AWS Amplify that uses React as frontend framework and GraphQL as backend API.
In this article, I want to guide you through the process how to build and deploy such an Amplify application.
AWS Amplify describes itself as:
Fastest, easiest way to build mobile and web apps that scale
I recently joined a project where the team used two separate Git repositories for their web components based on Stencil and Storybook. But the idea of Storybook is that the so-called “stories” live next to the components source code. Therefore, it made no sense to me to have those two tools in different repositories, and I combined them both in one repository.
My goal was that developers can also use Storybook stories via hot reload during development. Additionally, it should still be possible to separately deploy the web components to a npm registry and Storybook to a public URL.
React is known for its performance by using the Virtual DOM (VDOM). It only triggers an update for the parts of the real DOM that have changed. In my opinion, it is important to know when React triggers a re-rendering of a component to be able to debug performance issues and develop fast and efficient components.
After reading this article, you should have a good understanding of how React rendering mechanism is working and how you can debug re-rendering issues.
First, we need to understand what rendering in the context of a web application means.
Domain names provide a human-readable address for any web server available on the Internet and are a key part of the Internet infrastructure. You can reach any computer which is connected to the Internet through a public IP address. This IP can either be an IPv6 address (e.g.
2001:0DB8:0000:0001:0000:0000:0010:01FF), or an IPv4 address (e.g.
This article summarizes a list of Angular interview questions which I would ask candidates and that I get often asked in interviews.
Angular is an application design framework and development platform for creating efficient and sophisticated single-page apps. Angular is built entirely in TypeScript and uses it as a primary language. As it is a framework it has many useful built-in features like routing, forms, HTTP client, Internationalization (i18n), animations, and many more.
For me, it is important to see analytics about my portfolio website. This way, I can see which posts got the most views, which country my users are from, and which browser & operating system they are using. The simplest solution to add analytics to your site is Google Analytics as it is free and easy to set up. But as we all know, this service is only free as we pay it indirectly by providing data to it. What you need to know about Google Analytics and privacy.
It is important to monitor an application’s metrics and health which helps us to improve performance, manage the app in a better way, and notice unoptimized behavior. Monitoring each service is important to be able to maintain a system that consists of many microservices.
In this blog post, I will demonstrate how a Spring Boot web application can be monitored using Micrometer which exposes metrics from our application, Prometheus which stores the metric data, and Grafana to visualize the data in graphs.
Implementing these tools can be done quite easily by adding just a few configurations. …
Creating a changelog is a usual task if a new software version is going to be released. It contains all the changes which were made since the last release and is helpful to remember what has changed in the code and to be able to inform the users of our code.
In many projects, creating the changelog is a manual process that is often undesired, error-prone, and time-consuming. This article describes some tools that can help to automate the changelog creation based on the Git history.
Let’s start with some basics.
Semantic Versioning (SemVer) is a de facto standard for…
On Hacker News I discovered the article Building a self-updating profile README for GitHub. I was very fascinated about this new GitHub feature and wanted to build something similar for my GitHub profile.
GitHub profile READMEs are a new feature that allows users to have the content of a README markdown file rendered at the profile page.
To use this feature you just need to create a new repository that has the same name as your GitHub account. Mine is located at
github.com/mokkapps/mokkapps.This repository needs to be public and initialized with a README:
In my current project my colleague Michael Seifert introduced property based testing in our Python codebase. It was the first time I heard about it and it sounded fascinating, so I wanted to also implement it in our frontend code based on Vue.js with Jest as testing framework and TypeScript as programming language.
TL;DR: A single concrete example of expected behavior of the system under test.
Freelance software engineer from Germany with focus on Angular