Next.js is one of the top choices when you need performant and robust React.js server side rendering with smart code splitting on your front end. Things like smart code-splitting, routing, lazy loading, isomorphic state between server and client side (browser) or Webpack optimised configurations can be a hassle, but Next.js framework make your developing process go forward.

After almost two years building from an e-commerce to a publishing site using Next.js with Drupal + GraphQL on production, we learned valuable lessons which motivated us to build the next-on-drupal boilerplate, a collection of examples and tools in order to integrate Drupal best features with Next.js.

I'll share with you our most valuable lessons, showing to you how we integrate: Drupal’s dynamic routing, translations, layouts with contextual blocks, metatags, cache-tags and more.