Background concepts / WEBFRONT
React components and state
State, rendering and events with React.
Rendering a component
A component is a function describing part of an interface from its props and state. JSX resembles HTML but belongs to JavaScript/TypeScript code. React recalculates that description when state changes and updates the required DOM.
A minimal state
This fragment belongs inside a function component, with useState imported from react. The function g => g + 1 computes the next value from the previous one. Do not mutate a grid stored in state directly: create a copy and pass it to the setter.
const [generation, setGeneration] = useState(0);
<button onClick={() => setGeneration(g => g + 1)}>
{generation}
</button>Connect an external effect
A C++ call is asynchronous. After await, its reply should update state only if the session remains valid. For subscriptions and observers, useEffect provides a clean-up function. The Life starter illustrates both precautions.
Question