React 18 Design Patterns and Best Practices: Design, build, and deploy production-ready web applications with React by leveraging industry-best practices. 4 Ed

Cover Page....2 Table of Contents....3 Preface....5 Taking Your First Steps with React....16 Technical requirements....16 Differentiating between declarative and imperative programming....18 How React elements work....21 Unlearning everything....23 Understanding JavaScript fatigue....26 Summary....30 Introducing TypeScript....32 Technical requirements....33 TypeScript’s features....33 Converting JavaScript code into TypeScript....34 Types....36 Interfaces....37 Extending interfaces and types....38 Implementing interfaces and types....39 Merging interfaces....40 Enums....41 Namespaces....42 Template literals....44 TypeScript configuration file....44 Summary....46 Cleaning Up Your Code....47 Technical requirements....48 Using JSX....48 Styling code....67 Functional programming....74 Summary....79 Exploring Popular Composition Patterns....81 Technical requirements....81 Communicating components....82 Exploring the container and presentational patterns....85 Understanding HOCs....91 Understanding FunctionAsChild....94 Summary....96 Writing Code for the Browser....97 Technical requirements....98 Understanding and implementing forms....98 Handling events....106 Exploring refs....109 Implementing animations....113 Exploring SVG....115 Summary....117 Making Your Components Look Beautiful....119 Technical requirements....119 CSS in JavaScript....120 Understanding and implementing inline styles....122 Using CSS modules....127 Setting up a project....128 Locally scoped CSS....135 Implementing styled-components....144 Summary....148 Anti-Patterns to Be Avoided....150 Technical requirements....150 Initializing the state using properties....151 Using indexes as a key....154 Spreading properties on DOM elements....157 Summary....159 React Hooks....161 Technical requirements....161 Introducing React Hooks....162 Rules of Hooks....164 Migrating a class component to React Hooks....165 Understanding React effects....171 Understanding the useReducer Hook....194 Summary....202 React Router....203 Technical requirements....203 Installing and configuring React Router....204 Creating our sections....205 Adding parameters to the routes....209 React Router v6.4....217 Summary....224 React 18 New Features....226 Concurrent mode....227 Automatic batching....229 Transitions....230 Suspense on the server....232 New APIs....233 New Hooks....237 Strict mode....242 Node.js latest features....243 Summary....246 Managing Data....247 Technical requirements....247 Introducing the React Context API....248 Consuming context with useContext....251 Introducing React Suspense with SWR....253 Redux Toolkit: a modern approach to Redux....265 Summary....268 Server-Side Rendering....269 Technical requirements....269 Understanding universal applications....270 Reasons for implementing SSR....271 Creating a basic example of SSR....276 Implementing data fetching....284 Using Next.js to create a React application....288 Summary....292 Understanding GraphQL with a Real Project....294 Technical requirements....295 Building a backend login system using PostgreSQL, Apollo Server, GraphQL, Sequelize, and JSON Web Tokens....295 Installing PostgreSQL....295 Creating our backend project....298 Configuring Apollo Server....301 Defining our GraphQL types, queries, and mutations....305 Creating our resolvers....308 Using the Sequelize ORM....312 Authentication functions....316 Running our project for the first time....321 Building a frontend login system with Apollo Client....344 Summary....373 MonoRepo Architecture....374 Technical requirements....375 Advantages of a monorepository and the problems it solves....375 Creating a MonoRepo with NPM Workspaces....378 Implementing TypeScript in our MonoRepo....382 Creating a devtools package to compile packages with Webpack....386 Creating the utils package....398 Creating the API package....406 Creating the frontend package....429 Summary....455 Improving the Performance of Your Applications....457 Technical requirements....458 How reconciliation works....458 Using keys....460 Optimization techniques....461 Tools and libraries....463 Summary....465 Join our community on Discord....466 Testing and Debugging....467 Technical requirements....467 Understanding the benefits of testing....468 Painless JavaScript testing with Jest....470 Introducing Vitest....478 Using React DevTools....489 Summary....490 Deploying to Production....492 Technical requirements....492 Creating our first DigitalOcean Droplet....492 Configuring nginx, PM2, and a domain....507 Implementing CircleCI for continuous integration....513 Summary....526 Other Books You May Enjoy....527 Index....532