UfukCemDELICE / EpiX

Your browser-native frontend framework with JSX syntax and built-in AI copilot.

EpiX

Your browser-native frontend framework with JSX syntax and built-in AI copilot.

---

🔭 Vision

Imagine a frontend framework that:

• Uses native Web Components under the hood
• Supports JSX out of the box, without React
• Delivers true encapsulation via Shadow DOM
• Is blazing fast and bundle-size minimal
• Can generate code from natural language prompts
• Can translate UI designs into working JSX components
• Works seamlessly with Vite, ES modules, and modern tooling

EpiX aims to be both a framework and an AI-assisted frontend development agent, accelerating how developers build UI from prompt → code → deploy.

---

🧱 Core Architecture

EpiX is built on 3 core pillars:

1. Native-first Rendering

   • Web Components with Shadow DOM
   • JSX via nano-jsx (zero React)
   • No virtual DOM overhead

2. Reactive State (Signals)

   • Fine-grained state management using a minimal reactive core
   • Declarative updates with zero runtime abstraction

3. AI-Assisted Code Generation (Planned)

   • Natural Language → JSX components
   • Figma / Image / HTML → Web Components
   • Realtime coding assistance in the browser or IDE

---

🚀 Goals

• ⛓️ Zero framework lock-in
• ⚡ Ultra-fast performance
• 🧠 Built-in AI copilots for real-time UI generation
• 🧩 Easily composable component model
• ✨ Developer experience with modern build tools (Vite, ESBuild)

---

📐 Example

import { Component, h } from 'nano-jsx';
import { signal } from './core/signal.js';

const count = signal(0);

export class Counter extends Component {
  render() {
    return (
      <div>
        <p>Count: {count.get()}</p>
        <button onclick={() => count.set(count.get() + 1)}>+1</button>
      </div>
    );
  }
}

🛣️ Roadmap

Phase	Feature
✅ Core setup	Web Components + JSX + Vite
🔄 Auto reactivity	Signals with automatic rendering
🧭 Router	Minimal SPA router
🛠 CLI Tool	create-epix-app starter generator
🤖 AI Agent	Prompt to JSX component generation
🎨 Design2Code	Translate design files into JSX
🧩 IDE Plugin	Code suggestions, highlighting
📘 Docs Site	Live playground + reference

---

🧠 Why EpiX?

Modern frameworks abstract away the browser and replace it with layers of indirection.
EpiX flips that approach — giving you the bare metal control of Web Components with the developer comfort of JSX.

EpiX provides:

• ✅ Direct access to browser-native APIs
• 🚫 No need for virtual DOM or diffing
• 🔒 Shadow DOM isolation by default
• 🤖 AI-powered code generation on the horizon
• ⚡ A modern, minimalistic, and fast UI development experience

With AI embedded into the development loop, EpiX is not just a framework.
It’s your frontend copilot.

---

📎 License

MIT © 2025 Ufuk Cem Delice
Made with ❤️ to build faster, lighter, and smarter frontends.