Grills
Your own Gen UI platform. Create components or whole frontend with your fav LLM
Overview
GrillsYour Own Gen is an innovative UI platform designed to provide developers with unparalleled flexibility. Addressing the limitations of existing AI platforms, it goes beyond just Next.js, Tailwind, and ShadCN, ensuring that developers using various frameworks like Angular, Vue, and Svelte can also benefit. The platform emerges as a solution for indie developers and small teams, often overlooked due to the high costs associated with other AI UI builders. With a commitment to fitting seamlessly into existing projects, GrillsYour Own Gen aims to ease the workflow and enhance productivity without the burden of subscription fees.
This platform is still in its early stages, which means features are being actively developed and refined. Users can expect a robust set of functionalities designed to improve the development experience while retaining the freedom and control over their projects.
Features
-
BYOK (Bring Your Own Keys): Users can utilize their own API keys, allowing for budget-friendly customization and control.
-
Use Your Favorite LLMs: Compatible with all major language model providers such as OpenAI and Google, ensuring flexibility in tools.
-
Unstyled ShadCN UI: Generates clean, unstyled shadcn components that can be easily integrated into existing projects without hassle.
-
Copy & Paste into Prod: Streamlined generation process that enables developers to quickly copy and paste components directly into production with no additional overhead.
-
Live Preview: See the UI as it’s being built in real-time, eliminating the guesswork often associated with development.
-
Local Setup Instructions: Clear guidance on setting up the environment, including database configurations, making the onboarding process more manageable for new users.
-
Active Development: The platform is continuously evolving, with new features being added and adjusted based on user needs, promoting a dynamic development experience.
- Next.js
Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Tailwind
Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.
- Shadcn UI
Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
- Drizzle ORM
Drizzle ORM is a TypeScript ORM for SQL databases designed with maximum type safety in mind. It comes with a drizzle-kit CLI companion for automatic SQL migrations generation. Drizzle ORM is meant to be a library, not a framework. It stays as an opt-in solution all the time at any levels.
- UI Kits & Components
A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.
- Motion
Motion (formerly Framer Motion) is a production-ready animation library for React and JavaScript. It provides a simple declarative API for creating fluid animations, gestures, and transitions with excellent performance and accessibility.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
- Zod
Zod is a TypeScript-first schema declaration and validation library. It allows you to define schemas that can validate data at runtime while providing excellent TypeScript inference, making it perfect for API validation, form validation, and type-safe data handling.