Writing about Web Development and Freelancing. // konstantin.digital

Build this beautiful, small weather app and learn how to best plan and organize a React project. A beginner-friendly introduction to thinking in React.

Building a simple, responsive weather app with React.js
Building a simple, responsive weather app with React.js

In this article, we are going to build a beautiful, simple weather app with React.js. By doing this, we will discover and learn some essential skills:

  • How to best plan your React project in advance
  • How to organize your code meaningfully and maintainable
  • How to prevent common mistakes while building

Unfortunately, learning these theoretical things is often rather boring than excited, although it is important. That’s why I like to put it in a more practical-approached…


Image for post
Image for post

Without a doubt, Notion.so is one of my favorite apps when it comes to organizing notes. I love their minimal designed text editor because it focuses your attention on the content — and not on unnecessary UI elements.

Yet it provides you a ton of powerful features that lead to a better writing experience.

For instance, the slash command is one of those features that really enhanced my writing flow. It allows you to add and style content without leaving the keyboard. …


Get the cursor coordinates and index position to display interactive UI elements!

Image for post
Image for post

Yes, I know… there are certainly more exciting topics to write about than dealing with cursors on a web page. But since I struggled a lot with this issue in my latest project, I decided to share my approach — hoping that it might help one or the other.

In this article, we are going to create two methods for locating the caret: One to get the X/Y coordinates and another to get the index position within the content.

The Problem

Recently, I built a text-editor where users could edit HTML content inside a contenteditable element. …


This article should provide a general understanding of how Gatsby works and how it can be used to create a personal website from scratch. If you are new to Gatsby, this article is for you.

How To Build A Portfolio With Gatsby.js
How To Build A Portfolio With Gatsby.js

I recently published the first iteration of my personal website. Since I haven’t had a chance to try Gatsby prior to the project, it was the first time for me to dive into this new ecosystem.

Even though I got more and more enthusiastic about Gatsby throughout development, it was admittedly quite overwhelming at first. …


Image for post
Image for post

The web is a great platform. It’s an open-ecosystem that anyone can use and build on. Sometimes, however, it is not possible to build exactly what you want due to missing capabilities.

Think about a messaging application that should use the contact list on your smartphone to select friends to chat with. In today’s web, you can’t build an app like this because you don’t have access to native features like contact lists.

Google calls this the app gap.

It describes the gap between what’s possible on the web and what’s possible on native. …


Why You Can’t Ignore Progressive Web Apps
Why You Can’t Ignore Progressive Web Apps

These days, the discussion about Progressive Web Apps is often primarily focused on whether they will replace native apps or not. And while this might be an interesting topic to talk about, people forget about the first and foremost intent PWAs were built for: Enhancing the web’s user experience.

However, ignoring this can come to you at a high cost. No matter if you have a native app or not. This article should help you in evaluating PWA technology.

The Misleading Battle: PWA vs. Native Apps

Discussing PWAs, it seems like one question is ubiquitous: Which app model will be the most promising in the future? Not…


Service Worker Templating
Service Worker Templating

Traditionally, platforms like PHP or Ruby on Rails took care of the rendering process server-side. Lately, new frameworks like React or Angular took that process from the server to the client. With service workers, we now have a third place where we can implement a template engine — between client and server. This article shows you what I mean by that, the advantages that come with it, and how you can use it.

What is Service-Worker-Side Templating?

Service-Worker-Side Templating works like any other template engine. You have your templates, e.g. an article page, stored within your cache. For any intercepted requests, the service worker…


Image for post
Image for post

Progressive Web Apps have been hyped for quite a long time. Since the term was coined by Google’s engineer Alex Russell back in 2015, a lot of people referred to it as the future of app development and enumerated its advantages over and over again.

But let’s face the truth: People and businesses haven’t yet adapted to Progressive Web Apps. Even though we have seen some great case studies in the past, it feels like neither corporates nor users have been embracing this new technology thoroughly. Or how many PWAs do you use in your daily life?

In this article…


Image for post
Image for post

Hosting your Gatsby site with Netlify is a perfect pairing. The whole development workflow gets so smooth using both. However, redirects, for instance, don’t work out of the box yet, or at least not the way you would expect it to work. Therefore, this article should show you two ways how you can add redirects to your Gatsby site hosted on Netlify.

Option 1
Adding redirects via _redirects file

Option 2
Adding redirects via createRedirect action

Which one you choose is up to you, whatever you prefer. However, since both don’t work out of the box in Gatsby, we, first…


Product management lessons from the legendary CEO

Image for post
Image for post

I recently read the biography of Steve Jobs, written by Walter Isaacson. And although there are many things interesting enough to write about, it was one particular aspect that got me fascinated throughout the whole book: Jobs’s ability and discipline to focus.

Well, you may think it’s nothing new that Jobs was really dedicated to simplicity and focusing, and you’re certainly right. But I, nevertheless, was impressed by how he implemented both in a straightforward way at Apple. …

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store