Learning in public
Tags: webdev, learning, productivity
Published: 2022-02-06 20:44:02

Creating an app or a plugin for an existing software platform can be a great project to learn and improve our coding skills.

When following courses and tutorials by listening, watching, and even copying code, we usually follow a happy path to build something relatively simple. We risk an [illusion of competence](https://inspirationeducation.co.nz/study-tips/illusions-learning-may-robbing-children-success-school/) and fall into [tutorial hell](https://dev.to/davidmm1707/how-to-escape-from-tutorial-hell-and-never-come-back-bb6), which means overestimating our own achievements and missing out on gaining professional experience.

## Building something

[Moving past tutorials](https://dev.to/aspittel/moving-past-tutorials-a-course-on-problem-solving-for-programmers-3oa4), we should build something on our own, something that does not have a ready-made solution to look up, something that creates unexpected problems to solve. A small idea of our own, something that seems useful or interesting to us, a small personal project, also known as a "side project" because it is beside our regular job.

{% post https://dev.to/aspittel/moving-past-tutorials-a-course-on-problem-solving-for-programmers-3oa4 %}

### Creating apps or plugins to learn and show

Many side projects end up as unfinished ideas, and even if they don't, they're just some piece of code that you have written. Writing an app or a plugin to be released in an official app store sets a goal to achieve.

### A goal to achieve

To finish and release a plugin, we have to

* build something that's at least a little bit useful,
* understand the rules and requirements,
* meet the quality standards,
* have somebody else review and approve our code, and
* maintain our code to ensure compatibility with future software releases.

Then we also have a proof of our work for everyone to see. Wonder why you should trust my work? See for yourself! Still not convinced I did it on my own? Study my commit history, read my comments, follow my blog posts. I value privacy, but I have nothing to hide as a professional developer.

## My own learning path as a developer

### The basics

Long ago, after having done some hobby programming on home computers and learning the basic concepts of computing with a programming language called [BASIC](https://en.wikipedia.org/wiki/BASIC), I had some halfhearted attempts at learning [Assembly](https://en.wikipedia.org/wiki/Assembly_language) and [C](https://en.wikipedia.org/wiki/C_(programming_language)). I also wrote some shell scripts in [MS-DOS](https://en.wikipedia.org/wiki/MS-DOS), before Linux made it possible to use [Bash scripts](https://en.wikipedia.org/wiki/Bash_(Unix_shell)) on personal computers. 

I became fascinated by the emerging world wide web and started front-end development with [HTML](https://en.wikipedia.org/wiki/HTML) and [JavaScript](https://en.wikipedia.org/wiki/JavaScript). Adding [CSS](https://en.wikipedia.org/wiki/CSS), [Flash](https://macromedia.fandom.com/wiki/Macromedia_Flash), [ActionScript](https://en.wikipedia.org/wiki/ActionScript), [SQL](https://en.wikipedia.org/wiki/SQL), and [Perl](https://www.perl.org) I started building what we would now call full-stack web applications.

### Fullstack dev using PHP

[WordPress](https://wordpress.org) and [Magento](https://de.wikipedia.org/wiki/Magento) sparked my interest in [PHP](https://www.php.net). Later I focused on [Java](https://www.java.com/)-based e-commerce frameworks, [XSLT](https://en.wikipedia.org/wiki/XSLT)-based middleware, and [React](https://reactjs.org)-based front-end development for some years. As our smaller customers kept using WordPress and [Shopware](https://www.shopware.com), [I built plugins](https://www.ingo-steinke.com/#plugin-programmierung) to connect our software to both, which made me rediscover PHP and modern front-end development without the popular React framework.

Shopware is an open-source e-commerce platform built on top of the [Symfony](https://symfony.com) framework. Anyone can develop an extension (themes, plugins, apps) and hope to get it released on the official marketplace. Anyone can also watch all their developer tutorials for free. I decided to go one step further and enrol for a paid certification exam.

### Inspired by my own requirements

As a side project of my side projects, after switching from [VisualStudio Code](https://code.visualstudio.com) back to [PhpStorm](https://www.jetbrains.com/phpstorm/) as my default editor, I did not want to miss a colorful light theme that I had just discovered, but there was nothing like it yet, so I [started to build my own theme for PhpStorm](https://dev.to/ingosteinke/creating-a-cute-pink-light-theme-for-phpstorm-intellij-idea-54nb) (and all other JetBrains IDEA editors).

Despite being an unfinished copy of a VS Code theme, and despite the incomplete documentation and my lack of Kotlin experience, my plugin was approved and is now available as an [official theme, Cute Pink Light Theme](https://plugins.jetbrains.com/plugin/16721-cute-pink-light-theme), and has actually been downloaded by other users.

### Upcoming themes and plugins

Why not make a theme for [Shopware](https://www.shopware.com/) out of it? I'm not sure if that's original enough to get into the store (and I'm quite sure it would get rejected as a WordPress theme), but that would be an easy start to develop something again.

### API plugins

I have unfinished ideas for plugins measuring websites and shops to help improve performance and sustainability. A possible first step would be adding an automated analysis to the back-end, similar to [Google Site Kit](https://sitekit.withgoogle.com)'s PageSpeed / Lighthouse integration for WordPress, but with a more ecologic and [IndieWeb](https://indieweb.org) focus.

## Learning in public

[DEV](https://dev.to/) has inspired me to show my work and share my ideas without waiting for perfection. Open source is all about collaboration, even more so if we want to improve the way we work and how our products impact our society and environment.

So if you want to copy my idea to measure a site's sustainability, which is not that original in the first place, feel free to do so! I am open to collaboration and constructive criticism as well.

### Personal project roadmap

#### Front-end focus

[ingo-steinke.com](https://www.ingo-steinke.com/) is my portfolio website using [JAMStack](https://jamstack.org) and modern CSS (see [What's next in CSS](https://dev.to/ingosteinke/series/16136)). That's finished in a "version 1.0" way, but I have to keep the content up to date, and I would like to refactor my project, make it more modular and maintainable by using components, BEM class names, and automated testing.

#### Atomic design

[fractal-build-example](https://github.com/openmindculture/fractal-build-example) is a base to build reusable web components organized and tested in a design system, but currently rather a first proof of concept from the time when I was evaluating [fractal](https://fractal.build) as an alternative to [PatternLab](https://patternlab.io). I should update my example by building some more complex use cases like we would see in a real-world project, and maybe I could try [Codecept](https://codecept.io) as an alternative to [Cypress](https://www.cypress.io) here.

#### PHP-based frameworks

[open-mind-culture.org](https://github.com/openmindculture/open-mind-culture-org) is a WordPress blog, currently using my own [child-theme](https://github.com/openmindculture/wp-fasto-child-theme) and ready to use upcoming WordPress plugins.

I have a local demo shop for Shopware 6 development, and [IngoSDev6CertPrep](https://github.com/openmindculture/IngoSDev6CertPrep) is my current learning project.

#### The "MERN stack"

[bookstack-reading-list-app](https://github.com/openmindculture/bookstack-reading-list-app) is a project using JavaScript-based full-stack web development, see see [Building a Reading List Web App with Node, Preact, and Tailwind CSS](https://dev.to/ingosteinke/building-a-reading-list-web-app-with-node-preact-and-tailwind-css-44pa).

#### Work in progress

Writing helps me organize my ideas, explaining what I learned improves my understanding of stuff, and releasing unfinished work even offers the chance to have someone else point out mistakes and misconceptions.

Last but not least, publishing creates a public backup of my work. No need to rely on local files, remember my login to cloud storage and keep my notebooks in a safe place. I could let go of all of that and I'd only have to google my (nick)name(s) to rediscover my previous work.