Nextjs e-commerce website builder (Shop)

This project uses nested dynamic routing to provide SSG e-commerce websites for small buisness owners. you can view the project here

and then follow the link to the example merchant!

Elegent hover card banners are used on the products to reduce clutter on the Products page.

To improve user experience, the customer can see the available variants of the product, they can easily filter through the variants and then the available quantity will match the inventory of that specific variant. This is much better for UX than dropdown menus.

the project IDs are stored in the Mongodb Database and used with getStaticPaths and getStaticProps to provide the data for each storefront.

The shop has default site settings incase the user doesn't wish to build their own custom website

Repositories that make up the website builder

• Sanity - Content Management System - Sanity is used to create schemas to provide content and site settings for each merchant. This repo will be cloned for each merchant, then by running sanity init, a new CMS project will be created with the same schemas. The project ID, and API keys will then be added to the database with the Control Panel

• Control Panel - The Control Panel is used to encrypt API keys and then add them along with the Sanity Project Id to the mongodb database.

• Company Website - Authenticated Dashboard - an account can be created by signing up with credentials or google auth, after sending a nodemailer email verification link, the user data and hashed password is added to the database providing authentication. This creates a connected Stripe account, which enables the user to accept payments from their store!