Tobias Q. - q-bit

Quick & Dirty: How to add a client search feature to your Ghost blog

This article attempts to give you an idea of how to implement a search feature for your own Ghost blog. You'll learn how to create your own index, store it on the clientside and query it for results. In the related code repository, you can also find an implementation example.

Let's build Vue directives: Scrolling elements into view

Directives are one of Vue's most powerful concepts. They provide direct access to a DOM element over its lifecycle. And you're not restricted to the built-in ones but can also write your own custom directives.

How to self-host Google fonts for your web application | Part 1/2: DIY vs. CDN

Google provides plenty of web services, one of which is Google Fonts. At the same time, using these services is as simple as opening a window (or browser tab, literally speaking). You might have a good reason though not to use these, and instead, provide font files from your own sources.

How to self-host Google fonts for your web application | Part 2/2: Download and provision

They are everywhere. For a good reason as well - typography plays a big role in UI design, and Google provides designers and developers a simple solution by providing popular fonts over their CDN. You might, however, have good reason to serve these from your own server.

How to monitor the progress of a Javascript fetch - request and cancel it on demand.

Waiting blows. That goes for many situations in life, including when a website you visit is busy loading new data. However, it's usually helpful to visualize that something is happening in the background. Or be able to pull the plug. Read on to find out how that's to be done with the fetch API.

A step-by-step guide to develop and deploy Vue apps with docker, part one

Vue is a great framework to develop user interfaces. It has experienced a great deal of growth in popularity since its initial release in 2014 and still continues to improve. In this article, you'll learn how to make your Vue development workflow even better using Docker

A collection of useful express.js middleware concepts for your next project

This article explains a few techniques that make use of express's middleware interface. You will learn how to set up a common logger, add CORS and cache HTTP headers, as well as implement simple Basic Authentication into your Node application.

Seven advanced techniques for Javascript spread syntax and rest parameters

Spread syntax and rest parameters are two sides of the same coin. While the first gives you access to all properties of an object or array, the latter 'compresses' several variables or arguments into a single array. Read on to learn how to make the best use of this syntactic gemstone collection

🌙 How to implement darkmode with a Vue.js component

A dark mode feature can be a bliss for your webapp's users. It reduces stress on the eye in low-light conditions and can also help saving energy on the device. In this post, you'll learn how to write your own Vue.js component to add it to any newly created - or already existing project with ease.

Use async / await with Javascript's .map() and other high-order functions

High order functions in Javascript are incredibly useful to improve code readability and to reduce redundancies. They have a weak point, however: Asynchrony. Read on to learn how to tackle this matter.

Five conductive - and five innovative npm packages

The Node Package Manager (NPM), offers a variety of open source modules to extend your digital products. This article aims to present you a mixture of good - old utility modules, as well as some libraries which have rather exotic use cases.

How to use service workers in javascript

Progressive Webapps use service workers to make websites and webapps feel more like the native apps users know and love on their phones. This article will give you an introduction into the topic with some simple - to - follow code examples.

How to create svg elements with Javascript

SVGs are easily dropped into existing html content. But what if you wanted to add them dynamically, say to several DOM elements, with Javascript? Read on to find out how.

How to use Javascript to copy text to the clipboard

Copying and pasting text once doesn't take much time, but subsequent CRTL - parsing gets old pretty quick. Read on to find out how to leave this task to the browser, not to your reader.

What is the difference between callback functions, promises, and async/await in Javascript?

You've probably worked with each three of them yet as they are all very basic, yet reliable methods for asynchronous programming. This article aims to take a closer look into how they differ from one another, what they have in common and where async/await comes into play