<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Venkatesh A.G.E</title>
    <description>The latest articles on DEV Community by Venkatesh A.G.E (@venkatesh_age_a1c356e03).</description>
    <link>https://dev.to/venkatesh_age_a1c356e03</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4208259%2F5470d586-019f-4895-8795-43f28cdfe540.jpg</url>
      <title>DEV Community: Venkatesh A.G.E</title>
      <link>https://dev.to/venkatesh_age_a1c356e03</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/venkatesh_age_a1c356e03"/>
    <language>en</language>
    <item>
      <title>Build a website with Claude Code in 10 minutes (and catch its mistakes before they go live)</title>
      <dc:creator>Venkatesh A.G.E</dc:creator>
      <pubDate>Mon, 26 Oct 2026 09:17:07 +0000</pubDate>
      <link>https://dev.to/venkatesh_age_a1c356e03/build-a-website-with-claude-code-in-10-minutes-and-catch-its-mistakes-before-they-go-live-58je</link>
      <guid>https://dev.to/venkatesh_age_a1c356e03/build-a-website-with-claude-code-in-10-minutes-and-catch-its-mistakes-before-they-go-live-58je</guid>
      <description>&lt;p&gt;AI coding assistants are good at writing web pages. They're also good at quietly breaking things: a link to a page that doesn't exist, a missing description, a claim you never made, a deploy that overwrites something. This walkthrough builds a small business website with Claude Code and &lt;a href="https://vagejs.com" rel="noopener noreferrer"&gt;vagejs&lt;/a&gt;, a free, open-source static site generator that checks every page before it goes live.&lt;/p&gt;

&lt;p&gt;It works the same with Cursor, Codex, Copilot or Gemini CLI. You need &lt;a href="https://nodejs.org" rel="noopener noreferrer"&gt;Node.js&lt;/a&gt; 22.12 or newer.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Create the site
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm create vagejs@latest my-site
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It asks "Install and start the site now?". Press Enter, and your new site opens in the browser. Pages are Markdown files in &lt;code&gt;src/pages/&lt;/code&gt;; &lt;code&gt;src/pages/about.md&lt;/code&gt; becomes &lt;code&gt;/about/&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;The new folder also contains &lt;code&gt;AGENTS.md&lt;/code&gt;. That file tells your AI assistant the commands, the folder layout and the rules: run &lt;code&gt;npm run check&lt;/code&gt; after every change and fix every error, never add pages or links to other websites you didn't ask for, and only publish with your approval.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Ask for the pages
&lt;/h2&gt;

&lt;p&gt;Open the folder in Claude Code and describe what you want, with the real facts. Don't have a prompt yet? The &lt;a href="https://vagejs.com/prompts/builder/" rel="noopener noreferrer"&gt;prompt builder&lt;/a&gt; writes one from a few answers. Here's a short version:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Read AGENTS.md. This site is for Rosa's Bakery, a bakery in Indiranagar,
Bengaluru, that bakes sourdough bread and pastries.
Create Home, About and Contact pages, and add them to the main menu.
Facts you can use: open Tuesday to Sunday, 8am to 6pm.
Don't invent prices, reviews or anything else: ask me.
Then run npm run check until it reports 0 errors.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The assistant writes plain text files you can read and edit yourself, like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight markdown"&gt;&lt;code&gt;&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;span class="na"&gt;title&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;About&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;Rosa's&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;Bakery"&lt;/span&gt;
&lt;span class="na"&gt;description&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;A&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;neighbourhood&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;bakery&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;in&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;Indiranagar&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;baking&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;sourdough&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;and&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;pastries,&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;Tuesday&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;to&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;Sunday."&lt;/span&gt;
&lt;span class="nn"&gt;---&lt;/span&gt;

&lt;span class="gh"&gt;# About us&lt;/span&gt;

We bake sourdough bread and pastries every morning...
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  3. Let the check catch the mistakes
&lt;/h2&gt;

&lt;p&gt;Here's the part that matters. Say the assistant links the home page to &lt;code&gt;/menu/&lt;/code&gt;, a page that doesn't exist. &lt;code&gt;npm run check&lt;/code&gt; stops it:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;error   link-broken   / (src/pages/index.md)
        Link to "/menu/" does not match any page or file.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It names the file and the problem, so the assistant fixes it before you ever see the broken link. The same check covers missing titles and descriptions, structured data, image alt text, links to websites you haven't approved, and more. It ends with:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Checked 5 page(s): 0 error(s), 0 warning(s).
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  4. Review it yourself
&lt;/h2&gt;

&lt;p&gt;&lt;code&gt;npm run dev&lt;/code&gt; shows the site with live reload. It also prints an &lt;code&gt;editor:&lt;/code&gt; address: a local editor with a form for each page and a live preview, for when you'd rather fix a sentence yourself than ask the assistant. It only runs on your computer and is never part of the published site.&lt;/p&gt;

&lt;h2&gt;
  
  
  5. Publish, after you say yes
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npx vage deploy
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It shows a plan first: what gets committed, where it gets pushed (never force-pushed), and how it checks the result. Then it publishes to GitHub Pages and reports success only when your site actually answers. Cloudflare and Netlify work the same way.&lt;/p&gt;

&lt;p&gt;A free GitHub Pages address like &lt;code&gt;you.github.io/my-site&lt;/code&gt; works too: set &lt;code&gt;site: "https://you.github.io/my-site"&lt;/code&gt; in &lt;code&gt;vage.config.ts&lt;/code&gt;, and vagejs adds the &lt;code&gt;/my-site&lt;/code&gt; part to every link. Here's a &lt;a href="https://agevenkat.github.io/vagejs-subfolder-test/" rel="noopener noreferrer"&gt;live example&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  What you end up with
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Plain HTML pages with no JavaScript, unless you add some&lt;/li&gt;
&lt;li&gt;A sitemap, robots.txt and llms.txt generated from the pages that actually exist&lt;/li&gt;
&lt;li&gt;Search titles, descriptions, social previews and structured data on every page&lt;/li&gt;
&lt;li&gt;Files you own, in your own git repository&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Where it doesn't fit
&lt;/h2&gt;

&lt;p&gt;vagejs builds static sites: company sites, docs, blogs, portfolios, landing pages. If you need user accounts, a shopping cart or data that changes per visitor, use an application framework instead.&lt;/p&gt;




&lt;p&gt;vagejs is MIT licensed and free. The docs are at &lt;a href="https://vagejs.com/docs/" rel="noopener noreferrer"&gt;vagejs.com/docs&lt;/a&gt; and the code is on &lt;a href="https://github.com/agevenkat/vagejs" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;. It's young, so feedback on what breaks is very welcome.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>ai</category>
      <category>opensource</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
