Golden Flash is a premium, production-ready template for photography studios, wedding and portrait photographers, product and editorial shooters, videographers, and small creative agencies. Built on Next.js 16, React 19, and TypeScript, it ships with 17 page templates covering 33 prerendered routes, five portfolio case studies with a keyboard-accessible lightbox, three bookable packages with a working cart and checkout, a nine-article blog with category filtering, and a fully editable content layer — no CMS or backend required.

A photographer is hired on the strength of about twelve pictures and how quickly a visitor can find the price. Golden Flash is styled with a hand-crafted CSS design system (no utility-framework lock-in) in a smoky-black and gold palette, with BDO Grotesk headlines set against Inter and motion applied with restraint — so every page keeps attention on the photographs rather than on the interface. Content lives in JSON or MDX files, so you can launch in hours.

Live demo: https://goldenflash-nextjs.vercel.app

Tech Stack

• Next.js 16 — App Router, server components, all 33 routes prerendered to static HTML
• React 19 — latest features; interactivity isolated to one script layer plus the cart
• TypeScript — strict mode, fully typed
• MDX content — articles, projects and packages as .mdx files (frontmatter parsed with gray-matter), served by [slug] dynamic routes
• Hand-crafted CSS design system — colors, type scale, and spacing as CSS custom-property tokens in one :root block; re-theme everything in one place
• Self-hosted fonts — BDO Grotesk and Inter served locally, no third-party font CDN
• No animation library — 165 scroll reveals, the nine-image hero scatter, two scroll-scrubbed sections, five endless belts, slot-machine counters, the follow-cursor, the navigation overlay, the FAQ accordions, the category tabs and the project lightbox in one TypeScript file, no GSAP and no jQuery
• Client-side storefront — cart and order state in localStorage, no database, no vendor SDK

Included Pages and Templates

• Home — a scroll-driven story: the nine-image hero mosaic that scatters in on load, the studio introduction, the feature belt, the portfolio mosaic, an FAQ, the services list, the scroll-scrubbed process sequence, the three pricing packages, the testimonial belt, and a discovery-call panel
• About — the studio story, the client logo belt, the reasons to book, the foundations, the strategy panel, the team, and the awards row
• Portfolio — a sticky scroll-linked stack of five projects with a follow-cursor
• Project — 5 case study pages with the client, year and type, a full-bleed banner, Introduction, Challenges and Solutions panels, a two-image lightbox gallery, and a related-projects strip
• Blog — a directory with five category tabs over nine articles, plus 9 article pages with a hero, author block, pull quotes, full-width figures and a related strip
• Pricing — three package cards with the full feature comparison table, plus an FAQ
• Package — 3 detail pages with the included list, the notes, add-to-cart, and an FAQ
• Storefront — a cart drawer in the navigation bar, checkout, a PayPal checkout variant, and an order confirmation page
• Contact — enquiry form, studio details and an FAQ
• Utility — Style Guide, Changelog, License, 401 (password), 404

17 page templates, 33 prerendered routes.

Easy Content Editing

No CMS needed — content lives in editable files you can change in any text editor:

• Articles — src/content/blog/*.mdx. Frontmatter carries the title, standfirst, date, reading time, category, author and the banner and thumbnail images.
• Projects — src/content/portfolio/*.mdx. Frontmatter carries the client, the year, the project type, the four photographs the page prints and the two-image gallery. The body holds the Introduction, Challenges and Solutions copy.
• Packages — src/content/packages/*.mdx. Frontmatter carries the package name, the price, the included list and the id the basket stores the item under. The body holds the closing notes.
• Writing a body — plain prose, not markdown: paragraphs, ## headings, > pull quotes, - list items and full-width figures. The page component puts each one inside the design's own markup, so the words are yours and the layout stays exactly as designed. No special syntax to learn.
• Listing order — src/content/collections.json records what a per-item file cannot state: which articles the blog directory lists under each of its five category tabs, the order the related strips draw from, the order the portfolio stacks its projects in, which project sits in which slot of the home mosaic, and the arrangement of the home pricing row.
• Theme — brand colors, fonts, type scale, and spacing are CSS custom properties at the top of public/assets/css/styles.css — change them once to re-skin the whole site.
• Navigation, footer and cards — shared components edited once in src/components/.

Performance and SEO

• Static-rendered pages out of the box (App Router) — all 33 routes prerendered, including every article, project and package page
• Lazy-loaded imagery throughout, WebP artwork with responsive srcsets
• Self-hosted fonts — no third-party CDN requests at runtime
• Per-page titles and metadata via the Next.js Metadata API (generateMetadata on dynamic routes), with Open Graph and Twitter cards
• Semantic HTML structure, a single H1 per page, a route-aware active navigation state, and clean, crawlable URLs
• Keyboard-navigable tabs, menus and disclosures, a lightbox that takes focus and closes on Escape, and every animation respects the reduced motion setting

Deployment

One-click deploy to Vercel — build settings are auto-detected. Also runs on Netlify, AWS Amplify, Cloudflare Pages, or any Node 20+ host.

What You Get

• Full Next.js 16 + TypeScript source code
• 17 page templates covering 33 prerendered routes
• Content collections: 9 articles, 5 projects and 3 packages as MDX, plus the listing order as JSON
• A working cart and checkout flow, ready to point at your payment provider
• Self-contained HTML documentation
• Comprehensive README with setup and editing guide
• Friendly buyer support

Requirements

• Node.js 20 or higher
• Basic familiarity with the command line
• A text editor (VS Code recommended)