Build a static site with AI

Use an AI assistant like Claude, ChatGPT, or Gemini to generate a complete website, then deploy it on DanubeData in minutes — no coding experience required.

Why use AI to build your site

  • No coding required — Describe what you want in plain language and get working HTML, CSS, and JavaScript
  • Fast iteration — Regenerate or tweak designs in seconds
  • Production-ready output — Modern, responsive, accessible code you can deploy immediately
  • Learn as you go — Read the generated code to understand how websites work

Step 1: Choose an AI assistant

Any LLM that can generate code works. Popular options:

ToolAccessBest for
Claudeclaude.aiClean code, thoughtful design, long outputs
ChatGPTchatgpt.comGeneral-purpose, widely available
Geminigemini.google.comGoogle ecosystem integration
GitHub CopilotVS Code extensionInline code completion

The examples below use Claude, but the prompts work with any AI assistant.

Step 2: Write a prompt

Tell the AI exactly what you want. The more specific your prompt, the better the result.

Example: Personal portfolio

Text
Create a single-page personal portfolio website as a single HTML file with
inline CSS. Include:

- My name: Maria Popescu
- Title: UX Designer based in Bucharest
- A short bio paragraph about my experience in product design
- A section with 3 project cards (placeholder titles and descriptions)
- Links to GitHub, LinkedIn, and email
- Dark color scheme with blue accents
- Responsive layout that works on mobile
- Clean, modern design with good typography

Example: Landing page for a product

Text
Create a landing page for a SaaS product called "TaskFlow" as a single HTML
file with inline CSS and minimal JavaScript. Include:

- Hero section with headline, subtitle, and a call-to-action button
- Three feature cards with icons (use emoji as icons)
- A pricing section with Free, Pro, and Enterprise tiers
- A footer with links and copyright
- Light theme with a gradient hero background
- Fully responsive, mobile-first design

Example: Documentation site

Text
Create a documentation site for a REST API as a single HTML file with inline
CSS and JavaScript. Include:

- Sidebar navigation with sections: Getting Started, Authentication, Endpoints
- Main content area with formatted code blocks
- Dark code theme with syntax-like coloring
- A search box in the header (visual only, no backend needed)
- Responsive: sidebar collapses on mobile
- Clean, readable typography similar to Stripe or Tailwind docs

Example: Event or conference page

Text
Create a single-page website for a tech conference called "DevSummit 2026"
as a single HTML file. Include:

- Event date: October 15-16, 2026 in Cluj-Napoca, Romania
- Hero with event name, date, location, and a "Get Tickets" button
- Speaker section with 4 speaker cards (placeholder names and photos)
- Schedule/agenda for both days
- Sponsors section with placeholder logos
- Registration form (visual only)
- Modern, bold design with a dark background

Step 3: Refine the output

After the AI generates your site, you can ask follow-up questions to refine it:

  • "Make the hero section taller and add a background image placeholder"
  • "Change the color scheme to green and white"
  • "Add a contact form at the bottom"
  • "Make the navigation sticky"
  • "Add smooth scroll to section links"
  • "Add a dark/light mode toggle"
  • "Optimize the layout for mobile — the cards should stack vertically"

Each follow-up gives you an updated version. Keep refining until you are happy with the result.

Step 4: Save the files

  1. Copy the generated HTML from the AI assistant
  2. Create a folder on your computer (e.g., my-site)
  3. Save the HTML as index.html inside that folder
  4. If the AI generated separate CSS or JS files, save those too

File structure for a single-page site

Text
my-site/
  index.html

File structure for a multi-page site

Text
my-site/
  index.html
  about.html
  contact.html
  css/
    style.css
  js/
    main.js
  images/
    logo.png

Step 5: Preview locally

Open index.html in your browser to see how it looks. If something is not right, go back to the AI assistant and ask for changes.

Step 6: Deploy to DanubeData

