You will be building out the following project. You should divide your UI into the appropriate components and should utilize state and the useState hook.
- Your app should render as a greeting (perhaps, "Good Morning") in English.
- Beneath this greeting, there should be five buttons.
- Each button should correspond to a different language (perhaps, "Spanish", "Haitian Creole", and "Portuguese").
- When a language button is clicked, the greeting above should be translated to the appropriate language.
- Above your greeting, there should be two buttons to change the font size.
- When the buttons are clicked, the greeting size should grow or shrink accordingly.
- Your greeting should be its own component. In addition, each set of buttons should be their own component.
It's highly recommended you use the scaffolding tool Vite to create your starter code. You can run these commands to get started:
# Check your npm version
npm -v
# npm 6.x
npm create vite@latest project-name --template react
# npm 7+, extra double-dash is needed:
npm create vite@latest project-name -- --template react
cd project-name
npm i
npm run dev