🚀 EraHTML by VYNECT™

EraHTML is the framework of the future—a revolutionary approach to building web applications that combines the simplicity of pure HTML with the power of reactivity, AI readiness, and ultra-light performance.

---

🌐 Why EraHTML?

The web has become bloated, slow, and complex. EraHTML brings it back to:

✅ Speed: Zero JavaScript frameworks, ultra-fast static rendering.
✅ Simplicity: Write pure, readable HTML with intelligent attributes.
✅ AI-First Design: Built for human and AI co-creation.
✅ Reactivity Without Complexity: Minimalistic reactive behaviors without heavy libraries.

---

💡 Core Concepts

• HTML remains pure: Tags like <div>, <span>, <button> are untouched.
• Styles are attributes: padding=10, bg=blue-500, border-solid=1.
• Classes are attribute names: e.g., text-strong maps to .sty definitions.
• Reusable .sty file: Defines global, reusable styles.
• File-based routing: controllers/index.html becomes / route.
• Minimal reactivity: No runtime JS frameworks needed.
• AI-readable and AI-writable: Every line is clear for machine learning generation.

---

📁 File Structure

public/
controllers/
  index.html
  about.html
styles.sty

---

✏️ Example 1 — Basic Page

<document title="Home" sty="main">
  <section p=4 bg=gray-100>
    <h1 show=title text-strong />
    <button name=primary-btn onclick=dispatch('about.html')>
      Go to About
    </button>
  </section>
</document>

styles.sty Example:

text-strong: font-weight=bold; font-size=24;
bg-primary: background-color=#0055ff; color=white;
botao-primario:primary-btn: border-radius=6; padding=10;

---

✏️ Example 2 — Direct Inline Styling

<div padding=10 padding-top=2 border-solid=1 bg=red-100>
  Inline styled box
</div>

Result after compilation:

<div style="padding:10px; padding-top:2px; border:1px solid; background-color:#fdd">
  Inline styled box
</div>

---

✏️ Example 3 — Reactivity

<div show=username text-strong />

The value of username is injected at runtime automatically without JavaScript boilerplate.

---

✏️ Example 4 — AI-Ready Design

EraHTML's syntax is designed so that AI models can generate code like this:

<section p=5 bg=white>
  <h2 text-title show=pageTitle />
  <button onclick=dispatch('contact.html')>
    Contact Us
  </button>
</section>

AI can:

• Suggest layouts.
• Autocomplete styles.
• Generate components with no need for deep front-end knowledge.

---

🚀 The Future is Here

With EraHTML, you can:

• Build faster.
• Deploy lighter.
• Automate design and coding with AI support.
• Forget frameworks that go obsolete every two years.

---

📄 License

EraHTML is commercial software licensed by VYNECT™.

For licensing, visit: vynect.com/erahtml

---

🌍 About VYNECT™

VYNECT™ creates next-generation technologies for automation, AI, and digital innovation.

Learn more: vynect.com

---

🚀 Documentation coming soon at: vynect.com/erahtml