/Article

React, Next.js, and Me: Why I Keep Coming Back

/Article

React, Next.js, and Me: Why I Keep Coming Back

Publish Date

Categories

Tech Stack

Publish Date

Categories

Tech Stack

React, Next.js, and Me: Why I Keep Coming Back

Article content

After trying various frameworks and tools, I keep landing back on React and Next.js. Not because they're trendy, but because they solve real problems without creating new ones.

The Component Mental Model

React's component approach mirrors how I think about interfaces. Everything is a composable piece that does one thing well. Once you build a button component, it works everywhere:

// Build once, use everywhere
export default function Button({ variant = 'primary', children, onClick }) {
  return (
    <button 
      className={`btn btn-${variant}`}
      onClick={onClick}
    >
      {children}
    </button>
  );
}

// Then use it consistently
<Button variant="primary">Save</Button>
<Button variant="secondary">Cancel</Button>
// Build once, use everywhere
export default function Button({ variant = 'primary', children, onClick }) {
  return (
    <button 
      className={`btn btn-${variant}`}
      onClick={onClick}
    >
      {children}
    </button>
  );
}

// Then use it consistently
<Button variant="primary">Save</Button>
<Button variant="secondary">Cancel</Button>
// Build once, use everywhere
export default function Button({ variant = 'primary', children, onClick }) {
  return (
    <button 
      className={`btn btn-${variant}`}
      onClick={onClick}
    >
      {children}
    </button>
  );
}

// Then use it consistently
<Button variant="primary">Save</Button>
<Button variant="secondary">Cancel</Button>

Props handle variations, composition handles complexity. No copying and pasting code across files, no hunting down inconsistencies.

Next.js Fills the Gaps

React handles the UI brilliantly but leaves routing, data fetching, and deployment up to you. Next.js provides opinions on these without feeling restrictive.

What I actually use:

  • File-based routing that just works

  • Server components for performance wins

  • API routes for quick backend needs

  • Built-in optimization that I don't have to think about

The ecosystem advantage matters more than people admit. When you need something, someone's already built it. Authentication, forms, animations, state management—the npm ecosystem means you're rarely starting from scratch. Time spent debugging obscure framework issues is time not spent building.

Nothing's perfect. The JavaScript ecosystem moves fast—sometimes too fast. Dependencies break, best practices shift, and yesterday's solution becomes today's anti-pattern. React's not the easiest entry point either. Concepts like hooks and state management take time to internalize.

But switching costs are real. My muscle memory, component libraries, and problem-solving patterns are all React-shaped now. The best tool isn't always the newest or most elegant—it's the one that lets you ship without friction.

Create a free website with Framer, the website builder loved by startups, designers and agencies.