<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Development on Andreas' Blog</title><link>https://blog.anoff.io/tags/development/</link><description>Recent content in Development on Andreas' Blog</description><generator>Hugo</generator><language>en</language><lastBuildDate>Thu, 09 Apr 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://blog.anoff.io/tags/development/index.xml" rel="self" type="application/rss+xml"/><item><title>AI my Stock Portfolio</title><link>https://blog.anoff.io/2026-04-ai-my-stock-portfolio/</link><pubDate>Thu, 09 Apr 2026 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2026-04-ai-my-stock-portfolio/</guid><description>&lt;p&gt;My stock portfolio is spread across multiple brokers in different countries — Japanese stocks with one broker, European positions with another, investment funds in a third account.
Each has its own dashboard, export format, and way of presenting performance.
Relying on these dashboards as my single source of truth felt uncomfortable.
What if a broker changes its interface or suspends my account?
How do I compare positions across currencies, time horizons, and purchase dates?&lt;/p&gt;
&lt;p&gt;I wanted &lt;strong&gt;local, inspectable, portable data ownership&lt;/strong&gt; — files on my own disk that don&amp;rsquo;t disappear if a broker changes policy.
Not just the raw transaction records, but the &lt;strong&gt;analysis process itself&lt;/strong&gt;.&lt;/p&gt;
&lt;p&gt;This post tells the story of how I built a suite of tools to solve that problem.
But the real journey wasn&amp;rsquo;t about writing Python scripts — it was about discovering &lt;strong&gt;how to think about stock performance&lt;/strong&gt; in the first place.
This was also a trial run in using AI end-to-end: &lt;strong&gt;Gemini&lt;/strong&gt; for strategic thinking and high-level concepts, &lt;strong&gt;Claude&lt;/strong&gt; and &lt;strong&gt;VS Code Copilot&lt;/strong&gt; for implementation and debugging.&lt;/p&gt;</description></item><item><title>Loading global scss variables in nextjs with sass preprendData</title><link>https://blog.anoff.io/2024-11-nextjs-scss-global-variables/</link><pubDate>Fri, 15 Nov 2024 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2024-11-nextjs-scss-global-variables/</guid><description>&lt;p&gt;Recently I started using &lt;a href="https://nextjs.org/"&gt;next.js&lt;/a&gt; and slowly diving into lower levels of web design, creating own components, managing complexer styles etc.
One of the things I realized was that I want to use a CSS preprocessor, so I went for &lt;a href="https://sass-lang.com/dart-sass/"&gt;dart sass&lt;/a&gt; but sticking to &lt;code&gt;.scss&lt;/code&gt; as file format.&lt;/p&gt;
&lt;p&gt;The one thing that annoyed me - and took me some time to solve - was how to use react with modular styles i.e. &lt;code&gt;component.module.scss&lt;/code&gt; but having a central &lt;code&gt;_variables.scss&lt;/code&gt; containing colors, common element widths.
I have seen approaches that require custom loaders or organizing my stylesheets in a certain way.
Finally I found out that dart sass can be configured to append data to every stylesheet before parsing it.&lt;/p&gt;</description></item><item><title>Backup your NAS (Synology) to external harddrive</title><link>https://blog.anoff.io/2024-11-backup-synology-folder-to-external-disk-encrypted/</link><pubDate>Sun, 03 Nov 2024 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2024-11-backup-synology-folder-to-external-disk-encrypted/</guid><description>&lt;p&gt;Some months ago I decided it is time to take control of all my pictures.
So far everything is hosted either on Google Photos or Adobe servers.&lt;/p&gt;
&lt;p&gt;First thing was buying a NAS and trying out different self-hosted photo applications.
Of course if you keep the data yourself, you are also responsible for making sure nothing happens to it and run &lt;strong&gt;Backups&lt;/strong&gt;.
This post will explain how to setup a non-vendor-specific encrypted backup of your NAS data that can be read by any Linux system.
The description in this blog post is based on a Synology NAS but works for any Linux based system, NAS, server or computer.&lt;/p&gt;</description></item><item><title>Programming ESP and other Arduino compatible chips using VS Code on MacOS</title><link>https://blog.anoff.io/2020-12-programming-arduino-esp-with-vs-code/</link><pubDate>Mon, 28 Dec 2020 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2020-12-programming-arduino-esp-with-vs-code/</guid><description>&lt;p&gt;When you are developing microcontroller based projects as a hobbyist you often end up with the Arduino ecosystem and might be tempted to use their IDE.
This post will explain how you can develop, program &amp;amp; debug Arduino compatible devices using VS Code.
Even though this post is written with a MacOS walk-through it should be valid for other operation systems as well.&lt;/p&gt;</description></item><item><title>Publishing private npm packages to GitHub Package registry for free</title><link>https://blog.anoff.io/2020-07-private-npm-package-github/</link><pubDate>Sun, 26 Jul 2020 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2020-07-private-npm-package-github/</guid><description>&lt;p&gt;Even though I am a big fan of Open Source Software and try to make my projects open and consumable by others as well, there are cases where you want to keep your stuff private.
But even if you work in a closed source environment you still want to use the same tools that you employ in the open source world.
In this blog post I will explain how you can create private npm packages for your Javascript/Typescript projects - and I will show you how you can host your private npm packages &lt;strong&gt;for free&lt;/strong&gt;!&lt;/p&gt;</description></item><item><title>Migrating to vuetify 2.1</title><link>https://blog.anoff.io/2019-10-migrating-vuetify-1-to-2/</link><pubDate>Sun, 06 Oct 2019 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2019-10-migrating-vuetify-1-to-2/</guid><description>&lt;div class="mermaid"&gt;
 sequenceDiagram
 participant Alice
 participant Bob
 Alice-&gt;&gt;John: Hello John, how are you?
 loop Healthcheck
 John-&gt;&gt;John: Fight against hypochondria
 end
 Note right of John: Rational thoughts &lt;br/&gt;prevail!
 John--&gt;&gt;Alice: Great!
 John-&gt;&gt;Bob: How about you?
 Bob--&gt;&gt;John: Jolly good!
