Spaces:
Sleeping
Sleeping
Create app.py
Browse files
app.py
ADDED
|
@@ -0,0 +1,146 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
import streamlit as st
|
| 2 |
+
from transformers import AutoTokenizer, AutoModelForCausalLM
|
| 3 |
+
import torch
|
| 4 |
+
import json
|
| 5 |
+
from pathlib import Path
|
| 6 |
+
import re
|
| 7 |
+
|
| 8 |
+
class WebsiteGenerator:
|
| 9 |
+
def __init__(self):
|
| 10 |
+
# Initialize the model and tokenizer
|
| 11 |
+
# Using CodeLlama as it's specifically trained for code generation
|
| 12 |
+
self.model_name = "codellama/CodeLlama-34b-Instruct-hf"
|
| 13 |
+
self.tokenizer = AutoTokenizer.from_pretrained(self.model_name)
|
| 14 |
+
self.model = AutoModelForCausalLM.from_pretrained(
|
| 15 |
+
self.model_name,
|
| 16 |
+
torch_dtype=torch.float16,
|
| 17 |
+
device_map="auto"
|
| 18 |
+
)
|
| 19 |
+
|
| 20 |
+
# Template snippets for common components
|
| 21 |
+
self.templates = {
|
| 22 |
+
"base": Path("templates/base.html").read_text(),
|
| 23 |
+
"navbar": Path("templates/navbar.html").read_text(),
|
| 24 |
+
"footer": Path("templates/footer.html").read_text()
|
| 25 |
+
}
|
| 26 |
+
|
| 27 |
+
def generate_code(self, description, component_type):
|
| 28 |
+
# Construct prompt based on component type
|
| 29 |
+
prompt = self._construct_prompt(description, component_type)
|
| 30 |
+
|
| 31 |
+
# Generate code using the model
|
| 32 |
+
inputs = self.tokenizer(prompt, return_tensors="pt").to(self.model.device)
|
| 33 |
+
outputs = self.model.generate(
|
| 34 |
+
inputs.input_ids,
|
| 35 |
+
max_length=2048,
|
| 36 |
+
temperature=0.7,
|
| 37 |
+
top_p=0.95,
|
| 38 |
+
do_sample=True
|
| 39 |
+
)
|
| 40 |
+
|
| 41 |
+
generated_code = self.tokenizer.decode(outputs[0], skip_special_tokens=True)
|
| 42 |
+
return self._clean_generated_code(generated_code)
|
| 43 |
+
|
| 44 |
+
def _construct_prompt(self, description, component_type):
|
| 45 |
+
prompts = {
|
| 46 |
+
"frontend": f"""
|
| 47 |
+
Create a modern, responsive website frontend based on this description:
|
| 48 |
+
{description}
|
| 49 |
+
|
| 50 |
+
Generate HTML, CSS, and JavaScript code that:
|
| 51 |
+
1. Uses modern best practices
|
| 52 |
+
2. Is mobile-responsive
|
| 53 |
+
3. Follows accessibility guidelines
|
| 54 |
+
4. Includes proper semantic HTML
|
| 55 |
+
|
| 56 |
+
Response should include complete code:
|
| 57 |
+
""",
|
| 58 |
+
"backend": f"""
|
| 59 |
+
Create a Python FastAPI backend based on this description:
|
| 60 |
+
{description}
|
| 61 |
+
|
| 62 |
+
Generate code that includes:
|
| 63 |
+
1. API endpoints
|
| 64 |
+
2. Database models
|
| 65 |
+
3. Authentication if needed
|
| 66 |
+
4. Basic error handling
|
| 67 |
+
|
| 68 |
+
Response should include complete code:
|
| 69 |
+
"""
|
| 70 |
+
}
|
| 71 |
+
return prompts.get(component_type, "")
|
| 72 |
+
|
| 73 |
+
def _clean_generated_code(self, code):
|
| 74 |
+
# Remove any potential unsafe or invalid code
|
| 75 |
+
code = re.sub(r'<script.*?>(.*?)</script>', '', code, flags=re.DOTALL)
|
| 76 |
+
return code
|
| 77 |
+
|
| 78 |
+
def main():
|
| 79 |
+
st.set_page_config(page_title="AI Website Generator", layout="wide")
|
| 80 |
+
|
| 81 |
+
st.title("AI Website Generator")
|
| 82 |
+
st.write("Generate complete website code using natural language descriptions")
|
| 83 |
+
|
| 84 |
+
# Initialize generator
|
| 85 |
+
generator = WebsiteGenerator()
|
| 86 |
+
|
| 87 |
+
# Project configuration
|
| 88 |
+
with st.expander("Project Configuration"):
|
| 89 |
+
project_name = st.text_input("Project Name")
|
| 90 |
+
framework = st.selectbox(
|
| 91 |
+
"Frontend Framework",
|
| 92 |
+
["React", "Vue", "Plain HTML/CSS/JS"]
|
| 93 |
+
)
|
| 94 |
+
backend = st.selectbox(
|
| 95 |
+
"Backend Framework",
|
| 96 |
+
["FastAPI", "Django", "Flask"]
|
| 97 |
+
)
|
| 98 |
+
database = st.selectbox(
|
| 99 |
+
"Database",
|
| 100 |
+
["PostgreSQL", "MongoDB", "SQLite"]
|
| 101 |
+
)
|
| 102 |
+
|
| 103 |
+
# Website description
|
| 104 |
+
description = st.text_area(
|
| 105 |
+
"Describe your website",
|
| 106 |
+
height=200,
|
| 107 |
+
placeholder="Describe the website you want to create in detail..."
|
| 108 |
+
)
|
| 109 |
+
|
| 110 |
+
# Generate code button
|
| 111 |
+
if st.button("Generate Website Code"):
|
| 112 |
+
with st.spinner("Generating code..."):
|
| 113 |
+
# Generate frontend code
|
| 114 |
+
frontend_code = generator.generate_code(description, "frontend")
|
| 115 |
+
|
| 116 |
+
# Generate backend code
|
| 117 |
+
backend_code = generator.generate_code(description, "backend")
|
| 118 |
+
|
| 119 |
+
# Display generated code
|
| 120 |
+
st.subheader("Frontend Code")
|
| 121 |
+
st.code(frontend_code, language="html")
|
| 122 |
+
|
| 123 |
+
st.subheader("Backend Code")
|
| 124 |
+
st.code(backend_code, language="python")
|
| 125 |
+
|
| 126 |
+
# Export option
|
| 127 |
+
export_data = {
|
| 128 |
+
"project_name": project_name,
|
| 129 |
+
"frontend": frontend_code,
|
| 130 |
+
"backend": backend_code,
|
| 131 |
+
"config": {
|
| 132 |
+
"framework": framework,
|
| 133 |
+
"backend": backend,
|
| 134 |
+
"database": database
|
| 135 |
+
}
|
| 136 |
+
}
|
| 137 |
+
|
| 138 |
+
st.download_button(
|
| 139 |
+
"Download Project Files",
|
| 140 |
+
data=json.dumps(export_data, indent=2),
|
| 141 |
+
file_name=f"{project_name}_generated_code.json",
|
| 142 |
+
mime="application/json"
|
| 143 |
+
)
|
| 144 |
+
|
| 145 |
+
if __name__ == "__main__":
|
| 146 |
+
main()
|