# Eri in Germany — Full Content for AI Agents > AI-optimized content of key pages and project structure. Each section contains the URL followed by the page or module description. --- ## Homepage URL: https://eriingermany.com/ Eri in Germany is a personal brand website for Eri, a content creator based in Usingen, Germany (near Frankfurt). The site showcases her portfolio, blog content about life in Germany, brand collaborations, and practical resources for expats and fellow creators. ### Featured Sections - **About** — Creator bio and background - **Portfolio** — Recent brand collaborations and creative work - **Blog** — WordPress-powered posts about German life - **Tools** — Interactive guides (expat toolkit, visa navigator) - **Collaborate** — Brand partnership inquiry ### Quick Navigation - /about — About page - /portfolio — Portfolio gallery - /posts — Blog archive - /tools — Interactive tools - /contact — Contact form - /collaborate-with-eri-in-germany — Brand collaboration --- ## About URL: https://eriingermany.com/about Eri is a content creator from Usingen, Germany. She creates content about life in Germany as an international resident, covering expat experiences, German culture, daily vlogs, and practical living guides. Her content spans Instagram (@ertiqua), YouTube (@EriInGermany), and TikTok (@eriingermany). --- ## Portfolio URL: https://eriingermany.com/portfolio Showcase of Eri's brand collaborations and creative work. Displays partnerships with brands across lifestyle, travel, and expat-service categories. Each portfolio piece includes collaboration details, content samples, and results. --- ## Blog URL: https://eriingermany.com/posts WordPress-powered blog with categories covering: - Life in Germany - Expat experiences - German culture and traditions - Travel within Germany and Europe - Practical guides and tips - Personal stories and updates Posts are sourced from a headless WordPress backend via REST API with server-side pagination and automatic cache revalidation through WordPress webhooks. --- ## Tools URL: https://eriingermany.com/tools Interactive tools for expats and creators: - **Expat Toolkit** — Practical guides for moving to, living in, and navigating Germany - **Visa Navigator** — Step-by-step visa application guides - **Moving Checklist** — Comprehensive moving-to-Germany checklist --- ## Collaborate URL: https://eriingermany.com/collaborate-with-eri-in-germany Brand collaboration page detailing: - Audience demographics and reach - Collaboration types (posts, videos, reviews) - Partnership process - Contact for inquiries --- ## Tech Stack Details ### Framework & Runtime - **Next.js 16** with App Router, React 19, TypeScript - **Turbopack** in development (`pnpm dev` with turbo mode) - **Cloudflare deployment** via OpenNext ### Styling - **Tailwind CSS v4** with `@tailwindcss/postcss` - **shadcn/ui** components built on Radix UI primitives - Custom fonts: Bricolage Grotesque (display), DM Sans (body), Caveat (accent), DM Mono (monospace) - **framer-motion** for animations - **lucide-react** icons ### Data Layer - **WordPress REST API** via centralized `lib/wordpress.ts` client - Type definitions in `lib/wordpress.d.ts` — Post, Page, Category, Tag, Author, FeaturedMedia - Two fetch patterns: `wordpressFetch` (throws on error) and `wordpressFetchGraceful` (returns fallback) - `WordPressAPIError` class for consistent error handling - Cache tags for granular revalidation: `['wordpress', 'posts', 'post-{id}', 'posts-page-{n}']` - Default cache: 1 hour (`revalidate: 3600`) - Graceful degradation — builds succeed even when WordPress is unavailable ### Server Components & Data Fetching - Parallel `Promise.all()` calls in Server Components - `generateStaticParams()` via `getAllPostSlugs()` for static generation - URL-based state for search/filters via `searchParams` - Debounced search (300ms) in `SearchInput` component - Next.js 15+ async params pattern: `params: Promise<{ slug: string }>` ### Revalidation Flow 1. WordPress plugin sends webhook to `/api/revalidate` 2. Validates `x-webhook-secret` header against `WORDPRESS_WEBHOOK_SECRET` 3. Calls `revalidateTag()` for specific content types (posts, categories, tags, authors) 4. Also calls `revalidatePath("/", "layout")` for full site refresh ### Routes | Route | Type | Description | |-------|------|-------------| | `/` | Static | Homepage | | `/about` | Static | About page | | `/portfolio` | Static | Portfolio gallery | | `/posts` | Dynamic | Blog archive with pagination | | `/posts/[slug]` | Dynamic | Individual blog post | | `/posts/authors` | Dynamic | Author archive | | `/posts/categories` | Dynamic | Category archive | | `/posts/tags` | Dynamic | Tag archive | | `/tools` | Static | Interactive tools hub | | `/expat-toolkit` | Static | Expat resource guides | | `/visa-navigator` | Static | Visa guidance | | `/moving-checklist` | Static | Moving checklist | | `/my-everyday-in-deutschland` | Static | Daily life content | | `/collaborate-with-eri-in-germany` | Static | Brand collab page | | `/recommends` | Static | Product recommendations | | `/contact` | Static | Contact form | | `/api/revalidate` | API | Webhook handler | | `/api/og` | API | OG image generation | ### Configuration - `site.config.ts` — Site metadata (domain, name, description, social links) - `menu.config.ts` — Navigation menu structure (mainMenu, contentMenu) - `next.config.ts` — Image remotePatterns for WordPress media, /admin redirect to WordPress, standalone output ### Layout Components Custom layout primitives (craft-ds v0.3.2 adaptation): - `Section` — Page sections with vertical padding - `Container` — Max-width container with horizontal padding - `Article` — Prose container for WordPress content - `Prose` — Typography styles for rich content - `Box` — Flex/grid layout with responsive props ### Environmental Variables ``` WORDPRESS_URL — Full WordPress REST API URL WORDPRESS_HOSTNAME — Domain for Next.js image optimization WORDPRESS_WEBHOOK_SECRET — Shared secret for webhook validation ``` ### Testing - **Vitest** with `@` path alias matching `tsconfig.json` - Tests mirror source structure: `__tests__/lib/*.test.ts` - Coverage: `lib/utils`, `lib/metadata`, `lib/wordpress`, `api/revalidate` - WordPress API tests mock `global.fetch` ### Scripts | Command | Description | |---------|-------------| | `pnpm dev` | Start dev server with Turbopack | | `pnpm build` | Production build | | `pnpm start` | Production server | | `pnpm lint` | ESLint | | `pnpm test` | All Vitest tests | | `pnpm deploy` | Build + deploy to Cloudflare | ### Key Dependencies - next@16, react@19, react-dom@19 - tailwindcss v4, @tailwindcss/postcss - shadcn/ui components (Radix primitives) - craft-ds layout primitives - framer-motion for animations - @vercel/analytics - jose (JWT), zod (validation), react-hook-form - jspdf (PDF generation) - googleapis (Google services) - next-themes (dark mode) - use-debounce, query-string, clsx, tailwind-merge --- ## Project Structure ``` / ├── app/ Next.js App Router pages │ ├── about/ │ ├── portfolio/ │ ├── posts/ Blog routes (dynamic) │ ├── tools/ │ ├── expat-toolkit/ │ ├── visa-navigator/ │ ├── layout.tsx Root layout (fonts, Nav, Footer, structured data) │ ├── page.tsx Homepage │ └── globals.css Global styles ├── components/ React components │ ├── layout/ Nav, Footer, GlobalStructuredData │ ├── posts/ PostCard, PostList, etc. │ ├── tools/ Interactive tool components │ ├── ui/ shadcn/ui primitives │ ├── home/ Homepage sections │ ├── creator/ Creator-specific components │ ├── portfolio/ Portfolio gallery components │ ├── contact/ Contact form components │ └── visa/ Visa navigator components ├── lib/ Shared utilities │ ├── wordpress.ts WordPress REST API client │ ├── wordpress.d.ts TypeScript type definitions │ ├── metadata.ts SEO metadata helpers │ ├── utils.ts cn() utility │ ├── utils.ts General utilities │ ├── affiliates.ts Affiliate link management │ ├── instagram.ts Instagram API integration │ ├── youtube.ts YouTube API integration │ ├── sounds.ts Sound effects/assets │ ├── creator-stats.ts Creator analytics │ ├── visa-data.ts Visa information data │ ├── partners.ts Partner/affiliate data │ └── article-content.ts Article content helpers ├── public/ Static assets │ ├── logos/ │ ├── portfolio-assets/ │ ├── series/ │ └── eri-logo.png ├── docs/ Documentation ├── scripts/ Utility scripts │ └── safe-dev.mjs Safe dev server startup ├── __tests__/ Vitest test files └── site.config.ts Site configuration ```