React Design Patterns and Best Practices

Build modular applications that are easy to scale using the most powerful components and design patterns that React can offer you right now

React Design Patterns and Best Practices

This ebook is included in a Mapt subscription
Michele Bertoli

Build modular applications that are easy to scale using the most powerful components and design patterns that React can offer you right now
$0.00
$35.99
$44.99
$29.99p/m after trial
RRP $35.99
RRP $44.99
Subscription
eBook
Print + eBook
Start 30 Day Trial
Subscribe and access every Packt eBook & Video.
 
  • 4,000+ eBooks & Videos
  • 40+ New titles a month
  • 1 Free eBook/Video to keep every month
Start Free Trial
 
Preview in Mapt

Book Details

ISBN 139781786464538
Paperback318 pages

Book Description

Taking a complete journey through the most valuable design patterns in React, this book demonstrates how to apply design patterns and best practices in real-life situations, whether that's for new or already existing projects. It will help you to make your applications more flexible, perform better, and easier to maintain – giving your workflow a huge boost when it comes to speed without reducing quality. 

We'll begin by understanding the internals of React before gradually moving on to writing clean and maintainable code. We'll build components that are reusable across the application, structure applications, and create forms that actually work.

Then we'll style React components and optimize them to make applications faster and more responsive. Finally, we'll write tests effectively and you'll learn how to contribute to React and its ecosystem.

By the end of the book, you'll be saved from a lot of trial and error and developmental headaches, and you will be on the road to becoming a React expert.

Table of Contents

Chapter 1: Everything You Should Know About React
Declarative programming
React elements
Unlearning everything
Common misconceptions
Summary
Chapter 2: Clean Up Your Code
JSX
ESLint
The basics of functional programming
Summary
Chapter 3: Create Truly Reusable Components
Creating classes
The state
Prop types
Reusable components
Living style guides
Summary
Chapter 4: Compose All the Things
Communication between components
Container and Presentational pattern
Mixins
Higher-order Components
Recompose
Function as Child
Summary
Chapter 5: Proper Data Fetching
Data flow
Data fetching
React-refetch
Summary
Chapter 6: Write Code for the Browser
Forms
Events
Refs
Animations
Scalable Vector Graphics
Summary
Chapter 7: Make Your Components Look Beautiful
CSS in JS
Inline styles
Radium
CSS Modules
Styled Components
Summary
Chapter 8: Server-Side Rendering for Fun and Profit
Universal applications
Reasons to implement Server-Side Rendering
A basic example
A data fetching example
Next.js
Summary
Chapter 9: Improve the Performance of Your Applications
Reconciliation and keys
Optimization techniques
Common solutions
Tools and libraries
Summary
Chapter 10: About Testing and Debugging
The benefits of testing
Painless JavaScript testing with Jest
Mocha is a flexible testing framework
JavaScript testing utilities for React
A real-world testing example
React tree Snapshot Testing
Code coverage tools
Common testing solutions
React Dev Tools
Error handling with React
Summary
Chapter 11: Anti-Patterns to Be Avoided
Initializing the state using props
Mutating the state
Using indexes as a key
Spreading props on DOM elements
Summary
Chapter 12: Next Steps
Contributing to React
Distributing your code
Publishing a npm package
Summary

What You Will Learn

  • Write clean and maintainable code
  • Create reusable components applying consolidated techniques
  • Use React effectively in the browser and node
  • Choose the right styling approach according to the needs of the applications
  • Use server-side rendering to make applications load faster
  • Build high-performing applications by optimizing components

Authors

Table of Contents

Chapter 1: Everything You Should Know About React
Declarative programming
React elements
Unlearning everything
Common misconceptions
Summary
Chapter 2: Clean Up Your Code
JSX
ESLint
The basics of functional programming
Summary
Chapter 3: Create Truly Reusable Components
Creating classes
The state
Prop types
Reusable components
Living style guides
Summary
Chapter 4: Compose All the Things
Communication between components
Container and Presentational pattern
Mixins
Higher-order Components
Recompose
Function as Child
Summary
Chapter 5: Proper Data Fetching
Data flow
Data fetching
React-refetch
Summary
Chapter 6: Write Code for the Browser
Forms
Events
Refs
Animations
Scalable Vector Graphics
Summary
Chapter 7: Make Your Components Look Beautiful
CSS in JS
Inline styles
Radium
CSS Modules
Styled Components
Summary
Chapter 8: Server-Side Rendering for Fun and Profit
Universal applications
Reasons to implement Server-Side Rendering
A basic example
A data fetching example
Next.js
Summary
Chapter 9: Improve the Performance of Your Applications
Reconciliation and keys
Optimization techniques
Common solutions
Tools and libraries
Summary
Chapter 10: About Testing and Debugging
The benefits of testing
Painless JavaScript testing with Jest
Mocha is a flexible testing framework
JavaScript testing utilities for React
A real-world testing example
React tree Snapshot Testing
Code coverage tools
Common testing solutions
React Dev Tools
Error handling with React
Summary
Chapter 11: Anti-Patterns to Be Avoided
Initializing the state using props
Mutating the state
Using indexes as a key
Spreading props on DOM elements
Summary
Chapter 12: Next Steps
Contributing to React
Distributing your code
Publishing a npm package
Summary

Book Details

ISBN 139781786464538
Paperback318 pages
Read More

Read More Reviews