{"product_id":"110282","title":"React Hook in Action ","description":"\u003ccenter\u003e\u003cdiv style=\"text-align:center\"\u003e\u003cimg src=\"https:\/\/tmgdisk01.cafe24.com\/images\/vs\/4172\/sv\/3jYEEJtrlqWXUBJO2uDR2AS4AgR7oN.png?v=1765098737\" style=\"max-width:100%;max-height:10px\"\u003e\u003c\/div\u003e\u003c\/center\u003e\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\u003ccenter\u003e\n\n\u003cdiv style=\"width:95%\"\u003e\n\n\u003cdiv style=\"text-align:center;font-size:30px;font-weight:bolder;line-height:1.6em\"\u003e React Hook in Action \u003c\/div\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003cdiv style=\"border-bottom:1px;border-bottom-style:dotted;border-color:;padding-bottom:20px\"\u003e\u003ccenter\u003e\u003ctable align=\"center\" width=\"100%\"\u003e\u003ctbody style=\"border:0px\"\u003e\n\n\u003ctr\u003e\u003ctd align=\"center\" style=\"line-height:1.2em;text-align:center;font-size:18px;color:black;font-weight:bold;padding-bottom:20px;\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\n\n\u003ctr\u003e\u003ctd style=\"text-align:center\"\u003e\u003cimg src=\"https:\/\/image.yes24.com\/goods\/125606405\/XL\" style=\"max-width:100%;height:auto\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\n\n\n\u003c\/tbody\u003e\u003c\/table\u003e\u003c\/center\u003e\u003c\/div\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003cdiv style=\"width:95%;{split_style6}padding-top:20px;padding-bottom:20px\"\u003e\n\n\u003cdiv style=\"text-align:left;font-size:16px;font-weight:bold;padding-bottom:20px\"\u003e Description \u003c\/div\u003e\n\n\u003cdiv style=\"text-align:left;word-break:break-all;font-size:14px;line-height:1.6em;\"\u003e\n\n\u003cdiv\u003e\u003ch5\u003e \u003cb\u003eBook Introduction\u003c\/b\u003e\n\u003c\/h5\u003e\u003c\/div\u003e\n\u003cdiv\u003e\n\u003cdiv\u003e\u003cdiv\u003e \u003cb\u003eA complete guide to using REACT HOOKs to write systematic and maintainable code!\u003cbr\u003e Let's learn the concepts and uses of React Hooks step by step with abundant sample code and various illustrations!\u003c\/b\u003e\u003cbr\u003e \u003cbr\u003eReact Hooks are JavaScript functions designed for reusing and easily sharing functionality between multiple React components. They let you break components into smaller functions, manage state and side effects, and leverage React's features without using classes.\u003cbr\u003e Moreover, you can achieve all these benefits without rearranging your component hierarchy.\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e This book teaches you how to quickly write reusable React components using hooks.\u003cbr\u003e We'll start by writing component code using hooks, then implement a resource reservation application that demonstrates side-effect management, including local state management, application state management, and data loading. \u003cbr\u003eThe special appendix for the Korean edition, \"How to Change the Example App to Apply React 18,\" explains which parts of the original source code need to be changed to conform to React 18.\u003cbr\u003e\n\u003c\/div\u003e\u003c\/div\u003e\n\u003cdiv\u003e\u003cul\u003e\u003cli\u003e You can preview some of the book's contents.\u003cbr\u003e \u003cspan\u003ePreview\u003c\/span\u003e\n\n\u003c\/li\u003e\u003c\/ul\u003e\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cbr\u003e\u003cdiv\u003e\u003ch5\u003e \u003cb\u003eindex\u003c\/b\u003e\n\u003c\/h5\u003e\u003c\/div\u003e\n\u003cdiv\u003e\n\u003cdiv\u003e \u003cb\u003e[Part 1] A Complete Guide to React Hooks and Concurrency Mode\u003c\/b\u003e\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 1: React is Evolving\u003c\/b\u003e\u003cbr\u003e 1.1 What is React?\u003cbr\u003e __1.1.1 Creating UI from Components\u003cbr\u003e __1.1.2 Synchronizing state and UI\u003cbr\u003e __1.1.3 Understanding Component Types\u003cbr\u003e 1.2 New features in React\u003cbr\u003e 1.3 React hooks can add state to function components.\u003cbr\u003e __1.3.1 Stateful Function Components: Write Less Code, Organize Better\u003cbr\u003e __1.3.2 Custom Hooks: Easier Code Reuse\u003cbr\u003e __1.3.3 Third-party hooks that provide pre-built, well-tested functionality\u003cbr\u003e 1.4 Better UX with Concurrent Rendering and Suspense\u003cbr\u003e __1.4.1 Concurrent Rendering\u003cbr\u003e __1.4.2 Suspense \u003cbr\u003e1.5 React's new code release channel\u003cbr\u003e 1.6 Target Audience of this Book\u003cbr\u003e Starting with 1.7\u003cbr\u003e 1.8 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 2: Managing Component State with the useState Hook\u003c\/b\u003e\u003cbr\u003e 2.1 Setting up the reservation management app\u003cbr\u003e __2.1.1 Creating an app skeleton with create-react-app\u003cbr\u003e __2.1.2 Modifying four core files\u003cbr\u003e __2.1.3 Adding the database files required by the application\u003cbr\u003e __2.1.4 Creating a page component and UserPicker.js file\u003cbr\u003e 2.2 Storing, using, and setting values ​​using useState\u003cbr\u003e __2.2.1 The UI does not change even when a new value is assigned to a variable.\u003cbr\u003e __2.2.2 Calling useState returns a value and an update function.\u003cbr\u003e __2.2.3 Calling the update function replaces the previous value.\u003cbr\u003e __2.2.4 Passing a function to useState with initial values\u003cbr\u003e __2.2.5 Referencing the previous state when setting a new state\u003cbr\u003e 2.3 Calling useState multiple times to handle multiple values\u003cbr\u003e __2.3.1 Setting a state using a drop-down list\u003cbr\u003e __2.3.2 Setting status using checkboxes \u003cbr\u003e2.4 Revisiting the Function Component Concept\u003cbr\u003e 2.5 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 3: Managing Component State Using the useReducer Hook\u003c\/b\u003e\u003cbr\u003e 3.1 Updating multiple state values ​​in response to a single event\u003cbr\u003e __3.1.1 Interrupting users with unpredictable state changes\u003cbr\u003e __3.1.2 Maintaining user focus with predictable state changes\u003cbr\u003e 3.2 Managing More Complex State with useReducer\u003cbr\u003e __3.2.1 Updating state using predefined actions and reducers\u003cbr\u003e __3.2.2 Creating a Reducer for the BookablesList Component\u003cbr\u003e __3.2.3 Accessing component state and dispatching actions using useReducer\u003cbr\u003e 3.3 Creating an initial state using a function\u003cbr\u003e __3.3.1 Introducing the WeekPicker component\u003cbr\u003e __3.3.2 Creating utility functions to handle dates and weeks\u003cbr\u003e __3.3.3 Creating a reducer to manage the component's date\u003cbr\u003e __3.3.4 Passing an initialization function to the useReducer hook\u003cbr\u003e __3.3.5 Changing BookingsPage to Use WeekPicker \u003cbr\u003e3.4 Revisiting the useReducer Concept\u003cbr\u003e 3.5 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 4: Using Side Effects\u003c\/b\u003e\u003cbr\u003e 4.1 Exploring the useEffect API with a Simple Example\u003cbr\u003e __4.1.1 Running side effects after every rendering\u003cbr\u003e __4.1.2 Running effects only when a component is mounted\u003cbr\u003e __4.1.3 Returning a function to clean up side effects\u003cbr\u003e __4.1.4 Controlling when effects are executed by specifying dependencies\u003cbr\u003e __4.1.5 Summary of how to call the useEffect hook\u003cbr\u003e __4.1.6 Call useLayoutEffect to run an effect before the browser redraws the screen.\u003cbr\u003e 4.2 Reading data\u003cbr\u003e __4.2.1 Create a new db.json file\u003cbr\u003e __4.2.2 Setting up a JSON server\u003cbr\u003e __4.2.3 Reading data inside the useEffect hook\u003cbr\u003e __4.2.4 Using async and await\u003cbr\u003e 4.3 Reading data for use by the BookablesList component\u003cbr\u003e __4.3.1 Examining the data loading process\u003cbr\u003e __4.3.2 Modifying the reducer to manage loading and error states\u003cbr\u003e __4.3.3 Creating a helper function to load data \u003cbr\u003e__4.3.4 Loading Reservable Resources\u003cbr\u003e 4.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 5: Managing Component State with the useRef Hook\u003c\/b\u003e\u003cbr\u003e 5.1 How to update state without triggering a re-render\u003cbr\u003e __5.1.1 Comparing useState and useRef when updating state values\u003cbr\u003e __5.1.2 Calling useRef\u003cbr\u003e 5.2 Storing the timer ID using a reference object\u003cbr\u003e 5.3 Maintaining References to DOM Elements\u003cbr\u003e __5.3.1 Setting focus on an element in response to an event\u003cbr\u003e __5.3.2 Managing text boxes using reference objects\u003cbr\u003e 5.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 6: Managing Application State\u003c\/b\u003e\u003cbr\u003e 6.1 Passing shared state to child components\u003cbr\u003e __6.1.1 How a parent passes state to its child by setting its props\u003cbr\u003e __6.1.2 Receiving state from parent component via props\u003cbr\u003e __6.1.3 Receiving an update function as a prop from the parent\u003cbr\u003e 6.2 Breaking down components into smaller pieces\u003cbr\u003e __6.2.1 Viewing components as part of a larger app \u003cbr\u003e__6.2.2 Organizing multiple components within a page's UI\u003cbr\u003e __6.2.3 Creating a BookableDetails component\u003cbr\u003e 6.3 Sharing state and dispatch with useReducer\u003cbr\u003e __6.3.1 Managing state in the BookablesView component\u003cbr\u003e __6.3.2 Removing Actions from Reducers\u003cbr\u003e __6.3.3 Receiving state and dispatch from the BookablesList component\u003cbr\u003e 6.4 Sharing state values ​​and update functions obtained from useState\u003cbr\u003e __6.4.1 Managing selected bookable resources in the BookablesView component\u003cbr\u003e __6.4.2 Passing bookable resources and update functions to the BookablesList component\u003cbr\u003e 6.5 Passing a function to useCallback to prevent callback function redefinition\u003cbr\u003e __6.5.1 Relying on functions we pass through props\u003cbr\u003e __6.5.2 Maintaining function identity using the useCallback hook\u003cbr\u003e 6.6 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 7: Managing State with useMemo\u003c\/b\u003e\u003cbr\u003e 7.1 Break the chef's heart by shouting \"O, shortcake!\"\u003cbr\u003e __7.1.1 Generating Anagrams with Expensive Algorithms \u003cbr\u003e__7.1.2 How to avoid duplicate function calls\u003cbr\u003e 7.2 Memoizing expensive function calls with useMemo\u003cbr\u003e 7.3 Configuring the Bookings Page Components\u003cbr\u003e __7.3.1 Managing Selected Bookable Resources Using useState\u003cbr\u003e __7.3.2 Managing selected states and reservations using useReducer and useState\u003cbr\u003e 7.4 Creating an Efficient Reservation Grid Using useMemo\u003cbr\u003e __7.4.1 Creating a grid of sessions and dates\u003cbr\u003e __7.4.2 Create a query for an existing reservation\u003cbr\u003e __7.4.3 Providing the getBookings data loading function\u003cbr\u003e __7.4.4 Creating a BookingsGrid component and calling useMemo\u003cbr\u003e __7.4.5 Handling response contention when reading data using useEffect\u003cbr\u003e 7.5 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 8: Managing State with the Context API\u003c\/b\u003e\u003cbr\u003e 8.1 When you need state stored very high up in the component tree\u003cbr\u003e __8.1.1 Displaying a guidance message when a page is first loaded\u003cbr\u003e __8.1.2 Displaying reservation information when a visitor selects a reservation \u003cbr\u003e__8.1.3 Showing an Edit button for user-created reservations: Issue\u003cbr\u003e __8.1.4 Showing an Edit button for user-created reservations: Solution\u003cbr\u003e 8.2 Using Custom Providers and Multiple Contexts\u003cbr\u003e __8.2.1 Setting an object as a value for a context provider\u003cbr\u003e __8.2.2 Moving state to a custom provider\u003cbr\u003e __8.2.3 Using Multiple Contexts\u003cbr\u003e __8.2.4 Specifying default values ​​for contexts\u003cbr\u003e 8.3 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 9: Creating Custom Hooks\u003c\/b\u003e\u003cbr\u003e 9.1 Extracting features into custom hooks\u003cbr\u003e __9.1.1 Recognizing Shareable Features\u003cbr\u003e __9.1.2 Defining custom hooks outside the component\u003cbr\u003e __9.1.3 Calling a custom hook from a custom hook\u003cbr\u003e 9.2 Follow the hook rules\u003cbr\u003e __9.2.1 Calling hooks only at the top level\u003cbr\u003e __9.2.2 Calling hooks only inside React functions\u003cbr\u003e __9.2.3 Using the ESLint plugin to enforce hook rules\u003cbr\u003e 9.3 Other custom hook extraction examples\u003cbr\u003e __9.3.1 Getting the window size using the useWindowSize hook \u003cbr\u003e__9.3.2 Setting and reading values ​​using the useLocalStorage hook\u003cbr\u003e 9.4 Consuming context values ​​using custom hooks\u003cbr\u003e 9.5 Encapsulating data reading with custom hooks\u003cbr\u003e __9.5.1 Creating a useFetch Hook\u003cbr\u003e __9.5.2 Using data, status, and error values ​​returned by useFetch\u003cbr\u003e __9.5.3 Creating a more specialized hook for reading data: useBookings\u003cbr\u003e 9.6 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 10: Using Third-Party Hooks\u003c\/b\u003e\u003cbr\u003e 10.1 Accessing URL State Using React Router\u003cbr\u003e __10.1.1 Setting up the path to be included\u003cbr\u003e __10.1.2 Adding nested routes to the Bookables page\u003cbr\u003e __10.1.3 Accessing URL parameters using the useParams hook\u003cbr\u003e __10.1.4 Navigating using the useNavigate hook\u003cbr\u003e 10.2 Getting and Setting Query String Search Parameters\u003cbr\u003e __10.2.1 Retrieving search parameters from the query string\u003cbr\u003e __10.2.2 Setting the query string\u003cbr\u003e 10.3 Streamlining Data Reading with React Queries\u003cbr\u003e __10.3.1 Introduction to React Queries \u003cbr\u003e__10.3.2 Making components accessible to the React query client\u003cbr\u003e __10.3.3 Reading data using useQuery\u003cbr\u003e __10.3.4 How to access data in the query cache\u003cbr\u003e __10.3.5 Updating server state using useMutation\u003cbr\u003e 10.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003e[Part 2] Loading Components and Data Asynchronously Using Suspense and Error Boundaries\u003c\/b\u003e\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 11: Splitting Code with Suspense\u003c\/b\u003e\u003cbr\u003e 11.1 Dynamically importing code using the import function\u003cbr\u003e __11.1.1 Setting up a web page to load JavaScript when a button is clicked\u003cbr\u003e __11.1.2 Using Default and Named Exports\u003cbr\u003e __11.1.3 Loading JavaScript using static imports\u003cbr\u003e __11.1.4 Dynamically loading JavaScript by calling the import function\u003cbr\u003e 11.2 Dynamically Importing Components Using Lazy and Suspense\u003cbr\u003e __11.2.1 Converting a component to a lazy component using the lazy function \u003cbr\u003e__11.2.2 Specifying fallback content using the Suspense component\u003cbr\u003e __11.2.3 Understanding How Lazy Loading and Suspense Work Together\u003cbr\u003e __11.2.4 Splitting apps by path\u003cbr\u003e 11.3 Catching Errors Using Error Boundaries\u003cbr\u003e __11.3.1 Examining error boundary examples provided by the React documentation\u003cbr\u003e __11.3.2 Creating Our Own Error Boundaries\u003cbr\u003e __11.3.3 Recovering from errors\u003cbr\u003e 11.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 12: Integrating Data Reading and Suspense\u003c\/b\u003e\u003cbr\u003e 12.1 Data Reading and Suspense\u003cbr\u003e __12.1.1 Upgrading Promises to Include State\u003cbr\u003e __12.1.2 Integrating Suspense Using Promise State\u003cbr\u003e __12.1.3 Reading data as fast as possible\u003cbr\u003e __12.1.4 Reading new data\u003cbr\u003e __12.1.5 Recovering from errors\u003cbr\u003e __12.1.6 Check the React documentation\u003cbr\u003e 12.2 How to Use React Queries, Suspense, and Error Boundaries Together\u003cbr\u003e 12.3 Loading Images with Suspense\u003cbr\u003e __12.3.1 Providing a Fallback During Image Loading Using React Queries and Suspense \u003cbr\u003e__12.3.2 How to preload images or data using React queries\u003cbr\u003e 12.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eChapter 13: Practice and Experiment with useTransition, useDeferredValue, and SuspenseList\u003c\/b\u003e\u003cbr\u003e 13.1 Making state transitions smoother\u003cbr\u003e __13.1.1 Avoiding Fallback States with useTransition\u003cbr\u003e __13.1.2 Providing Feedback to the User Using isPending\u003cbr\u003e __13.1.3 Integrating Common Components and Transitions\u003cbr\u003e __13.1.4 Maintaining previous values ​​with useDeferredValue\u003cbr\u003e 13.2 Using SuspenseList to Manage Multiple Fallbacks\u003cbr\u003e __13.2.1 Obtaining and displaying data from multiple sources\u003cbr\u003e __13.2.2 Controlling Multiple Fallbacks with SuspenseList\u003cbr\u003e 13.3 React 18 and Concurrency Mode\u003cbr\u003e 13.4 Summary\u003cbr\u003e\u003cbr\u003e \u003cb\u003eSpecial Appendix for the Korean Edition | Modifying the Sample App to Adapt to React 18\u003c\/b\u003e\u003cbr\u003e A.1 Change package.json\u003cbr\u003e A.2 Changed the json import part\u003cbr\u003e A.3 Modifying the application startup part\u003cbr\u003e A.4 Remove unstable_\u003cbr\u003e A.5 Routing Related Changes\u003cbr\u003e A.6 SuspenseList Issue Resolution (Workaround) \u003cbr\u003e__A.6.1 How to run the original code as is\u003c\/div\u003e\n\u003cdiv\u003e\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cbr\u003e\u003cdiv\u003e\u003ch5\u003e \u003cb\u003eDetailed image\u003c\/b\u003e \u003c\/h5\u003e\u003c\/div\u003e\n\u003cdiv\u003e\u003cdiv\u003e\u003cimg src=\"https:\/\/image.yes24.com\/momo\/TopCate4453\/MidCate008\/445270433.jpg\" border=\"0\" alt=\"Detailed Image 1\"\u003e\u003c\/div\u003e\u003c\/div\u003e\n\u003cbr\u003e\u003cdiv\u003e\u003ch5\u003e \u003cb\u003ePublisher's Review\u003c\/b\u003e\n\u003c\/h5\u003e\u003c\/div\u003e\n\u003cdiv\u003e\n\u003cdiv\u003e \u003cb\u003e│ What this book covers │\u003c\/b\u003e\u003cbr\u003e - How to create a function component that uses React features\u003cbr\u003e - How to manage local state, shared state, and application state\u003cbr\u003e - How to use built-in hooks, custom hooks, and third-party hooks\u003cbr\u003e - How to load, update, and cache data using React queries\u003cbr\u003e - How to improve page and data loading using code splitting and React Suspense components\u003cbr\u003e\u003cbr\u003e \u003cb\u003e│ Target audience for this book │\u003c\/b\u003e\u003cbr\u003e Any developer who has some knowledge of JavaScript and web development and has learned basic React development can read this.\u003cbr\u003e This book will help you better understand hooks and learn how to write your own custom hooks to make your front-end programs more modular.\u003cbr\u003e\u003cbr\u003e \u003cb\u003e│ Structure of this book │\u003c\/b\u003e \u003cbr\u003ePart 1 introduces the syntax and usage of React hooks built into React.\u003cbr\u003e We'll also show you how to create your own custom hooks and make the most of third-party hooks provided by other existing React libraries.\u003cbr\u003e\u003cbr\u003e Part 2 explains how to load component code more efficiently in larger apps and how to use the Suspense component and error boundaries to configure a fallback UI while resources are loading.\u003cbr\u003e Next, we'll look at the concurrency APIs we use to integrate data loading and Suspense, and handle state transitions.\u003cbr\u003e\u003cbr\u003e \u003cb\u003e[Author's Note]\u003c\/b\u003e\u003cbr\u003e\u003cbr\u003e As a high school teacher and programmer, I've had a wonderful time developing applications that support teaching, learning, and organization within schools. \u003cbr\u003eBy listening directly to the needs of students, teachers, and staff every day, we've been able to work with them to create intuitive apps and tools that make planning, communicating, understanding, and playing easier.\u003cbr\u003e I've created everything from quiz apps and spot-the-difference games written in JavaScript to lesson planning and resource scheduling apps using jQuery and templates.\u003cbr\u003e Since then, the school's science department has wanted a way to order tools for classes, the leadership team has wanted a way to communicate announcements to staff, and ICT technicians have wanted a way for staff to report and manage software and hardware issues. \u003cbr\u003eWhat about a student seating app, a content management system (CMS) for news on the school website, a custom calendar, an interactive on-duty assignment sheet, or a sports log? All of this software had a consistent look and feel.\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e While each project had its own unique requirements, there was a lot of overlap, and similar methods could be used across multiple apps.\u003cbr\u003e To accelerate this, I switched to JavaScript from server to client using Node.js, Express, Handlebars, Backbone, and Marionette.\u003cbr\u003e Most of it worked well, but sometimes it was tricky to change the app as requirements changed.\u003cbr\u003e In particular, the data flow between the model, view, and controller was not always smooth. \u003cbr\u003eThe users were happy, but I could see the underlying problems in the code, and I knew that at some point I would have to go back and untangle the kinks.\u003cbr\u003e Then I encountered React and all my problems were solved! Of course, it wasn't a perfect solution, but React's component, prop, state, and automatic re-rendering model appealed to me more than other libraries.\u003cbr\u003e I converted existing apps to React one by one.\u003cbr\u003e With each transformation, the app becomes simpler, easier to understand, and easier to maintain.\u003cbr\u003e I was able to reuse common components, allowing me to quickly change code and confidently add new features.\u003cbr\u003e While I'm not a React fanatic (I respect framework diversity), I'm definitely a convert, and I've enjoyed my experience as a React developer and the user feedback on my React apps.\u003cbr\u003e \u003cbr\u003eUsing React Hooks allowed my code to take another positive step forward in terms of simplicity.\u003cbr\u003e Code that was scattered across the lifecycle methods of class components can now be gathered into custom hooks inside or outside of function components.\u003cbr\u003e You can easily isolate, maintain, and share code for specific functions, such as setting document titles, accessing local storage, managing context values, measuring the on-screen size of elements, subscribing to services, and reading data.\u003cbr\u003e It also became easier to connect functionality from existing libraries like React Router, Redux, React Query, and React Spring.\u003cbr\u003e React hooks give you a new way of thinking about React components.\u003cbr\u003e There are some small pitfalls to watch out for at first, but I think this change in mindset is definitely a good thing.\u003cbr\u003e \u003cbr\u003eThe switch to hooks represents a fundamental change to how React will work going forward.\u003cbr\u003e Concurrency mode (concurrent rendering in React 18) will become the new standard, enabling time-slicing magic where rendering doesn't block the main thread and higher-priority state changes like user input can render immediately while other components are being built.\u003cbr\u003e Selective hydration will allow React to load only the component code that is absolutely necessary for user interaction, and the Suspense API will allow developers to more carefully specify the loading state while loading code and resources.\u003cbr\u003e\u003cbr\u003e The React team is focused on building great developer experiences that empower developers to create great user experiences.\u003cbr\u003e Additional changes will continue to occur, and best practices will continue to emerge. \u003cbr\u003eI hope this book will help you understand the current changes and prepare for the changes in React that are gradually emerging on the horizon.\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e \u003cb\u003e[Translator's Note]\u003c\/b\u003e\u003cbr\u003e\u003cbr\u003e With the introduction of function components and hooks in React, various third-party libraries began to provide hooks, and people realized that using hooks and function components together could create apps that were much more concise, composable, and easier to maintain than class-based components, so hooks and function components are being used a lot.\u003cbr\u003e For example, Zustand and Jotai, which are popular React state management libraries these days, all provide hooks.\u003cbr\u003e Therefore, in order to learn React development, you need to systematically learn how to handle hooks. \u003cbr\u003eHowever, most React books still cover class components in detail, explain component lifecycle management through class methods rather than hooks, and often briefly explain React hooks.\u003cbr\u003e\u003cbr\u003e This book covers React's various features in detail, especially hooks.\u003cbr\u003e Developers who have some knowledge of JavaScript and web development and have learned basic React development will be able to better understand hooks through this book and write their own custom hooks to further modularize front-end programs.\u003cbr\u003e \u003cbr\u003eAbove all, it provides a detailed visual explanation of how React function components work and how to separate each function of a function component into hooks through rich illustrations, so you can understand the relationship between components and hooks more easily and also easily understand how to separate common functions in the components you wrote into hooks.\u003cbr\u003e And once you have a good understanding of how hooks work, you can more easily understand and utilize how components and third-party hooks work when utilizing hooks provided by new third-party libraries. \u003cbr\u003eEven for front-end developers who don't know much about React, it explains in detail through illustrations how various parts of class components change into function components and hooks, and it explains step by step the various functions needed to create a web app using React function components, such as managing component state using the useState hook, sharing state to multiple components through useReducer, and sharing references using the useRef hook. It is also helpful for React beginners who want to build the basics of React.\u003cbr\u003e I hope this book will be of some help to React programmers who use hooks. \u003cbr\u003e\n\n\u003c\/div\u003e\n\u003cdiv\u003e\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\n\n\u003c\/div\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003cdiv style=\"width:95%;padding-top:20px;padding-bottom:20px\"\u003e\n\n\u003cdiv style=\"text-align:left;font-size:16px;font-weight:bold;padding-bottom:20px\"\u003e GOODS SPECIFICS \u003c\/div\u003e\n\n\u003cdiv style=\"text-align:left;font-size:14px;line-height:1.6em;\"\u003e\n\n\u003cdiv style=\"width:100%;margin-bottom:5px;line-height:1.6em;font-size:14px\"\u003e - \u003cstrong\u003eDate of issue:\u003c\/strong\u003e March 29, 2024\u003c\/div\u003e\n\n\u003cdiv style=\"width:100%;margin-bottom:5px;line-height:1.6em;font-size:14px\"\u003e - \u003cstrong\u003ePage count, weight, size:\u003c\/strong\u003e 432 pages | 812g | 185*240*21mm\u003c\/div\u003e\n\n\u003cdiv style=\"width:100%;margin-bottom:5px;line-height:1.6em;font-size:14px\"\u003e - \u003cstrong\u003eISBN13:\u003c\/strong\u003e 9791189909611\u003c\/div\u003e\n\n\u003cdiv style=\"width:100%;margin-bottom:5px;line-height:1.6em;font-size:14px\"\u003e - \u003cstrong\u003eISBN10:\u003c\/strong\u003e 1189909618 \u003c\/div\u003e\n\n\n\u003c\/div\u003e\n\n\n\u003c\/div\u003e\n\n\n\u003c\/div\u003e\n\n\u003ccenter\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003ccenter\u003e\u003ctable\u003e\u003ctr\u003e\u003ctd style=\"height:10px\"\u003e\u003c\/td\u003e\u003c\/tr\u003e\u003c\/table\u003e\u003c\/center\u003e\n\n\u003cspan\u003e\u003c\/span\u003e\n\n\u003c\/center\u003e\n\n\n\u003c\/center\u003e","brand":"LIBRAIRIE COREENNE","offers":[{"title":"Default Title","offer_id":43893724184618,"sku":"110282","price":41.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0683\/2750\/5962\/files\/f901032e08dbc1a95e1987ab555f78c3.jpg?v=1765413453","url":"https:\/\/librairie.coreenne.fr\/en\/products\/110282","provider":"LIBRAIRIE COREENNE","version":"1.0","type":"link"}