BLOG
You can search blog posts using Google. Or browse a minimal list .
![Run, Build & Deploy Stencil and Storybook From One Repository Image]()
Run, Build & Deploy Stencil and Storybook From One Repository
3/25/2021 Michael HoffmannDevelopmentTools
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…
![Debug Why React (Re-)Renders a Component Image]()
Debug Why React (Re-)Renders a Component
2/26/2021 Michael HoffmannDevelopmentReact
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…
![How to Deploy a Heroku Backend to a Netlify Subdomain Image]()
How to Deploy a Heroku Backend to a Netlify Subdomain
1/12/2021 Michael HoffmannDevelopment
On my main domain mokkapps.de I have deployed my private portfolio website. For different use cases, I want to have a Node.js backend deployed to a subdomain, e.g. api.mokkapps.de . This blog post describes how you can deploy a Heroku…
![My Top Angular Interview Questions Image]()
My Top Angular Interview Questions
11/23/2020 Michael HoffmannDevelopmentCareerAngular
This article summarizes a list of Angular interview questions which I would ask candidates and that I get often asked in interviews. Table of Contents 1. What is Angular? What is the difference between Angular and Vue.js / React? 2. What's new in…
![How I Replaced Google Analytics With a Private, Open-Source & Self-Hosted Alternative Image]()
How I Replaced Google Analytics With a Private, Open-Source & Self-Hosted Alternative
11/2/2020 Michael HoffmannTools
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…
![Monitoring Spring Boot Application With Micrometer, Prometheus And Grafana Using Custom Metrics Image]()
Monitoring Spring Boot Application With Micrometer, Prometheus And Grafana Using Custom Metrics
10/26/2020 Michael HoffmannDevelopmentSpring
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…
![How To Automatically Generate A Helpful Changelog From Your Git Commit Messages Image]()
How To Automatically Generate A Helpful Changelog From Your Git Commit Messages
9/7/2020 Michael HoffmannDevelopmentTools
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…
![How I Built A Self-Updating README On My Github Profile Image]()
How I Built A Self-Updating README On My Github Profile
7/15/2020 Michael HoffmannDevelopmentCareer
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 README GitHub profile…
![Property Based Testing With Typescript Image]()
Property Based Testing With Typescript
5/29/2020 Michael HoffmannDevelopmentTesting
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…
![How To Generate Angular & Spring Code From OpenAPI Specification Image]()
How To Generate Angular & Spring Code From OpenAPI Specification
3/2/2020 Michael HoffmannAngularDevelopmentSpring
If you are developing the backend and frontend part of an application you know that it can be tricky to keep the data models between the backend & frontend code in sync. Luckily, we can use generators that generate server stubs, models, configuration…
![Sending Message To Specific Anonymous User On Spring WebSocket Image]()
Sending Message To Specific Anonymous User On Spring WebSocket
2/10/2020 Michael HoffmannSpringDevelopment
In my current, I had the opportunity to develop a new application based on Vue.js in the frontend and Spring Boot in the backend. The backend should send updates to the frontend via a WebSocket connection so that users do not need to refresh the…
![Boost Your Productivity By Using The Terminal (iTerm & ZSH) Image]()
Boost Your Productivity By Using The Terminal (iTerm & ZSH)
2/3/2020 Michael HoffmannProductivityDevelopment
Using the terminal is one of the biggest productivity boosts you can gain in your daily work as a developer. If you know your shortcuts, you will be way faster than using the mouse. In this article, I want to show you my terminal setup and how I use…
![Manually Lazy Load Modules And Components In Angular Image]()
Manually Lazy Load Modules And Components In Angular
1/7/2020 Michael HoffmannDevelopmentAngular
In Angular enterprise applications, it is often a requirement to load a configuration from a server via HTTP request which contains a UI configuration. Based on this configuration data, multiple modules and/or components need to be lazy-loaded and…
![How To Build An Angular App Once And Deploy It To Multiple Environments Image]()
How To Build An Angular App Once And Deploy It To Multiple Environments
12/9/2019 Michael HoffmannDevelopmentAngular
In my last projects, we always had the same requirement: Build the application once and deploy the same build fragment to multiple environments. This leads to some technical challenges, as we need to be able to inject environment-specific information…
![The Last Guide For Angular Change Detection You'll Ever Need Image]()
The Last Guide For Angular Change Detection You'll Ever Need
11/18/2019 Michael HoffmannDevelopmentAngular
Angular's Change Detection is a core mechanic of the framework but (at least from my experience) it is very hard to understand. Unfortunately, there exists no official guide on the official website about this topic. In this blog post, I will…
![How I Write My Blog Posts Image]()
How I Write My Blog Posts
10/15/2019 Michael HoffmannCareer
I'm often asked how I write my blog posts and in this article, I want to describe my process from start to finish. In this blog post I will cover these topics: Topic Selection Planning & Preparation Writing Review Publish Prepare a talk Conclusion…
![JHipster - The Fastest Way To Build A Production-Ready Angular & Spring Boot Application Image]()
JHipster - The Fastest Way To Build A Production-Ready Angular & Spring Boot Application
9/23/2019 Michael HoffmannDevelopmentAngularSpring
The last years I mainly worked on the frontend part of web & mobile applications but I also did some minor backend work. Since mid of this year, I am working to improve my backend knowledge and started to focus on Java backend development using…
![How To Easily Write And Debug RxJS Marble Tests Image]()
How To Easily Write And Debug RxJS Marble Tests
9/9/2019 Michael HoffmannDevelopmentAngular
End of 2018 I wrote an article about how I write marble tests for RxJS observables in Angular. The content in there is still valid but I found recently a new library which I like and which makes debugging marble tests easier. If you do not know…
![The Mistakes I Made In My First Software Project Image]()
The Mistakes I Made In My First Software Project
8/2/2019 Michael HoffmannDevelopmentCareer
Before I started my professional career as a developer I mainly developed Android apps using Java as the programming language. I got hired by a software service company and in my first project, we had to develop JavaScript-based applications for…
![How I Set Up A New Angular Project Image]()
How I Set Up A New Angular Project
7/6/2019 Michael HoffmannDevelopmentAngular
Update November 2019: Updated article with some additional tips Update September 2019: Added error handling In my opinion, Angular is the best choice for large enterprise applications. The basic project setup which is generated by using the…
![5 Reasons Why I Quit My Job And Started Freelancing Image]()
5 Reasons Why I Quit My Job And Started Freelancing
6/12/2019 Michael HoffmannCareerFreelancing
I recently quit my job and decided to start a new chapter in my life as a freelancer. This idea was in my head for about one year but to be honest, back in these days I was not brave enough to go step. In this blog post, I want to tell you my main…
![NestJS - The missing piece to easily develop full-stack TypeScript web applications Image]()
NestJS - The missing piece to easily develop full-stack TypeScript web applications
4/15/2019 Michael HoffmannDevelopment
I think we all know this problem: You need to develop a new web application and therefore you need to implement the core of the application in the backend and frontend. Both can be time-consuming and if, in the beginning, you choose wrong…
![Why I Switched From Visual Studio Code to JetBrains WebStorm Image]()
Why I Switched From Visual Studio Code to JetBrains WebStorm
2/14/2019 Michael HoffmannDevelopmentTools
As I started my first JavaScript project in 2015 I used JetBrains WebStorm which is an IDE (integrated development environment) for JavaScript development. I was already used to JetBrains IDEs as I worked before with Android Studio which is based…
![How I Built A Custom Stepper/Wizard Component Using The Angular Material CDK Image]()
How I Built A Custom Stepper/Wizard Component Using The Angular Material CDK
12/25/2018 Michael HoffmannDevelopmentAngular
Update 12.02.2018: Meanwhile I have created a PR to the Angular Material repository and added there an official guide Recently I had to refactor a quite complex legacy Angular component and I want to share my experiences with you. The Legacy…
![The Engineering Behind My Portfolio Website Image]()
The Engineering Behind My Portfolio Website
12/12/2018 Michael HoffmannDevelopment
I created my first personal website in 2017 when I launched my first smartphone game . I use Google Analytics in this game and it is therefore necessary to provide a link to a privacy policy website from inside the game. I used WordPress and a…
![Why A Good Frontend Developer Should Care About Web Accessibility Image]()
Why A Good Frontend Developer Should Care About Web Accessibility
11/24/2018 Michael HoffmannDevelopment
Back in 2017, when I started frontend development, I heard an interesting talk with the title "Aesthetics of the invisible" from my former colleague Francesco Schwarz . It was all about accessibility in websites and the corresponding blog post…
![How I Write Marble Tests For RxJS Observables In Angular Image]()
How I Write Marble Tests For RxJS Observables In Angular
11/12/2018 Michael HoffmannDevelopmentAngular
I am a really passionate Reactive Extensions user and mostly use them in RxJS which is integrated into the Angular framework . In Angular, I often use observables in my services and need therefore to write tests for these asynchronous data…
![Sticky Footer in GatsbyJS using Flexbox Image]()
Sticky Footer in GatsbyJS using Flexbox
9/20/2018 Michael HoffmannDevelopment
I have recently developed some static websites based on GatsbyJS which have a sticky footer. A sticky footer is always positioned on the bottom of the page, even for sparse content. Unfortunately, I had some struggle to solve this and I, therefore…
![Run Automated Electron App Tests Using Travis CI Image]()
Run Automated Electron App Tests Using Travis CI
9/6/2018 Michael HoffmannDevelopment
Last year I developed the Standup Picker which is an Angular application running in an Electron shell. As I released new versions while older versions were already in use, I wanted to gain more confidence while releasing newer versions of my…
![With These Tips You Will Rock Every Technical Job Interview Image]()
With These Tips You Will Rock Every Technical Job Interview
8/16/2018 Michael HoffmannCareer
In my previous company I got the opportunity to be one of 20 so called "candidate interviewers". This meant that I participated in technical interviews; an essential part of this company's application procedure. I participated in about 30 interviews…
![My Definition Of A Senior Developer Image]()
My Definition Of A Senior Developer
7/22/2018 Michael HoffmannCareer
During my time as a software developer I met and worked with many other developers. Some of them just started their apprenticeship, some started their first job after university, some already had multiple years work experience and some even had 1…
![How I Increased My Productivity With Visual Studio Code Image]()
How I Increased My Productivity With Visual Studio Code
5/31/2018 Michael HoffmannProductivityDevelopmentTools
In this post I will describe how I increased my productivity by learning how to use Visual Studio Code in a more efficient way. But in general, always consider this advice as it is really important: Learn your IDE/Editor so that you are able to use…
![Lessons Learned: My First Smartphone Game Image]()
Lessons Learned: My First Smartphone Game
5/22/2018 Michael HoffmannDevelopment
In 2017, I have released my first smartphone game "Supermarket Challenge" for iOS and Android . I learned a lot of stuff during the game development and wanted to share my experiences with you. Why did I develop a game I play and love video games…
![How I Built My Website With Hugo And Netlify Image]()
How I Built My Website With Hugo And Netlify
5/19/2018 Michael HoffmannDevelopment
End of last year I started working on my private portfolio website and started to research how to easily build and deploy such static websites. The Tools Hugo I discovered Hugo which is a very popular open-source static site generator. It is…
![My First NPM Package: github-traffic-cli Image]()
My First NPM Package: github-traffic-cli
5/12/2018 Michael HoffmannDevelopment
Since I published my first projects on GitHub I really enjoyed viewing the traffic on my repositories. It is really interesting to see how many people visit or clone my repositories. Unfortunately it costs a lot of time to click through all…
![My First Visual Code Extension Image]()
My First Visual Code Extension
5/11/2018 Michael HoffmannDevelopment
I am really a big fan of Visual Code and use it as my main IDE for software development. The available selection of extensions (see the Extension Marketplace ) is amazing. As I started using Visual Code I found every extension I was looking for…
