updated dockerfile

Author: chefgs

.github/workflows/Build-Docker-Image.yaml

@@ -0,0 +1,61 @@
+name: Build and Create Docker Images
+
+on:
+  push:
+    branches:
+      - main
+
+env:
+  # Use docker.io for Docker Hub if empty
+  REGISTRY: ghcr.io
+  # github.repository as <account>/<repo>
+  IMAGE_NAME: ${{ github.repository }}
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+  
+      - name: Setup docker
+        uses: docker/setup-buildx-action@v2.7.0
+      
+      - name: Login to Docker Hub
+        uses: docker/login-action@v2
+        with:
+            registry: ${{ env.REGISTRY }}
+            username: ${{ github.actor }}
+            password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Build and push backend Docker image
+        uses: docker/build-push-action@v2
+        with:
+          context: ./backend
+          file: ./backend/Dockerfile
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}-backend:latest
+          platforms: linux/amd64,linux/arm64,linux/arm/v8
+
+      - name: Build and push frontend Docker image
+        uses: docker/build-push-action@v2
+        with:
+          context: ./frontend
+          file: ./frontend/Dockerfile
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}-frontend:latest
+          platforms: linux/amd64,linux/arm64,linux/arm/v8
+
+    # Install the cosign tool except on PR
+    # https://github.com/sigstore/cosign-installer
+    #   - name: Install cosign
+    #     if: github.event_name != 'pull_request'
+    #     uses: sigstore/cosign-installer@v3.5.0
+    #   - name: Sign the published Docker image
+    #     if: ${{ github.event_name != 'pull_request' }}
+    #     env:
+    #         COSIGN_EXPERIMENTAL: "true"
+    #     # This step uses the identity token to provision an ephemeral certificate
+    #     # against the sigstore community Fulcio instance.
+    #     run: echo "${{ steps.meta.outputs.tags }}" | xargs -I {} cosign sign --yes {}@${{ steps.build-and-push.outputs.digest 

README.md

@@ -53,44 +53,36 @@ Create a `.env` file in the backend directory and add the following environment
    PORT=5001
    ```
 
-4. **Start MongoDB**:
-Ensure MongoDB is running. You can start MongoDB using the following command:
+## How to Start MongoDB
 
-   ```bash
-   mongod --dbpath ~/mongodb/data/db
-   ```
+To start MongoDB, ensure you have MongoDB installed on your machine. You can start MongoDB using the following command:
+
+```bash
+mongod --dbpath ~/mongodb/data/db
+```
+
+If you encounter any issues with the data directory, create the directory and set the appropriate permissions:
 
-5. **Start the Backend Server**:
+```bash
+mkdir -p ~/mongodb/data/db
+sudo chown -R `id -un` ~/mongodb/data/db
+```
 
+4. **Start the Backend Server**:
 Navigate to the backend directory and start the server.
    ```bash
    cd backend
    npm start
    ```
 
-6. **Start the Frontend Application**:
+5. **Start the Frontend Application**:
 
 Navigate to the frontend directory and start the React application.
    ```bash
    cd frontend
    npm start
    ```
 
-## How to Start MongoDB
-
-To start MongoDB, ensure you have MongoDB installed on your machine. You can start MongoDB using the following command:
-
-```bash
-mongod --dbpath ~/mongodb/data/db
-```
-
-If you encounter any issues with the data directory, create the directory and set the appropriate permissions:
-
-```bash
-mkdir -p ~/mongodb/data/db
-sudo chown -R `id -un` ~/mongodb/data/db
-```
-
 ## API Endpoints
 The backend server provides the following API endpoints:
 
@@ -132,3 +124,72 @@ The backend server provides the following API endpoints:
 3. A list of all employees will be displayed. Verify the details of the newly added employee in the list.
 
 By following these steps, you can successfully run the Talent-Sphere application, add new employees, and verify their details.
+
+## How to Build and Run Docker Images
+
+### Prerequisites
+
+- Docker installed on your machine.
+
+### Steps to Build and Run Docker Images
+
+1. **Set Up Environment Variables**:
+
+Ensure you have the necessary environment variables set up in the `.env` files for both the frontend and backend.
+
+#### Frontend `.env` File
+
+Create a `.env` file in the frontend directory with the following content:
+
+   ```env
+   PORT=3000
+   REACT_APP_API_URL=http://localhost:5001
+   ```
+
+#### Backend `.env` File
+
+Create a `.env` file in the backend directory with the following content:
+
+   ```env
+   MONGODB_URI=mongodb://localhost:27017/talent-sphere
+   PORT=5001
+   REACT_APP_API_URL=http://localhost:5001
+   ```
+
+2. **Build and Run Backend Docker Image**:
+
+Navigate to the backend directory and build the Docker image:
+
+   ```bash
+   cd backend
+   docker build -t backend-image .
+   ```
+
+Run the Docker container:
+
+   ```bash
+   docker run -p 5001:5001 backend-image
+   ```
+
+3. **Build and Run Frontend Docker Image**:
+
+Navigate to the frontend directory and build the Docker image:
+
+   ```bash
+   cd frontend
+   docker build -t frontend-image .
+   ```
+
+Run the Docker container:
+
+   ```bash
+   docker run -p 3000:3000 frontend-image
+   ```
+
+By following these steps, you can build and run Docker images for both the frontend and backend of the Talent-Sphere application, running on ports 3000 and 5001 respectively.
+
+### Summary:
+
+- Added sections to the README to explain how to build and run Docker images for the frontend and backend.
+- Mentioned updating the `.env` files before running the images.
+- Provided detailed steps for building and running the Docker images.

backend/Dockerfile

@@ -0,0 +1,20 @@
+# Use the official Node.js image as the base image
+FROM node:20-alpine
+
+# Set the working directory
+WORKDIR /app
+
+# Copy package.json and package-lock.json
+COPY package*.json ./
+
+# Install dependencies
+RUN npm install
+
+# Copy the rest of the application code
+COPY . .
+
+# Expose the port the app runs on
+EXPOSE 5001
+
+# Start the application
+CMD ["npm", "start"]

frontend/Dockerfile

@@ -0,0 +1,32 @@
+# Stage 1: Build the React app
+FROM node:20-alpine AS build
+
+# Set the working directory
+WORKDIR /app
+
+# Copy package.json and package-lock.json
+COPY package*.json ./
+
+# Install dependencies
+RUN npm install
+
+# Copy the rest of the application code
+COPY . .
+
+# Build the React app
+RUN npm run build
+
+# Stage 2: Serve the React app using a lightweight web server
+FROM node:20-alpine
+
+# Install serve to serve the build directory
+RUN npm install -g serve
+
+# Copy the build files from the previous stage
+COPY --from=build /app/build /app/build
+
+# Expose the port the app runs on
+EXPOSE 3000
+
+# Start the application
+CMD ["serve", "-s", "/app/build"]