&lt;/div&gt;

&lt;p&gt;I just migrated the &lt;a href="https://github.com/anoff/devradar/tree/master/editor"&gt;code&lt;/a&gt; for the &lt;a href="//editor.devradar.io"&gt;devradar editor&lt;/a&gt; to the latest major version of vuetify.
There is an officiel &lt;a href="https://vuetifyjs.com/en/getting-started/releases-and-migrations"&gt;migration guide&lt;/a&gt; that helped me solve 70% of the issues but here is a quick overview of the biggest issues I encountered and what actually changed.&lt;/p&gt;</description></item><item><title>Reference GitHub #issues during git rebase</title><link>https://blog.anoff.io/2019-07-20-git-config-rebase-github-issue/</link><pubDate>Sat, 20 Jul 2019 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2019-07-20-git-config-rebase-github-issue/</guid><description>&lt;p&gt;Being a developer most times means working with git.
There are many different ways to use git and every project, every developer has their preferences.
For my own projects I work a lot with GitHub and I love using the &lt;code&gt;git rebase -i&lt;/code&gt; feature to clean up commits.&lt;/p&gt;
&lt;p&gt;&amp;lt;!&amp;ndash;more&amp;ndash;&amp;gt;&lt;/p&gt;
&lt;p&gt;Lately I ran into the problem that rebasing a &lt;a href="http://commitizen.github.io/cz-cli/"&gt;Commitizen&lt;/a&gt; commit message with a linked GitHub issue leads to problems.
The problem is that the rebase UI treats the &lt;code&gt;&amp;amp;#35;&lt;/code&gt; hash sign as an escape character for comments.
In the message below the reference to the GitHub issue #53 would be removed from the commit message as &lt;code&gt;&amp;amp;#35;&lt;/code&gt; is the leading character in line 3.&lt;/p&gt;</description></item><item><title>Preview AsciiDoc with PlantUML in VS Code</title><link>https://blog.anoff.io/2019-05-08-asciidoc-plantuml-vscode/</link><pubDate>Wed, 08 May 2019 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2019-05-08-asciidoc-plantuml-vscode/</guid><description>&lt;p&gt;This post is for everyone that likes to write AsciiDoc in VS Code but also wants to inline PlantUML diagrams within their docs.
In a previous post about &lt;a href="https://blog.anoff.io/2018-07-31-diagrams-with-plantuml/"&gt;diagrams with PlantUML&lt;/a&gt; I gave an intro into PlantUML and how to preview images in VS Code.
With the latest release of the asciidoctor plugin for VS Code it is possible to easily preview embedded PlantUML images within AsciiDocs.
No more need to maintain attributes in each file 🎉&lt;/p&gt;</description></item><item><title>Get Hugo to render (nice) Asciidocs</title><link>https://blog.anoff.io/2019-02-17-hugo-render-asciidoc/</link><pubDate>Sun, 17 Feb 2019 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2019-02-17-hugo-render-asciidoc/</guid><description>&lt;p&gt;While migrating my blog from Jekyll to Hugo I went down quite a rabbit hole.
While setup and migration to Hugo was a breeze, I spent a lot of time making my &lt;code&gt;.adoc&lt;/code&gt; formatted post work with the new blog.
After working through several GitHub issues I ended up manipulating the DOM with Javascript to get admonitions working.
It still doesn’t feel right - but hey it works! 🤷‍♂️
This post will cover the steps I took in case I myself or anyone out there ever needs to do this again.&lt;/p&gt;</description></item><item><title>Converting existing AsciiDoc into an Antora project</title><link>https://blog.anoff.io/2019-02-15-antora-first-steps/</link><pubDate>Fri, 15 Feb 2019 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2019-02-15-antora-first-steps/</guid><description>&lt;p&gt;After 2 years of working with the arc42 template in markdown, I spent the last few weeks learning about an asciidoc based site generator named &lt;a href="//antora.org/"&gt;Antora&lt;/a&gt;. The main reason for the interest in AsciiDoc was the fact that the limited feature set in markdown often impairs you while writing down complex things. But I had one problem; most of our documentation is scattered across multiple repositories as we try to keep the docs as close to the code as possible. That is why this series will cover how to get a multi repository (software) architecture template up and running using &lt;a href="//antora.org/"&gt;Antora&lt;/a&gt;.&lt;/p&gt;</description></item><item><title>Get the most out of hackathons</title><link>https://blog.anoff.io/2018-12-09-stuttgart-hackathon/</link><pubDate>Sun, 09 Dec 2018 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2018-12-09-stuttgart-hackathon/</guid><description>&lt;p&gt;End of October I joined the &lt;a href="https://www.hackathon-stuttgart.de/"&gt;Stuttgart Hackathon&lt;/a&gt; for the second time. It was my overall 4th public Hackathon. In this blog post I want to tell you why I enjoy doing Hackathons and why you should join one too if you have the chance!&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;TL;DR; &lt;strong&gt;Network&lt;/strong&gt; and play with expensive toys&lt;/p&gt;
&lt;/blockquote&gt;</description></item><item><title>Markdown native diagrams with PlantUML</title><link>https://blog.anoff.io/2018-07-31-diagrams-with-plantuml/</link><pubDate>Tue, 31 Jul 2018 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2018-07-31-diagrams-with-plantuml/</guid><description>&lt;p&gt;This post covers PlantUML basics and how it can be used in GitLab or GitHub projects as well as a seamless local development environment using Visual Studio Code.
I have been wanting to write this post for months. Lately I have been using PlantUML extensively at work but also in my private projects. You can see it being used in my &lt;a href="https://github.com/anoff/plantbuddy#main-features"&gt;plantbuddy&lt;/a&gt; and &lt;a href="https://github.com/anoff/techradar#design"&gt;techradar&lt;/a&gt; projects on GitHub. Using it in different places and for various purposes I came across a bunch of issues that I want to share in this post.&lt;/p&gt;</description></item><item><title>Building realtime apps with Vue and nodeJS</title><link>https://blog.anoff.io/2018-04-18-node-vue-websockets/</link><pubDate>Wed, 18 Apr 2018 00:00:00 +0000</pubDate><guid>https://blog.anoff.io/2018-04-18-node-vue-websockets/</guid><description>&lt;p&gt;Wanting to build a simple &lt;a href="https://en.wikipedia.org/wiki/Single-page_application"&gt;SPA&lt;/a&gt; as a side project I struggled with things that might annoy a lot of newcomers that do not want to go full vanilla. Which &lt;em&gt;web framework&lt;/em&gt;, which &lt;em&gt;style library&lt;/em&gt;, which &lt;em&gt;server framework&lt;/em&gt; - and more importantly how does it all work together?&lt;/p&gt;
&lt;p&gt;In this post we will put together a bunch of great tools out there to build a realtime web app with a few single lines of code. A quick introduction into the tools that will be used:&lt;/p&gt;</description></item></channel></rss>