React and React Native : Build cross-platform JavaScript applications with native power for the web, desktop, and mobile, 4/e (Paperback)

Key Features

• Discover React's latest features including automatic state update batching and prioritizing state updates
• Get to grips with React architecture to write cross-platform apps using libraries such as NativeBase
• Understand GraphQL and Apollo for building a scalable backend for your applications

Book Description

Over the years, React and React Native has proven itself among JavaScript developers as a popular choice for a complete and practical guide to the React ecosystem. This fourth edition comes with the latest features, enhancements, and fixes to align with React 18, while also being compatible with React Native. It includes new chapters covering critical features and concepts in modern cross-platform app development with React.

From the basics of React to popular components such as Hooks, GraphQL, and NativeBase, this definitive guide will help you become a professional React developer in a step-by-step manner.

You'll begin by learning about the essential building blocks of React components. As you advance through the chapters, you'll work with higher-level functionalities in application development and then put your knowledge to work by developing user interface components for the web and native platforms. In the concluding chapters, you'll learn how to bring your application together with robust data architecture.

By the end of this book, you'll be able to build React applications for the web and React Native applications for multiple mobile platforms.

What you will learn

• Explore React architecture, component properties, state, and context
• Work with React Hooks for handling functions and components
• Implement code splitting using lazy components and Suspense
• Build robust user interfaces for mobile and desktop apps using Material-UI
• Write shared components for Android and iOS apps using React Native
• Simplify layout design for React Native apps using NativeBase
• Write GraphQL schemas to power web and mobile apps
• Implement Apollo-driven components

Who this book is for

This book is for any JavaScript developer who wants to start learning how to use React and React Native for mobile and web application development. No prior knowledge of React is required, however working knowledge of JavaScript is necessary to be able to follow along the content covered.

主要特點

• 探索 React 的最新功能，包括自動狀態更新批處理和優先處理狀態更新


• 瞭解 React 架構，使用 NativeBase 等庫來撰寫跨平台應用程式


• 了解 GraphQL 和 Apollo，為應用程式建立可擴展的後端

書籍描述

多年來，React 和 React Native 在 JavaScript 開發者中被證明是一個受歡迎的選擇，提供了一個完整且實用的 React 生態系統指南。這本第四版隨著 React 18 的最新功能、增強和修復，同時也與 React Native 兼容。它包含了涵蓋現代跨平台應用程式開發中關鍵功能和概念的新章節。

從 React 的基礎知識到流行的組件，如 Hooks、GraphQL 和 NativeBase，這本權威指南將以逐步方式幫助您成為專業的 React 開發人員。

您將從學習 React 組件的基本構建塊開始。隨著章節的進展，您將使用應用程式開發中的更高級功能，然後通過開發網頁和原生平台的用戶界面組件來應用您的知識。在結尾的章節中，您將學習如何使用強大的數據架構將應用程式結合在一起。

通過閱讀本書，您將能夠為網頁構建 React 應用程式，並為多個移動平台構建 React Native 應用程式。

您將學到什麼

• 探索 React 架構、組件屬性、狀態和上下文


• 使用 React Hooks 處理函數和組件


• 使用懶加載組件和 Suspense 實現代碼拆分


• 使用 Material-UI 為移動和桌面應用程式構建強大的用戶界面


• 使用 React Native 為 Android 和 iOS 應用程式撰寫共享組件


• 使用 NativeBase 簡化 React Native 應用程式的佈局設計


• 撰寫 GraphQL 模式以支援網頁和移動應用程式


• 實現基於 Apollo 的組件

適合閱讀對象

本書適合任何想要開始學習如何使用 React 和 React Native 進行移動和網頁應用程式開發的 JavaScript 開發者。不需要事先了解 React，但需要具備 JavaScript 的工作知識，以便能夠跟隨所涵蓋的內容。

