ebay E-Commerce Clone

Fullstack e-commerce website using Next JS, React, Supabase, TailwindCSS, Prisma, Stripe based upon ebay design.
Explore the docs »

View Demo · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
3. Contributing
4. License
5. Contact
6. Acknowledgments

About The Project

This is a clone of popular e-commerce website eBay, an online auction and shopping website, eBay provides virtual marketplaces for selling goods, and to buy products provided with online payment services.

In this functional ebay clone users can:

• Register + Login using Google OAuth
• Search for items in the search bar
• See a list of products available (fetched from supabase database)
• See full details of each product by entering that products individual page.
• Add + edit their address for delivery
• Add products to their cart
• See their cart dynamically update in the top bar.
• View their full cart details and total by clicking the cart icon
• Go to the checkout where they can see the products they are buying, their shipping address.
• Pay for their items using Stripe.

(back to top)

Built With

This following frameworks/libraries were used to bootstrap this project:

Notable mentions:

• Stripe payments
• Tailwind CSS
• Prisma
• Supbase

(back to top)

Getting Started

1. Clone the repo

   git clone https://github.com/Patchalv/ebay-clone.git

2. Install NPM packages

   npm install

3. Create .env file (See example.env for example)
4. Setup supabase and add in required keys to .env
5. Setup Google OAth in supabase (https://supabase.com/docs/guides/auth/social-login/auth-google)
6. Setup stripe and add in reqiored keys to .env
7. Run the development server

   npm run dev

8. Open http://localhost:3000 with your browser to see the result.

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Whether you want to reach out about this project, collaborating together in the future, or you just want to reach out, please don't hesitiate to get in touch!

(back to top)

Acknowledgments

Some resources that I found helpful and would like to give credit to:

• John Weeks - Tutorial
• Img Shields
• GitHub Pages
• Font Awesome
• React Icons
• React Toastify
• Othneil Drew README Template

(back to top)