Skip to Content

Components, JSX and props

npm create vite@latest catalogue -- --template react
cd catalogue && npm install && npm run dev
function ProductCard({ name, price, inStock }) {
  return (
    <article className="card">
      <h3>{name}</h3>
      <p>${price.toFixed(2)}</p>
      {inStock ? <span className="ok">In stock</span> : <span>Call us</span>}
    </article>
  );
}

export default function App() {
  return <ProductCard name="RUT261 router" price={390.4} inStock />;
}

Components are functions that return UI. Props flow down; components never change their props.

Rating
0 0

There are no comments for now.

to be the first to leave a comment.