RSS.Social

Markus Oberlehner

follow: @[email protected]

Posts

Let's Share Our Failures Not Our Successes!

Understanding 'Magic' in Programming Frameworks: Examples, Pros and Cons

Will LLMs Ever Be Creative Enough To Solve Programming?

Nomenclature in Microservices Architecture: Modules, Components, and Services

Parallelizing Specmatic Contract Tests with Playwright

You Can't Fight 'Not-enoughness' with 'More'

Using react-hook-form with React 19, useActionState, and Next.js 15 App Router

Non-English Variable, Function, and Symbol Names in Code

Running Visual Regression Tests with Storybook and Playwright for Free

Running Next.js with Docker

The Microservices and Microfrontend Mindset: Think Decoupled

Microservices, the Expulsion From E2E Testing Paradise, and the Path to Salvation: Contract Testing

Using Testing Library jest-dom with Vitest

AI-Enhanced Development: Building Successful Applications with the Support of LLMs

No More Mocking! Write Better Tests for Microservices-powered Server-side Rendered Applications with Contract Tests

Nuxt: Building a Similar Products Feature with Vector Search and SQLite

Your Own Vector Search in 5 Minutes with SQLite, OpenAI Embeddings, and Node.js

Is Returning Composables from Composables an Anti-Pattern in Vue Applications?

Reactive Data Fetching and Updating in Nuxt 3: Automatically Refresh `useFetch()` When Deleting or Updating Data

Test Smarter, Not Harder: Focus on Outcomes, Not Outputs

Embracing Simplicity: The Rule of Least Power

Building a Chatbot with Next.js Running LLaMA 2 Locally

Running Nuxt 3 in a Docker Container

Leveraging Docker to Run CLI Tools in Languages Like Java, Ruby, and PHP Without Local Installation

Beware of Leaky Abstractions When Relying on Attribute Inheritance in Vue Components

The Best of Both Worlds: Progressive Enhanced Hybrid Applications

Building a ChatGPT Client with Remix: Leveraging Response Streaming for a Chat-like Experience

Using Error Boundaries in Remix to Prevent Broken Pages on Client-Side-Only Errors

Building a ChatGPT Client with Nuxt 3: Leveraging Response Streaming for a Chat-like Experience

Utilize TypeScript's Omit & Partial for Data Creation & Update Scenarios

Harnessing ChatGPT as Your Writing Assistant: A Step-by-Step Guide

The Three-Layer UI Component Architecture: Versatile Building Blocks for Crafting Multiple Design Systems

How To Fix Spacing Between Text Blocks When Using Tailwind CSS

Using Mock Service Worker with Vitest and fetch

Refactoring a House: Software Architecture is Architecture After All

TODO Timeboxing

Manual testing, E2E testing, unit testing – how to decide which testing strategy to use?

How to Clean Up Global Event Listeners, Intervals, and Third-party Libraries in Vue Components

Multiple Root Nodes and Attribute Inheritance in Vue 3

Vue Project Directory Structure: Keep It Flat or Group by Domain

Vue Composition API: VueUse Composable Library

Maintaining Shared Code and the Inversion of Responsibility Principle

Vue Composition API: Composables

Don't Write Documentation!

Cypress Live-Reload Tests on Code Changes

Decoupling Component Tests From Implementation Details with Preconditions

Vue 3 Composition API vs. Options API

CSS: The Spacing Between Elements Should Be Determined by the Parent Element

Vue 3 Composition API: ref() vs. reactive()

Premium Vue and Nuxt Templates for Web Apps and Sites

Tailwind CSS: The Antifragile CSS Framework

Your Components Do Too Much

Events and Callbacks: Parent/Child Component Communication in Vue

What Makes a Senior Developer? It Depends!

Building Vue.js Applications Without webpack

JavaScript Runtime Bundling Concept

What Developers Can Learn from Playing Chess and Video Games

Utilize the File Structure to Decide When to Use Vue.js Slots

Progressive Enhancement and the Modern Web

Group, Extract, Share: Working with the Vue Composition API

watch vs. watchEffect when to use what with Vue.js

Partial Hydration Concepts: Lazy and Active

Automatic Dependency Injection in Vue with Context Providers

Vue.js Feature Toggle Context Provider

useState and useReducer with the Vue 3 Composition API

Application State Management with Vue 3

Wrap Third-Party Libraries

Vue.js Style Provider Pattern

Avoid Opaque Dependency Injection Techniques with Vue.js

We Have Solved CSS! With BEM, Scoped Components, and Utility First Frameworks

When and When Not to Use Utility Classes With BEM

Antifragile Web Development

Automatically Generate Responsive Image Attributes Based on the Context of a Vue Component

Cross-Browser Acceptance Tests with LambdaTest and TestCafe

Context-Aware Props in Vue.js Components

Tight Coupling vs. Loose Coupling in Vue.js

Retry Failed API Requests with JavaScript

How to Avoid Bugs from Unanticipated Behavior?

Business Logic in Fat Client Applications

Make it Simple

Fighting Procrastination

Break out of CSS Grid: Align Image or Background at the Edge of the Screen

