Master Next.js with Patterns

Become a better developer, one Pattern at a time.

Easy to understand, practical, and full of examples.

Patterns are self‑paced, self‑contained, goal‑oriented, multimedia courses.

Wow, that's a mouthful. Let me rephrase.

Each Pattern is a course on its own that will teach you how to solve a precise problem. For instance serving files from Next.js, or using client-only code in your React components.

A Pattern combines text content, code samples, videos and practical exercices. My experiences with students taught me that this is the best way to learn and memorize new concepts.

New Patterns will come up regularly. The first Pattern is already out, you can preview the course content for free.

You can also join the newsletter to be informed when new Patterns are released and benefit from a 50% reduction on the first Pattern.

The first Pattern is out!

«Manage client-only code with React "Browser Components"»

Never hit the "window not defined" and "hydration mismatch" errors again! This course delves into the intricacies of managing client-side JavaScript code within server-rendering technologies such as Next.js.

Check it out!

This course has a text version and a video for each section, for a total of almost an hour of content.

It also includes a demonstration codebase and optional exercises.

Some works from the author

Patterns are based on the author's research works on the topics of Next.js, Server-Side Rendering and web development in general.

These works have been published on renowned publications like Smashing Magazine or Prismic Blog.

Leveraging Server Context for Advanced Next.js Optimization Patterns

Leveraging Server Context for Advanced Next.js Optimization Patterns

In this article, I focus on the concept of “server cache”. We learn why accessing this context or extending it is very important, and how it can be done in practice, through the example of Next.js 13’s new methods: “headers()”, “cookies()”, patched fetch() and React 18 cache.

Read on Prismic Blog

A New Pattern For The Jamstack: Segmented Rendering

A New Pattern For The Jamstack: Segmented Rendering

Among all possible architectures for rendering a website, static rendering is the most performant. Yet, it’s only applicable to public, generic content. Or is it? In this article, we will push the boundaries of static rendering and learn how to apply it to personalized content. This new pattern is called “Segmented Rendering” and will change the Jamstack game forever.

Read on Smashing Magazine

Recommended by the best

Eric's knowledge of the intricacies of Next.js and the pros and cons of all the different server and client architecture goes far beyond any other developer I've worked with, to the point where he could probably write a PhD dissertation on the topic if he wanted to.
The course is very enjoyable, and I appreciate the hands-on approach where you actually have to write some code. The explanations are thorough but not boring, and you gain a clear grasp of the problem before diving into the specific Next.js pattern.

Hi, my name is Eric Burel

And I'll be your teacher for this course, pleased to meet you!

I am an engineer and teacher from France. You may know me from the State of JavaScript/CSS/HTML surveys that I help maintaining.

A few years ago I made the bet that Next.js would become a major technology, and I've never been so right in my life.

Since then, I've been teaching Next.js and web development to various organizations in France and abroad. Next.js Patterns is built upon the knowledge I've gathered both as a developer and a teacher.

I hope you'll enjoy following this course as much as I've enjoyed writing it!

Eric Burel picture

Be informed when new Patterns are released

Gain access to all the Patterns or only the ones you need. Level up your coding skills one Pattern at a time.

Each new Pattern is released in early access with a limited time 50% discount, until the final version with videos is published.