feat(fullstack): implement observability and redesign frontend UI
Build & Push Docker Images / test-backend (push) Failing after 36s
Build & Push Docker Images / test-frontend (push) Successful in 29s
Build & Push Docker Images / build-backend (push) Has been skipped
Build & Push Docker Images / build-frontend (push) Has been skipped
Build & Push Docker Images / deploy (push) Successful in 7s
Build & Push Docker Images / test-backend (push) Failing after 36s
Build & Push Docker Images / test-frontend (push) Successful in 29s
Build & Push Docker Images / build-backend (push) Has been skipped
Build & Push Docker Images / build-frontend (push) Has been skipped
Build & Push Docker Images / deploy (push) Successful in 7s
This commit introduces comprehensive observability for both backend and frontend, alongside a major UI/UX overhaul to align with modern design standards (Material 3 inspired) and improve localization. Backend changes: - Integrated OpenTelemetry SDK for distributed tracing. - Added Pino for structured JSON logging with OTel instrumentation for trace/span correlation. - Configured OTLP exporters to route traces and logs to Grafana Alloy. - Updated docker-compose to include necessary environment variables for observability. Frontend changes: - Integrated Grafana Faro for Real User Monitoring (RUM), capturing Web Vitals, JS errors, and user interactions. - Redesigned the entire UI using a new color palette and Material 3 design principles. - Refactored component architecture (App, Home, Search, Scanner, Profile, Alerts views) for better state management and navigation. - Improved mobile UX with a redesigned Bottom Navigation bar and Top Bar. - Localized the interface to Spanish (es). - Updated assets, icons, and PWA configuration (manifest, icons). - Refactored CSS to use a centralized design token system (CSS variables). Observability enables better debugging and performance monitoring across the entire stack.
This commit is contained in:
@@ -0,0 +1,18 @@
|
||||
# Grafana Faro (browser RUM) — Vite build-time env vars.
|
||||
# These are inlined into the production bundle at build time.
|
||||
# Copy to .env and adjust as needed for local dev.
|
||||
|
||||
# OTLP HTTP endpoint of the Grafana Alloy collector.
|
||||
# In Docker on the same host as Alloy, use http://localhost:4318 (the
|
||||
# container's perspective of the host). For external deploys, use the
|
||||
# Alloy's public URL, e.g. https://alloy.example.com.
|
||||
VITE_FARO_ENDPOINT=http://localhost:4318
|
||||
|
||||
# App name shown in Grafana Explore / Faro data source.
|
||||
VITE_FARO_APP_NAME=farmafinder-frontend
|
||||
|
||||
# Environment label (production | staging | development).
|
||||
VITE_FARO_ENV=production
|
||||
|
||||
# App version (set by CI from the package version or git tag).
|
||||
VITE_FARO_APP_VERSION=1.0.0
|
||||
Reference in New Issue
Block a user