▲ Next.js

Next.js App Router Pattern

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

// app/documents/[id]/page.tsx
import { Metadata } from 'next';
import { notFound } from 'next/navigation';

interface Props {
  params: { id: string };
}

// Generate metadata for SEO
export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const document = await getDocument(params.id);
  return {
    title: document.title,
    description: document.summary,
    openGraph: {
      title: document.title,
      description: document.summary,
    },
  };
}

// Static generation for known paths
export async function generateStaticParams() {
  const documents = await getAllDocumentIds();
  return documents.map((id) => ({ id }));
}

// Server Component - no client JavaScript
export default async function DocumentPage({ params }: Props) {
  const document = await getDocument(params.id);
  
  if (!document) {
    notFound();
  }
  
  return (
    <article>
      <h1>{document.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: document.content }} />
      <Comments documentId={params.id} />
    </article>
  );
}

Next.js Project Structure

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

app/
├── (marketing)/
│   ├── page.tsx          # Home page
│   ├── about/
│   └── pricing/
├── (app)/
│   ├── layout.tsx        # Authenticated layout
│   ├── dashboard/
│   ├── documents/
│   │   ├── [id]/
│   │   │   ├── page.tsx
│   │   │   └── loading.tsx
│   │   └── page.tsx
│   └── settings/
├── api/
│   └── v1/
│       └── documents/
├── components/
├── lib/
└── middleware.ts

Frequently Asked Questions

How much does it cost to hire a Next.js developer?

Next.js developer hourly rates: Junior $25-50/hr, Mid-level $50-100/hr, Senior $100-200+/hr in the US. Western Europe: $80-120/hr. Eastern Europe: $40-70/hr. Full-time US salaries: Junior $80,000-100,000, Mid $100,000-130,000, Senior $130,000-180,000+. Effective rates start at $50/hour with prepaid packages. See pricing for details with production Next.js experience.

What is the average Next.js developer salary in 2025?

Next.js developer salaries in the US: Junior $80,000-100,000, Mid-level $100,000-130,000, Senior $130,000-200,000+. High-cost areas (SF, NYC) can exceed $200,000 for senior roles. Specializations that increase salary: SSR/SSG expertise, TypeScript, performance optimization, GraphQL integration. Next.js skills command 10-20% premium over plain React.

Next.js vs React: which should I choose for my project?

Choose Next.js for: SEO-critical sites, marketing pages, e-commerce, content sites, apps needing fast initial loads. Choose plain React for: internal dashboards, admin panels, SPAs where SEO doesn’t matter. Next.js is React with added server capabilities, it’s the recommended way to build React apps in 2025. I recommend Next.js for most new projects.

App Router vs Pages Router: which Next.js router should I use?

Choose App Router (Next.js 13+) for: new projects, React Server Components, better caching, layouts. Choose Pages Router for: existing projects, simpler mental model, if team isn’t ready for RSC. App Router is the future but has a learning curve. For new projects, I recommend App Router; for migrations, I help plan gradual adoption.

How do you deploy Next.js applications in production?

Deployment options: Vercel (optimal for Next.js, recommended), AWS (Amplify, Lambda, or self-hosted on ECS/EC2), Cloudflare Pages, Docker containers. Vercel provides best DX and automatic optimizations. Self-hosted gives more control and can reduce costs at scale. I help choose based on your infrastructure, cost, and control requirements.

Related

Experience:

• Senior Engineer at Last Call Media
• Fullstack Engineer at PipelinePharma

Case Studies: Next.js Performance Optimization | GraphQL API Modernization

Related Technologies: React, TypeScript, GraphQL, PostgreSQL