Hi there! Christian here
I like to deepen my skills in TypeScript, Node.js, Docker and Go. In order to solve problems.
useEffect Hook: Dependency Array Cheatsheet
20th of Mar '22 • 8 min.
A quick cheatsheet about useEffect. Examples of controlling when the effect runs, skip unnecessary function calls using the dependency array!
Developer's Resume Template - made with Tailwind, Vite and Ionicons
3rd of May '21 • 1 min.
As a Developer you might like the idea to design your resume as a website to impress your future employer or just as an easy way to share the link with clients or friends. I've made a template for a single page resume that can easily be hosted on GitHub Pages (or somewhere else) with TailwindCSS, Vite and Ionicons. I am using the template for my own resume! It is fully responsive and customizable - check it out!
Object Destructuring, but Why?
4th of Apr '21 • 7 min.
Object Destructuring is a handy syntax feature of JavaScript. It enables you to write cleaner code, especially when using it to destructure parameters right inside a function definition! I rarely used it in the past, although familiar with the syntax. But recently it saved me a lot of pain when I needed to pass a bunch of arguments to Vuex actions and mutation handlers. It allowed for easily keeping track of all the stuff being passed around between the functions!
The CSS Position Property Explained - with Examples
30th of Mar '21 • 6 min.
CSS position can be used to design layouts, align elements pixel-perfectly and even draw pictures! So, in order to learn the fundamentals of CSS positioning, here is a quick reference! Two vivid examples are included to play around with on CodePen!
The Right Tool for the Job in Frontend Engineering
20th of Mar '21 • 6 min.
Lately, I've been thinking alot about choosing the right tools and frameworks for another project. Ok, I simply go ahead and choose. Harder than you think! Because so many tools are damn hot right now - like TailwindCSS. Other tools have been hyped for years and still are - like React. But what if these tools aren't fit for every project? What if they only shine in their specific domain? Here is what I found to choose the right tools depending on the use-case of your web project.
Blockchain-based Sensor Data Validation
22nd of Feb '21 • 33 min.
The Blockchain has constantly been hyped and is still gaining popularity - not only for cryptocurrencies such as Bitcoin pushing forward into our daily lives. Blockchain technology promises privacy and security, thus enabling a free internet of independent users. And with the rise of IoT devices, data generation, processing and storage is growing out of hand. This article provides an introduction to the merger of Blockchain technology with IoT networks to enhance privacy and security for the user.
How to preview your Website shared on Social Media with Meta Tags
8th of Jan '21 • 5 min.
Websites should be easily shared on Social Media such as Facebook, Twitter, Whatsapp etc. In order to be an eye-catcher, it is essential to display the link in a visually attractive manner e.g. with a featured image, a convincing title and a concise description. It will drive peoples engagement! In this Tutorial we use meta tags in the HTML head along with Open Graph for sharing a Card on Twitter.
Vue.js Tutorial Part II: Build a Frontend Quiz App
2nd of Jan '21 • 19 min.
Part II: Learn fundamental concepts of Vue.js like emitting custom events and component re-rendering and more! This is a followup Tutorial where we will extend the existing Vue Quiz App with a Modal giving the user a smooth experience. Create a custom Quiz App along with me!
Emit Events in Vue to pass Data between Components
2nd of Jan '21 • 5 min.
Modern frontend frameworks like Vue or React use props to pass data down the component tree. But how to pass data up? With Vue you can design your custom event, define how it is triggered and catch data bubbling up to the parent component.
The CSS Display Property Explained
9th of Dec '20 • 8 min.
CSS powers the web along with HTML and JavaScript. CSS has powerful features, one being the display property defining how an HTML element integrates into the CSS Flow Layout of a Website. Background knowledge of the display property and its most frequently used values block and inline helps to understand positioning and element flow in the browser! Additionally, a working example is supplied for outlining the importance of CSS display!
9 Amazing GitHub Repos for Every Developer
20th of Nov '20 • 6 min.
GitHub is full of code.. But how to find excellent repos that come in handy for every web developer? Curated lists of resources are pure gold for everyone seeking to increase their skills in coding, as a quick reference and find out what`s new out there. Searching manually can be quite exhausting... I´ll show you the needles in the haystack!
9 VS Code Shortcuts for faster programming
17th of Nov '20 • 4 min.
Writing code is probably the most complex task in the world, it requires physical engagement, focus, a clear and undisturbed mind in order to fully immerse oneself in the process. Switching frequently between keyboard and mouse can be quite exhausting and kill your fluent process over and over again. Soo, I made a small list of VS Code shortcuts helping to keep up the positive flow while coding - hands on the keyboard!
Picking a Frontend Framework as a Beginner
31st of Oct '20 • 2 min.
Here are some thoughts of mine about picking a frontend framework as a beginner. It's how I feel after having tried React and Vue. The original title of this post was 'Why is React so damn popular?' because its popularity caused me to pick it as my first frontend library. But was it really the best choice for me as a beginner?
Vue.js Tutorial: Build a Frontend Quiz App
23rd of Oct '20 • 34 min.
In this tutorial you build a Quiz app and learn fundamental concepts of Vue.js. We cover Vue components, computed properties, methods, Vue directives and much more! Our Frontend Quiz app fetches data from an API and walks the user through an interactive Quiz! I have provided a GitHub repository with the Starter-Code for you! Have fun following along!
Connect AWS DynamoDB to your Next.js App and Deploy on Vercel
31st of Jul '20 • 15 min.
In this post I'll walk you through setting up an AWS DynamoDB Database with your Next.js App and how to Deploy it easily on Vercel. We're going to go over the AWS Free Tier, different ways to configure DynamoDB and how to store the database's secret credentials safely in Next.js Framework and use them as Environment Variables. Last but not least, I'll show you how to manage Environment Variables on Vercel with either the Vercel CLI or the Dashboard on vercel.com. Have fun!
How to Make Banner a Reusable Component with Props
8th of Jul '20 • 8 min.
I am going to implement my Welcome Banner Component to be displayed on every page where the Typewriter Component shall be fed with variable Text Input based on the title of the page. The component will be included into the Container Component which already wraps the whole content section of DevDiary, making the Banner part of the ubiquous layout.
My first Blog made with Next.js - DevDiary
30th of Jun '20 • 14 min.
In this post I'll walk you through each step of creating my first Blog with Next.js, React, style-jsx and Markdown. Starting with some basics about Next.js, then diving into the birth of the essential components. Each step is supplemented by Code Snippets and detailed description. I'd like to inspire anyone seeking to create their own Blog!
Connect with me
1st of Jun '20 • 0 min.
As a young Blogger and Junior Web Developer I'm happy and grateful for your Feedback! If you like to connect with me longterm, follow me on Twitter! I'll tweet out every new post, there. Hope you enjoy my blog!