All of my posts

A View on CSS Viewport Units in 2022 (v*, sv*, lv*, dv*)

What is a Viewport? In computer graphics, a viewport, as the word already suggests, is the area that is currently viewed. In Browsers, the Viewport is the currently open browser window without the

How to set up a project with Nuxt 3 and Vuetify 3 with themes and Icon Fonts

Creating a Nuxt 3 Project Nuxt 3 is based on Vue3, if you are already familiar with vue3, great! If you think you should catch up a little on it, I could highly recommend the course: Vue - The

Extend Vitests API with custom expects

What is Vitest Vitest is the brand new, superfast test runner you should know in 2022! If you heard from it the first time, you can also check out the Docs or my Vitest UI review here. Why do I need

How to indicate scrollable content in Vue.js

My experience with bad scrolling indicator UX I think everyone found itself using an website or app and did not recognize that there is something to scroll to find the desired action. One Popular

Parameterized (data-driven) Tests in Vitest + example

The First one was using Vitest UI and the second one how to set up a CI with Vitest and GitHub Actions. What is Vitest I’m pretty sure you have already heard about vitest and vite in general. In case

A simple Guide on integrating google AdSense into your vue project

What is Google Adsense When you have used the Internet before reading this article, or also during this article you already came across Google AdSense. Google Adsense is an advertising network by

Using Vitest UI as an alternative WebStorm Integration.

What is Vitest? When you are reading this, you probably have already heard of Vite (french for Quick). Vite is a new frontend build tool with an insane performance. Vite has the power to immediately

Setting up a superfast CI with Vitest and GitHub Actions

What is GitHub Actions? I think nobody could describe it better than GitHub itself in its official docs. GitHub Actions is a continuous integration and continuous delivery (CI/CD) platform that

Vitest How to mock A Canvas

Vitest is a new testing framework for JavaScript. It is fast and easy to get started when you have used JavaScript testing frameworks like jest before! Currently, it is still in beta, but I think it

Vitest how to mock Window and JQuery

Vitest mock jQuery Vitest is a new testing framework for JavaScript. It is fast and easy to get started when you have used JavaScript testing frameworks like jest before! Currently, it is still in

How to easily Invalidate CloudFront Cache.

How to create a CloudFront invalidation Request? To create an Invalidation request you need to create an InvalidationRequest Object with the explained parameters and sent it with your

Upload Images to S3 from a .net core API

In the first part, we were focusing on building a drag&drop Vue component to upload the files. The last article was all about handling the images inside that backend and forwarding them to your

NBomber load testing in C#, ship with confidence robust stress-tested APIs

What is load testing? Load testing is simulating system interactions with n Users, collecting multidimensional metrics from response times over to system metrics like RAM and CPU usage. Load testing

A real-world example on Improving JavaScript performance

Why I needed to Improve my JavaScript performance I'm currently working on a simple tool to draw roofs with all kinds of different shapes. The tool should be able to handle all different types of

steps to improve your vue js onpage SEO

1. Use Vue-Meta When it comes to on-page SEO, there is nothing more important than good content, except good meta data to describe your content. What is meta-data? Meta-data is everything you need to

Static code analysis with SonarQube

What is static code analysis? Static code analysis is a process where checkers like SonarCube checks the source code itself for potential errors and pitfalls. Checkers are navigating through the code

Cypress test events from DOM elements

Why should I assert Events in my Cypress tests? When performing a Cypress test you are using an application as a real user would use it. From this point of view, we could assume that events are not

Cypress how to upload files

What is cypress Cypress is a popular test framework for UI testing like selenium. Cypress says about itself that it is a developer-focused framework. This means that every feature of cypress should

How to Log in Cypress

The Cypress Log statement Given the Cypress documentation, the Cy.Log has nearly the same functionality as the Console.log() statement. The Only Problem is to use this functionality within the

CakeDefi Review 2022 - Is CakeDefi a good Investment for 2022?

CakeDefi is a Platform for Staking, Lending, and Liquidity mining their native Defi token. CakeDefi promises on their site: "Bake cash flow with crypto while you sleep." I told to myself: Getting

Level up you're UI Testing with Cypress

Hi, in this guide I want to show you the amazing testing library Cypress. You will learn what cypress is why to use cypress and how to use cypress for quality assurance in your next vue js or other

How to mock Axios requests.

Installing axios-mock-adapter By installing axios-mock-adapter you will get the ability to mock all axios requests. npm install axios-mock-adapter --save-dev Importing and using

Property-based testing in JavaScript

Selection of the right JavaScript testing Libary For JavaScript, there exist several Property-based testing Libraries, all of them are following Quick-Check [6] which was implemented in Haskell. Some

Three simple Steps to crop images in vue js.

Hello, and welcome (back). In one of my previous examples, I showed you how to upload images to your vue app in an easy way. But sometimes you do not only want to upload images, but you also want to

Introduction to Property-based testing

When realizing a Software Project, testing is a crucial part and could take up to 50% of the project cost. Especially in a Startup where changes happen daily and must be implemented without much

Build a blog with gridsome and forestry CMS

When it comes to creating a blog, most people tend to chose WordPress with Elementor. This sounds also like an amazing combination, there are a whole bunch of finished themes and also a high amount

Improve your S3 Loading speed with AWS CloudFront

This is the last part of my series on how to Upload files on Amazon S3 from a Vue.Js frontend. In the last part, we have uploaded our files from a .net core API. You can find it here if you missed

How to send mails from .net Core API in 2021

I had an UseCase where I had to send different emails to our clients depending on what they did on our application. To do this I first started using the SMTP client, as many Blogposts and

How to integrate GoogleMaps in a vue app.

GoogleMaps is awesome, but the GoogleMaps API is even more Awesome. You can not only show places or calculate routes but you're also able to draw on the map, measure distances and even use heatmaps

How to deploy your project to Netlify and register a Domain for it. (fast)

In this Post i will guide you through the steps i took when deploying an project to Netlify. Netlify is similar to AWS another cloud service, they offer a huge free plan with up to 100GB/month of

Build an email list using gridsome and MailChimp

As you have probably read before, if not, you will read it now, an personal email list is a very important marketing tool for you and your product. You have the ability to keep connected with your

A three-step guide to upload files in vue js using dropzone.js

In my first guide, I want to show you how to build a Drag&Drop component inside your Vue.js application using vue Dropzone. This is the first part of the series on how to securely upload your

Three steps to Create and manage an Amazon S3 Bucket

In the last part, we were focusing on building a drag&drop Vue component to upload the files. This is the second part of my Series on how to Upload images on Amazon S3 from a Vue.Js frontend.