The goal of this project is to create a example of compound pattern usage and atomic design synthesis. And also best practices of custom hooks for event listeners.
yarn install
yarn dev
you can check the architecture design in components/atom/Clock.tsx
and you can check the synthesized component of Clock and Tooltip in components/molecules/ClockWithTooltip.tsx
I hope you enjoy this project
ps: you can check how to reuse css variables in components/atom/Clock.tsx via cva(like recipe grammar of vanilla-extract css)
- Why compound pattern is useful?
- Do we need to take this level of abstraction? Additionally, when does it need for us to design frontend projects
- is there any better way for component synthesis?
- type safety for compound pattern applied component
- how to make custom hooks more reusable?