Building a screen from pieces

A shopping page has a product card, basket button, and checkout form. A frontend tool helps a team build these as reusable pieces and update the screen when information changes. The browser still uses HTML, CSS, and JavaScript underneath.

Each reusable piece is called a component. A product card component might show a picture, name, price, and button. The same component can appear for many products. When a shopper adds something to the basket, the tool helps update the relevant parts of the screen, such as the basket total.

Choosing a frontend tool

These tools help organise and update the interface. The team writes the product’s content and business rules, then checks that the result is accessible and works for users.

The choices differ in how much structure and tooling they provide. React is usually called a library, while Vue and Angular are frameworks. Teams often compare them together because they solve similar frontend problems. The choice also affects what other tools the project needs, how the code is maintained, and which skills the team needs. See frameworks and libraries for the distinction.

Examples of frontend tools