Skip to content

Modernize Go uptime frontend with Vite 8, React 19 and shadcn/ui - #276

Merged
lennartp merged 1 commit into
mainfrom
t3code/uptime-go-frontend
Oct 15, 2026
Merged

lennartp merged 1 commit into
mainfrom
t3code/uptime-go-frontend

Conversation

@simon-johansson

@simon-johansson simon-johansson commented Oct 1, 2026 •

Copy link
Copy Markdown
Contributor

Summary

Brings the Go uptime example (uptime/) in line with the TypeScript one in #275: the same frontend, text and layout, on current dependencies.

Frontend

  • Upgraded Vite 3 → 8, React 18 → 19, Tailwind 3 → 4 (via @tailwindcss/vite), TypeScript 4 → 7, and TanStack Query to the latest v5.
  • Default shadcn/ui look: Button, Card, Input and Badge components in frontend/src/components/ui, with the neutral theme.
  • Adds one-click example sites, "Check all now" (cron jobs don't run locally), a per-site "Check" button, up/down counts, and an info sidebar. Topic names and doc links are adapted for Go.
  • Removed Jest, Babel, PostCSS, the Tailwind 3 config, luxon, headlessui, heroicons, and the cross-fetch / fetch-ponyfill / whatwg-fetch polyfills.
  • Tests now use Vitest and Testing Library, and mock fetch with vi.hoisted. The generated client binds its methods and captures fetch when it's imported, so spying on its methods (the old Jest approach) has no effect.
  • The client is regenerated with the current CLI and moved to src/lib/client.ts. It keeps the {{ENCORE_APP_ID}} placeholder, which encore app create replaces with each user's app ID.
  • Tailwind is told not to scan the committed dist. Without that, it picks up class names from previous builds.

How it's served

  • Unchanged: frontend/dist is committed and embedded with go:embed, so encore run serves it on localhost:4000 with no Node.js needed.
  • For hot reloading, run npm run dev in frontend/ next to encore run. It opens on localhost:5173 and calls the API on :4000. The README documents this, and fixes the old frontend URL (/frontend/ → /).

Backend

  • Updated encore.dev v1.12.0 → v1.57.13, gorm 1.31, the gorm postgres driver 1.6 (pgx v5), and x/sync 0.23.
  • site.Add now returns already_exists ("site is already being monitored") for duplicate URLs, instead of showing the raw Postgres error in the UI. A test covers it.

Deploy time

Measured on Encore Cloud: one staging app, alternating between main and this branch, timed from git push encore until staging served that version. The first deploy (163s, setting up databases and Pub/Sub) is excluded.

Version Run 1 Run 2
Before: main 32s 34s
After: this PR 42s 35s

No meaningful change, as expected. Encore Cloud doesn't run npm for Go apps, and frontend/dist is committed prebuilt in both versions, so the frontend changes don't affect the build. The new version averages about 5s slower, which is within the run-to-run spread. If it's real, the likely cause is the newer Go modules (encore.dev v1.57, gorm 1.31).

Test plan

  • encore run, then in the browser: added sites from the form and the example buttons, ran Check, Check all now and Remove, and added a duplicate URL
  • npm run dev on :5173 loads data from the API on :4000
  • npm test in frontend/ passes 6/6
  • encore test ./... passes, including the new TestAddDuplicate
  • npm run build output matches the committed dist

🤖 Generated with Claude Code


View with [code]smith Autofix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.

Bring the Go uptime example in line with the TypeScript one: the same
shadcn/ui frontend, text and layout, on current Vite, React, TanStack
Query and Tailwind 4. Tests move from Jest/Babel to Vitest and mock
fetch, since the generated client binds its methods and captures fetch
at import. The built frontend stays committed and embedded with
go:embed, so `encore run` serves it without Node.js.

Also update encore.dev and the other Go modules, and return
AlreadyExists instead of a raw Postgres error when adding a site that
is already monitored.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@simon-johansson
simon-johansson requested a review from eandre October 1, 2026 17:49
@lennartp
lennartp merged commit 44fafd9 into main Oct 15, 2026
3 checks passed
@lennartp
lennartp deleted the t3code/uptime-go-frontend branch October 15, 2026 13:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants