Project Overviewlink

SaaSify is a Next.js + Tailwind CSS SaaS landing page template by Metronic, featuring built-in component libraries such as Shadcn UI, ReUI, and MagicUI, with dark mode support for quickly building modern product marketing pages.

Tech Stacklink

• Framework: Next.js 15.3.3 + React 19
• Styling: Tailwind CSS 4.x
• Component Libraries: Shadcn UI + Radix UI
• Animation: Framer Motion + Motion
• Forms: React Hook Form + Zod
• Icons: Lucide React

Project Structurelink

metronic-tailwind-nextjs-landings/saas/
├── app/                    # Next.js App Router pages
├── pages/                  # Pages Router (API routes)
│   └── api/hello.ts
├── public/                 # Static assets
├── src/                    # Component source code
├── next.config.ts
├── tailwind.config.js
├── postcss.config.mjs
├── tsconfig.json
└── package.json

Key Fileslink

• package.json — Dependency declarations and npm scripts
• next.config.ts — Next.js configuration
• tailwind.config.js — Tailwind CSS configuration
• pages/api/hello.ts — Example API route
• postcss.config.mjs — PostCSS configuration
• tsconfig.json — TypeScript configuration

Quick Startlink

# Install dependencies
npm install --force

# Start development server
npm run dev

# Production build
npm run build

# Start production server
npm run start

The development server runs at http://localhost:3000.

Usage Noteslink

This template is suitable for SaaS product websites or marketing landing pages. It uses the pages/ directory structure (rather than App Router). Refer to the official documentation to customize page routes and API endpoints.