npm install
npm run dev
Open http://localhost:3000 with your browser to see the result.
- The UI should look like the mockup in /mocks.
- Clicking the "Make Noise" button should cause the noise to be displayed briefly and fade away.
- Add a "Delete" button to the right of the "Make Noise" button
- The delete button should only show when you hover on an animal
- The delete button should remove the animal from the list
- Add an "Add" button below the last animal
- The add button should create a random animal
- Move the animals into a React.Context, instead of passing as as prop to AnimalsView
- Use Atomic design to organize and maintain this project
- Use the Angular Commits Guide Line to lint the commit message, for more information, click on this link.
- The animation at animal name that's currently wrongly toggling the visibility, but this behavior can be easily fixed by creating a custom animation at the tailwind.config.js file
- The random animal creation feature would be better using a pool of animals and their sounds to create the whole animal object randomly.
- There's a warning at the console about the title tag it's placed on the _document file, the solution it's on this link