Build an Amazon Clone with Firebase Authentication: Powered by React

Amazon Clone with Authentication using Firebase, Data Storage with Firestore, and Payments with Stripe

This is a full-stack web application that replicates the core functionalities of the popular e-commerce platform Amazon. The application uses Firebase for authentication, Firestore for data storage, and Stripe for processing actual payments. The backend is built using Node.js and Express, while the frontend is developed using React.

Features

  • User authentication using Firebase Auth.
  • Browse through various products.
  • Add products to the cart.
  • Update and remove items from the cart.
  • Checkout process with real payment functionality using Stripe.
  • Real-time product updates.
  • Responsive design for mobile and desktop.

Deployment

-Under progress-

Screenshots

imageimage

imageimage

image

Installation

  1. Clone the repository:
git clone https://github.com/your-username/amazon-clone.git
cd amazon-clone
  1. Install backend dependencies:
npm install
  1. Install frontend dependencies:
npm install
  1. Set up Firebase:
  • Create a new project on Firebase and enable Authentication and Firestore.
  • Go to the project settings and find the web app configuration.
  • Copy the configuration object and replace it in src/firebase.js.
  1. Set up Stripe:
  • Create an account on Stripe (if you haven’t already).
  • Get your Stripe API key.
  • Replace the placeholder in payment.js with your Stripe API key.
  1. Run the application:
# From the backend directory
firebase init
firebase emulators:start

# From the frontend directory
npm start
  1. Open your browser and navigate to http://localhost:3000 to view the application.

Folder Structure

amazon-clone/
|-- functions/
|   |-- index.js
|-- 
|   |-- public/
|   |-- src/
|   |   |-- components
|   |   |-- App.js
|   |   |-- index.js
|
|-- README.md

Acknowledgements

  • This project is inspired by the Amazon website.
  • Special thanks to Firebase, Firestore, and Stripe for providing the authentication, data storage, and payment processing capabilities.

GitHub

View Github


Related Posts

Recent Posts

ഇടുക്കിയിലെ മലയോര മേഖലകളിൽ രാത്രിയാത്ര നിരോധിച്ചു. രാത്രി ഏഴു മുതൽ രാവിലെ ആറു വരെയാണ് നിരോധനം

ഏന്തയാർ ഈസ്റ്റിൽ പ്രളയത്തിൽ തകർന്ന പാലത്തിന് പകരം പുതിയ പാലം നിർമ്മിക്കുവാൻ താത്ക്കാലിക പാലം പൊളിച്ച് നീക്കി

Explore the Investment Opportunities: A Comprehensive Guide to Different Types of Mutual Funds

Title: Understanding Mutual Funds: A Beginner's Guide to Investing

തീവ്രമഴ മുന്നറിയിപ്പിന്റെ പശ്ചാതലത്തിൽ സംസ്ഥാനം ജാഗ്രതയിൽ

250,000 അപേക്ഷകൾ വർദ്ധിച്ചതിനാൽ ട്രാൻസ്‌പോർട്ട് കമ്മീഷണർ പരിശോധന പുനരാരംഭിക്കും

ഏലക്കയിൽ കീടനാശിനി സാന്നിധ്യം; ആറര ലക്ഷത്തിലധികം ടിൻ അരവണ നശിപ്പിക്കാൻ ടെൻഡർ ക്ഷണിച്ച് ദേവസ്വം ബോർഡ്‌

ഭീമൻ പാറക്കഷണങ്ങൾ അടർന്ന് ദേശീയ പാതയിലേക്ക് വീഴുന്നത് പതിവാകുന്നു. കുട്ടിക്കാനത്തിനും മുണ്ടക്കയത്തിനുമിടയിൽ നിലനിൽക്കുന്നത് വൻ അപകട ഭീഷണി

ചക്രവാതച്ചുഴി:അതിശക്തമായ മഴ വരുന്നു

പ്ലസ് വൺ പ്രവേശനം. അക്ഷയയിൽ തിക്കി തിരക്കേണ്ട, നെറ്റിവിറ്റി/ജാതി തെളിയിക്കാൻ പത്താംതരം സർട്ടിഫിക്കറ്റ് മതി