Skip to main content
All versions below are taken from package.json. Ranges (e.g. ^15.5.7) indicate the minimum installed version; the lockfile pins the exact resolved version.

Core framework

PackageVersionPurpose
next^15.5.7React framework providing App Router, Server Components, API routes, and built-in optimizations
react^18.2.0UI library — concurrent rendering, Suspense, and hooks
react-dom^18.2.0DOM renderer for React
typescript^5Static typing across the entire codebase
tailwindcss^4.1.9Utility-first CSS with the v4 engine (PostCSS-based, no config file required for core)
Why Next.js 15? The App Router enables per-route Server Components, which keep Supabase credentials server-side and reduce client bundle size. Streaming SSR speeds up the initial page load for the media-heavy landing page. Why Tailwind CSS v4? The v4 engine drops the tailwind.config.js class-scanning requirement in favor of CSS-first configuration, reducing build complexity. Custom design tokens (navy palette, spacing variables, font variables) are defined directly in CSS.

UI components

PackageVersionPurpose
shadcn/ui (via components.json)New York styleAccessible, unstyled-first component library built on Radix UI primitives
@radix-ui/react-*1.x – 2.xHeadless, accessible primitives (accordion, dialog, popover, select, tooltip, and more)
framer-motion^12.23.25Declarative animation library used for page transitions and scroll-triggered reveals
motion^12.23.24Framer Motion’s standalone motion package (used alongside framer-motion)
gsap^3.13.0Timeline-based animation for complex, sequenced effects
locomotive-scroll^4.1.4Smooth scroll with inertia and scroll-triggered callbacks
@paper-design/shaders-reactlatestWebGL shader effects used for the decorative paper-grain backgrounds
lucide-react^0.454.0Icon library — 1 000+ consistent SVG icons as React components
react-icons^5.5.0Additional icon sets not available in Lucide
geistlatestVercel’s Geist font (supplementary to the Google Fonts loaded in layout.tsx)
Why Framer Motion + GSAP? Framer Motion handles component-level declarative animations (entry/exit, layout). GSAP handles complex, sequenced, timeline-based animations where fine-grained control over easing and staggering is required. The two libraries complement each other. Why shadcn/ui? Components are copied into the codebase (components/ui/) rather than installed as a black-box package, so they can be customized freely without fighting an upstream API.

Forms and validation

PackageVersionPurpose
react-hook-form^7.60.0Performant form state management with minimal re-renders
@hookform/resolvers^3.10.0Adapter connecting React Hook Form to Zod schemas
zod3.25.67Schema declaration and runtime validation for form data
react-phone-number-input^3.4.12International phone number input with country flag selector
react-day-picker^9.10.0Accessible date and date-range picker
date-fns^4.1.0Date formatting and arithmetic utilities used with react-day-picker
chrono-node^2.8.4Natural language date parsing (e.g. “next Sunday” → Date)
@internationalized/date^3.9.0Timezone-aware date primitives from React Aria
react-aria-components^1.12.2Accessible React Aria component wrappers
react-dropzone^14.3.8Drag-and-drop file upload for seva submission forms
input-otp1.4.1One-time password input component
Why React Hook Form + Zod? React Hook Form avoids controlled-input overhead — the registration form has many fields and must stay responsive. Zod schemas serve as the single source of truth for both client-side validation and TypeScript type inference.

Backend and storage

PackageVersionPurpose
@supabase/supabase-js^2.57.4Supabase JavaScript client — database queries, realtime, and auth
@supabase/ssr^0.8.0SSR-compatible Supabase client for Server Components and middleware
@aws-sdk/client-s3^3.922.0AWS S3-compatible client used to interact with Cloudflare R2
@aws-sdk/s3-request-presigner^3.922.0Generates pre-signed URLs for temporary R2 access
Why Supabase? Supabase provides a managed PostgreSQL database, Row Level Security, and Google OAuth out of the box — eliminating the need to build an auth system or manage a database server. The @supabase/ssr package handles cookie-based session management in Next.js Server Components. Why Cloudflare R2? R2 is S3-compatible (enabling the AWS SDK) but has no egress fees, which matters for a media-heavy event site serving audio and large images. Cloudflare Images sits in front for responsive delivery.

Data visualization

PackageVersionPurpose
recharts2.15.4Chart library used in the admin dashboard for arrival-by-date and Mandal breakdown visualizations

Media and interactivity

PackageVersionPurpose
embla-carousel-react^8.5.1Touch-friendly, accessible carousel for photo galleries
embla-carousel-autoplay^8.6.0Autoplay plugin for Embla Carousel
swiper^12.0.2Alternative carousel used in specific gallery sections
media-chrome^4.14.0Web components for custom HTML5 video player controls
canvas-confetti^1.9.3Canvas-based confetti animation shown on registration success
pdfjs-dist^3.11.174PDF rendering for in-browser document previews

Notifications and UX utilities

PackageVersionPurpose
sonner^1.7.4Toast notification system — wraps the Sonner library
cmdk^1.0.4Command palette component
vaul^0.9.9Drawer component for mobile bottom sheets
react-resizable-panels^2.1.7Resizable split-panel layouts used in the admin dashboard

Styling utilities

PackageVersionPurpose
clsx^2.1.1Conditional class name joining
tailwind-merge^2.5.5Merges Tailwind classes without specificity conflicts
class-variance-authority^0.7.1Variant-based component API (used by shadcn/ui)
tailwindcss-animate^1.0.7Tailwind plugin for CSS animation utilities
tw-animate-css1.3.3Additional animate.css-compatible Tailwind animations
@emotion/is-prop-validlatestFramer Motion peer dependency for prop filtering

Analytics and performance

PackageVersionPurpose
@vercel/analytics1.3.1Page view and event analytics via Vercel
@vercel/speed-insights^1.3.1Real User Monitoring (RUM) for Core Web Vitals

Build tooling (dev dependencies)

PackageVersionPurpose
typescript^5TypeScript compiler
@types/node^22Node.js type definitions
@types/react^18.2.0React type definitions
@types/react-dom^18.2.0ReactDOM type definitions
@tailwindcss/postcss^4.1.9PostCSS plugin for Tailwind CSS v4
postcss^8.5CSS transformation pipeline

Notable build configuration

Several defaults are overridden in next.config.mjs to suit the platform’s needs:
next.config.mjs
const nextConfig = {
  eslint: {
    ignoreDuringBuilds: true,       // ESLint runs separately in CI
  },
  typescript: {
    ignoreBuildErrors: true,         // Type errors don't block production builds
  },
  images: {
    unoptimized: true,               // Cloudflare Images handles all optimization
  },
  experimental: {
    optimizePackageImports: ['framer-motion'],  // Tree-shake animation library
  },
}
The webpack configuration also disables the canvas module (a pdfjs-dist peer dependency) for environments where it is unavailable:
next.config.mjs (webpack)
config.resolve.fallback.canvas = false
config.plugins.push(new webpack.IgnorePlugin({ resourceRegExp: /^canvas$/ }))
typescript.ignoreBuildErrors: true means type errors will not fail CI unless you run tsc --noEmit separately. Add a dedicated type-check step to your pipeline if type safety in production builds is required.

Build docs developers (and LLMs) love