- Added: api-patterns, app-builder, architecture, bash-linux, behavioral-modes, clean-code, code-review-checklist, database-design, deployment-procedures, docker-expert, documentation-templates, game-development, geo-fundamentals, i18n-localization, lint-and-validate, mobile-design, nestjs-expert, nextjs-best-practices, nodejs-best-practices, parallel-agents, performance-profiling, plan-writing, powershell-windows, prisma-expert, python-patterns, react-patterns, red-team-tactics, seo-fundamentals, server-management, tailwind-patterns, tdd-workflow, typescript-expert, vulnerability-scanner - Updated README: skill count 179 → 223 - Added credit for vudovn/antigravity-kit (MIT License) Source: https://github.com/vudovn/antigravity-kit
2.0 KiB
2.0 KiB
name, description
| name | description |
|---|---|
| nextjs-static | Next.js static site template principles. Landing pages, portfolios, marketing. |
Next.js Static Site Template
Tech Stack
| Component | Technology |
|---|---|
| Framework | Next.js 14 (Static Export) |
| Language | TypeScript |
| Styling | Tailwind CSS |
| Animations | Framer Motion |
| Icons | Lucide React |
| SEO | Next SEO |
Directory Structure
project-name/
├── src/
│ ├── app/
│ │ ├── layout.tsx
│ │ ├── page.tsx # Landing
│ │ ├── about/
│ │ ├── contact/
│ │ └── blog/
│ ├── components/
│ │ ├── layout/ # Header, Footer
│ │ ├── sections/ # Hero, Features, CTA
│ │ └── ui/
│ └── lib/
├── content/ # Markdown content
├── public/
└── next.config.js
Static Export Config
// next.config.js
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
};
Landing Page Sections
| Section | Purpose |
|---|---|
| Hero | Main headline, CTA |
| Features | Product benefits |
| Testimonials | Social proof |
| Pricing | Plans |
| CTA | Final conversion |
Animation Patterns
| Pattern | Use |
|---|---|
| Fade up | Content entry |
| Stagger | List items |
| Scroll reveal | On viewport |
| Hover | Interactive feedback |
Setup Steps
npx create-next-app {{name}} --typescript --tailwind --app- Install:
npm install framer-motion lucide-react next-seo - Configure static export
- Create sections
npm run dev
Deployment
| Platform | Method |
|---|---|
| Vercel | Auto |
| Netlify | Auto |
| GitHub Pages | gh-pages branch |
| Any host | Upload out folder |
Best Practices
- Static export for maximum performance
- Framer Motion for premium animations
- Responsive mobile-first design
- SEO metadata on every page