liveBook · Manning

Component-based design

As explained in Refactoring to Rust

Component-based development is a software design approach that structures systems as isolated, reusable components with related functionality or data.

Component-based design separates concerns into isolated, reusable packages, services, resources, or modules that share related functions or data. React applies this pattern to user interfaces by organizing behavior and rendering into components. section 9.4

A React list component

A List component owns its entries and page state, renders entries as links, and advances pagination through a More button. Replacing static entries with a WebAssembly-backed search keeps the UI boundary while moving data retrieval behind an imported library.

How Refactoring to Rust covers it

How deep it goes
Defines isolation and reuse, then demonstrates component state, rendering, imports, and asynchronous data fetching without covering broader architecture.
Examples
Uses a paginated React list, static entries, a More button, and asynchronous paper search backed by WebAssembly.
What it assumes
Assumes npm installation and basic JavaScript familiarity while introducing component structure incrementally through a working application.
What you can do after
Build React components, bootstrap them with Vite, and connect bundled WebAssembly functionality through npm dependencies.
How it connects
Connects React, JavaScript, Vite, npm, and WebAssembly through component creation and library integration.

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Refactoring to Rust. The section links point to the parts of the book it draws on.