Web Components and React Components - Usage Differences

Web Components

• Custom Component Name must be hyphenated e.g. my-component
• The tag name is case insensitive as it is part of the HTML
• <slot> tag that allows component composition. Svelte too has the concept of slots.
• API ⇒ customElements.define('my-component', ComponentClass)

React Components

• Custom Component Name always starts with a capital letter.
• It is case sensitive, that is possible because JSX is actually XML(which is case sensitive).
• Can't have hyphens in the name because it is supposed to be a function that can't have a hyphen in its name.