This is a submission for the Sanity Challenge, Path Two: Vibe-Code Something Strange
What I Built
I built the Bureau of Anomalous Artifacts (BAA), a brutalist, SCP-inspired terminal interface for tracking and containing anomalous entities.
The goal was to build something that didn't just look "vibe-coded" but actually functioned as a serious, usable application. It features a Next.js 15 frontend with a custom Sanity Studio fully embedded directly into the /studio route.
Authorized personnel can log into the embedded Studio to document new anomalies, set Threat Levels (Safe, Euclid, Keter, Apollyon), and write containment procedures using PortableText. The frontend then dynamically renders this data with a retro-terminal aesthetic, complete with redacted text effects for sensitive information.
Demo
Code
This is a Next.js project bootstrapped with create-next-app.
Getting Started
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
Learn More
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more…
My Build Process
This was built entirely using the Google Antigravity IDE. I wanted to push the agent to build something structural and robust, not just a fragile prototype.
The build process was a wild ride:
The Disk Space Crisis: Halfway through scaffolding the Next.js app, the agent literally ran out of disk space in its scratch environment. We had to pause, clean up the system, and migrate the whole project to my Desktop to keep going.
The React 19 Dependency War: When we tried to embed the Sanity Studio via next-sanity, we hit a massive peer dependency conflict because we were using React 18, but the latest Sanity packages required React 19. The agent made the bold decision to just upgrade the entire app to the Next.js 15 Release Candidate on the fly.
The Async Params Bug: Because we upgraded to Next.js 15, we instantly got hit by a brand new Next.js breaking change—dynamic route params are now Promises! The dossier page crashed because it was trying to fetch from Sanity before the URL parameter resolved. The agent had to jump in, debug the GROQ query, and implement a bulletproof async wrapper for the params.
It felt like true pair programming. We fought through dependency hell, fixed breaking changes, and came out the other side with a really cool, fully functioning app.
Sanity Project Details
Project ID: iqopcrqz
Dataset: production
We used standard string fields for the metadata, strict arrays with options for Threat Levels, and PortableText blocks for the deep-dive containment procedures (which allowed us to map standard bold/italic marks to our custom React components on the frontend).
Top comments (0)