This eCommerce project is built on Next.js, Prisma, Postgres, and Tailwind. It integrates with Commerce.js, a headless eCommerce CMS, to fetch product data and manage the eCommerce functionality.
- Prerequisites
- Getting Started
- Project Structure
- Database
- Commerce.js Integration
- Tailwind CSS
- Contributing
- License
Before you begin, ensure you have the following installed:
- Node.js (v14 or higher)
- npm or yarn
- PostgreSQL
Clone the repository and install the dependencies:
git clone https://github.com/your-username/ecommerce-nextjs.git
cd ecommerce-nextjs
npm install # or yarn install
- Create a
.env
file in the root directory with the following environment variables:
DATABASE_URL=postgres://your-username:your-password@localhost:5432/your-database
COMMERCEJS_API_KEY=your-commercejs-api-key
# Add other configuration variables as needed
- Migrate the database:
npx prisma migrate dev
- Run the development server:
npm run dev # or yarn dev
Visit http://localhost:3000 to explore your eCommerce application.
./
|-- pages/ # Next.js pages
|-- components/ # Reusable React components
|-- api/ # API endpoints (optional)
|-- prisma/ # Prisma database schema and migrations
|-- public/ # Static assets
|-- .env # Environment variable configuration
|-- next.config.js # Next.js configuration
|-- ...
Customize the structure according to your project's specific needs.
This project uses PostgreSQL as the database. To make changes to the database schema, use Prisma migrations:
npx prisma migrate dev
Commerce.js is integrated to fetch product data and manage eCommerce functionalities. The integration details can be found in commercejs.js file.
Tailwind CSS is used for styling. The utility-first approach allows for easy customization. See tailwind.config.js for configuration details.
See CONTRIBUTING.md for information on how to contribute to this project.
This project is licensed under the MIT License.
Replace placeholders like your-username
, your-password
, and your-database
with your actual database credentials. Make sure to provide proper instructions for setting up and configuring Commerce.js in your project. Customize the sections as needed for your specific project.