<p align="center"> <a href="#"> <img width="400" src="public/logo.png" alt="genreact logo"/> </a> </p> <p align="center"> <img src="https://img.shields.io/npm/v/genreactai?style=for-the-badge"> <img src="https://img.shields.io/github/repo-size/rasperon/genreact?style=for-the-badge"> <img src="https://img.shields.io/npm/l/genreactai?style=for-the-badge"> <img src="https://img.shields.io/npm/dt/genreactai?style=for-the-badge"> <img src="https://img.shields.io/github/contributors/rasperon/genreact?style=for-the-badge"> <a href="https://discord.gg/W9rattDP7h" target="_blank"> <img alt="Discord" src="https://img.shields.io/badge/Join-Discord-7289d9?style=for-the-badge&logo=discord"> </a> <a href="https://rasperon.dev" target="_blank"> <img src="https://img.shields.io/badge/More-Rasperon.dev-ff0000?style=for-the-badge&logo=go" /> </a> </p>

⚛️ GENREACT

Your AI-Powered React Component Generator — Built for speed, control, and flexibility.

Powered by GENCREATE API and prompt chaining. Generate clean, production-ready components directly from CLI.

Create. Edit. Deploy. No fluff, just code.

---

🔗 Links

• 🌐 Website
• 📦 NPM
• 💬 Discord
• 🛠️ Docs
• 🧠 Powered by Gencreate

---

📦 Installation

npm install -g genreactai

---

⚙️ Usage (CLI)

genreact

EXAMPLE

<p align="center"> <a href="#"> <img src="public/example.gif" alt="example usage gif"/> </a> </p>

OUTPUT

EXAMPLE

<p align="center"> <a href="#"> <img src="public/output.png" alt="output"/> </a> </p>

Generates a fully typed, styled, and animated React component in your current folder.

---

🧪 Features

• 🔄 Gencreate-powered prompt chaining
• 🎨 Tailwind CSS + shadcn/ui support
• ⚛️ Functional & typed components
• 🧱 Atomic structure output (optional)
• 🛜 Offline capabilities (cached prompt templates)
• 🌍 Multi-language support (EN/TR)

---

🧠 Prompt Chain Feature

GenReact doesn’t just generate code — it understands your needs.

1. It comprehends what you're asking for.
2. It suggests the best component structure.
3. It includes CSS classes and interactivity.
4. It outputs everything into your file.

Without you needing to manually define styles, GenReact behaves like an AI-powered assistant that knows what it’s doing.

---

🔒 Roadmap

• [ ] UI-based component management (genreact-ui)
• [ ] Next.js and Astro compatibility mode
• [ ] Plugin system (e.g., auth, modal, etc.)
• [ ] Online component marketplace

---

🙌 Contributing

Every PR is appreciated. Our focus is on code quality, simplicity, and speed. Feel free to contribute by opening issues or submitting pull requests.

---

📞 Contact & Support

🌐 rasperon.dev
💬 Discord server

---

Made with ❤️‍🔥 by Rasperon C.

<p align="center"> <img src="https://readme-typing-svg.herokuapp.com?font=JetBrains+Mono&size=18&pause=1000&color=0FF7ED&center=true&vCenter=true&width=435&lines=Write+less+code.+Build+more+impact."> </p>