<?xml version="1.0" encoding="utf-8" standalone="no"?><rss xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" version="2.0"><channel><title>makkusu.dev</title><description>Personal blog of Maximilian Boll</description><managingEditor>atom@makkusu.dev (Maximilian Boll)</managingEditor><pubDate>Tue, 3 Sep 2024 00:00:00 GMT</pubDate><language>en-us</language><itunes:explicit>no</itunes:explicit><itunes:subtitle>Personal blog of Maximilian Boll</itunes:subtitle><itunes:owner><itunes:email>atom@makkusu.dev</itunes:email></itunes:owner><item><title>My Journey to Minimalism</title><pubDate>Tue, 3 Sep 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2024/09/my-journey-to-minimalism/</guid><description>&lt;p&gt;What do I actually need in my life? This question, coupled with my circumstances at the time, led me to embark on a meaningful journey towards minimalism. In this post I want to share how it all began, how it is going and where my current goals are. I hope you enjoy reading this and perhaps even find some tips and motivation. This might as well become a small series in the future.&lt;/p&gt;
&lt;h2&gt;What is minimalism?&lt;/h2&gt;
&lt;p&gt;Minimalism is a lifestyle philosophy that emphasizes simplicity and the removal of excess. It focuses on prioritizing what truly matters by decluttering both physical and mental spaces, promoting a life centered around intentionality and mindfulness.&lt;/p&gt;
&lt;p&gt;In terms of living, minimalism encourages creating a home and personal life with fewer possessions but greater meaning. This often involves streamlining belongings, choosing quality over quantity, and embracing functional, aesthetically simple decor. In personal life, it might mean prioritizing meaningful experiences over material gains, fostering deeper relationships, and maintaining a clear, uncluttered schedule. By focusing on essentials, minimalism aims to reduce stress and enhance overall well-being.&lt;/p&gt;
&lt;h2&gt;How it all started for me&lt;/h2&gt;
&lt;p&gt;I was first introduced to the word “minimalism” and what it actually meant a few years ago. At first I didn’t think about it much but since the day I learned about it, it lived in my head and led me to see my life with different eyes. Every now and then, I noticed thoughts like “Do I really need this?”, “When did I actually use this thing the last time?” or “I felt burned out because there was too much of everything. I didn’t want to face these tasks.”.&lt;/p&gt;
&lt;p&gt;That last thought especially led me to a more negative and depressing way of living. Having too much—choosing quantity over quality—can seriously affect your mental health. I felt exhausted being in my own apartment even if I didn’t do anything. Don’t get me wrong here, my apartments never looked super chaotic or full of stuff from floor to ceiling but I still acquired a lot of belongings over the years. It burned me out.&lt;/p&gt;
&lt;p&gt;Around 2018/19 I was living in a small one room apartment and during this period I decided to do something about my anti-minimalist-life. Taking action felt good as soon as I began sorting through my belongings and deciding what I want to keep and what to sell or throw away but it didn’t take long until I realized that decluttering your life is pretty exhausting too. Not so much in a physical way, as long as you don’t throw out the heavy duty furniture, but the whole progress of deciding what you want to get rid of. This is especially true for items with sentimental value.&lt;/p&gt;
&lt;h2&gt;How I decide what to keep and what to throw away&lt;/h2&gt;
&lt;p&gt;The hardest part of starting a minimalist life is probably choosing what to keep and what to throw away or sell. The latter being even harder because keeping things is something we are already used to, that’s what brought me to my situation—having stuff and keeping it.&lt;/p&gt;
&lt;p&gt;Let me tell you upfront: Getting rid of things is a process, you won’t get rid of everything right away. Every time you start a new “throw-out-session” it will be more and more and you will have a new perspective, so never give up if you feel unsatisfied after your first few sessions, it will get easier.&lt;/p&gt;
&lt;p&gt;I don’t remember where I read it, but when I started I kept asking myself the same 3 questions every time I was holding something in my hands—deciding what to do with this item:&lt;/p&gt;
&lt;p&gt;&lt;a name="questions"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h3&gt;1. Do I really need this?&lt;/h3&gt;
&lt;p&gt;I want to figure out if this item has an actual use case in my life and if it makes my life better in any way. You would be surprised by how many things you think have a positive impact on your life but in reality have the opposite effect.&lt;/p&gt;
&lt;h3&gt;2. When was the last time I used this?&lt;/h3&gt;
&lt;p&gt;Checking when I last needed this item and also how often I need it helps tremendously in my decision process. Some items are worth keeping even if you use them very rarely but those should be a minority.&lt;/p&gt;
&lt;h3&gt;3. How much would it cost me to get it again if I throw it away?&lt;/h3&gt;
&lt;p&gt;This is true in terms of effort, finance and time. I want to check if any of these points are off limits and would prevent me from throwing it away. An expensive drill you rarely use is probably worth keeping over a lot of small items slowly rotting in your bathroom shelf, items you bought ages ago but never really used. If you would ever find yourself in needed them ever again after sorting them out, you could easily get them again, so no need to keep your shelfs or closests full.&lt;/p&gt;
&lt;p&gt;These questions helped me a lot when I started and they still help me today. It’s a very good starting point but I realized that I would never end up in a situation I wished for, it always felt like I didn’t do enough. This is exactly what I was talking about earlier. Every time I was starting a new session I threw away things I initially kept during my last session because I realized my thought process about this specific item was wrong the last time, &lt;u&gt;I do not need it&lt;/u&gt;.&lt;/p&gt;
&lt;h2&gt;Selling vs. Throwing away&lt;/h2&gt;
&lt;p&gt;When I decided to get rid of an item I always thought about selling it or to throw it away. I think selling something makes more sense most of the time because it can still be of value for another person. This thought might be very positive but can backfire sometimes. Selling something means you have to keep it until it is sold, so the items I wanted to sell were still stuck in my apartment. That was not my plan, so how to fix this?&lt;/p&gt;
&lt;p&gt;I set myself a time limit for selling things, if the item is not sold within this limit I would give it away for free or throw it away. A lot of people in my area place things they don’t want outside in a box for others to take. So this might be a last resort before throwing something useful away. I didn’t want to clutter the neighborhood though, so I rarely put things in a box outside.&lt;/p&gt;
&lt;p&gt;So, my priority is: selling first, then gifting, and finally throwing away.&lt;/p&gt;
&lt;h2&gt;Impact on my life&lt;/h2&gt;
&lt;p&gt;After the first couple of months, on and off decluttering my life, I finally felt the impact it had. Coming home felt like a relief, having less things meant less things to worry about, less things to worry about led to a much more relaxed life. I was absorbing this feeling to the fullest. It boosted my motivation and made me addicted to the whole minimalist lifestyle.&lt;/p&gt;
&lt;p&gt;For me, it is not only about having the least amount of things but rather steering my life towards a happier path. Soon after making progress for the first time I thought about other areas in my life where less could be more. It took me one glance at my phone to see my next target.&lt;/p&gt;
&lt;h2&gt;Digital Minimalism&lt;/h2&gt;
&lt;p&gt;No matter where we are, no matter what time it is or how busy we are, we always carry our phones nowadays. For me, this feels like carrying a “worry-package” at all times. Vibrations, sounds, notifications, mails &amp;amp; messages. It is all there, the whole time, distracting you from the world around you. There must be a way to make this tool less distracting, I thought. Here are some things that I started doing so far to transform this “worry-package” into a “don’t-worry-so-much-package” that would actually help me tackle my tasks and not distract me all the time.&lt;/p&gt;
&lt;h3&gt;1. Uninstall apps&lt;/h3&gt;
&lt;p&gt;I don’t know about you but I had a lot of apps on my phone. Just like I had random things in my drawers at home, that I would rarely or never use. I started deleting all these apps that I don’t need and decided what to keep and what not by following the &lt;a href="https://makkusu.dev/blog/2024/09/my-journey-to-minimalism/#questions"&gt;same questions&lt;/a&gt; I asked myself in terms of my apartment. Having only the tools you really need makes my phone much more valuable for my life again.&lt;/p&gt;
&lt;h3&gt;2. Disable notifications&lt;/h3&gt;
&lt;p&gt;Notifications can be useful but they can also be the devil. There are good ones and bad ones. Probably more of the latter. It is good to be reminded that there is an important appointment today but not so much if there is a person liking my post on Instagram. I’m still in the progress of figuring out which notifications I want to keep and which I don’t. This decision process is much easier for me because you don’t really miss out on anything. If you want to get the news, you can always check manually.&lt;/p&gt;
&lt;h3&gt;3. Sorting data&lt;/h3&gt;
&lt;p&gt;Our phones are the go to camera for most of us. For this reason we collect hundreds if not thousands of pictures over time. This not only consumes storage space but also fills our live with a lot of stuff we don’t actually need. Think about it, so many pictures you took but you will, most likely, never look at again. Same goes for pictures being sent to you via messenger. I rarely checked my “Whats App Images”-folder and was surprised how full it was, full of shit, when I finally scrolled through. Deleting all of this and sorting the rest in folders to keep it nice and clean helped me a lot. I regularly do this now, and I also move folders to my PC hard drive if I don’t need them on my phone at all times.&lt;/p&gt;
&lt;h2&gt;What’s planned for the future?&lt;/h2&gt;
&lt;p&gt;I will keep decluttering my life, no matter where and I can’t wait for all the moments of joy. I can highly recommend this to anyone struggling or feeling a little off while being at home. Do something about it, do something for you! It will make your life less stressful and might make you a happier person. You will re-learn how to live in the moment and see what is really important in life because there is less things to worry about, less stress and more time to absorb what really matters.&lt;/p&gt;
&lt;p&gt;I’m currently reading the German translation of “&lt;a href="https://www.google.com/books/edition/Goodbye_Things/_psIDgAAQBAJ"&gt;Goodbye, Things - On Minimalist Living&lt;/a&gt;” by Fumio Sasaki. And I plan to read even more books on this topic, it helps me stay on track and focus on what I want to achieve in the future.&lt;/p&gt;
&lt;p&gt;I am more than happy to take you with me on this journey. There will be more follow up posts about this topic as soon as I have more to tell you. I also want to dedicate a page about this topic on my website. Thanks for reading, and I hope I’ve been able to improve your life, even just a little, with my words and thoughts.&lt;/p&gt;
</description></item><item><title>Eleventy Reading Time Plugin</title><pubDate>Mon, 13 May 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2024/05/eleventy-reading-time-plugin/</guid><description>&lt;p&gt;I've been using &lt;a href="https://11ty.dev/"&gt;eleventy&lt;/a&gt; for quite a while now and a couple of plugins with it, some official, some by community members. It was about time to create my own plugin. I decided to add a reading time display to my blog posts and even though there are plugins for that already I chose to build my own and publish it—for learning purposes.&lt;/p&gt;
&lt;p&gt;May I proudly present: my very first node package and eleventy plugin! You can find the package at &lt;a href="https://www.npmjs.com/package/@myxotod/eleventy-plugin-readingtime"&gt;NPM&lt;/a&gt; and the full source code on &lt;a href="https://github.com/MyXoToD/eleventy-plugin-readingtime"&gt;GitHub&lt;/a&gt;.&lt;/p&gt;
&lt;h2&gt;So, what is it?&lt;/h2&gt;
&lt;p&gt;The plugin is really small and simple to use. You can add it to your 11ty project and use a custom filter to display the average reading time of a post or page. You can see an example on every single post on the &lt;a href="https://makkusu.dev/blog"&gt;blog page&lt;/a&gt;.&lt;/p&gt;
&lt;h2&gt;How to use it&lt;/h2&gt;
&lt;p&gt;First install the package to your project like so:&lt;/p&gt;
&lt;pre class="language-sh"&gt;&lt;code class="language-sh"&gt;&lt;span class="token function"&gt;npm&lt;/span&gt; i @myxotod/eleventy-plugin-readingtime&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;After that you have to add and register it inside your &lt;code&gt;.eleventy.js&lt;/code&gt; config file&lt;/p&gt;
&lt;pre class="language-js"&gt;&lt;code class="language-js"&gt;&lt;span class="token comment"&gt;// .eleventy.js&lt;/span&gt;
&lt;span class="token keyword"&gt;const&lt;/span&gt; readingtime &lt;span class="token operator"&gt;=&lt;/span&gt; &lt;span class="token function"&gt;require&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token string"&gt;"@myxotod/eleventy-plugin-readingtime"&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;

