Next.js 15Anime.js v4React 19TypeScript 5Tailwind CSS

Dinosaur Foundation

A scroll-driven landing experience for Dinosaur Foundation with animated storytelling, video backgrounds, analytics instrumentation, and production-ready deployment setup.

Project Overview

Built an immersive landing page with Next.js App Router, React, TypeScript, Tailwind CSS, and Anime.js. Implemented responsive desktop and mobile animation timelines with Anime.js onScroll, media-query scoped animation logic, and section-based state management. Developed interactive media features including video backgrounds, poster preloading, audio playback controls, loading progress flow, and dynamic overlay backgrounds. Added OpenGraph/Twitter metadata, Google Analytics, Microsoft Clarity, sitemap/robots support, commit SHA metadata, client error forwarding, and internal cache revalidation endpoints.