Stage 2 Frontend Task: Timbu Cloud Shop

Study Material

• Learn React and Next (Js/Ts)

Task

In this stage, you'll step outside your individual coding zone and embrace collaboration! Here's the mission:

Find a Designer:

Partner up with a designer. This is your chance to showcase your communication and teamwork skills.

Design Implementation:

Collaborate with your designer to bring their Timbu Cloud shop page design to life. Translate the design into a functional webpage using React (.tsx/.jsx) / Next.js (.tsx/.jsx). Make sure there’s a checkout page as well.

Requirements

• Collaboration: Effective communication and teamwork with your assigned designer throughout the development process. (You are only allowed to collaborate with a designer, any collaboration with your fellow FE dev will result in instant disqualification).

• Technologies: TypeScript or JavaScript.

• Responsiveness: The website must be responsive and function well on all devices (desktop, tablet, mobile).

• The shop page should reflect the designer's vision.

• Products should be displayed with clear descriptions and images.

• A checkout page checkout process should be implemented.

• There will be no functional checkout process at this stage.

• All static pages must be implemented.

Acceptance Criteria:

• Visual Design: Your implementation must be pixel-perfect and reflect what is on the Figma design (layout, colors, branding).

• Products are displayed clearly with descriptions and images.

• Navigation allows users to browse through the shop page.

• The page is static (no working checkout process).

• The page should be fully responsive and adjust to different screen sizes.

• Code Quality: Well-structured, indented, and easy-to-read jsx/tsx code.

Submission Mode

Submit your task through the designated submission form. Ensure you've:

• Hosted the page on a platform of your choice (e.g., Vercel, Netlify).

• Double-checked all requirements and acceptance criteria.

• Provided the hosted page's URL in the submission form.

• Provided a link to the Figma file of the design.

• Thoroughly reviewed your work to ensure accuracy, functionality, and adherence to the specified guidelines before you submit it.

Submission Deadline:

The deadline for submissions is Monday, 8 July, at 11:59 PM GMT. Late submissions will not be entertained.

Submit - Submission Form @channel