Adam Boduch has been involved in large-scale JavaScript development for nearly 15 years. Before moving to the frontend, he worked on several large-scale cloud computing products using Python and Linux. No stranger to complexity, Adam has practical experience with real-world software systems and the scaling challenges they pose.

Roy Derks is a serial start-up CTO, international speaker, and author from the Netherlands. He has been working with React, React Native, and GraphQL since 2016. You might know him from the book “React Projects – Second Edition”, which was released by Packt earlier this year. Over the last few years, he has inspired tens of thousands of developers worldwide through his talks, books, workshops, and courses.

Mikhail Sakhniuk is Software Engineer with high proficiency in JavaScript, React and React Native. He has more than 5 years of experience in developing web and mobile applications. He has worked for startups, fintech companies, and product companies with more than 20 million users. Currently, Mikhail is working at Miro as a Frontend Engineer. In addition, he owns and maintains a few open-source projects. He also shares his experience and knowledge through books and articles.

Adam Boduch在大型JavaScript開發領域已經參與了近15年。在轉向前端之前，他使用Python和Linux開發了幾個大型雲計算產品。對於複雜性並不陌生，Adam在實際軟體系統和它們所面臨的擴展挑戰方面具有實際經驗。

Roy Derks是一位連續創業的CTO，國際演講者和來自荷蘭的作者。他從2016年開始使用React、React Native和GraphQL進行工作。你可能從今年早些時候由Packt出版的書籍《React Projects - 第二版》中認識他。在過去幾年中，他通過演講、書籍、研討會和課程在全球啟發了數以萬計的開發者。

Mikhail Sakhniuk是一位具有高水平JavaScript、React和React Native技能的軟體工程師。他在開發網頁和移動應用方面擁有超過5年的經驗。他曾在初創公司、金融科技公司和擁有超過2000萬用戶的產品公司工作。目前，Mikhail在Miro擔任前端工程師。此外，他還擁有和維護幾個開源項目。他也通過書籍和文章分享他的經驗和知識。

1. Why React?
2. Rendering with JSX
3. Component Properties, State, and Context
4. Getting Started with Hooks
5. Event Handling, the React Way
6. Crafting Reusable Components
7. The React Component Life Cycle
8. Validating Component Properties
9. Handling Navigation with Routes
10. Code Splitting Using Lazy Components and Suspense
11. Server-Side React Components
12. User Interface Framework Components
13. High-Performance State Updates
14. Why React Native?
15. React Native Under the Hood
16. Kick-Starting React Native Projects
17. Building Responsive Layouts with Flexbox
18. Navigating Between Screens
19. Rendering Item Lists
20. Showing Progress
21. Geolocation and Maps
22. Collecting User Input
23. Displaying Modal Screens
24. Responding to User Gestures
25. Using Animations
26. Controlling Image Display
27. Going Offline
28. Selecting Native UI Components Using NativeBase
29. Handling Application State
30. Why GraphQL?
31. Building a GraphQL React App

- 為什麼選擇 React？
- 使用 JSX 進行渲染
- 元件的屬性、狀態和上下文
- 使用 Hooks 開始
- 以 React 方式處理事件
- 建立可重複使用的元件
- React 元件的生命週期
- 驗證元件的屬性
- 使用路由處理導航
- 使用懶加載元件和暫停進行程式碼分割
- 伺服器端的 React 元件
- 使用者介面框架元件
- 高效能的狀態更新
- 為什麼選擇 React Native？
- React Native 的內部結構
- 啟動 React Native 專案
- 使用 Flexbox 建立響應式佈局
- 在畫面間導航
- 渲染項目清單
- 顯示進度
- 地理位置和地圖
- 收集使用者輸入
- 顯示模態畫面
- 回應使用者手勢
- 使用動畫
- 控制圖片顯示
- 離線操作
- 使用 NativeBase 選擇原生 UI 元件
- 處理應用程式狀態
- 為什麼選擇 GraphQL？
- 建立一個 GraphQL React 應用程式