React ๐ŸŽ„

๐ŸŽ‰ Now on video! ๐Ÿ“บ
Buy, buy, buy!!!

Day 3: Components are functions

Components are just functions.

๐Ÿคฏ

How do I write said component functions?

Easy.

Hereโ€™s one that spits out our Hello ๐ŸŽ„ wherever used.

function Greeting() {
  return <h1>Hello ๐ŸŽ„</h1>;
}

How do I use said component functions?

JSX has you covered. Just use the function name like an HTML tag.

<Greeting />
<Greeting></Greeting>

Thatโ€™s it?

Pretty much, but hereโ€™s something to remember - Capitalize your Custom Components. If you donโ€™t, JSX transformers assume you meant a native DOM element.

Tinker with it

Use the workspace below to play with components.

  • Write and use a component of your own creation.
  • Mix custom components and native components. Any issues?
โ† Previous
Next โ†’

Learn other React stuff...