Overview:
OneStopShop is an online marketplace built using Next.js App Router. It allows users to purchase products, sign up, and list their own products for sale. The app utilizes new technologies such as Server Actions and Drizzle ORM, but is currently a work in progress and should not be considered production ready.
Features:
- Next.js App Router with React Server Components
- Intercepted routes for product quick view and new product creation in admin
- Server Actions for mutations
- PlanetScale MySQL database with Drizzle ORM
- UploadThing for typesafe file uploads (e.g., product images)
- User authentication with Clerk
- Stripe Connect integration for marketplace payments
- Demo checkout experience with test card number and future date
Installation:
To run the app locally, follow these steps:
- Create a database in PlanetScale
- Create a local
.env
file with the variables from.env.example
- Run
npm install
- Generate a migration with
npx drizzle-kit generate:mysql
- Run the generated SQL queries from the migration manually or use the migration function in
db.ts
- Run
npm run dev
to open the app in development mode - Access the app at http://localhost:3000
Note: Ensure the migrations-folder
in the root is empty or doesn’t exist when generating the migration for the first time.
Summary:
OneStopShop is an online marketplace built with Next.js App Router. It offers various features such as server actions, user authentication, and Stripe integration for payments. The app is currently in development and uses new technologies that are still being stabilized. The installation process involves setting up a database, generating migrations, and running the app locally.