Originally I shared this post to Syndicode blog.
There is always a dilemma on choosing an appropriate design solution. Your product should be visually appealing and engaging, but not very complicated to develop. Who wants to put years into developing a new style for a website these days?... That is why the community often comes up with some ready-made solutions to simplify your life. Today I'm going to share with you a new tool for developers and designers I've found! It is created to build and document websites and apps! UIengine is a workbench for UI-driven development.
In a nutshell, UIengine is a static site generator that can be used in standalone mode or integrated into your build process. It requires at least Node.js 8.11.
How it works?
UIengine consumes the files and structure of your project and generates the documentation based on this. In development mode, the output is regenerated on file change and synced to the browser. This provides you with a development environment for creating the components, prototyping and writing the docs.
Main features of UIengine
- Because UIengine has various templating engines integrated via adapters, it's templating agnostic. And you can integrate your custom templates too.
- UIengine provides you with the prototyping environment to build your UI without the need for an existing backend/API. Render your templates and components with mock data.
- Best practice approach: The tool guides you towards best practices like the component folder pattern, the modlet workflow (which promotes building each of your components as their own mini-apps) and by proposing a separation of data and template/component.
- The documents are generated from the code of your application.
- Flexible integrations for templating engines and markdown parcing/rendering lets you configure everything according to your needs.
- UIengine provide the coverage for new pattern libraries, transition your process and refactor your existing UI into modular components.
p.s. compare it with Cuttlebelle, another static site generator that uses React.
There are a lot of people who love both JS and UX/CSS. If we stop labeling people just as “JS developers” or “UX developers”, we can achieve a ceasefire in the current “JS vs. CSS” war and achieve a mutually benefiting peace.