e-Commerce Site

Go to site =>Dara's Upholstery

Goal:

  • Build an e-commerce template to be used for future projects

Research:

  • An e-commerce site can be boiled down to a simple concept of a catalog of items, and a shopping cart.
  • The site was designed to be both simple and complete, with the ability to be easily modified to fit the needs of a client.
  • A CMS is essential for an e-commerce site, and the CMS should be easy to use and understand for the client.
  • The payment system should be easy to use and understand for the client.

Planning:

  • Next.js was used for ease of use and reliability. Dynamic pages were made simple with Next.js features.
  • Each page needed to be able to be broken down into components to be easily modified and expanded upon.
  • Sanity.io was used as the CMS for the site
  • Stripe was used for the payment system
  • Figma was used to prototype certain elements
  • Shadcn was used for easily modified ready to use components.

Implementation:

  • Site would be filled out using generated images to simulate a real site.
  • Documentation was written to help with future development and modification of the site.

Polishing:

  • The site was styled to a 'dia de los muertos' theme.
  • Text, descriptions, and images were organized and optimized to allow google search indexing to have desired index preview in listings.
  • Site was tested using different screen sizes and browsers to site behaves predictably regardless of usage.

Production:

Launching the site

  • Vercel was chosen to host the site for ease of deployment
  • Sanity is hosted on their own servers, and is easily updated through their dashboard.