First lecture at Hochschule Düsseldorf

I have just finished my first lecture as a guest lecturer at my former University in Düsseldorf, Germany. I can tell the Hochschule Düsseldorf has aged quite well. The new building complex close to the Autobahn A52 is really impressive and fits well to the modern skills students can learn here.

My lecture was a great experience as a former HSD student. More than 7 years ago, I learned a lot about user experience, usability and programming in general here. I always admired the small courses combined with hands-on projects I was able to work on as a student. For me, it was never a question to study at a classic university because personally I learn much better when doing things instead of talking about it theoretically. That is why I tried to keep that hands-on mentality in my lecture and integrated a practical exercise.

The topic we were dealing with was “Cross-Platfrom development with Electron.js” which is also a technology I am using in my recent project. We have covered the basics of cross-platform development and went on with highlighting advantages and disadvantages of it. After that, I gave an overview of some popular cross-platform frameworks available on the market (including Flutter and React Native). Then we dived into Electron by talking about general application architecture and concepts, benefits and downsides and core features like IPC. Finally I concluded the lecture with a demo and a live-coding session where everyone could try Electron himself or herself.

I really enjoyed to see the classroom from a different angle this time. Not only because I liked and I feel honored to share my knowledge in web development and technologies, but also because this time I will not be the one who needs to pass the exam. :-)

You can find the source code of the demo application and exercises on my GitHub repository.

The first demo is a super simplistic Electron application containing nothing more than the basic dependencies (okay, I have added TypeScript because it is awesome). The repository has two branches. The live-coding branch was used during the lecture to provide a live coding experience for the students. All students have accomplished the following tasks:

• Checkout the project and install all dependencies
• Create a first basic Electron app with a first Browser Window
• Open a basic local HTML page in said window
• Enable first security features (like context isolation for Node)
• Integrate communication between Renderer and Main thread via IPC
• Update the UI based on the IPC communication result

The master branch contains the final application including the steps above. It can be seen as the “solution” branch.

After the practical demo I had the time to present a more sophisticated demo application: The Awesome Music Player (AMP). It is a little MP3 player based on Electron which I just crafted two days before the lecture. I was uncertain about the level of complexity required to keep the students interested but not overwhelm them.

Just while building this demo I realized I added too much concepts and dependencies that do not directly belong to Electron. That was the point where I decided to keep it easy and go with the “basic” demo I have written about before. Nevertheless, I wanted to show it and at least provide a quick insight in what is possible with Electron when combined with frameworks like React or packages like Electron-Forge.

If you are interested, you can also find the project on Github. Since it was created within a few hours, do not expect too much here.

It was fantastic to share my knowledge with the next generation of web developers that will graduate at the Hochschule Düsseldorf. Besides from the fact that the short-term preparation of the lecture came out quite stressful, I am looking forward to doing it again at some point. Also because it is a welcome change from everyday project work.

Hope to see you soon, Hochschule Düsseldorf!