Recently I've started writing CI pipelines in GitHub Actions, and found out there was no easy way to browse test results. So I wrote a site to display them right out of your artifacts.
I chose an implementation where the client fetches and parses the data by itself, so I don't have to manage user's data (or have a backend really).
I didn't want to spend too much time on this side-project, so I used AI tooling, and was delightfully surprised with their effectiveness.
I used Vercel's v0 for the initial design (that uses mock data), and used Cursor to introduce API calls and add features.
I then manually reviewed all code and touched up the design and UX, all in a span of 2 days.v0 generated most of the logic in the main page TSX file (it seems like AI works better when the code is centralized) and the most impressive part was that Cursor managed to (all in one prompt per change with minimal or no bugs):
- Convert it from next.js to react-router
- Split it into nicely decoupled logical components
- Switch to a state-management framework (zustand).
Here's the code: https://github.com/Wazzaps/test-viewer
Pardon my english, I am not a native speaker :)