Root cause of the all-black view: the gallery demo hardcoded
<MultiStepLoader loading /> (loading=true forever), which renders a
fixed inset-0 z-[100] backdrop-blur overlay over the entire viewport.
Replace with an interactive demo (button triggers loader, auto-resets
after 4s).
Also soften flat-black dark backgrounds:
- /ui page: dark:bg-black -> dark:bg-zinc-950 + subtle top radial gradient
- home hero: dark:bg-black -> dark:bg-zinc-950 + white 6% radial gradient
Replace create-next-app boilerplate home with a signature Aceternity hero:
- Spotlight glow top-left, SparklesCore particle field background
- Cover underlines 'animated UI out of the box'
- MagneticButton on the gallery CTA (href=/ui)
- Staggered fade-up entry via motion/react
Full gate: lint/typecheck/build/test/format green.
LayoutProps<'/'> is a Next-generated global type that only exists after
next typegen/build creates .next/types. Fresh CI clones fail tsc --noEmit
because .next doesn't exist yet. Use Readonly<{children}> — no dependency
on generated types.
- Added ESLint configuration for Next.js with custom global ignores.
- Created Next.js configuration file with basic setup.
- Initialized package.json with dependencies for Next.js, React, and TypeScript.
- Set up PostCSS configuration for Tailwind CSS.
- Added SVG assets for the project.
- Created TypeScript configuration file with strict settings and Next.js support.
- Defined custom type declarations for Next.js cache life and routing parameters.
- Implemented validation types for Next.js pages and layouts.
asepharyana