Muutke küpsiste eelistusi

E-raamat: Beginning ReactJS Foundations Building User Interfaces with ReactJS: An Approachable Guide: An Approachable Guide [Wiley Online]

  • Formaat: 512 pages
  • Ilmumisaeg: 05-May-2022
  • Kirjastus: John Wiley & Sons Inc
  • ISBN-10: 111968563X
  • ISBN-13: 9781119685630
Teised raamatud teemal:
  • Wiley Online
  • Hind: 52,87 €*
  • * hind, mis tagab piiramatu üheaegsete kasutajate arvuga ligipääsu piiramatuks ajaks
Beginning ReactJS Foundations Building User Interfaces with ReactJS: An Approachable Guide: An Approachable GuideSuurem pilt
  • Formaat: 512 pages
  • Ilmumisaeg: 05-May-2022
  • Kirjastus: John Wiley & Sons Inc
  • ISBN-10: 111968563X
  • ISBN-13: 9781119685630
Teised raamatud teemal:
Wiley Online e-raamatudRohkem infot Wiley Online kohta
Raamatu kodulehekülg: https://onlinelibrary.wiley.com/doi/book/10.1002/9781119685630

Quickly learn the most widely used front-end development language with ease and confidence

React JS Foundations: Building User Interfaces with ReactJS - An Approachable Guide walks readers through the fundamental concepts of programming with the explosively popular front-end tool known as React JS.

Written by an accomplished full-stack engineer, speaker, and community organizer, React JS Foundations teaches readers how to understand React and how to begin building applications with it. The book:

  • Explains and clarifies technical terminology with relevant and modern examples to assist people new to programming understand the language
  • Helps experienced programmers quickly get up to speed with React
  • Is stocked throughout with practical and applicable examples of day-to-day React work

Perfect for beginner, intermediate, and advanced programmers alike, React JS Foundations will quickly bring you up to speed on one of the most useful and widely used front-end languages on the web today. You can start building your first application today.

