top of page

Building an OpenAi Website Doctor at Vibecamp

Aug 25

4 min read

0

21

0

This weekend I had the chance to spend a weekend at Vibecamp, a campout hackathon hosted at Habitat Noosa and organised by the Peregian Digital Hub. Picture dozens of hackers camping by the lake, coding late into the night, and demoing weird and wonderful AI powered projects under the stars.



Highlights From the Camp

Before I get into my own project, here are a few of my favourites from the other vibe campers:

  • Customer Support Caller: An AI-powered agent that actually calls customers on behalf of small businesses, follows up, collects feedback, and handles questions, it could give small business the same customer support capabilities as a massive corporation.

  • Gamified Study Planner: Built by a Year 9 student with only a few weeks of coding experience. She turned studying into a game, complete with rewards and challenges.

  • AI Film Editor: A workflow that ingests a full movie script and generates a “rough cut” of the film, complete with stitched-together visuals and audio. An early glimpse at how generative AI might reshape creative industries.

  • Biosecurity Assistant: An agent trained to interpret Australia’s notoriously arcane biosecurity regulations.

I was absolutely blown away by what everyone was able to get done over the weekend.


My Project: Diagnosing Broken Websites With AI

As a freelance developer, a big part of my work is supporting WordPress sites. Often, the first call I get from a client is when their site is down. To a non-technical business owner, “my site is broken” might mean anything: DNS misconfiguration, expired SSL certificates, hosting downtime, plugin conflicts, you name it.


For Vibecamp, I built a prototype of something that would be useful to me and my clients: an AI assistant that diagnoses why a website is broken.


The idea was simple:

  • The assistant runs real tools like DNS lookups or live browser screenshots to investigate the site.

  • It then explains the issue in plain English, tailored to the client’s own hosting provider or admin system.


The goal wasn’t to replace myself as a developer, but to empower non-technical people to troubleshoot before they panic.


I've deployed the code to a live demo here. Paste in the url of a "broken website", and it'll tell you what's wrong with it and give you tailored instructions for how to fix it.


In this example, I've entered a website whose domain has expired and which is now returning a godaddy landing page.


Traditional tools may not flag this, because the landing page returns a 200 response code and valid HTML, but the AI agent can recognise that the website is "broken". The agent also detects that the site is hosted with GoDaddy and provides specific instructions.



https://brokensite.safewp.net/


Exploring the OpenAI Responses API

Vibecamp was also my chance to dive deep into OpenAI’s new Responses API, which unifies chat, tools, and structured outputs.

Key aspects I wanted to explore:

  • Tool Integration: I hooked up DNS lookups, screenshot capture, and basic HTTP checks. The model can choose which tool to call, though in practice it doesn’t always make the smartest decision (sometimes you’re better off calling tools yourself and feeding results back into the prompt).

  • Event Streaming: Using Server-Sent Events (SSE), I streamed partial responses back to the client. This gave the user progress updates like “Running DNS check…” or “Capturing screenshot…” rather than forcing them to wait for a final result.


I couldn't find and clean examples of integrating these technologies together. Many online examples will use older APIs or don't use event streaming responses. I've publish my source code as an example of tool use with event streaming on the OpenAi Responses API. Summarised from agent.py:

// Start streaming with tools
stream = client.responses.create(
    model="gpt-4o-mini",
    input=[{"role": "user", "content": initial_message}],
    tools=tools,
    stream=True,
)

for event in stream:
    event_type = event.type

    // ... The agent decides which tools it will use
    // ... we then handle the function calls
    if event_type == "response.output_item.added" and event.item.type == "function_call":
        // ... run any tools, and yield a message to the front end
        yield {
            "type": "tool_call",
            "message": "Checking your site's DNS settings"
        }

    // ... once functions are complete, take the results
    if event_type == "response.completed":
        for tool_result in tool_results:
             new_input.append({
                 "type": "function_call_output",
                 "output": tool_result["content"]
             })
        
         // ... and call the agent again with the tool results
         final_stream = client.responses.create(
             model="gpt-4o-mini",
             input=new_input,
             stream=True
         )

         for final_event in final_stream:
             if final_event_type == "response.output_text.delta":
                 // .. stream the agents response
                 yield {
                     "type": "text_content",
                     "content": final_event.delta,  
                 }

Tricks I Learned for Using Cursor

Another hero of the weekend was the Cursor editor. If you haven’t tried it yet, Cursor is essentially VS Code with an AI pair programmer baked in.

Here are some tricks and learnings:

  • Feed It Code, Not Links: Cursor isn’t great at “reading” external docs just from links. Copy-pasting example code directly into the editor works far better.

  • Persistence Pays Off: Sometimes it hallucinates, switching approaches mid-way. Don’t give up—guide it back, and it’ll get there.

  • Be Specific: Show it the error message and the exact section of code you want changed. Vague instructions lead to vague fixes.

  • Ask for Cleanup: It won’t clean up after itself unless you tell it to—but it will if prompted.

  • You Still Need to Understand: Cursor is great at helping you to work faster, but you can’t abdicate all responsibility. If you don’t understand what’s being built, you’ll get stuck eventually.

For rapid prototyping, it was unbelievably effective. I would say that it helped me produce about two weeks worth of work in two days.


What I Took Away

Vibecamp was equal parts hackathon, campout, and tech festival.

  • I left with a working prototype of an awesome tool that might help a lot of people.

  • I got hands-on with OpenAI’s cutting-edge APIs.

  • And I sharpened my workflow around Cursor, which has become a mainstay in my daily development, especially for rapid prototyping.

  • I got connected with a lot of interesting and talented hackers from the Peregian Digital Hub.



Source code: github.com/roo2/broken-site


Live Demo: https://brokensite.safewp.net/


Please reach out if you have any questions about agents or fixing broken websites!


(written with some AI assistance)

Aug 25

4 min read

0

21

0

Related Posts

Comments

Share Your ThoughtsBe the first to write a comment.
bottom of page