This test aims to test the candidate's knowledge regarding the technologies used by the Cuponeria Frontend Developer Team.
-
all the images and icons what you will need are in images folder inside references
Clone this repository. Create a new branch with your name. Checkout to the branch of your name. Commit your workflow, you can check this article. After you're done, push to the origin and send a pull request of the branch with your name.
- You have to use Next Js as your framework.
- Use typescript.
- Use many reusable components as you can.
- Use Styled Components to style your components.
- You have to use Grid Layout for the structure of the pages and Flexbox for the Components.
- All content needs to be consumed through the Fake Store API.
- If the fake store API is out, you can consume alternative API.
- For the sign up page you have to use viacep API to get all address informations to pre populate other fields.
- Home page must be a static page.
- For the other pages, you have to use server side rendering avaliable in next js.
- Each category and product page must be a dinamic page in next js pages folder
- The app must be responsive for Web and Mobile but have to look good on all breakpoints like mobile, tablets, laptops, desktops widescreen and desktops ultrawidescreen.
- You can mock informations like the price on cart page if this doesn't exists in fake store api.
- Can we see your UI/UX skills? Surprise us with your best, you can change the layout theme schema the way you want, and please, add microinterations but without using external libs.
- Don't repeat yourself. Elements that are logically related must be changed predictably and uniformly and must be sync.
- Create and Documenting your components using storybook. you can use as a little component library or a part of your project.
- Create tests for your components and services using react testing library, jest or any other test library.