Merge pull request #43 from unknown91tech/docker-added

added the docker file

.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+.next

Dockerfile

@@ -0,0 +1,13 @@
+FROM node:20-alpine
+
+WORKDIR /nextapp
+
+COPY package* .
+
+RUN npm install
+
+COPY . .
+
+EXPOSE 3000
+
+CMD ["npm" , "run" , "dev"]

README.md

@@ -77,6 +77,28 @@ npm run dev
 
 Open your web browser and visit http://localhost:3000 to see the website in action during development.
 
+## Running the Project Locally Using Docker
+
+You can also run DesignDeck locally using Docker by following these steps:
+
+1. Make sure you have Docker installed on your machine.
+
+2. Go to the `docker-compose.yml` file in the root of your project and put your api key in this section:
+
+```bash
+  environment:
+      NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY: your_api_key_goes_here
+```
+
+3. To start the application using Docker, run the following command in your terminal:
+
+```bash
+docker-compose up --build
+```
+
+This command builds the image and starts the container. You can then access the application at `http://localhost:3000`. 
+
+
 ## CONTRIBUTING 
 
 We welcome contributions to DesignDeck! To contribute:

docker-compose.yml

@@ -0,0 +1,22 @@
+version: '3.8'  
+
+services:
+  web:
+    image: nextapp
+    build:
+      context: .  # Use the current directory
+      dockerfile: Dockerfile
+    command: sh -c "npm i && npm run dev"
+    restart: always  # Specify the Dockerfile
+    ports:
+      - "3000:3000"  # Map port 3000 
+    volumes:
+      - ./app:/nextapp/app 
+      - ./components:/nextapp/components
+      - ./constants:/nextapp/constants
+      - ./hooks:/nextapp/hooks
+      - ./lib:/nextapp/lib
+      - ./public:/nextapp/public
+      - ./types:/nextapp/types # Bind mount the current directory to /nextapp in the container
+    environment:
+      NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY: your_api_key_goes_here

next.config.mjs

@@ -1,18 +1,22 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
+  swcMinify: true,
   experimental: {
     appDir: true,
     esmExternals: "loose",
   },
-  webpack: (config) => {
+  webpack: (config, context ) => {
     config.externals.push({
       "utf-8-validate": "commonjs utf-8-validate",
       bufferutil: "commonjs bufferutil",
       canvas: "canvas",
     });
-
-    return config;
+    config.watchOptions = {
+      poll: 1000,
+      aggregateTimeout: 300,
+    }
+    return config
   },
   images: {
     remotePatterns: [