Real-World Next.js: Build scalable, high-performance, and modern web applications using Next.js, the React framework for production
- Length: 366 pages
- Edition: 1
- Language: English
- Publisher: Packt Publishing
- Publication Date: 2022-02-28
- ISBN-10: 180107349X
- ISBN-13: 9781801073493
- Sales Rank: #616355 (See Top 100 Books)
Learn how to use Next.js for building web apps without compromising performance, user experience, and developer happiness
Key Features
- Develop scalable web applications using Next.js
- Use Next.js as a frontend for existing backends and e-commerce websites and understand how to implement it with any headless CMS
- Deploy Next.js on different platforms, such as Vercel, DigitalOcean, and AWS, or on your own server
Book Description
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.
What you will learn
- Get up to speed with Next.js essentials and learn how to build apps quickly
- Understand how to create scalable Next.js architectures
- Choose between different rendering strategies, such as client-side rendering (CSR), static site generation (SSG), server-side rendering (SSR), and incremental static regeneration (ISR)
- Write unit tests and integration tests in your Next.js application
- Discover the powerful routing system and Next.js’ built-in components
- Design and build modern architectures with Next.js using GraphCMS or any headless CMS
Who this book is for
This book is for web developers who want to improve their React skills by building scalable and maintainable full-stack applications using the modern Next.js web framework. Intermediate-level knowledge of ES6+, React, Node.js, and REST is assumed.
Real-World Next.js Contributors About the author About the reviewers Preface Who this book is for What this book covers To get the most out of this book Download the example code files Download the color images Conventions used Get in touch Share Your Thoughts Part 1: Introduction to Next.js Chapter 1: A Brief Introduction to Next.js Technical requirements Introducing Next.js Comparing Next.js to other alternatives Gatsby Razzle Nuxt.js Angular Universal So, why Next.js? Moving from React to Next.js Getting started with Next.js Default project structure TypeScript integration Custom Babel and webpack configuration Summary Chapter 2: Exploring Different Rendering Strategies Technical requirements Server-side rendering (SSR) Client-side rendering (CSR) Using the React.useEffect hook Using the process.browser variable Using dynamic component loading Static site generation Summary Chapter 3: Next.js Basics and Built-In Components Technical requirements Routing system Using route variables inside our pages Using route variables inside components Client-side navigation Serving static assets Next.js' automatic image optimization Running automatic image optimization on external services Handling metadata Grouping common meta tags Customizing _app.js and _document.js pages The _app.js page The _document.js page Part 2: Hands-On Next.js Chapter 4: Organizing the Code Base and Fetching Data in Next.js Technical requirements Organizing the folder structure Organizing the components Organizing utilities Organizing static assets Organizing styles Lib files Data fetching Fetching data on the server side Consuming REST APIs on the server side Fetching data on the client side Consuming REST APIs on the client side Consuming GraphQL APIs Summary Chapter 5: Managing Local and Global States in Next.js Technical requirements Local state management Global state management Using the Context APIs Using Redux Summary Chapter 6: CSS and Built-In Styling Methods Technical requirements Exploring and using Styled JSX CSS modules Integrating SASS with Next.js Summary Chapter 7: Using UI Frameworks Technical requirements An introduction to UI libraries Integrating Chakra UI in Next.js Building an employee directory with Chakra UI and Next.js Conclusive words about Chakra UI Integrating TailwindCSS in Next.js Integrating Headless UI Summary Chapter 8: Using a Custom Server Technical requirements About using a custom server Using a custom Express.js server Using a custom Fastify server Summary Chapter 9: Testing Next.js Technical requirements An introduction to testing Running unit and integration tests End-to-end testing with Cypress Summary Chapter 10: Working with SEO and Managing Performance Technical requirements SEO and performance – an introduction Rendering strategies, from a performance and SEO perspective The reasoning behind a real-world website example Rendering the image detail page Private routes A quick recap regarding our decisions Working with SEO Dealing with performance Summary Chapter 11: Different Deployment Platforms Technical requirements A brief introduction to different deployment platforms Deploying to the Vercel platform Deploying a static site to a CDN Choosing a CDN Deploying Next.js on any server Running Next.js in a Docker container Summary Part 3: Next.js by Example Chapter 12: Managing Authentication and User Sessions Technical requirements A brief introduction to user sessions and authentication Understanding JSON web tokens Custom authentication – the good, the bad, and the ugly Implementing authentication using Auth0 Customizing Auth0 Summary Chapter 13: Building an E-Commerce Website with Next.js and GraphCMS Technical requirements Creating e-commerce websites for the modern web Setting up GraphCMS Creating the storefront, cart, and product detail pages Processing payments using Stripe Summary Chapter 14: Example Projects and Next Steps for Learning More One framework, endless possibilities Real-world applications for practicing with Next.js Streaming website Blogging platform Real-time chat website Next steps Summary Why subscribe? Other Books You May Enjoy Packt is searching for authors like you
Donate to keep this site alive
How to download source code?
1. Go to: https://github.com/PacktPublishing
2. In the Find a repository… box, search the book title: Real-World Next.js: Build scalable, high-performance, and modern web applications using Next.js, the React framework for production
, sometime you may not get the results, please search the main title.
3. Click the book title in the search results.
3. Click Code to download.
1. Disable the AdBlock plugin. Otherwise, you may not get any links.
2. Solve the CAPTCHA.
3. Click download link.
4. Lead to download server to download.