module&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function-variable function"&gt;exports&lt;/span&gt; &lt;span class="token operator"&gt;=&lt;/span&gt; &lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token parameter"&gt;eleventyConfig&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt; &lt;span class="token operator"&gt;=&gt;&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
  eleventyConfig&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;addPlugin&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;readingtime&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;
&lt;span class="token punctuation"&gt;}&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Finally use it in your code with the &lt;code&gt;readingtime&lt;/code&gt;-filter&lt;/p&gt;
&lt;pre class="language-html"&gt;&lt;code class="language-html"&gt;&lt;span class="token tag"&gt;&lt;span class="token tag"&gt;&lt;span class="token punctuation"&gt;&amp;lt;&lt;/span&gt;div&lt;/span&gt;&lt;span class="token punctuation"&gt;&gt;&lt;/span&gt;&lt;/span&gt;Reading time: {{ post | readingtime }}&lt;span class="token tag"&gt;&lt;span class="token tag"&gt;&lt;span class="token punctuation"&gt;&amp;lt;/&lt;/span&gt;div&lt;/span&gt;&lt;span class="token punctuation"&gt;&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Example output&lt;/p&gt;
&lt;pre class="language-html"&gt;&lt;code class="language-html"&gt;&lt;span class="token tag"&gt;&lt;span class="token tag"&gt;&lt;span class="token punctuation"&gt;&amp;lt;&lt;/span&gt;div&lt;/span&gt;&lt;span class="token punctuation"&gt;&gt;&lt;/span&gt;&lt;/span&gt;Reading time: ~3min&lt;span class="token tag"&gt;&lt;span class="token tag"&gt;&lt;span class="token punctuation"&gt;&amp;lt;/&lt;/span&gt;div&lt;/span&gt;&lt;span class="token punctuation"&gt;&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;You will have to pass the whole post or page to the filter as shown above.&lt;/p&gt;
&lt;h2&gt;Can I customize it? Sure you can!&lt;/h2&gt;
&lt;p&gt;You can pass several options when adding the plugin in your eleventy config file like so:&lt;/p&gt;
&lt;pre class="language-js"&gt;&lt;code class="language-js"&gt;eleventyConfig&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;addPlugin&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;readingtime&lt;span class="token punctuation"&gt;,&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;wordsPerMinute&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token number"&gt;200&lt;/span&gt;&lt;span class="token punctuation"&gt;,&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;suffixDisplay&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token boolean"&gt;true&lt;/span&gt;&lt;span class="token punctuation"&gt;,&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;suffixText&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token string"&gt;'min'&lt;/span&gt;&lt;span class="token punctuation"&gt;,&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;prefixDisplay&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token boolean"&gt;true&lt;/span&gt;&lt;span class="token punctuation"&gt;,&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;prefixText&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token string"&gt;'~'&lt;/span&gt;&lt;span class="token punctuation"&gt;,&lt;/span&gt;
  &lt;span class="token literal-property property"&gt;verbose&lt;/span&gt;&lt;span class="token operator"&gt;:&lt;/span&gt; &lt;span class="token boolean"&gt;false&lt;/span&gt;
