Patagonia

Ecommerce website

Personal project

2020

Patagonia is a fictional e-commerce website selling modern surfboards, and surfing items. Introducing three major trademarks to chose surfboards from depending on the range of your experience and level.

scroll

THE TECH BEHIND THE WEBSITE

The goal from building this web app was to test my frontend skills and my ability to work with modern React using rest-apis, also modern css with flex and grid displays. The concept design and gathering of all the assets was done in few hours and I started my development planing, the first problem I had to deal with is building products' data structure.Therefore I used a json file to store every product under it's own trademark, category, and id which properly facilitate managing and working with data on the frontend code. The app had many pages and components with a associated and interchangeable state, I chosed React to build the app to solve this problems using it's context api, another problem I had to undertake was sourcing images from instagram to a component on the home page and increase the overall performance of the app, as a solution I used an instagram query link api along with Axios to fetch the required assets and I applied code splitting with suspense and react.lazy for the pages.
  • ReactJs
  • Sass
  • Axios

A MOBILE FRIENDLY APPROACH

In todays digital age, users expect every website to have a mobile version. So companies and developers must try to produce the same if not better experience for users interacting with their site on a mobile device. This project helped me understand how a professional team translates a desktop site into a mobile device.