This week I shipped the UIengine v2.0 🥳
Here’s what changed during the last six months after the release of v1.0.
💣 No more YAML – it’s JS all the way down
The biggest change for users is that the UIengine got rid of YAML and its use in the frontmatter of Markdown files.
Even though I still like YAML, the JavaScript community does not use it extensively and going with the pure JS approach feels more natural and intuitively.
The component markdown files often contained more YAML configuration code than markdown, which gave the whole frontmatter approach a clumsy feel.
Now documentation and configuration are split up into separate files (README.md and component.config.js or page.config.js) and reusing data is solved via requireing the shared files.
But what about all your existing component.md and page.md files?
Don’t sweat, the npx uiengine migrate command has you covered.
I also plan to add migrations for future breaking changes as well, as it makes upgrading pretty seemless.
🎨 Themes as a first-class citizen
My current freelancing project involved building a multi-brand platform and the UIengine helps us facilitate just that: The biggest change under the hood help implementing multiple themes, delivering the pattern library tooling you need for this job. Don’t have a need for multiple themes, white-label UIs or supporting different brands? That’s fine too, you won’t be bothered with any complexity and can use the UIengine just like you used too.
💁♀️ Noteworthy too
Some more things that are worth mentioning:
Windows compatibility has improved a lot – if you are a Windows user, please let me know in case you encounter any trouble. You are supposed to feel like a first-class citizen, too 😉
The recently added CSS Adapter extracts custom properties and displays the values, analoguous to the component properties. This is especially helpful when you are developing themes as you can see the differences easily.
The pen icon in the interface opens the displyed file directly in VS Code while development. In production this links the file in your repository, e.g. the GitHub or GitLab interface.
The React sample project also got updated to v2.0, so have a look at the source code in case you are curious or need some ideas to get started.
More of the recent changes can be found in the changelog.
👨🔬 What’s next?
The upcoming 2.x releases will feature a plugin API so that third-party addons can be integrated into the UI and core functionality. I am currently fleshing out the API working on UI plugins myself and will extend this for adding deeper integrations for core functionality once the basics are working.
Also, I think the fundamentals of the project have matured enough to open it up for contributions: The project is well tested and its structure should provide a good impression of where new functionality should go. If you are interested in helping develop and extend the UIengine let me know; I’d like to get more developers involved and make it even more polished and helpful.