&lt;span class="token punctuation"&gt;}&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Option&lt;/th&gt;
&lt;th&gt;Default&lt;/th&gt;
&lt;th&gt;Description&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;wordsPerMinute&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;200&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Average number of words read per minute (higher values result in faster reading times)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;suffixDisplay&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;true&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Show or hide the suffix&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;suffixText&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;'min'&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;The suffix to be shown&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;prefixDisplay&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;true&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Show or hide the prefix&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;prefixText&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;'~'&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;The prefix to be shown&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;code&gt;verbose&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;&lt;code&gt;false&lt;/code&gt;&lt;/td&gt;
&lt;td&gt;Output additional data to your terminal when an eleventy build happens&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;If you have any questions, feel free to open an &lt;a href="https://github.com/MyXoToD/eleventy-plugin-readingtime/issues"&gt;issue&lt;/a&gt; or send me a message on &lt;a href="https://x.com/MyXoToD"&gt;X&lt;/a&gt;.&lt;/p&gt;
</description></item><item><title>3D Boxes Loading Animation</title><pubDate>Wed, 3 Apr 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/3d-boxes-loading-animation/</guid><description>&lt;p&gt;I stumbled upon &lt;a href="https://codepen.io/amit_sheen/pen/JjzGGQR"&gt;this pen by Amit Sheen&lt;/a&gt; and thought it was a really cool idea. I wanted to create something similar and maybe more towards a loading animation—something a little more subtle (if you can still use that word when animating 3D boxes tbh).&lt;/p&gt;
&lt;p&gt;This is was I came up with, an infinite loop of moving 3D boxes.&lt;/p&gt;
</description></item><item><title>How I finally "finished" my website and a general update</title><pubDate>Sun, 31 Mar 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2024/03/how-i-finally-finished-my-website-and-a-general-update/</guid><description>&lt;p&gt;&lt;strong&gt;tl;dr&lt;/strong&gt;—Found a new job, gained a lot of motivation and finally finished this website. Also pretty happy about how everything turned out. Able to go to Japan, feeling fit because of bouldering and can't wait to see what else is coming in 2024.&lt;/p&gt;
&lt;hr /&gt;
&lt;p&gt;The last few month of 2023 were quite challenging but I was able to make the best out of it. I had to leave my job but and this was terrifying at first because it wasn't planned at all and I had to find an alternative. Luckily I made a few new friends during this time and one of them happened to work for a software company in Mainz. We talked a little about what I do and what they do—long story short, it was a match.&lt;/p&gt;
&lt;h2&gt;All new job ✨&lt;/h2&gt;
&lt;p&gt;So in January 2024 I started the new job and I was pretty excited. I would have to learn Java, which I have never written before and also I needed to improve my Angular skills. Turns out Java is not that different from other languages (who would have guessed &#129335;&#127995;‍♂️) and after a 1 week long Angular workshop I was feeling very confident in creating Angular apps.&lt;/p&gt;
&lt;p&gt;So far I feel really blessed in this company and I am really looking forward working there. This brings me to my next topic—motivation.&lt;/p&gt;
&lt;h2&gt;Sports, Japanese and my Website&lt;/h2&gt;
&lt;p&gt;The new job gave me a lot of motivation and I was trying to make good use out of it. Last year I went bouldering for the first time and I loved it, so what better to do with motivation than to invest it into sports. I aim to go at least 1 or 2 times a weak to the boulder gym now, this helps me get in shape and to relax. Another thing that improved for me is the way I learn Japanese. It was hard during the last half of 2023 and I had to stop going to the language school because it was too much for me to handle. But this year I finally felt good about studying again, so I increased my Japanese immersion and also got back to my Anki decks.&lt;/p&gt;
&lt;p&gt;Because all of this was not enough I also continued work on this website. In discontinued work here around 2 years ago but I really wanted to get it done. Now, finally I can say I'm &amp;quot;done&amp;quot;™. Using 11ty and all the bits and pieces I have learned over the past months really made this process fun. Can't wait to bring updates and to start working on new private projects.&lt;/p&gt;
&lt;h2&gt;Japan calling&lt;/h2&gt;
&lt;p&gt;Now I feel good about the current situation and the best thing is that it is only 1 week until I step into a plane going to Japan. I am super excited to stay there for 2 weeks. I'm going to be in Tokyo for at least 1 week and the remaining time I will go to Kyoto, Osaka and maybe some more rural areas. I will definitely post a lot of blog post once I come back with all of my impressions.&lt;/p&gt;
&lt;p&gt;So, see you after Japan &#128075;&#127995;&lt;/p&gt;
</description></item><item><title>Spinning 3D Loader</title><pubDate>Thu, 21 Mar 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/spinning-3d-loader/</guid><description></description></item><item><title>Shiny Card Tilting towards cursor</title><pubDate>Tue, 5 Mar 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/shiny-card-tilting-towards-cursor/</guid><description></description></item><item><title>CSS Day/Night Toggle</title><pubDate>Wed, 28 Feb 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/css-day-night-toggle/</guid><description></description></item><item><title>Pure CSS Gender Toggle</title><pubDate>Mon, 26 Feb 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/pure-css-gender-toggle/</guid><description></description></item><item><title>Circular Theme Toggle Animation</title><pubDate>Wed, 21 Feb 2024 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/circular-theme-toggle-animation/</guid><description></description></item><item><title>HUB Selector Idea</title><pubDate>Fri, 17 Feb 2023 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/hub-selector-idea/</guid><description></description></item><item><title>Maze Generation &amp; Path Finding (Prim's + A* Algorithm)</title><pubDate>Sat, 14 May 2022 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/maze-generation-and-path-finding-prim-s-a-algorithm/</guid><description></description></item><item><title>Net Puzzle</title><pubDate>Thu, 12 May 2022 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/net-puzzle/</guid><description></description></item><item><title>First successfull 3x3 blindsolve</title><pubDate>Sat, 12 Mar 2022 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2022/03/first-successfull-3x3-blindsolve/</guid><description>&lt;p&gt;&lt;strong&gt;tl;dr&lt;/strong&gt;—&lt;em&gt;I did it. It took me about 4 days of practice and the solve was a little over above 10 minutes. Check out the &lt;a href="https://makkusu.dev/blog/2022/03/first-successfull-3x3-blindsolve/#video"&gt;video below&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;Those of you who know me in person, know that I've been doing speedcubing for over 10 years already. I don't really remember when I really started but I know that my first official competition was 2011 in the Netherlands. Here's a &lt;a href="https://youtu.be/DLfM8VXO-GM"&gt;video from said competition&lt;/a&gt;—my first official personal best time. (btw I absolutely loved that purple tattooed Darth Vader shirt)&lt;/p&gt;
&lt;p&gt;As you can see I was super excited, super happy, had a very lucky &lt;span class="tooltip" data-text="A lucky coincidence in which you don't need to do the last step of the CFOP system"&gt;PLL skip&lt;/span&gt; and &lt;em&gt;I did not have a beard&lt;/em&gt;. The last one being the most weird of it all.
After competing in many more competitions, beating my personal best countless times and even going the &lt;a href="https://www.youtube.com/watch?v=kcIvwpm4PIc"&gt;Las Vegas for the world championship in 2013&lt;/a&gt; it was now finally time to learn how to solve this damn puzzle blindfoled.&lt;/p&gt;
&lt;p&gt;During my &lt;em&gt;active&lt;/em&gt; years in the speedcubing community, between 2011 and 2014, I picked up many information on how to actually solve the standard 3x3 cube blindfolded but I never really tried to do it. I thought it would be too hard or too time consuming to learn a good and reliable memorization technique. Although I did solve the cube with eyes open, only using moves that would be used when solving it while eyes are closed (T-Perm, J-Perm and Y-Perm—together with some setup moves).&lt;/p&gt;
&lt;p&gt;That's right, you only need the T- &amp;amp; Y-Permutation to solve a 3x3 Rubik's Cube blindfolded. But to be more precise and to also make it a little bit more convenient this is what you need:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;span class="tooltip" data-text="R U R' U' R' F R2 U' R' U' R U R' F'"&gt;T-Perm&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;&lt;span class="tooltip" data-text="R U R' F' R U R' U' R' F R2 U' R' U'"&gt;J-Perm&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;&lt;span class="tooltip" data-text="F R U' R' U' R U R' F' R U R' U' R' F R F'"&gt;Y-Perm&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;&lt;span class="tooltip" data-text="R U' R' U' R U R' F' R U R' U' R' F R"&gt;Y-Perm variation&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;&lt;span class="tooltip" data-text="L U2' L' U2' L F' L' U' L U L F L2' U"&gt;R-Perm (Party-Algorithm)&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;A lot of setup moves: Intuitive&lt;/li&gt;
&lt;li&gt;A good memorization technique: &lt;a href="https://www.speedsolving.com/wiki/index.php/Classic_Pochmann"&gt;Old Pochmann&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;So now it was time for me to check the last point on this list. The memorization. After some research I found some pictures that are actually describing the procedure so simple, I didn't have to do any more research but practice.&lt;/p&gt;
&lt;p&gt;&lt;img src="https://makkusu.dev/blog/2022/03/first-successfull-3x3-blindsolve/pochmann-memo.webp" alt="Pochmann Memo Technique" /&gt;&lt;/p&gt;
&lt;p&gt;This is my own creation of the images that I found. Every corner and every edge has a letter assigned to it from A to X, fortunately you don't need to remember Y and Z (that would be too much, honestly &amp;lt;/irony&amp;gt;).&lt;/p&gt;
&lt;p&gt;But how does it work? A quick description of how to remember the edge pieces. Holding the cube as pictured above, I start by looking at piece &lt;em&gt;B/M&lt;/em&gt;, checking the &lt;em&gt;B&lt;/em&gt;-sided color of it. Let's say at this position is the &lt;em&gt;red/green&lt;/em&gt; piece. This has to go to location &lt;em&gt;F/L&lt;/em&gt;—more precisely, if location &lt;em&gt;B&lt;/em&gt; is &lt;em&gt;red&lt;/em&gt;, then &lt;em&gt;B&lt;/em&gt; has to be switched with &lt;em&gt;F&lt;/em&gt;. Now I would continue like this all the way through. What is currently in location &lt;em&gt;F&lt;/em&gt;, where does it need to go and where goes the next piece that is currently located in that position. I know, it sounds mind-bending but it is doable. Here's an example, sorting the letters by always only changing it with the first (top/left) position:&lt;/p&gt;
&lt;pre class="language-markup"&gt;&lt;code class="language-markup"&gt;Change: E/B       Change: B/C       Change: C/D       Change: D/F       Change: F/A       Done.
|---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|
| E | C | D |     | B | C | D |     | C | B | D |     | D | B | C |     | F | B | C |     | A | B | C |
|---|---|---| --&gt; |---|---|---| --&gt; |---|---|---| --&gt; |---|---|---| --&gt; |---|---|---| --&gt; |---|---|---|
| F | B | A |     | F | E | A |     | F | E | A |     | F | E | A |     | D | E | A |     | D | E | F |
|---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|     |---|---|---|&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The full path to remember to solve this would be &lt;em&gt;EBCDFA&lt;/em&gt;. Since we always use the top left box as a buffer location we don't need to remember what is in there at the beginning, so it becomes &lt;em&gt;BCDFA&lt;/em&gt;. The last switch will automatically solve the A piece anyway, so we can get rid of this as well. Only remember &lt;em&gt;BCDF&lt;/em&gt;. So change buffer with position B, then C, then D and finally F. Grid is solved. Solving the Rubik's Cube blindfolded follows the same idea. There are some more steps required but route to take is the same.&lt;/p&gt;
&lt;p&gt;Remembering the whole route how to solve all edges and all corners can be quite challenging but luckily there are systems to help with that. Using a 2-letter-memorization and building a short story out of it is the key for me. So for example, having a string of letters like &lt;em&gt;HPBRLA&lt;/em&gt; would become &lt;em&gt;HP-BR-LA&lt;/em&gt; would become &lt;em&gt;&lt;u&gt;&lt;strong&gt;H&lt;/strong&gt;&lt;/u&gt;arry &lt;u&gt;&lt;strong&gt;P&lt;/strong&gt;&lt;/u&gt;otter flies a &lt;u&gt;&lt;strong&gt;BR&lt;/strong&gt;&lt;/u&gt;oom above &lt;u&gt;&lt;strong&gt;L&lt;/strong&gt;&lt;/u&gt;os &lt;u&gt;&lt;strong&gt;A&lt;/strong&gt;&lt;/u&gt;ngeles&lt;/em&gt;. To remember a short story is a lot simpler than a cryptic string of random letters. Being able to put two letters into one word (like broom) helps a lot.&lt;/p&gt;
&lt;p&gt;With that being said, I've spent some days doing the whole memo thing and solving the cube with eyes open as I would with my eyes closed, after feeling confident enough I started doing some blind edge-only and corner-only solves. Partly successful, but boosting my confidence even more. It didn't matter to me if 2 or 3 pieces were unsolved when I finished—to me this was a success already. But then it finally happened!&lt;/p&gt;
&lt;p&gt;If you want to follow along, this is the scramble: &lt;code&gt;F L2 U2 L' D2 B2 L' F2 D2 R2 D2 B' L2 U' R F D' R2 D Rw2 Uw'&lt;/code&gt;&lt;/p&gt;
&lt;iframe width="560" height="315" id="video" src="https://www.youtube.com/embed/FDicNFKlGig?rel=0" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""&gt;&lt;/iframe&gt;
&lt;p&gt;That's it. I'm happy and satisfied. For now. See you when it is time to break my personal best time :P&lt;/p&gt;
</description></item><item><title>Japanese Furigana Script</title><pubDate>Mon, 13 Dec 2021 13:23:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2021/12/japanese-furigana-script/</guid><description>&lt;p&gt;While finalizing the current version of this website using 11ty, I took the time to implement a super small script to help me display &lt;em&gt;furigana&lt;/em&gt; for kanji. Furigana are small written hiragana on top of kanji. To keep it clean I only wanted to show the furigana when the respective kanji is hovered. The thought behind is being present with a &lt;em&gt;kanji-only&lt;/em&gt; mode at first and only seeing the helping &lt;em&gt;furigana&lt;/em&gt; when actually needed, might help while learning the language. I noticed that I'm always reading the furigana instead of the kanji whenever it is present, so I thought hiding it on the first sight would be useful.&lt;br /&gt;
Here is an example block of how it looks.&lt;/p&gt;
&lt;p class="jp"&gt;
    こんにちは。私[わたし]の名[な]前[まえ]はマックスです。お元[げん]気[き]ですか。
&lt;/p&gt;
&lt;p&gt;In case you're interested how it works, here is the code. A little description you can find below.&lt;/p&gt;
&lt;pre class="language-javascript"&gt;&lt;code class="language-javascript"&gt;&lt;span class="token keyword"&gt;class&lt;/span&gt; &lt;span class="token class-name"&gt;Furigana&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
  &lt;span class="token function"&gt;constructor&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token parameter"&gt;selectors &lt;span class="token operator"&gt;=&lt;/span&gt; &lt;span class="token punctuation"&gt;[&lt;/span&gt;&lt;span class="token punctuation"&gt;]&lt;/span&gt;&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
      &lt;span class="token keyword"&gt;this&lt;/span&gt;&lt;span class="token punctuation"&gt;.&lt;/span&gt;selectors &lt;span class="token operator"&gt;=&lt;/span&gt; selectors&lt;span class="token punctuation"&gt;;&lt;/span&gt;
      &lt;span class="token keyword"&gt;this&lt;/span&gt;&lt;span class="token punctuation"&gt;.&lt;/span&gt;regex &lt;span class="token operator"&gt;=&lt;/span&gt; &lt;span class="token regex"&gt;&lt;span class="token regex-delimiter"&gt;/&lt;/span&gt;&lt;span class="token regex-source language-regex"&gt;([\u4E00-\u9FAF\u3040-\u3096\u30A1-\u30FA\uFF66-\uFF9D\u31F0-\u31FF]{1})\[(.*?)\]&lt;/span&gt;&lt;span class="token regex-delimiter"&gt;/&lt;/span&gt;&lt;span class="token regex-flags"&gt;g&lt;/span&gt;&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;

      &lt;span class="token keyword"&gt;this&lt;/span&gt;&lt;span class="token punctuation"&gt;.&lt;/span&gt;selectors&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;forEach&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token parameter"&gt;selector&lt;/span&gt; &lt;span class="token operator"&gt;=&gt;&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
          &lt;span class="token keyword"&gt;let&lt;/span&gt; results &lt;span class="token operator"&gt;=&lt;/span&gt; document&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;querySelectorAll&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;selector&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;
          results&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;forEach&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token parameter"&gt;result&lt;/span&gt; &lt;span class="token operator"&gt;=&gt;&lt;/span&gt; &lt;span class="token punctuation"&gt;{&lt;/span&gt;
              result&lt;span class="token punctuation"&gt;.&lt;/span&gt;innerHTML &lt;span class="token operator"&gt;=&lt;/span&gt; result&lt;span class="token punctuation"&gt;.&lt;/span&gt;innerHTML&lt;span class="token punctuation"&gt;.&lt;/span&gt;&lt;span class="token function"&gt;replace&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token keyword"&gt;this&lt;/span&gt;&lt;span class="token punctuation"&gt;.&lt;/span&gt;regex&lt;span class="token punctuation"&gt;,&lt;/span&gt; &lt;span class="token string"&gt;"&amp;lt;ruby&gt;$1 &amp;lt;rp&gt;(&amp;lt;/rp&gt;&amp;lt;rt&gt;$2&amp;lt;/rt&gt;&amp;lt;rp&gt;)&amp;lt;/rp&gt;&amp;lt;/ruby&gt;"&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;
          &lt;span class="token punctuation"&gt;}&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;
      &lt;span class="token punctuation"&gt;}&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;
  &lt;span class="token punctuation"&gt;}&lt;/span&gt;
