<div align="center">
# โก TidyFactor HTMX `v1.2.0`
### Server-Driven Hypermedia Interactivity & Contextual Decision Engine
**The official hypermedia interaction track within the TidyFactor Architecture Ecosystem.**
[](https://www.npmjs.com/package/@tidyfactor/htmx)
[](LICENSE)
[](README.ar.md)
[](#-three-lifecycle-modes)
[๐ Quick Start](#-quick-start) โข [โก 10 Commands](#-command-set) โข [๐๏ธ Ecosystem](#%EF%B8%8F-tidyfactor-ecosystem-architecture) โข [๐ ุจุงูุนุฑุจูุฉ](README.ar.md)
<br/><br/>
<p align="center">
<img src="assets/hero-banner.png" alt="TidyFactor HTMX Hero Banner" width="100%" />
</p>
</div>
---
This is a **layer, not a full stack**. It owns how fragments get
requested, swapped, validated, and made navigable โ not backend
architecture or data. It pairs with `tidyfactor-php` or
`tidyfactor-php-micro` (or any other server that can render HTML),
rather than replacing them.
## Three lifecycle modes
- **Init** โ add the htmx layer to a project (new or existing backend).
- **Convert** โ replace ad hoc `fetch()`/full-page-reload interactivity
with htmx.
- **Improve** โ audit and fix an existing htmx implementation.
## Command set
`init` ยท `assets` ยท `fragments` ยท `swap` ยท `triggers` ยท `forms` ยท
`indicators` ยท `history` ยท `modules` ยท `i18n` โ see `SKILL.md` for full
sequencing and each command's reference file under
`references/commands/`.
## Related skills
Part of the TidyFactor skill library โ see `tidyfactor-html` (no
backend), `tidyfactor-php` (vanilla backend), `tidyfactor-php-micro`
(opinionated Flight+Medoo+Plates backend), and the planned
`tidyfactor-js` / `tidyfactor-js-micro` tracks.
## Developer
Built and maintained by **alwkala** โ github.com/alwkala
## License
Licensed under the Apache License 2.0.
---
## ๐ Installation & Quick Start
Choose your preferred installation method:
### Option A: Via TidyFactor CLI (Recommended)
Install directly using the official ecosystem package runner into your active workspace:
```bash
npx @tidyfactor/cli add htmx
```
*Or if you have the CLI installed globally (`npm i -g @tidyfactor/cli`):*
```bash
tidyfactor add htmx
```
### Option B: Via Open Agent Skills Ecosystem (skills.sh / Vercel Labs)
Install using the universal multi-agent standard across all supported IDEs (Cursor, Antigravity, Claude Code, Windsurf, Trae, Codex):
```bash
npx skills add tidyfactor/htmx
```
### Option C: Standalone Zero-Dependency Runner (NPM Direct)
Run the dedicated skill installer directly with automatic cache invalidation:
```bash
npx @tidyfactor/htmx@latest
```
---
## ๐๏ธ TidyFactor Ecosystem Architecture
**TidyFactor** is a modular web architecture and AI coding agent skill ecosystem built on clear separation of concerns across the product lifecycle:
```
TidyFactor Organization (github.com/TidyFactor)
โ
โโโ Design Skills
โ โโโ Cinematic โ Experience / "Wow" (Apple ร Cartier Scroll-Driven Landing Pages)
โ โโโ Design โ Prototype / "Build" (Code-Native UI Design Engine & Figma Alternative)
โ โโโ Styler โ Production / "Ship" (Framework Styler & RTL Polish Engine)
โ
โโโ Development Skills
โ โโโ HTML โ Content & Static (Semantic SEO & Static Platform Starter)
โ โโโ HTMX โ Hypermedia (Server-Driven Micro-Interactions)
โ โโโ JS โ Vanilla SPA (Framework-Free Reactive ES Modules)
โ โโโ PHP โ Server-Rendered (Modern PHP 8.x Component UI & Architecture)
โ โโโ Next โ Multi-Tenant SaaS (Next.js 16, React 19, Supabase RLS & Dev-Perf)
โ
โโโ Growth Skills
โโโ Marketing โ Growth / Revenue (Direct Response, Pillar SEO & Content Lifecycles)
```
### ๐ Frontend Triad
```
TidyFactor
โ
โโโโโโโโโโโผโโโโโโโโโโ
โ โ โ
Cinematic Design Styler
โ โ โ
Experience Prototype Production
โ โ โ
"Wow" "Build" "Ship"
```
### ๐ฆ Community Package & Skill Parity
| Track | Category | GitHub Repository | Agent Skill | NPM Package |
| :--- | :--- | :--- | :--- | :--- |
| **Cinematic** | Design | [`TidyFactor/Cinematic`](https://github.com/TidyFactor/Cinematic) | `tidyfactor-cinematic` | [`@tidyfactor/cinematic`](https://www.npmjs.com/package/@tidyfactor/cinematic) |
| **Design** | Design | [`TidyFactor/Design`](https://github.com/TidyFactor/Design) | `tidyfactor-design` | [`@tidyfactor/design`](https://www.npmjs.com/package/@tidyfactor/design) |
| **Styler** | Design | [`TidyFactor/Styler`](https://github.com/TidyFactor/Styler) | `tidyfactor-styler` | [`@tidyfactor/styler`](https://www.npmjs.com/package/@tidyfactor/styler) |
| **Next** | Development | [`TidyFactor/Next`](https://github.com/TidyFactor/Next) | `tidyfactor-next` | [`@tidyfactor/next`](https://www.npmjs.com/package/@tidyfactor/next) |
| **HTML** | Development | [`TidyFactor/HTML`](https://github.com/TidyFactor/HTML) | `tidyfactor-html` | [`@tidyfactor/html`](https://www.npmjs.com/package/@tidyfactor/html) |
| **HTMX** | Development | [`TidyFactor/HTMX`](https://github.com/TidyFactor/HTMX) | `tidyfactor-htmx` | [`@tidyfactor/htmx`](https://www.npmjs.com/package/@tidyfactor/htmx) |
| **JS** | Development | [`TidyFactor/JS`](https://github.com/TidyFactor/JS) | `tidyfactor-js` | [`@tidyfactor/js`](https://www.npmjs.com/package/@tidyfactor/js) |
| **PHP** | Development | [`TidyFactor/PHP`](https://github.com/TidyFactor/PHP) | `tidyfactor-php` | [`@tidyfactor/php`](https://www.npmjs.com/package/@tidyfactor/php) |
| **Marketing** | Growth | [`TidyFactor/Marketing`](https://github.com/TidyFactor/Marketing) | `tidyfactor-marketing` | [`@tidyfactor/marketing`](https://www.npmjs.com/package/@tidyfactor/marketing) |
---
## ๐จโ๐ป Organization & Support
- ๐ **Official Website:** [https://tidyfactor.com/](https://tidyfactor.com/)
- ๐ **Official Documentation:** [https://tidyfactor.com/documentation](https://tidyfactor.com/documentation)
- ๐ค **Official Partner Website:** [Alwkala Digital Agency](https://alwkala.com/)
- ๐ **GitHub Organization:** [github.com/TidyFactor](https://github.com/TidyFactor)
- ๐ง **Business Inquiries:** [hello@tidyfactor.com](mailto:hello@tidyfactor.com)
- ๐ฑ **WhatsApp:** [+20 101 665 6899](https://wa.me/201016656899)
- ๐ **Phone:** +20 101 665 6899
- ๐ **Location:** Cairo, Egypt
---
## ๐ License
Licensed under the **Apache License 2.0**. Copyright (c) 2026 [TidyFactor](https://tidyfactor.com) & [Alwkala](https://alwkala.com).