Files
artsite/content/projects/artsite.md

2.5 KiB

slug, title, type, description, publishedAt, readingTime, favorite, status, tags, icon
slug title type description publishedAt readingTime favorite status tags icon
artsite ArtSite - Personal Research Hub Personal Project My digital headquarters. A high-performance portfolio built on the Edge using the full Nuxt ecosystem, deployed to Cloudflare Workers via Wrangler. 2024-06-01 2 true Active
Nuxt
NuxtHub
Cloudflare Workers
Wrangler
TypeScript
i-ph-globe-hemisphere-west-duotone

ArtSite is my digital headquarters—a unified platform serving as my engineering portfolio and experimental lab.

More than just a static site, it is a modern Portfolio designed to be fast, accessible, and type-safe. It serves as a live production environment where I experiment with the latest frontend technologies and Edge computing paradigms.

The Nuxt Stack Architecture

This project is built entirely on the Nuxt ecosystem, leveraging the synergy between its modules for maximum developer experience and performance.

Core Engine

  • Nuxt 3: The meta-framework providing the backbone (SSR, Auto-imports, Modules).
  • Nitro: The high-performance server engine that powers the API routes and renders the app at the Edge.

Infrastructure & Deployment

  • Cloudflare Workers: The application runs entirely on Cloudflare's global serverless network (SSR), ensuring minimal latency and high resilience.
  • Wrangler: The command-line tool used for precise deployment pipelines and worker configuration.
  • NuxtHub: Integrated specifically for advanced cache management and unifying Cloudflare platform features (KV, D1, Blob) within the Nuxt runtime.

Content & Data

  • Nuxt Content: A Git-based Headless CMS that treats Markdown as a database.
  • Nuxt Studio: A live visual editor allowing for seamless content management directly from the browser.

Interface & Design

  • Nuxt UI: A comprehensive component library built on Headless UI and Tailwind CSS.
  • Tailwind CSS: Utility-first styling for rapid and responsive design.

Quality Assurance

  • TypeScript: Strict type safety across the entire stack (Frontend & Backend).
  • Zod: Runtime schema validation for API inputs and environment variables.