AudioVerse is a fully responsive eCommerce website built with React, Next.js, integrated Stripe payments,using Sanity as the backend and is deployed on Vercel.
The purpose of this project was to gain experience and start learning Next.js, as well as to learn how to integrate Stripe payments and backend management with Sanity, both of which were important parts of this project.
- The integration with Stripe payments is a crucial feature for the eCommerce website, as it allows secure and efficient online transactions.
- Using Sanity as the backend for this project allows for flexible and efficient content management.
- Fully responsive design for easy access and use across all devices
- Fast and intuitive user interface to enhance user experience
- Integration with Stripe payments for secure and efficient online transactions
- A shopping cart to keep track of selected products
- A checkout page to complete purchases and finalize transactions
- Integration with Sanity backend for easy product management
- Local Storage integration
- Search Bar
- Product Categoriation
Please note that the AudioVerse eCommerce website has been developed in testing mode and no real payments will be processed. Stripe ensured you can fully experience all the features of the website - please use the following test credit card details on the checkout page:
- Card number: 4242 4242 4242 4242
- Expiration date: 04/24
- CVC: 242
- Postal code: 42424
You can clone my repo on your local machine...
- Hit a green 'Code' button on my GitHub Repo and coppy SSH key
- Use the below command on yout Terminal(Mac)/ Bash(Windows)
git clone <copy SSH key here>
- Install all dependencies by running
npm install
- Run the App with
npm run dev
- Open http://localhost:3000 with your browser to see the result.
- React
- Next.js
- Stripe
- Sanity
- CSS
- JavaScript
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- You can also check out the Next.js GitHub repository
- The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
- Sanity Docs - 'The Composable Content Cloud'
- Stripe Docs
- Confetti on my payment success page 🙃
- Really Cool Website for mixing CSS gradients