Option A: ZIP upload (simplest)

  1. Select all files inside your my-site folder and compress them into a ZIP file
  2. Log in to the DanubeData dashboard
  3. Go to Static Sites > Create Static Site
  4. Enter a name, choose the Free plan, select ZIP Upload
  5. Click Create Static Site
  6. On the site detail page, click Upload and select your ZIP file
  7. Wait 1-2 minutes for the build to complete
  8. Your site is live at https://{slug}.pages.danubedata.ro

Option B: Git repository (for ongoing updates)

  1. Create a Git repository (e.g., on GitHub) and push your files
  2. In the DanubeData dashboard, create a new static site with Git Repository deployment
  3. Enter your repository URL and branch
  4. Set the Publish directory to / (or wherever your index.html is)
  5. Set up a webhook for automatic deploys on push

Now every time you update your files and push, the site redeploys automatically.

Option C: CLI push (for scripting)

Bash
tar -czf site.tar.gz -C ./my-site .

curl -X POST \
  -H "Authorization: Bearer YOUR_API_TOKEN" \
  -F "file=@site.tar.gz" \
  https://api.danubedata.ro/api/v1/static-sites/{site-id}/deploy

Tips for better AI-generated websites

Be specific about design

Bad: "Make me a website" Good: "Create a portfolio site with a dark navy background, white text, blue accent links, 3 project cards in a grid, and a sticky navigation bar"

Request a single HTML file

For the simplest deployment, ask for everything in one file:

"Create this as a single HTML file with all CSS inline in a <style> tag and all JavaScript inline in a <script> tag."

This gives you one file to deploy — no build step, no dependencies.

Ask for responsive design

Always include "responsive" or "mobile-friendly" in your prompt. AI assistants sometimes generate desktop-only layouts unless you specify.

Add real content

Replace placeholder text with your actual content before deploying. You can also ask the AI to help with copywriting:

"Write a professional bio for a software developer with 5 years of experience specializing in React and Node.js"

Request accessibility features

"Include proper semantic HTML, alt text for images, and ARIA labels where appropriate"

Use frameworks if you prefer

If you know a framework, ask the AI to use it:

  • "Create this using Tailwind CSS via the CDN"
  • "Build this as a React app with Vite"
  • "Generate an Astro site with these pages"

For framework-based sites, you will need to build locally first (npm run build) and upload the output directory as a ZIP.

Example workflow: Portfolio site in 5 minutes

Here is a complete walkthrough from prompt to live site:

1. Prompt the AI:

Text
Create a personal portfolio as a single HTML file with inline CSS.
Name: Alex Ionescu. Title: Backend Engineer. Bio: I build scalable APIs
and microservices. 3 project cards: "Payment Gateway API", "Real-time
Chat Service", "Data Pipeline Framework". Links to GitHub and LinkedIn.
Dark theme with green accents. Mobile-friendly.

2. Copy the output into a file called index.html

3. Preview in browser — open the file and verify it looks good

4. ZIP it:

Bash
zip my-portfolio.zip index.html

5. Deploy on DanubeData:

  • Create Static Site > Free plan > ZIP Upload
  • Upload my-portfolio.zip
  • Wait for Active status

6. Done. Your portfolio is live at https://your-slug.pages.danubedata.ro

Common site ideas to build with AI

Site typeKey prompt elements
PortfolioName, title, bio, projects, links, photo placeholder
Landing pageProduct name, headline, features, pricing, CTA button
Resume/CVName, experience, education, skills, contact info
DocumentationSidebar nav, code blocks, sections, search
BlogPost list, individual post layout, categories, author info
Event pageDate, location, speakers, schedule, registration
Restaurant menuCategories, items with prices, location, hours
Coming soonProduct name, email signup, countdown timer
Link-in-bioName, photo, list of links (like Linktree)
Wedding siteDate, venue, RSVP form, schedule, photo gallery

Next steps


Questions? Contact support at support@danubedata.ro