{"slug": "how-i-vibe-configed-this-website-in-under-10-hours", "title": "How I vibe-configed this website in under 10 hours", "summary": "A developer built the workflows-of-ai.com website in under 10 hours using a team of AI agents to configure Drupal modules, with only 2,380 of the site's 1,647,655 lines of PHP — 0.14% — written as custom code. The remaining code came from Drupal core (1,001,502 lines, 60.8%), 51 contributed modules and submodules (643,526 lines, 39.1%) and the Magoo base theme (247 lines, 0.01%), while 26,939 lines of configuration were exported and versioned like code. The author counted the lines with the code provenance skill from drupal-skills and framed the result as evidence that configuring security-covered Drupal modules is safer for agents than writing glue code between libraries.", "body_md": "Drupal AI\n\n# How I vibe-configed this website in under 10 hours\n\nDrupal is more agent-ready than ever: I built this site with a team of AI agents by configuring security-covered modules, and only 0.14% of the PHP is custom code. This is how it was done, and how it compares to an Express.js version built at the same time.\n\n## Why I tried this\n\nA driving factor was the [State of Drupal presentation in September 2026](https://dri.es/state-of-drupal-presentation-september-2026), the best Driesnote I have seen. Part of that could be that, for once, I had not seen most of the parts beforehand. But mostly I think it delivered on every front, and made it clear that Drupal is one of the best content management systems to build on, if not the best. Now we have to tell the world. That was one of the important messages too: reach people outside of our bubble, something [Alex Moreno](https://www.drupal.org/u/alexmoreno) has also talked a lot about. So I'm rebranding workflows-of-ai.com into a mix of information, including a blog that spreads the message about AI in general and ties in Drupal where it makes sense.\n\n## Driesnote Rotterdam 2026\n\nDrupal's reputation gap: is it the number one problem?\n\n[Watch the Driesnote on YouTube, from 52:58 (opens in a new tab)](https://www.youtube.com/watch?v=jrXnvVD8ryo&t=3178s)\n\nIt is quite interesting. I spend most of my days on the microlevel: how a skill is written, how the Tool API exposes a tool, how the AI module talks to a provider. But I had never used all of it to build a full website. So I tried.\n\nThe rule was simple - play to Drupal's strengths: configure first, code last. Every feature started as a search for a Drupal module that already does it. The agents did the configuring. I made the decisions.\n\nI am not sure who came up with the term \"vibe-config\". It might be [Jamie Abrahams](https://www.drupal.org/u/yautja_cetanu) or [Kristof Van Tomme](https://www.drupal.org/u/kvantomme). What I do know is that configuring secure Drupal modules is a safer way to build for an agent than writing glue code between libraries that might or might not follow good security principles.\n\nYou could quite possibly have most of the same feature set up on Wix.com in similar time using AI. But then you would not own it, and it would not be extendable.\n\n## 0.14% custom code\n\nThis is the number the whole post is about. Out of 1,647,655 lines of PHP, 2,380 were written for this site. I counted them with the code provenance skill from [drupal-skills](https://github.com/ivanboring/drupal-skills), which is there for exactly that: seeing how much of the code you wrote yourself. The rest is Drupal core and 51 contributed modules and submodules, most of them covered by the Drupal Security Team. What we wrote instead was configuration: 26,939 lines of it, exported and versioned like code.\n\n### Where the code comes from\n\n1. \nThis grid is every line of PHP that runs this site: 1,647,655 lines, about 1,650 per square.\n2. \n60.8% is Drupal core: 1,001,502 lines, looked after by the core team and the Drupal Security Team.\n3. \n39.1% is contributed modules: 643,526 lines in 51 modules and submodules, configured instead of written.\n4. \n247 lines come from the Magoo base theme, generated from the component library.\n5. \nAnd this is what was written for this site: 2,380 lines. One square.\n6. \nEverything else is configuration: 26,939 lines of it, exported and versioned like code.\n\n| Where the code comes from |  |  | \n|---|---|---|\n| Group | Lines | Share | \n|---|---|---|\n| Drupal core | 1,001,502 | 60.8% | \n| Contributed modules | 643,526 | 39.1% | \n| Magoo base theme | 247 | 0.01% | \n| Written for this site | 2,380 | 0.14% | \n\n### So why any custom code?\n\nEvery post here is a Canvas page, not a node, and some contributed modules still assume nodes, like reading time and RSS feeds. Some things are specific to this site, such as the post layout with chapters and the other versions of a post. And a few things are glue no module offers yet: one MCP tool that sets up a post in a single call, structured data that links the author across pages, and a way to push content from my laptop to production.\n\nI could have used [Tool Belt](https://www.drupal.org/project/tool_belt) and [Google Tag](https://www.drupal.org/project/google_tag) to get the number down even further. But I wanted a realistic version of when to use code and when not to.\n\n## The people behind the other 99.86%\n\nThose numbers only work because of the people who look after the rest. The [Drupal Security Team](https://www.drupal.org/drupal-security-team) and the [core team](https://www.drupal.org/project/drupal) do an incredible job on the basics, and it often goes unnoticed.\n\nI have been in contact a lot lately with [Greg Knaddison (greggles)](https://www.drupal.org/u/greggles) and [Drew Webber (mcdruid)](https://www.drupal.org/u/mcdruid). They are some of the foundations of why Drupal is trusted by enterprises all over the world. Every time I configure a security-covered module instead of writing code, I build on their work.\n\n## How it was built\n\nIt is both a completely new site and a move: the old videos from workflows-of-ai.com came over, and got chapters and transcripts on the way. Locally it runs with the [One Line Installer](https://www.drupal.org/project/one_line_installer). These were the steps, in order.\n\n### From an empty folder to a live site\n\n1. \n#### Install 1 commandThe One Line Installer sets up DDEV, Drupal and the agent tooling with one command.\n2. \n#### Plan OpusClaude Code with Opus wrote the spec and the plan with the superpowers writing-plans skill before anything was built.\n3. \n#### Find modules before any codeEvery feature started as a module search through the agent module knowledge MCP, preferring maintained, security-covered modules.\n4. \n#### Theme magoocomponentuiThe components come from the Magoo component catalog and are built straight into the theme, so no theme layer was written by hand.\n5. \n#### Content model CanvasPosts are Canvas pages with categories, authors and an MCP tool to publish them.\n6. \n#### Migrate smaller modelsThe old videos from workflows-of-ai.com moved over, with chapters and transcripts added.\n7. \n#### Voice CCCThe Context Control Center learned how I write and how I talk, so agents can draft posts over MCP.\n8. \n#### Check Lighthouseagent-browser looked at every change, and web-quality-audit and seo-aeo-best-practices audited the result.\n9. \n#### Ship 3-4 hGitHub Actions builds every tagged release and drush deploy imports the configuration, with backups and rollback. The server itself runs on Ansible roles I wrote by hand.\n\n### Herding the agents\n\nI used herdr to quite literally let Claude Code with Opus 5.5 herd the subagents: Claude Code with Sonnet, and OpenCode with GLM 5.3 remotely and Qwen 3 Coder locally. Opus planned and wrote the specs. GLM 5.3 and Sonnet configured the website. The smaller models took the recurring tasks of the migration.\n\n## The skills that cut the time\n\n- [The Magoo component library](https://ivanboring.github.io/magoocomponentui/) ([magoocomponentui](https://github.com/ivanboring/magoocomponentui) ): a catalog of components that writes any vanilla component to an SDC or a Canvas Code Component, so I did not have to write the theme layer over and over again.\n- [ddev-drupal-agent-module-knowledge-mcp](https://github.com/Drupal-AI/ddev-drupal-agent-module-knowledge-mcp) : makes the agents look for a module first, so we use modules as much as possible.\n- [seo-aeo-best-practices](https://github.com/sanity-io/agent-toolkit) : an audit for search engines and AI answer engines, and the fixes that followed.\n- [web-quality-audit](https://github.com/addyosmani/web-quality-skills) : Lighthouse runs, and the fixes for performance and accessibility.\n- [superpowers](https://github.com/obra/superpowers) writing-plans: a spec and a plan before any code.\n- [agent-browser](https://github.com/vercel-labs/agent-browser) : the agents check every change in a real browser.\n- [dtk](https://www.drupal.org/project/dtk) and[rtk](https://github.com/rtk-ai/rtk) : fewer tokens for the same work.\n\n## Writing as me, almost\n\nThe posts here start as an AI draft. In the [Context Control Center](https://www.drupal.org/project/ai_context), AI analysed everything I have written before and the transcripts of my videos, and turned that into two pieces of context: how I write and how I talk. Together with the [avoid-ai-writing](https://github.com/conorbronsdon/avoid-ai-writing) skill, an agent can write a first draft over MCP that sounds close to me. This post started that way.\n\nIt is not a completely honest version of me. In the same way an agent finds internal services I would not have used because I did not know about them, it uses words I understand but would not normally use. That makes it more professional and less personal. At the same time, it lets me write about things happening at a scale that was impossible before.\n\nThat is why every post here says how AI was used in it, with the [AI Disclosure](https://www.drupal.org/project/ai_disclosure) module. If you publish with AI, it is imperative that you disclose it. See the word *imperative* - I would probably have used super-important :) Readers should know what they are reading.\n\n## One post, many ways in\n\nIn the age of AI there are more ways to consume content, because building it in different forms is easy. So a post here can come with a spoken version for accessibility, a funny AI-generated podcast, a pure reader mode and a narrated PowerPoint. Agents get a Markdown version of every page.\n\nAny post with a presentation can also be shown as one: add [`?presentation=true`](https://workflows-of-ai.com/blog/how-i-vibe-configed-this-website?presentation=true) to its address and it opens in fullscreen, narrated or not. That also means I am ready to present on any topic I write about here at any time.\n\n## Close to 100, and ready for agents\n\n[Lighthouse](https://developer.chrome.com/docs/lighthouse/overview) is Google's open-source tool for checking the quality of a web page. It loads the page the way a visitor on a mid-range phone would, and scores it from 0 to 100 in a few categories: performance (how fast the page shows up and responds), accessibility (whether everyone can use it, also with a screen reader or only a keyboard), best practices (security and modern web standards) and SEO (whether search engines can understand it). The newest category, agentic browsing, checks how well AI agents can read and use the page.\n\nThe lowest score of four pages (front page, blog, a post and an about page), median of three runs on the local site.\n\n| Lighthouse, mobile |  | \n|---|---|\n| Performance | 97 / 100 | \n|---|---|\n| Accessibility | 97 / 100 | \n| Best practices | 100 / 100 | \n| SEO | 100 / 100 | \n| Agentic browsing | 98 / 100 | \n\nThis site is close to 100 on every one of them. It is also built for agents: every page has a Markdown version, structured data that links the author across pages, an llms.txt, a sitemap and a robots.txt that lets AI crawlers in. Posts are structured content, Canvas components with typed props, so agents can read them and publish new ones over MCP.\n\nThe biggest jump came from two swaps: a lighter consent manager (Klaro! instead of COOKiES, which also removed jQuery) and responsive images. Hover or tap the charts for the exact numbers, and click a legend entry to hide a series.\n\nMedian of three mobile Lighthouse runs on the local site, before and after the switch to Klaro! and responsive images.\n\n| Mobile performance score, before and after |  |  | \n|---|---|---|\n| Page | Before | After | \n|---|---|---|\n| Front page | 82 | 97 | \n| Blog | 89 | 97 | \n| A post | 79 | 97 | \n| About page | 94 | 99 | \n\nLower is better; Google counts 2.5 seconds or less as good. Same runs as above.\n\n| Largest Contentful Paint, before and after |  |  | \n|---|---|---|\n| Page | Before | After | \n|---|---|---|\n| Front page | 3.8 s | 2.4 s | \n| Blog | 3 s | 2.2 s | \n| A post | 4.2 s | 2.4 s | \n| About page | 1.9 s | 1.8 s | \n\n## Express.js, built at the same time\n\nAt the same time I let a vanilla Codex Luna build the same site in Express.js, something I have worked with a lot. The result is a focused website that might be easier for one person to handle. It also has more than 30,000 lines of code.\n\nAnd it misses what Drupal has from the start: extensibility, permissions, translations, multitenancy and the power of a visual editor like Canvas.\n\nThe advantage of the Express.js version is that it did not need any skills to get the same results, and it was ready to deploy to Vercel straight away. Here it took 3 to 4 hours to get deployment working. Those are problems we have to bridge, and it is where Drupal has to end up.\n\n## Some truths\n\n- The \"under 10 hours\" is the site: 7 hours to have it working locally. Getting deployment working took another 3 to 4 hours.\n- Some of the MCP and Tool modules are not stable yet and not covered by the Security Team: Agent Access, Canvas Tools, MCP Server, Tool API and AI Disclosure.\n- The server is the one part I kept away from AI. The DigitalOcean setup runs on Ansible roles I wrote myself, with my own hands and my own brain. I do not trust AI with that yet. If I ran managed servers, I would trust something like Hostinger's MCP servers, but I prefer managing my own. And one of the strengths of a LAMP stack is that a site like this runs just as well on cheap hosting.\n\n## Now you do it\n\n### If you know Drupal\n\nGet the message out there. Write about what you build, show it, and share it outside the Drupal channels. It is not the most advanced or feature-rich framework that wins, and it is not the one with the best UX either. It is the one people talk about most positively. Agents learn from what we write, and in the next training round that becomes what they know.\n\n### If you do not use Drupal yet\n\nGet started with the [One Line Installer](https://www.drupal.org/project/one_line_installer): one command sets up a local Drupal site with the AI tooling. On Windows you need WSL2.\n\n```\nbash <(curl -fsSL https://aibp.drupalstarforge.ai/install.sh)\n```\n\nThat's it. Thank you for reading.\n\n## \nChapters\n12 min read \n\nOther ways to consume this\n\nListen to this article\n\n15:18\n[Articles read out (podcast feed)](https://workflows-of-ai.com/articles-read-out.xml)\n\n## Podcast: How I vibe-configed this website in under 10 hours\n\nPodcast episode\n\n4:57\nWorkflows of AI Podcast\n\nListen in your podcast app\n\nTranscript\n\n- AI disclosure\n- This podcast episode is created and spoken by AI based on articles written on workflows-of-ai.com.\n- Kwame Kwilson\n- Welcome back. Here's the number that stopped me today: zero point one four percent. That's how much of the PHP running Marcus Johansson's new site was actually written for it. Jane, what are we looking at?\n- Jane Olson\n- A site that was configured, not coded. About one point six million lines of PHP run it, and only two thousand three hundred and eighty were written by hand. Everything else is Drupal core and fifty-one contributed modules, and most of those are covered by the Drupal Security Team.\n- Erin Milleu\n- Which is the part I care about. If an agent writes glue code between random libraries, nobody has reviewed it. If it switches on a module that thousands of sites already use, somebody has.\n- Jane Olson\n- Exactly. And honestly, that's the whole trick. The agents did the configuring. Marcus made the decisions.\n- Erin Milleu\n- I'd add one thing, though. Configuration is still code, in a sense. He exported nearly twenty-seven thousand lines of it. It's versioned, it's reviewable, it just isn't PHP you have to secure yourself.\n- Kwame Kwilson\n- So why write any custom code at all?\n- Erin Milleu\n- He's quite upfront about it. There are four thousand six hundred and fifty-eight lines of hand-written code in total, if you count JavaScript, CSS and templates. Some of it exists because every post is a Canvas page rather than a node, and a few modules still assume nodes. Reading time, for one. RSS feeds.\n- Jane Olson\n- And some of it is glue nobody has built yet. One MCP tool that sets up a whole post in a single call. A way to push content from his laptop to production. He even says he could've used Tool Belt and Google Tag to push the number lower, but he wanted a realistic picture.\n- Erin Milleu\n- Which I rather respect. Chasing zero would've been a party trick.\n- Kwame Kwilson\n- Let's talk about the agents themselves. How was the work split?\n- Jane Olson\n- Like a small team. Claude Code with Opus planned and wrote the specs. Sonnet and GLM 5.3 configured the site. And the smaller models, Qwen running locally, did the repetitive migration work, moving the old videos over with chapters and transcripts. Nine steps from an empty folder to a live site.\n- Erin Milleu\n- And the planning happened before anything was built. Spec first, plan second, code last. That's the bit people skip.\n- Jane Olson\n- Erin, that's basically your personality as a workflow. Nobody touches anything until the spec has been approved by Erin.\n- Erin Milleu\n- And look how well that's worked out for everyone.\n- Kwame Kwilson\n- Fair. What about the skills? He credits those with cutting the time.\n- Jane Olson\n- The big one for me is the module knowledge MCP. It makes the agent search for an existing module before it writes a single line. That's how you end up at zero point one four percent instead of fifteen.\n- Erin Milleu\n- And agent-browser, so the agents actually look at every change in a real browser instead of declaring victory from the terminal. That alone saves you from half the nonsense.\n- Kwame Kwilson\n- Then the scores. On mobile Lighthouse, the slowest page went from a performance score of seventy-nine to ninety-seven. Largest Contentful Paint went from four point two seconds down to two point four. What changed?\n- Jane Olson\n- Two swaps. A lighter consent manager, Klaro instead of the Cookies module, which also got rid of jQuery. And responsive images.\n- Erin Milleu\n- Neither of which is clever. They're just correct. Which is rather the point: the gains came from good defaults, not from heroics.\n- Kwame Kwilson\n- And there was a comparison. He had Codex build the same site in Express.js at the same time.\n- Jane Olson\n- More than thirty thousand lines of code. Against four thousand six hundred and fifty-eight here. And it doesn't have permissions, translations or a visual editor like Canvas.\n- Erin Milleu\n- Yes, but be fair to it. The Express version needed no special skills, and it deployed to Vercel straight away. Here, deployment took another three to four hours. That's a real gap.\n- Jane Olson\n- No, that's fair. He says so himself. It's the problem Drupal has to bridge.\n- Kwame Kwilson\n- Erin, a last word?\n- Erin Milleu\n- Some of the MCP and Tool modules he relies on aren't stable yet, and they're not covered by the Security Team. So, a remarkable number, but with an asterisk until they are.\n- Jane Olson\n- Erin found the asterisk. Somebody mark the date, she's officially enjoying herself.\n- Kwame Kwilson\n- That's the episode. Zero point one four percent custom code, a site built in under ten hours, and an honest list of what's still missing. The whole write-up, with the charts, is on the post. See you next time.\n\n## Narrated slides: How I vibe-configed this website in under 10 hours\n\n## The post in three sentences\n\nI built this site with AI agents by configuring security-covered Drupal modules, and only 0.14% of the PHP that runs it is custom code. Skills like the Magoo component catalog and the module knowledge MCP cut the time, and the site scores close to 100 on Lighthouse and is ready for agents. An Express.js version built at the same time needed more than 30,000 lines of code but no skills, and that is where Drupal has to end up.", "url": "https://wpnews.pro/news/how-i-vibe-configed-this-website-in-under-10-hours", "canonical_source": "https://workflows-of-ai.com/blog/how-i-vibe-configed-this-website", "published_at": "2026-10-10 14:11:33+00:00", "updated_at": "2026-10-18 11:15:52.461653+00:00", "lang": "en", "topics": ["ai-agents", "ai-tools", "developer-tools", "artificial-intelligence"], "entities": ["Drupal", "workflows-of-ai.com", "drupal-skills", "Magoo", "Drupal Security Team", "Alex Moreno", "Jamie Abrahams", "Kristof Van Tomme"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/how-i-vibe-configed-this-website-in-under-10-hours", "markdown": "https://wpnews.pro/news/how-i-vibe-configed-this-website-in-under-10-hours.md", "text": "https://wpnews.pro/news/how-i-vibe-configed-this-website-in-under-10-hours.txt", "jsonld": "https://wpnews.pro/news/how-i-vibe-configed-this-website-in-under-10-hours.jsonld"}}