ZAR COMPONENTS: Atomic Component Library

A minimalistic component library that empowers developers to build dynamic UI components using native web elements — with data that can arrive at any time from the backend.

✨ Overview

This library is built on the principles of Atomic Design, focusing on simplicity and scalability. Instead of relying on complex JavaScript frameworks like Backbone or Angular, it uses the power of native web technologies (Web Components, HTML, CSS, etc.) to render and update components dynamically.

💡 Key Features

• Dynamic Data Handling
  Components can receive and update data at any time from backend sources.

• Atomic Design Philosophy
  Organize your UI in a structured way using atoms, molecules, organisms, and beyond.

• No Framework Dependency
  No React, Vue, or heavy JS frameworks — just native browser capabilities.

• Composable & Maintainable
  Easily compose larger UIs with reusable, well-scoped components.

• Simple State Management
  State is part of the base component on ZAR project, which can be shared by DATA elements or ATTRIBUTES. DATA is a special html element that enables any backend to send information that the browser would use for any computations. ATTRIBUTES are part of any html element however this can change on real time , easy to debug, and can be tracked or redraw.

📦 Installation

npm i zar-components