Introduction xxvii
Chapter 1 Hello, World!
1(10)
React without a Build Toolchain
1(6)
Interactive "Hello, World" with Create React App and JSX
7(2)
Summary
9(2)
Chapter 2 The Foundation Of React
11(12)
What's in a Name?
11(1)
UI Layer
12(1)
Virtual DOM
13(1)
The Philosophy of React
14(1)
Thinking in Components
15(1)
Composition vs. Inheritance
15(1)
React Is Declarative
16(1)
React Is Idiomatic
17(1)
Why Learn React?
17(1)
React vs
18(1)
React vs. Angular
18(1)
React vs. Vue
19(1)
What React Is Not
19(1)
React Is Not a Web Server
20(1)
React Is Not-a Programming Language
20(1)
React Is Not a Database Server
21(1)
React Is Not a Development Environment
21(1)
React Is Not the Perfect Solution to Every Problem
21(1)
Summary
21(2)
Chapter 3 JSX
23(20)
JSX Is Not HTML
23(7)
What Is JSX?
30(1)
How JSX Works
30(1)
Transpiler Huh?
31(1)
Compilation vs. Transpilation
31(1)
JSX Transform
31(1)
Introducing Babel
31(2)
Eliminating Browser Incompatibilities
33(1)
Syntax Basics of JSX
33(1)
JSX Is JavaScript XML
33(1)
Beware of Reserved Words
33(1)
JSX Uses camelCase
33(1)
Preface Custom Attributes in DOM Elements with data-
34(1)
JSX Boolean Attributes
34(1)
Use Curly Braces to Include Literal JavaScript
35(1)
Remember to Use Double Curly Braces with Objects
35(1)
Put Comments in Curly Braces
35(1)
When to Use JavaScript in JSX (
36(1)
Conditionals in JSX
36(1)
Conditional Rendering with if/else and Element Variables
36(1)
Conditional Rendering with the Operator
37(1)
Conditional Rendering with the Conditional Operator
38(1)
Expressions in JSX
38(2)
Using Children in JSX
40(1)
React Fragments
40(1)
Summary
41(2)
Chapter 4 All About Components
43(62)
What Is a Component?
43(1)
Components vs. Elements
44(1)
Components Define Elements
44(1)
Elements Invoke Components
45(2)
Built-in Components
47(1)
HTML Element Components
47(5)
Attributes vs. Props
52(1)
Passing Props
52(1)
Accessing Props
52(2)
Standard HTML Attributes
54(2)
Non-Standard Attributes
56(1)
Custom Attributes
56(1)
User-Defined Components
56(1)
Types of Components
56(1)
Class Components
57(11)
Stepping through a React Class Component
68(1)
React.Component
68(1)
Importing React.Component
68(1)
The Class Header
69(1)
The Constructor Function
69(2)
Managing State in Class Components
71(2)
The Render Function
73(1)
Creating and Using Props
74(2)
Function Components
76(3)
What Are Function Components?
79(1)
How to Write Function Components
79(1)
Optimizations and Function Component Shortcuts
80(3)
Managing State in Function Components
83(1)
Differences between Function and Class Components
84(1)
React Component Children
84(1)
this props children
85(1)
Manipulating Children
86(1)
React Children
86(1)
isValidElement
87(1)
cloneElement
87(2)
The Component Lifecycle
89(1)
Mounting
90(1)
constructor()
90(1)
static getDerivedStateFromProps
90(1)
render
90(1)
componentDidMount()
90(1)
Updating
90(1)
shouldComponentUpdate
91(1)
getSnapshotBeforeUpdate
91(1)
componentDidUpdate
92(1)
Unmounting
92(1)
cqmponentWillUnmount
92(1)
Error Handling
92(1)
getDerivedStateFromError
92(1)
componentDidCatch
92(1)
Improving Performance and Avoiding Errors
92(1)
Avoiding Memory Leaks
93(3)
React Pure Component
96(1)
React.memo
97(1)
React.StrictMode
98(1)
Rendering Components
98(1)
Rendering with ReactDOM
98(2)
Virtual DOM
100(1)
Other Rendering Engines
101(1)
React Native
101(1)
ReactDOMServer
102(1)
React Konsul
103(1)
react-pdf
103(1)
Component Terminology
103(1)
Summary
104(1)
Chapter 5 React Devtools
105(18)
Installation and Getting Started
105(2)
Inspecting Components
107(1)
Working with the Component Tree
108(2)
Searching for Components
110(1)
Using the Search Input Box
110(1)
Using Regular Expressions
110(2)
Filtering Components
112(2)
Selecting Components
114(1)
Editing Component Data in DevTools
114(4)
Working with Additional DevTools Functionality
118(1)
Profiling
119(2)
Summary
121(2)
Chapter 6 React Data Flow
123(76)
One-Way Data Flow
123(1)
Understanding One-Way Data Flow
124(1)
Why One-Way Data Flow?
125(1)
Props
126(1)
Components Receive Props
126(1)
Props Can Be Any Data Type
126(1)
Props Are Read-Only
127(2)
Validating Incoming Props with PropTypes
129(1)
What Is PropTypes?
130(1)
Getting Started with PropTypes
131(2)
What Can PropTypes Validate?
133(8)
Default Props
141(4)
React State
145(1)
What Is state?
146(1)
Initializing state
146(1)
Initializing state in Class Components
146(1)
Initializing State in Function Components
147(2)
The Difference between state and props
149(1)
Updating state
149(1)
Updating a Class Component's state with setState
150(4)
Updating state with Function Components
154(7)
What to Put in State
161(1)
Building the Reminders App
161(7)
What Not to Put in State
168(1)
Where to Put State
168(2)
Lifting State Up
170(7)
About the key Prop
177(6)
Filtering the Reminders
183(5)
Implementing the isComplete Changing Functionality
188(2)
Converting to Class Components
190(8)
Summary
198(1)
Chapter 7 Events
199(22)
How Events Work in React
199(2)
What Is SyntheticEvent?
201(1)
Using Event Listener Attributes
202(1)
The Event Object
203(1)
Supported Events
204(7)
Event Handler Functions
211(1)
Writing Inline Event Handlers
211(1)
Writing Event Handlers in Function Components
212(1)
Writing Event Handlers in Class Components
213(1)
Binding Event Handler Functions
214(1)
Using bind
215(1)
Using Arrow Functions
216(2)
Passing Data to Event Handlers
218(1)
Summary
219(2)
Chapter 8 FORMS
221(12)
Forms Have State
221(1)
Controlled Inputs vs. Uncontrolled Inputs
222(1)
Updating a Controlled Input
223(1)
Controlling an Input in a Function Component
224(1)
Controlling an Input in a Class Component
224(2)
Lifting Up Input State
226(2)
Using Uncontrolled Inputs
228(1)
Using Different Form Elements
229(1)
Controlling the Input Element
230(1)
Controlling a textarea
230(1)
Controlling a Select Element
231(1)
Preventing Default Actions
231(1)
Summary
232(1)
Chapter 9 Refs
233(10)
What Refs Are
233(1)
How to Create a Ref in a Class Component
234(1)
How to Create a Ref in a Function Component
234(1)
Using Refs
234(2)
Creating a Callback Ref
236(2)
When to Use Refs
238(1)
When Not to Use Refs
238(1)
Examples
239(1)
Managing Focus
239(1)
Automatically Selecting Text
239(2)
Controlling Media Playback
241(1)
Setting Scroll Position
241(1)
Summary
242(1)
Chapter 10 Styling React
243(14)
The Importance of Styles
243(1)
Importing CSS into the HTML File
244(1)
Using Plain Old CSS in Components
245(2)
Writing Inline Styles
247(1)
JavaScript Style Syntax
248(1)
Why to Use Inline Styles
249(1)
Why Not to Use Inline Styles
249(1)
Improving Inline Styles with Style Modules
249(1)
CSS Modules
250(1)
Naming CSS Module Files
251(1)
Advanced CSS Modules Functionality
252(1)
Global Classes
252(1)
Class Composition
252(1)
CSS-in-JS and Styled Components
253(2)
Summary
255(2)
Chapter 11 Introducing Hooks
257(32)
What Are Hooks?
257(1)
Why Were Hooks Introduced?
257(2)
Rules of Hooks
259(1)
The Built-in Hooks
259(1)
Managing State with useState
260(2)
Setting the Initial State
262(1)
Using the Setter Function
262(1)
Passing a Value to a Setter
263(1)
Passing a Function to a Setter
263(1)
Setter Function Value Comparison
264(1)
Hooking into the Lifecycle with useEffect
264(1)
Using the Default useEffect Behavior
265(1)
Cleaning Up After Effects
265(1)
Customizing useEffect
266(4)
Running Asynchronous Code with useEffect
270(2)
Subscribing to Global Data with useContext
272(1)
Combining Logic and State with useReducer
273(2)
Memoized Callbacks with useCallback
275(3)
Caching Computed Values with useMemo
278(1)
Solving Unnecessary Renders
278(1)
Solving Performance Problems
279(1)
Accessing Children Imperatively with useRef
279(1)
Customizing Exposed Values with uselmperativeHandle
280(1)
Updating the DOM Synchronously with useLayoutEffect
281(1)
Writing Custom Hooks
281(2)
Labeling Custom Hooks with useDebugValue
283(2)
Finding and Using Custom Hooks
285(1)
use-http
285(1)
react-fetch-hook
286(1)
axios-hooks
286(1)
react-hook-form
286(1)
@rehooks/local-storage
287(1)
use-local-storage-state
287(1)
Other Fun Hooks
288(1)
Lists of Hooks
288(1)
Summary
288(1)
Chapter 12 Routing
289(30)
What Is Routing?
289(2)
How Routing Works in React
291(2)
Using React Router
293(1)
Installing and Importing react-router-dom
293(1)
The Router Component
294(1)
Selecting a Router
294(1)
Using the Router Component
295(1)
Linking to Routes
296(1)
Internal Linking with Link
296(2)
Internal Navigation with NavLink
298(4)
Automatic Linking with Redirect
302(1)
Creating Routes
302(2)
Restricting Path Matching
304(1)
Using URL Parameters
304(1)
The component Prop
305(1)
Render Props
306(1)
Switching Routes
307(1)
Rendering a Default Route
308(1)
Routing with Redirect
308(1)
Behind the Scenes: location, history, and match
309(1)
The history Object
310(3)
The location Object
313(1)
The match Object
313(4)
React Router Hooks
317(1)
useHistory
317(1)
useLocation
317(1)
useParams
317(1)
useRouteMatch
317(1)
Summary
318(1)
Chapter 13 Error Boundaries
319(20)
The Best Laid Plans
319(1)
What Is an Error Boundary?
320(3)
Implementing an Error Boundary
323(1)
Building Your Own ErrorBoundary Component
323(1)
getDerivedStateFromErrors Is a Static Method
324(1)
getDerivedStateFromErrors Runs During the Render Phase
325(1)
getDerivedStateFromErrors Receives the Error as a Parameter
325(1)
getDerivedStateFromErrors Should Return an Object for
Updating State
325(1)
Testing Your Boundary
326(1)
Logging Errors with ComponentDidCatch()
327(1)
Using a Logging Service
328(5)
Resetting the State
333(1)
Installing a Pre-Built ErrorBoundary Component
334(2)
What Can't an Error Boundary Catch?
336(1)
Catching Errors in Error Boundaries with try/catch
336(1)
Catching Errors in Event Handlers with react-error-boundary
337(1)
Summary
338(1)
Chapter 14 Deploying React
339(12)
What Is Deployment?
339(1)
Building an App
339(1)
Running the build Script
340(1)
Examining the build Directory
340(1)
The Built index.html
341(1)
The static Directory
342(1)
asset-manifest.json
342(1)
What's in a Name?
343(1)
How Is a Deployed App Different?
343(1)
Development Mode vs. Production
343(1)
Putting It on the Web
344(1)
Web Server Hosting
344(1)
Node Hosting
345(1)
Deploying with Netlify
345(2)
Enabling Routing with Netlify
347(1)
Enabling Custom Domains and HTTPS
348(1)
Summary
349(2)
Chapter 15 Initialize A React Project From Scratch
351(18)
Building Your Own Toolchain
351(1)
Initializing Your Project
352(1)
The HTML Document
352(1)
The Main JavaScript File
353(1)
The Root Component
353(1)
Running in the Browser
354(3)
How Webpack Works
357(1)
Loaders
358(1)
Plugins
358(1)
Automating Your Build Process
358(1)
Making an HTML Template
359(1)
Development Server and Hot Reloading
360(1)
Testing Tools
360(1)
Installing and Configuring ESLint
360(1)
ESLint Configuration
361(1)
How to Fix Errors
362(1)
Testing with Jest
363(1)
Creating NPM Scripts
364(1)
Structuring Your Source Directory
365(1)
Grouping by File Type
366(1)
Grouping by Features
367(1)
Summary
367(2)
Chapter 16 Fetching And Caching Data
369(18)
Asynchronous Code: It's All About Timing
369(1)
JavaScript Never Sleeps
370(4)
Where to Run Async Code in React
374(2)
Ways to Fetch
376(1)
Getting Data with Fetch
377(1)
Getting Data with Axios
377(2)
Using Web Storage
379(1)
Two Types of Web Storage
379(1)
When to Use Web Storage
380(1)
When Not to Use Web Storage
380(1)
Web Storage Is Synchronous
380(1)
Working with localStorage
381(1)
Storing Data with localStorage
381(1)
Reading Data from localStorage
382(2)
Removing Data from localStorage
384(1)
Summary
385(2)
Chapter 17 Context API
387(12)
What Is Prop Drilling?
387(1)
How Context API Solves the Problem
388(1)
Creating a Context
388(1)
Creating a Provider
389(1)
Consuming a Context
390(1)
Using Context in a Class Component
390(1)
Using Context in a Function Component
391(1)
Common Use Cases for Context
391(1)
When Not to Use Context
392(1)
Composition as an Alternative to Context
392(4)
Example App: User Preferences
396(2)
Summary
398(1)
Chapter 18 React Portals
399(14)
What Is a Portal?
399(1)
How to Make a Portal
399(4)
Why Not Just Render Multiple Component Trees?
403(1)
Common Use Cases
403(1)
Rendering and Interacting with a Modal Dialog
404(5)
Managing Keyboard Focus with Modals
409(2)
Summary
411(2)
Chapter 19 Accessibility In React
413(12)
Why Is Accessibility Important?
413(1)
Accessibility Basics
414(1)
Web Content Accessibility Guidelines (WCAG)
414(1)
Web Accessibility Initiative - Accessible Rich Internet
Applications (WAI-ARIA)
415(1)
Implementing Accessibility in React Components
415(1)
ARIA Attributes in React
416(1)
Semantic HTML
416(1)
Form Accessibility
417(1)
Focus Control in React
418(1)
Skip Links
418(1)
Managing Focus Programmatically
419(1)
Media Queries in React
420(1)
Media Queries in Included CSS
421(1)
Using useMediaQuery
422(1)
Summary
422(3)
Chapter 20 Going Further
425(12)
Testing
425(1)
Mocha
426(1)
Enzyme
426(1)
Chai
427(1)
Assert
427(1)
Expect
428(1)
Should
428(1)
Karma
428(1)
Nightwatch.js
428(1)
Server-Side Rendering
429(1)
Flux
430(1)
Redux
430(2)
GraphQL
432(1)
Apollo
433(1)
React Native
434(1)
Next.js
434(1)
Gatsby
434(1)
People to Follow
435(1)
Useful Links and Resources
435(1)
Summary
436(1)
Index 437
About the Author

CHRIS MINNICK is an accomplished author, trainer, and web developer with experience working on web and mobile projects with both small and large companies.

The companion website at www.reactjsfoundations.com provides code listings for each chapter, plus examples and downloads that can be used to test out the various ReactJS techniques in the book.
Püsilink: https://www.kriso.ee/db/9781119685630_pe.html
Märksõnad: