Fe linting

.github/workflows/frontend-component-tests.yml

@@ -21,17 +21,17 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
 
-    - name: Use Node.js 18.x
-      uses: actions/setup-node@v3
+    - name: Use Node.js 20.x
+      uses: actions/setup-node@v4
       with:
-        node-version: 18.x
+        node-version: 20.x
 
     - name: Install and Execute Component Tests
       run: |
-        npm ci
-        npm run test:coverage
+        yarn
+        yarn test:coverage
 
     - name: Coverage Report
       uses: romeovs/[email protected]

.github/workflows/frontend-docker-push.yml

@@ -34,6 +34,6 @@ jobs:
         env:
             IMAGE_TAG: ${{ steps.extract_version.outputs.VERSION }}
         run: |
-          npm run docker:build
+          yarn docker:build
           docker tag notes-app-fe:latest ${{ secrets.DOCKERHUB_USERNAME }}/notes-app-fe:$IMAGE_TAG
           docker push ${{ secrets.DOCKERHUB_USERNAME }}/notes-app-fe:$IMAGE_TAG

.github/workflows/frontend-lint.yml

@@ -0,0 +1,29 @@
+name: Frontend Linting
+
+on:
+  pull_request:
+    branches: ["main"]
+    paths:
+      - "frontend/src/**"
+
+defaults:
+  run:
+    working-directory: ./backend
+
+jobs:
+    eslint:
+        name: Run eslint scanning
+        runs-on: ubuntu-latest
+        permissions:
+            contents: read
+            security-events: write
+            actions: read # only required for a private repository by github/codeql-action/upload-sarif to get the Action run status
+        steps:
+            - name: Checkout code
+              uses: actions/checkout@v4
+
+            - name: Install packages
+              run: yarn
+
+            - name: Run ESLint
+              run: yarn lint

.github/workflows/frontend-service-tests-deploy.yml

@@ -42,9 +42,9 @@ jobs:
     - name: Install and start frontend
       run: |
         cd ./frontend
-        npm ci
-        npm run build
-        npm run start &
+        yarn
+        yarn build
+        yarn start &
 
     - name: Install Playwright
       run: |

.github/workflows/frontend-service-tests.yml

@@ -13,15 +13,15 @@ jobs:
     env:
       API_URL: http://localhost:5000
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
 
     - name: Set up Docker Buildx
       uses: docker/setup-buildx-action@v1
 
-    - name: Use Node.js 18.x
-      uses: actions/setup-node@v3
+    - name: Use Node.js 20.x
+      uses: actions/setup-node@v4
       with:
-        node-version: 18.x
+        node-version: 20.x
 
     - name: Create .env file
       run: | 
@@ -43,9 +43,9 @@ jobs:
     - name: Install and start frontend
       run: |
         cd ./frontend
-        npm ci
-        npm run build
-        npm run start &
+        yarn
+        yarn build
+        yarn start &
 
     - name: Install Playwright
       run: |

frontend/.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+build

frontend/.prettierignore

@@ -0,0 +1,2 @@
+node_modules
+build

frontend/.prettierrc

@@ -0,0 +1,6 @@
+{
+    "singleQuote": true,
+    "trailingComma": "all",
+    "tabWidth": 2,
+    "semi": true
+  }

frontend/Dockerfile

@@ -18,7 +18,7 @@ ARG REACT_APP_API_BASE_URL
 ENV REACT_APP_API_BASE_URL=$REACT_APP_API_BASE_URL
 
 # Build the app
-RUN npm run build
+RUN yarn build
 
 # Use an official lightweight Node.js runtime as the final base image
 FROM node:14-alpine
@@ -27,7 +27,7 @@ FROM node:14-alpine
 WORKDIR /usr/src/app
 
 # Install serve to serve the app
-RUN npm install -g serve
+RUN yarn global add serve
 
 # Copy the build output from the previous stage
 COPY --from=0 /usr/src/app/build .