Getting Started

First prepare .env file:

MONGODB_URL="your_mongodb_connection_url"

NEXTAUTH_URL="http://localhost:3000/"
SECRET="supersecretkeyforauth"

GOOGLE_CLIENT_ID="your_google_api_id"
GOOGLE_CLIENT_SECRET="your_google_api_key"

AWS_ACCESS_KEY="your_aws_s3_access_key"
AWS_SECRET_KEY="your_aws_s3_secret_key"

STRIPE_SECRET_KEY="your_stripe_secret_key"
STRIPE_PUBLIC_KEY="your_stripe_public_key"
STRIPE_SIGN_SECRET = "your_stripe_cli_key"

Then, run the development server:

yarn install
yarn dev

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

Technologies used in project:

Next.js

Tailwind css

MongoDB

AWS S3 bucket for storing images

Stripe as payment provider

Google as auth provider for NextAuth

Screenshots of working application:

Home screen:

Products page:

Single product with options:

Login page:

Profile page:

Add/edit categories and products pages:

Listing orders based on privilages (admin sees all orders, logged-in user sees only his own orders):

Payment process: