🔭 #12: Islands Architecture engaging Micro Frontends, how to build stuff online (fast), and programmatic content migrations with the Storyblok CLI
I'm thinking a lot about Micro Frontend Architecture. I experienced how to build something new from the ground very fast. And I used the official Storyblok CLI for the first time (with great success!)
Hey,
I'm thinking a lot about a Micro Frontend Architecture at work: How to slice Micro Frontends? How to make sure Micro Frontends are independently deployable? How to share code between Micro Frontends?
Also, at work, a couple of colleagues and I worked on a new secret project for a week, and it was a fantastic experience.
For one of my freelancing projects, I use Storyblok (and Nuxt.js, a dream team 😉). Recently I had the chance to use the official CLI to do a content migration.
This is the 12th issue of my Recent Discoveries newsletter. If you don't want to miss the next issue, hit subscribe.
Micro Frontend Architecture
In the last couple of weeks, I worked on a PoC for a Micro Frontend Architecture for karriere.at. Because we want to combine server-side rendered PHP applications with interactive elements, ideally based on Vue components, I married the Micro Frontend concept with the Islands Architecture.
My main goals are:
Teams can work independently.
Projects are independently deployable (and testable).
Sharing UI components between (SPA and MPA) projects is painless.
The Module Federation approach seems pretty promising, but the more sophisticated the PoC gets, the more I struggle with rising complexity.
I hope I can write an in-depth article about this topic at some point. I'll keep you updated!
Looking for a fresh start?
I'm partnering with Vue Jobs. Find your next dream job and support this newsletter!
Building stuff (fast)
Last week, a couple of my karriere.at colleagues and I worked on a secret project to support Ukrainian refugees in finding jobs in Austria.
Apart from the good cause, what was incredibly motivating was to work under pressure circumventing all the typical professional things we think we need to do on regular projects.
Creating feature branches, code reviews before merging, strict commit guidelines, you name it. All of this, we ignored. Instead, we pushed directly into the main branch (aka trunk-based development). If I made a mistake while doing so, I quickly corrected it and pushed again—fast-paced iteration instead of striving for perfection.
Although we wrote a couple of tests (even more than for many other projects we typically work on), we somewhat neglected this aspect of fast-paced software development. On my side, for a large part, because for testing a couple of the project's features, a more sophisticated testing setup would've been necessary. So testing is absolutely something you need to invest in, but it pays great dividends for long-living projects. But also: if you have to get something off the ground very fast, you have to make compromises and focus on testing what really matters. We did that.
Another realization I had was, how awesome it is to work with a batteries-included (and opinionated) framework like Laravel. Unfortunately, I have the feeling we still lack something like that in the JavaScript world. I'm currently experimenting with Adonis.js, though. But more about this in a future article!
Official Storyblok CLI
I just used the official Storyblok CLI the first time to update the content of ~30 pages programmatically. Feels good not to have to rely on my hacky custom made solution anymore 😅
One of the features I was dearly missing when I started using Storyblok a couple of years ago was a CLI tool for schema and content migrations. So I built one myself. But it is not the most trivial thing to make. So I'm happy that Storyblok has released an official CLI tool since then.
Some days ago, I had the chance to use it for the first time, and it works flawlessly. I changed the content of ~30 pages programmatically by running a single command.
Suppose you have advanced needs for content management, like programmatic migrations: for a long time, those new fancy headless CMSes were not quite there. So I'm thrilled that Storyblok stepped up their game in that regard! With the official CLI, we can change hundreds or thousands of pages with a single command. And if something goes wrong, we can simply rollback. Awesome!
Sponsors
Storyblok is a headless CMS with a Visual Editor. They’re currently working on their V2 release! You can start using the V2 beta today!
Nuxt.js is a web framework for building modern apps & websites with Vue.