Bcordes

Overview

A full-stack portfolio site serving as the public face of BC Solutions, LLC. Visitors can browse completed work, learn about services offered, and reach out through a validated contact form. An authenticated admin dashboard provides message management.

Architecture

Built on TanStack Start with Nitro as the server runtime, the site follows a BFF (Backend-for-Frontend) pattern. The browser never communicates directly with backend services — all data flows through type-safe server functions that handle auth, secrets, and API calls server-side.

Key Features

• Content Pipeline — Projects and blog posts with type-safe metadata and React components for full styling control
• OIDC Authentication — Authorization code + PKCE flow against an OpenIddict provider, with sealed cookie sessions and transparent token refresh
• Contact System — React Hook Form with Zod validation, submitted through server functions to the Wallow backend
• Admin Dashboard — Protected panel for reviewing and managing incoming contact submissions

Technical Highlights

• Server Functions — RPC-style data fetching via TanStack Start, keeping API tokens and secrets off the client
• File-Based Routing — TanStack Router with type-safe route params and search params
• SSR — Server-side rendering for fast initial loads and SEO
• Dark Mode — Theme toggling with custom design tokens
• CI/CD — GitHub Actions building multi-stage Alpine Docker images, pushed to GHCR and deployed via Portainer