Mite/README.md

# Mite
> The tiniest framework that *mite* work

```
     /___\        ___ _
     )O.o(  |\/| o | |_   BE small
     \_^_/  |  | | | |_   be STRONG
      " "
```

Brainspace is limited, time is limited, ideas are abundant, so enter stage left: **Mite**

**Mite** is a tiny `import` ui library that was born out of a necessity to rift out prototypes fast, and complement existing HTML/CSS/JS knowledge. The boiler-plate of most conventional frameworks takes longer than actually getting the core MVP of the idea out there.

**Mite** provides an extendable one-and-done solutions from decorating components to building out single-page-applications -- pure-frontend, and core-web for the win!

With **Mite** it is just one file and go...

## Getting Started

### Key Features
- **Reactive Two-Way Data Binding**: Bind data to the DOM using `{ }` syntax, and Mite will automatically update the DOM when the data changes.
- **Directives**:
  - `m-if`: Conditionally show or hide elements based on a truthy/falsy expression.
  - `m-each`: Iterate over arrays to render lists dynamically.
- **Event Handling**: Bind events to methods using `@event` syntax (e.g., `@click`).
- **Lightweight**: Mite is a single class with no external dependencies, making it easy to integrate into any project.

## Usage

```html
    <div id="counter">
        <button @click="{count++}">{count}</button>
    </div>

    <script type="module">

        import Mite from './src/Mite.js';

        new Mite('#counter', {
            data: {count: 0},
        });

    </script>
```

### Options
- `selector`: A CSS selector (string) targets root DOM element (required).
- `opts`: An options object with properties:
  - `data` (Object): Reactive data for the app. Changes to `data` properties trigger DOM updates.
  - anything else you want, just a POJO


## Test

**WIP**

`bun test`

> Currently [Bun]() is used as the development runtime


## Support

Please open [an issue](https://github.com/n2geoff/mite/issues/new) for support.

## Contributing

Anyone is welcome to contribute, however, if you decide to get involved, please take a moment to review the [guidelines](CONTRIBUTING.md), they're minimalistic;)

## License

[MIT](LICENSE)

---
*Last updated: March 29, 2025*