This is project that can be reimplemented as a code dojo
The idea, is to build a react project from scratch, e.g. using
npx create-react-app counter-app
or using the skeleton branch in this repo.
First task is to create a simple counter (button "increase" which show the result). Other tasks are:
- Decrease Button: Add a button that decreases the count by 1 when clicked.
- Reset Button: Add a button that resets the count to 0 when clicked.
- Input Field: Add an input field where users can enter a number. When they click a "Set Count" button, the count should be set to the number they entered.
- Error Handling: If the user tries to set the count to a non-number or a negative number, show an error message.
- Save Count: Add a button that saves the current count to a list. Display this list on the page.
- Local Storage: Use the localStorage API to persist the count and the list of saved counts. When the user refreshes the page, the count and the list should not be lost.
- Styling: Use CSS or a CSS-in-JS library to style your components and improve the layout of your application.
Please solve the tasks in a test-driven way (TDD).
- node js
- yarn or npm
git clone https://github.com/PCPS/react-dojo.git
git checkout skeleton
yarn install or npm install
yarn start or npm start
git clone https://github.com/PCPS/react-dojo.git
yarn install or npm install
yarn start or npm start
Happy coding! 👨💻