PILLOWS.COM HOMEPAGE RECREATION IN REACT.JS

N/A

Pillows.com React Website

Industry

E-commerce / Home & Lifestyle

Project type

Web Development

Project year

2024

project overview

A responsive React.js implementation of a premium bedding e-commerce homepage, developed as part of a technical assignment for a frontend position. The project focused on accurately translating an existing Figma design into clean, reusable code while adding responsive behaviour, interactive product discovery and polished micro-interactions.

tools i used

ReactJS

Pillows.com is a frontend development project created as part of a technical assignment for a frontend position.

The objective was not to redesign the provided interface, but to demonstrate the ability to understand an established visual system and translate it into a functional, responsive and engaging React experience.

Beyond visual implementation, the project demonstrates practical frontend skills through reusable components, responsive layouts, state-based interactions and carefully implemented UI details.

The Challenge

The main challenge was to achieve close visual fidelity to the provided Figma design without treating the website as a static layout.

The original interface included multiple content-heavy sections, detailed product cards, promotional elements, category blocks, reviews and numerous visual assets. Every part of the page needed to remain consistent in terms of typography, spacing, imagery, colours, and hierarchy.

At the same time, the implementation needed to work across different screen sizes and include enough interaction to feel like a realistic e-commerce experience rather than a simple visual recreation.

The challenge was therefore to balance three important aspects:

  • accurate translation of the Figma design
  • clean and maintainable React code
  • responsive and interactive user experience

The Solution

The interface was developed in React.js using a component-based architecture.

 

Key Takeaway

This project strengthened my ability to move efficiently from design to development while maintaining both visual accuracy and code organisation.