People everywhere are spinning up dashboards to "monitor the situation." Which situation, you ask? Any they can think of.
They're sharing these real-time info websites to track geopolitical conflicts, prediction markets and natural disasters -- sometimes all of the above. The dashboards look like sci-fi-style command centers, with self-updating maps, charts and news feeds.
Why is everyone suddenly stuffing their screens with dizzying amounts of data? Enter "vibe coding," the art of talking an app into existence via artificial intelligence.
I can already feel the eye rolls, but I promise this is reality, not hype. And you can do it, too.
In creating my own dashboard, I learned a little about coding and a lot about this brave new world where non-coders can build whatever software they want. Plus, I now have a way to monitor my own situation!
Like any other pursuit worth doing, vibe coding isn't without some frustration. But getting started is easy and the upside is high. Here's how -- and why -- you should give it a try.
Step one: Brainstorm your design
The hardest part: dreaming up your product. Remember, you don't have to think big, since it's just for you.
Dashboards are popular because they're simple. One can run as a website or an app that lives only inside your computer's browser. The whole thing appears on a single page and draws from sources you already check regularly. Perhaps a calendar, stocks or something more specific, like the ideal sunset-photo time?
You also don't need design skills -- the AI helps with that, too.
I suggest true beginners use a website called Lovable, which is designed as a vibe-coding tool for apps and websites. Replit is fairly easy too, but it lets more experienced users multitask.
Start with a prompt asking for a dummy version. Here's mine:
Design a personal dashboard mock-up with placeholder data. It should look calm, refined and elegant, with a soft neutral palette, large typography, no clutter. Here are the elements: a calendar card, a task of the day card, 4-5 tech headlines, health stats, weather in San Francisco and bus departure times.
The AI might fill the page with features you didn't think of -- for better (a dark-mode button) or worse (a cheesy quote of the day). I went through several rounds of editing to get the mock-up just right. You literally tell it what changes to make using plain English.
Lock down your design first, since it's harder to overhaul when AI starts connecting all the data feeds.
You can do a fair amount before paying any fees. Once you burn through the free credits, though, you're faced with a choice: Pay the $25 monthly fee for a lot of upfront credits or wait a day for another free handful.
Pro tip: To save on credits on Lovable or Replit, plan your design with ChatGPT first, then upload the mock-up image as a reference. (You can upload other reference images too.)
Step two: Find the data
The AI can determine which data is actually gettable. A sample prompt:
I want to access this dashboard from the web, and don't have any coding skills. Assess the feasibility of my data wishlist. Also, are there any additional data sources I should consider?
The AI will likely propose grabbing data through what's called an API -- "application programming interface." I'll spare you the technical details, but it's essentially what serves the raw information that ends up on your dashboard.
I learned that some APIs aren't for personal use, such as my energy provider's live usage feed. Others are costly.
Most of my wishlist was free, such as my Oura ring stats, San Francisco fog info and my local bus arrivals. But you might need to manually connect an API to your dashboard.
The AI told me how to retrieve what's called a "key," which is a long string of numbers and letters to unlock the data. The AI can't do this by itself because users often need to create a developer account. Once I had the code, I could paste it into a text box displayed by Lovable.
Another pro tip: Save your API keys in a password manager. Most services only display the code once, before it disappears forever. (They're reusable and if you lose one, you can regenerate another.)
Google Calendar provides a "secret address" in settings so you can avoid any API fiddling.
Step three: Build the board
Finally, it's time to plug data into your dashboard. I found it easiest to proceed one at a time, with a prompt like this:
Add a public transit card that shows the next SFMTA bus arrivals for a specific stop. Display the route name, direction and minutes until arrival. Make it minimal, and easy to scan.
I will admit, at times I wanted to hurl my laptop into the Pacific. Resolving some issues took a lot of polite, and desperate, pleading with a machine. Again, all in plain English. But it worked.
Once my SF commute dashboard was up and running, I was hooked -- and on to my next, more complicated idea: a news briefing that ranked tech stories on my beat. This time, I used Replit.
Making the various buttons functional was more complex. At one point, the mobile view looked great, then completely broke.
I blazed through Replit's free credits, upgraded my account to a monthly plan and hit that paid limit too. The grand total: $45. And I'll have to pay $25 a month for Replit to keep hosting it.
But it's the news aggregator of my dreams.
Bonus challenge: Using Claude Code
I couldn't finish my experiment without trying Claude Code. It's a more complex, open-ended AI coding tool, and it's only for subscribers paying $20 or higher a month. Claude Code makes it easier to create a fully private web app that only runs on your computer; though to do that, I had to brave the dreaded Terminal -- a command-prompt screen.
And if you use Anthropic's impressive new Claude Design research preview (aka beta) to create your mock-up, you can send the visual directly to Claude Code to start building.
Anthropic's $20-a-month Pro plan was sufficient; though a few times I needed to wait a couple hours for my usage limits to reset.
After finishing my desktop-running dashboard, Claude suggested services that offered free hosting. So I followed its intimidating instructions involving uploading files to GitHub and connecting that to Cloudflare Pages. Eventually, my app was alive on the web. My husband—a professional software engineer—was impressed.
This past Friday I opened my SF dashboard on my phone and left the house in time for the next bus. I felt the same visceral satisfaction as finishing a Home Depot DIY project that actually looks nice and works.
There are ups and downs for sure. Along your vibe-coding journey you might still want to throw your laptop into the ocean—but at least your dashboard will tell you how high the tide is.