&lt;span class="token punctuation"&gt;}&lt;/span&gt;

&lt;span class="token keyword"&gt;new&lt;/span&gt; &lt;span class="token class-name"&gt;Furigana&lt;/span&gt;&lt;span class="token punctuation"&gt;(&lt;/span&gt;&lt;span class="token punctuation"&gt;[&lt;/span&gt;&lt;span class="token string"&gt;'.content'&lt;/span&gt;&lt;span class="token punctuation"&gt;]&lt;/span&gt;&lt;span class="token punctuation"&gt;)&lt;/span&gt;&lt;span class="token punctuation"&gt;;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;h3&gt;How it works&lt;/h3&gt;
&lt;p&gt;The class expects an array of element selectors. These DOM elements are then checked for kanji that are followed by brackets &lt;code&gt;[]&lt;/code&gt; and this will be replaced by &lt;code&gt;&amp;lt;ruby&amp;gt;Kanji &amp;lt;rp&amp;gt;(&amp;lt;/rp&amp;gt;&amp;lt;rt&amp;gt;Furigana&amp;lt;/rt&amp;gt;&amp;lt;rp&amp;gt;)&amp;lt;/rp&amp;gt;&amp;lt;/ruby&amp;gt;&lt;/code&gt;. The HTML ruby element suits best for this. Voilá, done.&lt;/p&gt;
</description></item><item><title>Using 11ty for the first time</title><pubDate>Tue, 7 Dec 2021 20:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2021/12/using-11ty-for-the-first-time/</guid><description>&lt;p&gt;I think one of the earliest versions of my website was back in 2009, that's already over 10 years ago. Holy... Since then a lot has changed and I have redesigned this page countless times. So many different designs, blog posts, tools and systems that I have used, it's crazy. One thing that never changed was the domain though—&lt;a href="http://myxotod.de/"&gt;myxotod.de&lt;/a&gt;. (update: oops, now this changed too)&lt;/p&gt;
&lt;p&gt;In the very beginning my website only consisted of static HTML files, no preprocessors, no logic code, nothing but HTML and CSS. As I continued to learn new languages and technology advanced I concidered using other tools that make my website more maintainable and more &lt;em&gt;fun&lt;/em&gt; to work with.&lt;/p&gt;
&lt;p&gt;For a very long time I have used &lt;a href="https://jekyllrb.com/"&gt;Jekyll&lt;/a&gt; as a static website creation tool or even built my sites bare bones without any other tools except SASS and maybe Coffeescript. Every now and then I even included some PHP. Now, for the first time, I'm using &lt;a href="https://11ty.dev/"&gt;11ty&lt;/a&gt; and it is super fun to play around with. Well actually it is not &lt;em&gt;really&lt;/em&gt; the first time using 11ty but at least it is the first use of it that you can actually see. This page has also countless ancestors before I got to this layout.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;Art is never finished, only abandoned.&lt;/p&gt;
&lt;h6&gt;Leonardo da Vinci&lt;/h6&gt;
&lt;/blockquote&gt;
&lt;p&gt;It feels like pulling out a very old book from the shelf and blowing away a big layer of dust into a distance. Finally a website again that actually delivers &lt;em&gt;content&lt;/em&gt; and triggers the urge for me to maintain it regularly. I'm excited to continue working with 11ty and improving this layout (maybe even some light/dark theming). Also creating some 11ty-plugins along the way would be really interesting. If this happens I will let you know on my &lt;a href="https://makkusu.dev/coding/"&gt;coding&lt;/a&gt; page. (this page is still in the planning phase at the time of writing this post)&lt;/p&gt;
&lt;p&gt;For now feel free to wander around and enjoy the depths of this personal website/blog. &#128526;✨&lt;/p&gt;
</description></item><item><title>Let's learn all the Kanji!!</title><pubDate>Mon, 6 Dec 2021 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/blog/2021/12/let-s-learn-all-the-kanji/</guid><description>&lt;p&gt;For the first time, since learning Japanese, I have spent a conciderable amount of time to study kanji. Especially recognition and writing. So far I'm mostly testing and using the app &lt;a href="https://play.google.com/store/apps/details?id=com.mindtwisted.kanjistudy&amp;amp;hl=de&amp;amp;gl=US"&gt;Japanese Kanji Study&lt;/a&gt; by Chase Colburn. It is a superb tool for studying so far, here is a list of kanji that I learned to recognize and write within about one week:&lt;/p&gt;
&lt;p class="jp jp--vertical"&gt;
    一ニ三四五&lt;br /&gt;
    六七ハ九十&lt;br /&gt;
    百千上下左&lt;br /&gt;
    右中大小月&lt;br /&gt;
    日年早木林&lt;br /&gt;
    山川土空田&lt;br /&gt;
    天生花草虫&lt;br /&gt;
    犬人名女男&lt;br /&gt;
    子目耳口手&lt;br /&gt;
    足見音力気
