Book Image

Real-World Next.js

By : Michele Riva
Book Image

Real-World Next.js

By: Michele Riva

Overview of this book

Next.js is a scalable and high-performance React.js framework for modern web development and provides a large set of features, such as hybrid rendering, route prefetching, automatic image optimization, and internationalization, out of the box. If you are looking to create a blog, an e-commerce website, or a simple website, this book will show you how you can use the multipurpose Next.js framework to create an impressive user experience. Starting with the basics of Next.js, the book demonstrates how the framework can help you reach your development goals. You'll realize how versatile Next.js is as you build real-world applications with step-by-step explanations. This Next.js book will guide you in choosing the right rendering methodology for your website, securing it, and deploying it to different providers, all while focusing on performance and developer happiness. By the end of the book, you'll be able to design, build, and deploy modern architectures using Next.js with any headless CMS or data source.
Table of Contents (19 chapters)
1
Part 1: Introduction to Next.js
5
Part 2: Hands-On Next.js
14
Part 3: Next.js by Example

What this book covers

Chapter 1, A Brief Introduction to Next.js, serves as an introduction to the framework, showing how to set up a new project, customize its configurations, and (if needed) how to adopt TypeScript as the primary programming language for Next.js development.

Chapter 2, Exploring Different Rendering Strategies, dives into rendering methods, teaching the differences between server-side rendering, static site generation, incremental static regeneration, and more.

Chapter 3, Next.js Basics and Built-In Components, provides a complete explanation of the Next.js routing system and essential built-in components, focusing on search engine optimization and performance.

Chapter 4, Organizing the Code Base and Fetching Data in Next.js, covers some helpful tips about organizing a Next.js project and fetching data on both the server and client side.

Chapter 5, Managing Local and Global States in Next.js, introduces state management via React Context and Redux, teaching you how to handle local state (at the component level) and global state (application-wide).

Chapter 6, CSS and Built-In Styling Methods, introduces the basic styling methods built into Next.js, such as Styled JSX and CSS modules. It also shows how to enable the SASS preprocessor for local development and production builds.

Chapter 7, Using UI Frameworks, concludes the conversation around styling by introducing some modern UI frameworks, such as TailwindCSS, Chakra UI, and Headless UI.

Chapter 8, Using a Custom Server, explores the reasons why we might (and might not!) need a custom server for our Next.js applications. It also shows how to integrate Next.js with Express.js and Fastify, two of the most popular web frameworks for Node.js.

Chapter 9, Testing Next.js, introduces some unit and end-to-end testing best practices by adopting Cypress and react-testing-library.

Chapter 10, Working with SEO and Managing Performance, dives into SEO and performance enhancements by introducing useful tips and tricks for improving any Next.js application.

Chapter 11, Different Deployment Platforms, shows how to choose the right platform to host a Next.js app, depending on its features and many other aspects.

Chapter 12, Managing Authentication and User Session, describes how to manage user authentication securely by choosing the right authentication provider. It also shows how to integrate Auth0, a popular identity management platform, with any Next.js app.

Chapter 13, Building an E-Commerce Website with Next.js and GraphCMS, dives into creating a real-world Next.js e-commerce platform with Next.js, Chakra UI, and GraphCMS.

Chapter 14, Example Projects and Next Steps for Learning More, concludes the book by giving some valuable tips on how to proceed with learning the framework and provides some example projects to implement to acquire even more confidence with Next.js.