frontendbeginner

Component

A reusable building block of your app's interface.

What is Component?

A component is a self-contained piece of UI — a button, a card, a navigation bar. Once built, you can reuse it anywhere. React (used by Lovable and Cursor) is built entirely around components.

Components are like LEGO bricks. You build small pieces (a button, a card), then snap them together to create pages and layouts.

In Vibe Coding

When you tell Lovable "add a pricing section," it creates a PricingSection component. In Cursor, you'll see files like Button.tsx, Navbar.tsx, Footer.tsx — each is a component you can reuse across your app.

Example

For example: You build a ProductCard component that shows a product image, name, and price. Now you can use that same card on your homepage, search results, and category pages — changing the data but keeping the design consistent.

Related Terms

Related Guides