Here's a quick overview of the tech stack we use in our project:
- Next.js - The React framework for production.
- Typescript - Strongly typed programming language that builds on JavaScript.
- Tailwind CSS - A utility-first CSS framework for rapid UI development.
- Swiper - Powerful and modern touch slider.
- React PDF - Display PDFs in your React application.
- Zustand - A simple, fast and scalable bearbones state-management solution.
- Node.js - JavaScript runtime for building fast server applications.
- Prisma - Next-generation ORM for Node.js and TypeScript.
- PostgreSQL - The World's Most Advanced Open Source Relational Database.
- NodeMailer - Module for Node.js applications to allow easy email sending.
- Docker - Platform for developing, shipping, and running applications.
- Vercel - Hosting and serverless backend services for web applications.
- Jest - Delightful JavaScript Testing Framework.
- Playwright - Browser automation library to enable cross-browser web testing.
- Figma - Online UI design and prototyping tool.
- Paypal - Online payment system.
- MercadoPago - Latin American payment platform.
- Cloudinary - Cloud service that offers a solution to a web application's entire image management pipeline.
- Clerk - User management and authentication for modern applications.
- ShadCn - (If ShadCn is a custom tool or library, you might want to provide more information or remove it if it's not publicly known or relevant to the project).
To get started with the project, follow these steps:
-
Clone the project repository:
git clone https://github.com/DeusloVult/shop.co-ecommerce.git
-
Copy the contents from
env.example
into a new file named.env.local
. -
If you are using a local database, start the Docker container:
docker compose up -d
Alternatively, if you're connecting to an external database, specify the database connection string in your
.env.local
file:DATABASE_URL="your-database-connection-string"
-
Install the project dependencies using
pnpm
:pnpm install
-
Apply database migrations to set up the database schema:
pnpm dlx prisma migrate dev --name init
-
Start the development server:
pnpm dev
- Use English for naming folders and files.
- For creating files, use the format
feature-name.ts
orfeature-name.tsx
(e.g.,data-products.ts
). - Create folders to group related files within a category (e.g.,
components
,utils
). - Manage imports using the Autobarrel extension for better organization and easier access from the main folder.
If you wish to contribute to the project, please follow these guidelines:
- Clone the repository.
- Fetch the latest updates from the main branch:
git pull
- Switch to the development branch:
git switch dev
- Create a new branch for your changes, using a descriptive name:
git checkout -b feature/your-feature-name
- Always pull the latest changes from the
dev
branch before starting to work on a new feature:git pull origin dev
- Contribute by opening a Pull Request (PR).
- If you encounter any bugs or would like to suggest new features, create an issue and assign the appropriate labels.
- The
data
folder is responsible for creating mock data for testing. - Each data file should be generated using
data-generator.ts
to ensure consistency. - Eventually, this dummy data will be replaced with actual data from the database.
pnpm prisma:seed
If you encounter any bugs or would like to suggest new features, create an issue and assign the appropriate labels.