CodingKiwi

Quick and dirty network synced vue state

Quick and dirty network synced vue state

For some apps it can be useful to have the state server-side and sync it to the clients live using websockets. One option is to just send the full state everytime it has changed, this has some disadvantages though * overhead: we send the full state even if just one property

My PHP VSCode / Docker / Remote SSH Setup

My PHP VSCode / Docker / Remote SSH Setup

Even though I mainly work on js projects I did a lot of laravel apps in the past and currently I still work on my project management app "flow" from time to time. Everything I explain in this post is based on my experience over the past years

SQL Batch inserts are faster

SQL Batch inserts are faster

At my current employer a PHP script was used that extracts entries from a large database table, optimizes them and saves them in a second table. This script was written years ago and it ran every day for 12 hours. Although the general rule "never change a running system&

Vue Component Workbench

Vue Component Workbench

In my projects I've been using my vue/scss framework "hop". Whenever I add new components or change something, it is quite helpful to have an instance of webpack running inside the hop project to see my changes in realtime instead of publishing a new version

Why I'm not switching to vite yet

Why I'm not switching to vite yet

Twisted paths While searching for a markdown based Static-Site Generation (SSG) to build a documentation page I came across vuepress, first I started with vuepress 1 but since I wanted to install it in my existing project (which uses vue 3 and vuepress 1 does not support vue 3) I

Digitally enhanced boardgame - Part 3: Perspective

Digitally enhanced boardgame - Part 3: Perspective

Link to Part 2 Digitally enhanced boardgame - Part 2: Fiducial markersLink to Part 1: Digitally enhanced boardgame - Part 1: The dungeon tilesWelcome to this blog post series about a dungeon boardgame enhanced with some digital magic. What kind of game? Something like a dungeon crawler :) The dungeon I

Digitally enhanced boardgame - Part 2: Fiducial markers

Digitally enhanced boardgame - Part 2: Fiducial markers

Link to Part 1: Digitally enhanced boardgame - Part 1: The dungeon tilesWelcome to this blog post series about a dungeon boardgame enhanced with some digital magic. What kind of game? Something like a dungeon crawler :) The dungeon I want the dungeon to be random, which is not too hard

Digitally enhanced boardgame - Part 1: The dungeon tiles

Digitally enhanced boardgame - Part 1: The dungeon tiles

Welcome to this blog post series about a dungeon boardgame enhanced with some digital magic. What kind of game? Something like a dungeon crawler :) The dungeon I want the dungeon to be random, which is not too hard to achieve procedurally, but how will the players be able to see

Building a Code Search

Building a Code Search

I came across the application sourcegraph which is an awesome code search tool that allows you to search across multiple repositories fast (plus a lot of other awesome features). Under the hood it uses "zoekt", a trigram based search index which was a independent project but is now

Waveshare DSI Screen

Waveshare DSI Screen

Let's start by setting up the OS via Raspberry Pi Imager To make thing easier I configure SSH, Wifi, country, language and keyboard settings in the "Advanced Settings" menu before flashing. After attaching the pi to the screen and plugging in the DSI cable I connect

SCSS Corner Circle Cutout

SCSS Corner Circle Cutout

First let's take a look at what we are trying to achieve: The simplest approach would be to give the icon in the corner a background-color and border-radius and that is also the solution I would suggest you use. There is one catch though: the background-color of the

Reverse Engineering Govee Smart Lights

Reverse Engineering Govee Smart Lights

Getting started First we need to enable bluetooth logging on the smartphone, for me it was in Settings > Developer options > Enable Bluetooth HCI snoop log Now we activate bluetooth and use the govee app. I also started a screen recording to make debugging easier later on! Exporting the

Creating an Electron App - Content-Security-Policy for file://

Creating an Electron App - Content-Security-Policy for file://

Content-Security-Policy or short CSP is a concept to prevent certain types of attacks, for example Cross-Site Scripting (XSS). In this post I will explain how I added this kind of security in my app while using the file:// protocol To enable CSP you need to configure the web sever to

Creating an Electron App - Secure core structure

Creating an Electron App - Secure core structure

Electron is split into a main process and a renderer process. The main process is a Node.js environment with full operating system access, whereas the renderer process does not have access to Node.js by default. nodeIntegration: false This strict division is done on purpose for security reasons. A

Why is local development of npm packages so hard?

Why is local development of npm packages so hard?

💡Disclaimer: the information in this article is outdated! I will write an update soon Sometimes you want to split up code into several npm packages, in my case I had a css/vue library called “hop” and a project, called “flow” in which I used hop. Later on I build

A tale of Trello and Laravel Socialite

A tale of Trello and Laravel Socialite

While recently working on my small-scale project management application “Flow” I had two features in mind: Third-Party Authentication and a tool to import Trello Boards into my database Introducing Laravel Socialite Laravel Socialite is officially listed in the laravel documentation as a simple way to authenticate using OAuth providers Laravel