Initial commit

.dockerignore

@@ -2,4 +2,6 @@ node_modules
 .git
 .gitignore
 .env.example
-.env
+.env
+.next
+node_modules

.eslintignore

@@ -1,2 +1,4 @@
 node_modules
+.next
+out
 .github

.eslintrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+    extends: [
+        "next/core-web-vitals",
+
+    ],
+    plugins: ['@typescript-eslint'],
+    rules: {
+      'no-multiple-empty-lines': ['error', { max: 1 }],
+    },
+  };

.github/workflows/cd.yml

@@ -23,7 +23,7 @@ jobs:
         uses: docker/build-push-action@v4
         with:
           context: .
-          file: ./Dockerfile.prod
+          file: ./Dockerfile.multistage
           push: true
           tags: 100xdevs/cms-staging:${{ github.sha }}
           build-args: |

.github/workflows/cd_prod.yml

@@ -23,7 +23,7 @@ jobs:
         uses: docker/build-push-action@v4
         with:
           context: .
-          file: ./Dockerfile.prod
+          file: ./Dockerfile.multistage
           push: true
           tags: 100xdevs/cms:${{ github.sha }}
           build-args: |

Dockerfile.multistage

@@ -0,0 +1,67 @@
+# Stage 1: Build the application
+FROM node:20-alpine AS builder
+ARG DATABASE_URL
+ENV DATABASE_URL=${DATABASE_URL}
+
+WORKDIR /usr/src/app
+
+# Install pnpm globally
+RUN npm install -g pnpm
+
+# Copy package.json and pnpm-lock.yaml (if you have one)
+COPY package.json pnpm-lock.yaml* ./
+
+# Copy Prisma schema
+COPY prisma ./prisma
+
+# Install dependencies including dev dependencies
+RUN pnpm install
+
+# Generate Prisma client
+RUN npx prisma generate --schema=./prisma/schema.prisma
+
+# Copy the rest of the application code
+COPY . .
+
+# Install next globally
+RUN npm install -g next
+
+# Copy ESLint configuration
+COPY .eslintrc.js .
+COPY .eslintignore .
+
+# Build the application
+RUN pnpm run lint || true && pnpm run build
+
+# Stage 2: Create the production image
+FROM node:20-alpine
+ARG DATABASE_URL
+
+WORKDIR /usr/src/app
+
+# Install pnpm globally
+RUN npm install -g pnpm
+
+# Copy package.json and pnpm-lock.yaml (if you have one)
+COPY package.json pnpm-lock.yaml* ./
+
+# Install only production dependencies
+RUN pnpm install --prod --no-frozen-lockfile
+
+# Copy Prisma schema and generate client
+COPY prisma ./prisma
+RUN npx prisma generate --schema=./prisma/schema.prisma
+
+# Copy built application from the builder stage
+COPY --from=builder /usr/src/app/.next ./.next
+COPY --from=builder /usr/src/app/public ./public
+
+# Set environment variables
+ENV NODE_ENV=production
+ENV DATABASE_URL=${DATABASE_URL}
+
+# Expose the port the app runs on
+EXPOSE 3000
+
+# Start the application
+CMD ["pnpm", "start"]

Dockerfile.prod

@@ -1,5 +1,6 @@
 FROM node:20-alpine
 ARG DATABASE_URL
+ENV DATABASE_URL=${DATABASE_URL}
 
 WORKDIR /usr/src/app
 

README.md

@@ -128,3 +128,19 @@ Read our [contribution guidelines](./CONTRIBUTING.md) for more details.
 <a  href="https://github.com/code100x/cms/graphs/contributors">
 <img  src="https://contrib.rocks/image?repo=code100x/cms&max=400&columns=20"  />
 </a>
+
+## Docker Build (Multistage)
+
+To build and run the application using the multistage Dockerfile locally:
+
+1. Build the Docker image:
+   ```bash
+   docker build -f Dockerfile.multistage -t nextjs-app --build-arg DATABASE_URL=your_database_url .
+   ```
+
+2. Run the Docker container:
+   ```bash
+   docker run -p 3000:3000 nextjs-app
+   ```
+
+Replace `your_database_url` with the actual database URL for your local environment.

docker-compose.yml

@@ -1,7 +1,9 @@
 version: '3.5'
 services:
   app:
-    build: .
+    build:
+      context: .
+      dockerfile: Dockerfile.multistage
     container_name: cms-docker
     environment:
       - DATABASE_URL=postgresql://postgres:postgres@db:5432/cms?schema=public
@@ -36,4 +38,4 @@ services:
       retries: 5
 
 volumes:
-  postgres-data: 
+  postgres-data:

package.json

@@ -6,10 +6,7 @@
     "seed": "ts-node --compiler-options {\"module\":\"CommonJS\"} prisma/seed.ts"
   },
   "scripts": {
-    "preinstall": "npx only-allow pnpm",
-    "postinstall": "prisma generate",
     "dev": "next dev",
-    "build": "next build",
     "start": "next start",
     "test": "vitest -c ./vitest.config.unit.ts",
     "test:integration": "./scripts/run-integration.sh",
@@ -24,22 +21,23 @@
     "db:seed": "prisma db seed",
     "db:reset": "prisma migrate reset",
     "update:videometadata": "ts-node --compiler-options \"{\\\"module\\\": \\\"CommonJS\\\"}\" ./src/scripts/updateVideoMetaData.ts",
-    "prepare": "husky install",
     "studio": "prisma studio",
     "studio:docker": "open http://localhost:5555 || start http://localhost:5555",
     "storybook": "concurrently 'yarn:watch:*'",
     "watch:storybook": "storybook dev -p 6006",
     "watch:tailwind": "npx tailwind -i ./src/styles/tailwind-input.css -o ./src/styles/tailwind.css --watch",
     "build:tailwind": "npx tailwind -i ./src/styles/tailwind-input.css -o ./src/styles/tailwind.css",
-    "build-storybook": "npm run build:tailwind && storybook build"
+    "build-storybook": "npm run build:tailwind && storybook build",
+    "lint": "eslint .",
+    "build": "next build"
   },
   "dependencies": {
     "@auth/prisma-adapter": "^1.0.6",
     "@discordjs/core": "^1.1.1",
     "@discordjs/next": "^0.1.1-dev.1673526225-a580768.0",
     "@hookform/resolvers": "^3.6.0",
     "@icons-pack/react-simple-icons": "^9.4.0",
-    "@prisma/client": "^5.18.0",
+    "@prisma/client": "^5.20.0",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-avatar": "^1.0.4",
     "@radix-ui/react-dialog": "^1.0.5",
@@ -125,13 +123,14 @@
     "@vitest/coverage-v8": "^1.6.0",
     "autoprefixer": "^10.0.1",
     "eslint": "^8.56.0",
+    "eslint-config-next": "^14.2.14",
     "eslint-plugin-storybook": "^0.8.0",
     "husky": "^9.0.7",
     "jsdom": "^24.0.0",
     "postcss": "^8",
     "prettier": "^3.2.4",
     "prettier-plugin-tailwindcss": "^0.6.1",
-    "prisma": "^5.18.0",
+    "prisma": "^5.20.0",
     "tailwindcss": "^3.3.0",
     "ts-node": "^10.9.2",
     "typescript": "^5.4.5",