&lt;/p&gt;
&lt;p&gt;Before using this app I was only able to recognize a few kanji that I stumbled upon in my text books like &lt;span class="jp"&gt;私[わたし]&lt;/span&gt; and in terms of writing... I was not able to. Being able to write a set of kanji with correct stroke order and knowing the meaning and maybe even reading feels absolutely amazing. I can't wait to study more and get even better.&lt;/p&gt;
&lt;p&gt;When I started using this app I set the &amp;quot;study type&amp;quot; to &amp;quot;Japanese school grade levels&amp;quot; which delivers new kanji in a similar order how schools in Japan would introduce them to their students. I thought this would be a good way to start but since I also want to pass JLPT tests along the way I switched the setting to &amp;quot;JLPT levels&amp;quot;, which then started introducing relevant kanji for JLPT N5.&lt;/p&gt;
&lt;p&gt;This is no sponsored post, I genuinely like the app and can recommend it to all people studying Japanese/kanjis. So far I'm happy with the progress I made and I excited where I will be in about one year using this and many other apps/tools. I'll keep you updated.&lt;/p&gt;
</description></item><item><title>Conway's Game of Life</title><pubDate>Thu, 3 Jun 2021 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/conway-s-game-of-life/</guid><description></description></item><item><title>15 Puzzle</title><pubDate>Mon, 19 Apr 2021 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/15-puzzle/</guid><description></description></item><item><title>AI Learning (genetic algorithm)</title><pubDate>Sun, 22 Jul 2018 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/ai-learning-genetic-algorithm/</guid><description></description></item><item><title>Primrose Triangle</title><pubDate>Thu, 1 Oct 2015 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/primrose-triangle/</guid><description></description></item><item><title>Radial Range Slider</title><pubDate>Tue, 26 May 2015 00:00:00 GMT</pubDate><guid isPermaLink="false">https://makkusu.dev/coding/radial-range-slider/</guid><description></description></item></channel></rss>