3^nd Homework

The goal of this homework is to create settings page.

There are 3 steps:

• [ ] Design settings page
• [ ] Connect fields to React Hook Form and use Zod validation
• [ ] Send a link to a working settings page

Deadline: Monday 09/10/2023 - 23:59:59

Step 0: Connect to the Server

• Connect to the remote server using your editor of choice
• Make sure you base your work on the branch of the git repository:

To get the latest state of Quacker in your folder, open your terminal and run the following commands on the server:

This will fetch the newly created branch from the GitLab origin and reset your code to the final state of the 2nd practical class.

If you have trouble connecting, see "Hello, Server!" guide or contact your teacher.

Step 1: Design settings page

Update and components according to screenshots below (be as close as possible). Use Chakra UI, for more info see here.

Desktup:

Tablet:

Mobile:

Step 2: Connect fields to React Hook Form and use Zod validation

All fields should be connected to React Hook Form library.

There should be validation using Zod on all fields.

• all fields are required (non empty string, etc.)
• email is valid email addres
• "Agree to Terms and Conditions" must be set to
• text in "Profile bio" can't contain strings and

When save button is pressed:

• if form is invalid it should dispaly error messages
• if form is valid it should use to show form values

Step 3: Send a Link to a Working Settings Page

Once you are finished:

• send a link to a working settings page
  https://dev-frontend--vse.handson.pro/practical/03
• using MS Teams to: Tomas Horacek (@hort19)

Deadline: Monday 09/10/2023 - 23:59:59

Happy Coding!