book

Real-World Next.js

by Michele Riva

February 2022

Intermediate to advanced

366 pages

6h 35m

English

Packt Publishing

Read now

Unlock full access

ContributorsAbout the authorAbout the reviewers
Who this book is forWhat this book coversTo get the most out of this bookDownload the example code filesDownload the color imagesConventions usedGet in touchShare Your Thoughts
Technical requirementsIntroducing Next.jsComparing Next.js to other alternativesGatsbyRazzleNuxt.jsAngular UniversalSo, why Next.js?Moving from React to Next.jsGetting started with Next.jsDefault project structureTypeScript integration Custom Babel and webpack configuration Summary
Technical requirementsServer-side rendering (SSR)Client-side rendering (CSR)Using the React.useEffect hookUsing the process.browser variableUsing dynamic component loadingStatic site generationSummary
Technical requirementsRouting systemUsing route variables inside our pagesUsing route variables inside componentsClient-side navigationServing static assetsNext.js' automatic image optimization Running automatic image optimization on external servicesHandling metadataGrouping common meta tagsCustomizing _app.js and _document.js pagesThe _app.js pageThe _document.js page
Technical requirementsOrganizing the folder structureOrganizing the componentsOrganizing utilitiesOrganizing static assetsOrganizing stylesLib filesData fetchingFetching data on the server sideConsuming REST APIs on the server sideFetching data on the client sideConsuming REST APIs on the client sideConsuming GraphQL APIsSummary
Technical requirementsLocal state managementGlobal state managementUsing the Context APIsUsing ReduxSummary
Technical requirementsExploring and using Styled JSXCSS modulesIntegrating SASS with Next.jsSummary

Technical requirementsAn introduction to UI librariesIntegrating Chakra UI in Next.jsBuilding an employee directory with Chakra UI and Next.jsConclusive words about Chakra UIIntegrating TailwindCSS in Next.jsIntegrating Headless UISummary
Technical requirementsAbout using a custom serverUsing a custom Express.js serverUsing a custom Fastify serverSummary
Technical requirementsAn introduction to testingRunning unit and integration testsEnd-to-end testing with CypressSummary
Technical requirementsSEO and performance – an introductionRendering strategies, from a performance and SEO perspectiveThe reasoning behind a real-world website exampleRendering the image detail pagePrivate routesA quick recap regarding our decisionsWorking with SEODealing with performanceSummary
Technical requirementsA brief introduction to different deployment platformsDeploying to the Vercel platformDeploying a static site to a CDNChoosing a CDNDeploying Next.js on any serverRunning Next.js in a Docker containerSummary
Technical requirementsA brief introduction to user sessions and authenticationUnderstanding JSON web tokensCustom authentication – the good, the bad, and the uglyImplementing authentication using Auth0Customizing Auth0Summary
Technical requirementsCreating e-commerce websites for the modern webSetting up GraphCMSCreating the storefront, cart, and product detail pagesProcessing payments using StripeSummary
One framework, endless possibilitiesReal-world applications for practicing with Next.jsStreaming websiteBlogging platformReal-time chat websiteNext stepsSummary
Other Books You May EnjoyPackt is searching for authors like you

Overview

"Real-World Next.js" is a comprehensive guide to mastering Next.js, the powerful React framework designed for modern web application development. This book walks you through creating scalable, maintainable solutions, offering insights into rendering strategies, testing, and deployment of performant web applications.

What this Book will help me do

Understand the core concepts and features of Next.js, including rendering strategies like SSR, CSR, and SSG.
Learn to organize code bases and fetch data efficiently in Next.js applications.
Gain skills in implementing and managing user authentication and sessions securely.
Explore deployment strategies for Next.js applications to various platforms.
Build a high-performance e-commerce site using Next.js and integrate it with headless CMS tools such as GraphCMS.

Author(s)

Michele Riva is a developer with significant experience in React.js and modern web development. Invested in creating tools and resources for developers, Michele brings his expertise and enthusiasm for clean and scalable system design to this book, ensuring an engaging learning experience for developers.

Who is it for?

This book is perfect for web developers already familiar with JavaScript and frameworks like React looking to deepen their expertise. Readers should have a basic understanding of concepts like ES6, REST APIs, and web application structures. Ideal for those wanting to build scalable full-stack applications and utilize modern web framework benefits. Advanced learners keen on deploying Next.js in production will also find this helpful.