Variable Naming: Arrays and Booleans

$refs and the Vue 3 Composition API

Are my Component Names Too Long? Vue.js Component Naming Best Practices

React Context and Provider Pattern with the Vue 3 Composition API

Automatically Generate your Vue Router Configuration with vue-auto-routing

Stale-While-Revalidate Data Fetching Composable with Vue 3 Composition API

Using Netlify Redirects to Proxy Images Hosted on a Third Party Image Provider or a Headless CMS

Super Simple Progressively Enhanced Carousel with CSS Scroll Snap

Simple Solution for Anchor Links Behind Sticky Headers

Lint Only Files with Changes on pre-commit

Telling a Story with Test Code

Cut Your Nuxt.js generate Build Time in Half with context.payload

Building Partially Hydrated, Progressively Enhanced Static Websites with Isomorphic Preact and Eleventy

Setting up Eleventy with Preact and htm

Naming Things: Staying in Line with the System

Naming Your Unit Tests: It Should vs. Given/When/Then

Weekly Recap: There is no Global State, Technical Debt and Writing Everything Twice

Weekly Recap: Eleventy + Preact, Boring Technology and the Right Amount of Magic

Weekly Recap: Atomic Commits, Legacy Code and Evil String Identifiers

Vue.js Functional Base Components Powered by CSS Modules

Weekly Recap: Data Sanitizing and Reducing Complexity up the Tree

Weekly Recap: Single Parameter Object and Craftsmanship vs. Engineering

Weekly Recap: Less Array.reduce(), SQL and JSON, Dunning-Kruger and Changing Your Mind

Weekly Recap: Playing with State Machines, Complexity and Best Practices

Lazy Resolving Observable API Services with Vue.js

Weekly Recap: Simple is Complicated

Weekly Recap: Tight Coupling + Complexity = Errors

Weekly Recap: TDD is dead

Vuex Data Model and Feature Module Strategy Part 2: Feature Modules

Vuex Data Model and Feature Module Strategy Part 1: The Data Model Module

Thoughts about Utility-First CSS Frameworks

Reusable Functional Vue.js Components with Tailwind CSS

Setting up Tailwind CSS v2 with Vue.js

Simple Solution to Prevent Body Scrolling on iOS

Scrolling Shadows with Vue.js

Popup Overlays with Vue Router and Portal Vue

Dynamic Vue.js CRUD Applications

Decouple Vue.js components from the Vuex Store

Dependency Injection in Vue.js with Functional Component Factories

Generic Content Vuex Modules

Make your Vuex State Flat: State Normalization with Vuex

Controlling the LEGO Mindstorms NXT with Node.js Part 2: It's Moving

Controlling the LEGO Mindstorms NXT with Node.js Part 1: It's Alive

Vue.js Powered Data Model and Query Builder

Separation of Concerns Re-Revisited

Vue.js Single File Component Factory

Implementing an Authentication Flow with Passport and Netlify Functions

Accessible Custom Vue.js Select Component Part 2: Advanced

Accessible Custom Vue.js Select Component Part 1: Simple but Experimental

Building Vue.js UI Components With HTML Semantics in Mind

Working With Functional Vue.js Components

Multi Export Vue.js Single File Components With Proxy Exports

Styling HTML Tables: How to Apply Margin, Border and z-index on Table Elements

Use Fragments to Avoid Obsolete GraphQL Fields in Vue.js Applications

Build Decoupled Vue.js Applications with Hooks

Observable REST API with Vue.js

Implementing the Builder Pattern in Vue.js Part 2: Forms

Implementing the Builder Pattern in Vue.js Part 1: Listings

The IoC Container Pattern with Vue.js

try...catch: The Right Way

Dependency Injection in Vue.js Applications

Distributed Vue.js Applications Part 2: Pushing Content and Component Updates to the Client

Distributed Vue.js Applications Part 1: Loading Components via HTTP

Using Docker to Run Visual Regression Tests with Jest and Puppeteer

Vue.js Error Handling with Renderless Components

Visual Regression Tests for Vue.Js Applications with Jest and Puppeteer

Renderless Vue.js Lifecycle Hook Components

Integration Testing Vue.js Components With Jest and Puppeteer

Integration Testing Vue.js Container Components With Cypress

Container Components in Vue.js: Advanced Component Composition

Reusing Logic With Renderless Vue.js Frame Components

Multi Export Vue.js Single File UI Components

Magic Numbers in CSS: How to Identify and Fight Them

How to Use GraphQL with Vue Apollo Components and Netlify Functions

How to Drastically Reduce Estimated Input Latency and Time to Interactive of SSR Vue.js Applications

Building a Renderless reCAPTCHA v3 Form Component with Vue.js

Lazy Load Vue.js Components When They Become Visible

Using the Google Maps API with Vue.js

abomination: a Concept for a Static HTML / Dynamic JavaScript Hybrid Application

Variables in Design Systems

Using the Wrapper Factory Pattern for Vue.js Unit Testing

Building a Parallax Scrolling Effect Component with Vue.js

Building a Static Site with Storyblok and Gridsome

Building a Simple Content Slider with Vue.js

