Apple Store - E-Commerce

Modern Apple Store built with React, TypeScript, Stripe payments, and Strapi backend for stored data. Styling with SASS.

View live siteView source code
Home page
Category page
Product page
Search page
Shopping bag

Main technologies

html icon

html

css icon

css

javascript icon

javascript

typescript icon

typescript

react icon

react

strapi icon

strapi

stripe icon

stripe

sass icon

sass

x reset filter

Stack

  • Strapi - the next-gen headless CMS, open-source, javascript, enabling content-rich experiences to be created, managed and exposed to any digital device.
  • Stripe - a suite of APIs powering online payment processing and commerce solutions for internet businesses of all sizes.
  • Axios - a simple promise based HTTP client for the browser and node.js.
  • React Icons - popular icons in your React projects which utilizes ES6 imports that allows you to include only the icons that your project is using.
  • React Router - a standard library for routing in React.
  • React Query - powerful asynchronous state management for TS/JS, React, Solid, Vue and Svelte.
  • Vite - a new breed of frontend build tooling that significantly improves the frontend development experience.

Details

  • client created with React (Vite) with TypeScript
  • payments provided by Stripe
  • CMS with Strapi
  • server deployment on Railway with PostgreSQL
  • local data stored on SQLite
  • media stored on Cloudinary
  • environment variables to switch between locale and production
  • data fetching and caching with Tanstack React Query
  • Axios and REST API is used to fetch data
  • context and reducer for managing shopping cart items
  • routing with React Router
  • styling with SASS
  • responsive website design
  • inspired by Apple
Go back