Design System using tailwind and helix in ClojureScript.
A simple way to develop a user interface with a consistent user experience, without the need to clutter cljs code with CSS.
"mockingbird" is for everyone!
The name is a reference to the book To Kill a Mockingbird by Harper Lee. The idea is that the design system is a "mockingbird" that sings the same song everywhere.
It's impossible to talk about "mockingbird" without remembering the song Mockingbird by Eminem with his daughter Hailie Jade. The song is a declaration of love from a father to his daughter.
mockingbird is a declaration of love for all developers (frontend will never be easy for backend developers).
Mockingbird offers a set of reusable components and utilities that increases speed and beauty on your UI development. By integrating Tailwind, Helix and ReFx, Mockingbird combines functional programming, a powerful component model together creating a fast and lightweight design system. This allows your team (or simply yourself) to focus on building robust, reactive interfaces without getting bogged down in styling and local state management concerns.
Prerequisites
Before you begin, ensure you have the following installed:
- Clojure: Follow the Clojure Installation guide to set up your environment.
- Node.js: Required for managing dependencies and building your project. Download it from here.
-
Set up your project: Start by creating a new ClojureScript project, or use an existing one.
-
Install node dependencies with a simple command:
npm i- configure your shadow cljs:
for better understanding, follow the offcial guide
;; TODO
And you are now done, you can clone and build this repo in order to see some examples of good usage of our dear Mockingbird. You can read more here.
Mockingbird is open-source, and contributions are welcome! If you have ideas for new features, improvements, or bug fixes, feel free to open an issue or submit a pull request.