React was the framework named most often in the adverts we studied, for both Ghanaian companies and remote teams. Its core ideas are few: components, props, state and effects. Learn these well and you can work on most React codebases.
Components and JSX
A component is a function that returns what should appear on screen, written in JSX, which looks like HTML inside JavaScript:
function PriceTag({ name, price }) {
return (
<p>{name}: GH₵ {price}</p>
);
}Curly braces put JavaScript values into the markup. Component names start with a capital letter.
Props: passing data in
Props are inputs to a component, like function arguments:
<PriceTag name="Gari" price={15} />A component should not change its own props. They flow down from parent to child.
State: data that changes
State is data a component remembers between renders, such as text typed in a search box. Use the useState hook: