Complete Components is an open-source project that leverages AI to help developers quickly build and integrate HTML components and code with Supabase and Tailwind CSS.
- AI-assisted Component Generation: Utilize AI to generate HTML components tailored to your project's needs, saving you time and effort.
-
- Supabase Integration: Seamlessly integrate your components with Supabase, a modern and powerful backend-as-a-service solution. Uses RAG to improve the AI's coding understanding and implementation of supabase-js and reduce hallucinations
-
- Tailwind CSS Support: Leverage the utility-first CSS framework, Tailwind CSS, to rapidly style your components with a consistent design system.
- Node - I use v20.10.0
- Clone the repository:
git https://github.com/gSUz92nc/Complete-Components.git- Navigate to the project directory:
cd complete-components- Install the dependencies:
npm install- Setup env.local:
Create a file called
.env.localand include these with your own values
PUBLIC_SUPABASE_URL=
PUBLIC_SUPABASE_ANON_KEY=
ANTHROPIC_API_KEY=
PUBLIC_URL=http://localhost:5173
SUPABASE_SERVICE_KEY=
BRIGHT_DATA_PASS=
BRIGHT_DATA_USER=- Start the development server:
npm run dev- Open your browser and visit
http://localhost:5173.
Complete Components is released under the MIT License.
I'm useless at github so if you would like to contribute (warning everything is a mess since I started late) I'll try my best to incorparate your changes.
I couldn't have done this without the amazing tooling provided by Supabase, TailwindCSS, Anthropic, SvelteKit and more.