Skip to content

Implement a simple React counter component with TypeScript #38

@Nextdrive-CarlosLi

Description

@Nextdrive-CarlosLi

Task

You're tasked with creating a simple counter component using React, React Hooks, and TypeScript.

Input

None. The counter starts from zero.
Source code:

A new file named Counter.tsx in the src folder.

Expect

The counter should display a number (starting at zero) and have two buttons labelled "Increment" and "Decrement".
When the "Increment" button is clicked, the counter should increase by 1.
When the "Decrement" button is clicked, the counter should decrease by 1.
The counter should never go below zero. If the counter is at zero and the "Decrement" button is clicked, it should stay at zero.

How to verify

Write tests for the counter in a new file called Counter.spec.tsx. The tests should verify the following:
The counter starts at zero.
Clicking the "Increment" button increases the counter by 1.
Clicking the "Decrement" button decreases the counter by 1.
The counter does not go below zero.
You can run the tests using the following command:

yarn test

Finally

When you have completed the task and all tests pass, submit your solution as a pull request to this repository.

Tip:
Use TypeScript to enforce type safety in your component.
Make sure your implementation is clear, clean, and well-documented.

Good luck!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions