Build a click counter component! Track how many times a button has been clicked and display the running total.

The component must render a <p> element with the class count and a <button> element with the class increment labeled Increment. The paragraph text must be exactly Count: N, where N is the current count — it starts at Count: 0, and every click of the button increments the count by 1.

Note that LWC templates cannot concatenate strings inline, so build the label in JavaScript: use a getter like get countLabel() { return 'Count: ' + this.count; } and render {countLabel} in the template. The paragraph text must be exactly Count: N — no extra words or punctuation.

Examples:

Initial render: <p class="count">Count: 0</p> <button class="increment">Increment</button> Click the button once -> paragraph shows: Count: 1 Click two more times -> paragraph shows: Count: 3
LWC

Preview

Press Run & Test to compile and preview your component.

Test results

Tests run automatically after each compile.

Wally can't hear you

Please sign in to access the AI Assistant

Sign In