https://github.com/302ai/302_coder_generator
π»π€ 302 AI Web Page Generator 2.0! πβ¨
https://github.com/302ai/302_coder_generator
Last synced: about 2 months ago
JSON representation
π»π€ 302 AI Web Page Generator 2.0! πβ¨
- Host: GitHub
- URL: https://github.com/302ai/302_coder_generator
- Owner: 302ai
- License: agpl-3.0
- Created: 2024-10-29T08:49:58.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-01-03T06:14:54.000Z (5 months ago)
- Last Synced: 2025-03-28T13:12:27.919Z (2 months ago)
- Language: TypeScript
- Homepage: https://302.ai/tools/coder/
- Size: 6.37 MB
- Stars: 34
- Watchers: 1
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
#
π» AI Web Page Generator 2.0 πβ¨
The AI Web Page Generator 2.0 can generate high-quality front-end HTML files through the AI large model by simply using natural language to describe the content of the web page. It supports the use of shadcn/ui.
Open-source version of the [AI Web Page Generator 2.0](https://302.ai/en/tools/coder/) from [302.AI](https://302.ai/en/).
You can directly log in to 302.AI for a zero-code, zero-configuration online experience.
Alternatively, customize this project to suit your needs, integrate 302.AI's API KEY, and deploy it yourself.
## Interface Preview
Generate web pages according to users' needs. The left column shows the code of the web page, and the right column shows the preview image of the web page.
## Project Features
### π€ Intelligent Code Generation
Automatically generate code according to your needs.
### βοΈ Flexible Editing
You can adjust and modify the code content at any time during the generation process.
### π¨ Flexible UI Selection
It supports the shadcn/ui component library to quickly create an aesthetically pleasing interface.
### π 3D Visualization
It supports three.js, enabling you to easily achieve 3D visualization functions.
### π οΈ Prompt Optimization
Optimize the prompts to make the content generated by AI more accurate.
### πΌοΈ Image Assistance
It supports uploading design drawings and allows AI to generate corresponding code based on the images.
### π¬ Multi-round Interaction
It supports continuous conversations and continuously adjusts code generation according to feedback.
### π Code Reference
You can reference the generated code snippets and ask AI to make corresponding modifications.
### π€Convenient Sharing
Easily share the generated code so that more people can appreciate your work.
### π Eye-friendly Dark Mode
Provide a dark mode to take care of your eye health.
### π Multi-language Support
- Chinese Interface
- English Interface
- Japanese Interface
With AI Code Generator 2.0, anyone can become a code creator! ππ» Let's explore the world of AI-driven code together! ππ
## π© Future Update Plans
- [ ] The simplicity of the code is improved
- [ ] The expansion of diverse templates
- [ ] The newly added function of generating dynamic content
## Tech Stack
- Next.js 14
- Tailwind CSS
- Shadcn UI
- Sandpack
- Vecel AI SDK
## Development & Deployment
1. Clone the project `git clone https://github.com/302ai/302_coder_generator`
2. Install dependencies `pnpm install`
3. Configure 302's API KEY as per .env.example
4. Run the project `pnpm dev`
5. Build and deploy `docker build -t coder-generator . && docker run -p 3000:3000 coder-generator`
## β¨ About 302.AI β¨
[302.AI](https://302.ai) is an enterprise-oriented AI application platform that offers pay-as-you-go services, ready-to-use solutions, and an open-source ecosystem.β¨
1. π§ Comprehensive AI capabilities: Incorporates the latest in language, image, audio, and video models from leading AI brands.
2. π Advanced application development: We build genuine AI products, not just simple chatbots.
3. π° No monthly fees: All features are pay-per-use, fully accessible, ensuring low entry barriers with high potential.
4. π Powerful admin dashboard: Designed for teams and SMEs - managed by one, used by many.
5. π API access for all AI features: All tools are open-source and customizable (in progress).
6. π‘ Powerful development team: Launching 2-3 new applications weekly with daily product updates. Interested developers are welcome to contact us.