Skeleton Loading Animation with Vue.js

Using Location Data with Vue.js and Open Street Map

Creating PDF Invoices with Airtable, Vue.js and Puppeteer

Poor Man's Container Queries: Hide Content Based on the Width of Its Container

Thoughts About Design Systems and Naming Things

How the BEM CSS Naming Scheme Can Improve Vue.js Component Architecture

Implementing a GDPR Consent Workflow with Vue.js

Using Cloudinary and Storyblok to Handle Assets for a Vue.js Application

Creating a Responsive Alternating Two Column Layout with Flexbox

Using Docker to run BackstopJS Powered Visual Regression Tests

Implementing a Simple Middleware with Vue Router

Building a Simple Ken Burns Slider with Vue.js

Automatic SPA FTP Deploys with CircleCI

Building a Serverless Comment System with Netlify Functions, Storyblok and Vue.js

Vue.js Responsive Image Lazy Loading

Building a Website with Vue.js, the Storyblok Visual Editor and Netlify

Building a Custom Storyblok Field Type Plugin With Vue.js

Building a Pre-Rendered Website With Nuxt.js and Storyblok

How to Pre-render Vue.js Powered Websites with webpack

Building Landing Pages with Vue.js and a Headless CMS

Layouts with Vue.js - How to Create Dynamic Layout Components

Vue Router Page Transitions with Fade, Slide and Zoom Effects

Transition to Height Auto With Vue.js

Should I Store This Data in Vuex – When Should I use Vuex?

Building Renderless Components to Handle CRUD Operations in Vue.js

Building Custom Multi-Option Form Components with Vue.js

Replicating the Twitter Tweet Box with Vue.js

Visual Regression Testing with Nightwatch.js and Cucumber.js

Building a Date Input Component with Vue.js

Crazy Powerful Nightwatch.js Cucumber Step Definitions

Setting up a Vue.js Project with webpack 4 and Babel 7

Vue.js Application Structure and CSS Architecture

Route Model Binding with Vue.js and Vuex

Network Stubs and Timers with Nightwatch.js and Cucumber.js

Automated Acceptance Testing with Cypress and Vue.js Part 2: Network Stubs and Timers

Automated Acceptance Testing with Cypress and Vue.js Part 1: Setup

Dynamically Loading SVG Icons with Vue.js

How to Structure a Complex Vuex Store with Modules

How to Handle Multi-row Forms with Vue, Vuex and vuex-map-fields

Money in Open Source

Vue.js Form Validation with Vuelidate

Combining GraphQL and Vuex

Two-Way Data Binding with v-model and Vuex

Building a Modal Dialog with Vue.js and Vuex

Exploratory TDD

Testing Vuex Powered Vue.js Components with Jest

Git, the pedantic way

Speeding up Nightwatch.js Powered Acceptance Tests

Intelligent Design vs. Evolution

Two-Tier Sass Variables / CSS Custom Properties

The Ultimative Flexbox Based CSS Layout

Unit Testing Vue.js Single File Components with ava

Acceptance Testing with Nightwatch.js and Cucumber.js Part 3: BrowserStack

Acceptance Testing with Nightwatch.js and Cucumber.js Part 2: Smart Step Definitions

Acceptance Testing with Nightwatch.js and Cucumber.js Part 1: Setup

Setting up a PWA with Vue, Vue Router and webpack Code Splitting

CSS Selector Namespaces for Stable Acceptance Tests

Don't Make Things More Complicated as They Are

Payment Request API Part 3: Taxes and Discounts

Payment Request API Part 2: Building a Shopping Cart

Payment Request API Part 1: Payment Process Using the Credit Card Payment Method

Dealing with the BrowserStack Parallel Test Limit When Using TestCafe

Front-End Testing Part 2: Cross-Browser Acceptance Tests with TestCafe, BrowserStack, and npm Scripts

Front-End Testing Part 1: Writing JavaScript Unit Tests with ava and mock-browser

Building a Responsive Priority+ Horizontal Scroll Navigation

Building npm Packages with TypeScript

Getting Off of Information Addiction (Part 2: News)

What I’ve Learned from Rewriting an Open Source Project from Scratch

Using Gulp and UnCSS in Combination with Sass based Hugo themes

How to Show a Placeholder for a <select> Tag

Getting Off of Information Addiction (Part 1: Social Media)

Building a Good Ol' 12 Column CSS Grid Framework with CSS Grid Layout

Dreaming of a Package Based CSS Workflow

Get Going

Creating a Pure CSS Animated SVG Circle Chart

Talk: Monorepos in the Wild

An Introvert on a Stage

Building the Berlin Skyline with LEGO

Code Quality Matters (for Developers)

AMP and the Open Web

Building a Blog with the Static Website Generator Hugo

Building a Simple (but Overengineered) Database Abstraction with TypeScript

A (Final?) Look at Grid Frameworks

Perfectionism Kills Motivation

CSS, BEM and Context

The Testable Module Pattern

Test Driven Development with JavaScript Using ava and Sinon.JS

Abbreviations Suck

Investing Money (as a Developer)

Building avalanche 4.x.x