feat: use a docker container to serve the development version of the …

…frontend

Makefile

@@ -7,7 +7,7 @@
 # SPDX-License-Identifier: Apache-2.0
 
 # PHONY makes possible to call `make commands` from inside the Makefile
-.PHONY: dev-docs dev-frontend
+.PHONY: start install dev down dev-docs
 
 # Main commands
 # ----------------------------------------------------------------
@@ -29,7 +29,7 @@ install:
 
 dev:
 	docker-compose up --scale scrapers=0 -d
-	make -j 2 dev-docs dev-frontend # Run concurrently
+	make dev-docs
 
 down:
 	docker-compose down
@@ -44,6 +44,3 @@ frontend/.env.local: .env
 	cp .env frontend/.env.local
 	sed -i 's/POSTGREST_URL=http:\/\/backend:3500/POSTGREST_URL=http:\/\/localhost\/api\/v1/g' frontend/.env.local
 	sed -i 's/RSD_AUTH_URL=http:\/\/auth:7000/RSD_AUTH_URL=http:\/\/localhost\/auth/g' frontend/.env.local
-
-dev-frontend: frontend/.env.local
-	cd frontend && yarn dev

docker-compose.yml

@@ -133,6 +133,46 @@ services:
     networks:
       - net
 
+  frontend-dev:
+    build:
+      context: ./frontend
+      # dockerfile to use for build
+      dockerfile: Dockerfile.dev
+    # update version number to correspond to frontend/package.json
+    image: rsd/frontend-dev:1.3.0
+    environment:
+      # it uses values from .env file
+      - POSTGREST_URL
+      - PGRST_JWT_SECRET
+      - RSD_AUTH_URL
+      - RSD_AUTH_PROVIDERS
+      - HOTJAR_ID
+      - MATOMO_URL
+      - MATOMO_ID
+      - NEXT_PUBLIC_SURFCONEXT_CLIENT_ID
+      - NEXT_PUBLIC_SURFCONEXT_REDIRECT
+      - NEXT_PUBLIC_SURFCONEXT_WELL_KNOWN_URL
+      - NEXT_PUBLIC_SURFCONEXT_SCOPES
+      - NEXT_PUBLIC_SURFCONEXT_RESPONSE_MODE
+      - NEXT_PUBLIC_HELMHOLTZAAI_CLIENT_ID
+      - NEXT_PUBLIC_HELMHOLTZAAI_REDIRECT
+      - NEXT_PUBLIC_HELMHOLTZAAI_WELL_KNOWN_URL
+      - NEXT_PUBLIC_HELMHOLTZAAI_SCOPES
+      - NEXT_PUBLIC_HELMHOLTZAAI_RESPONSE_MODE
+    expose:
+      - 3000
+    depends_on:
+      - database
+      - backend
+      - auth
+    volumes:
+      - ./frontend:/app
+      # - ./deployment/hmz/styles:/app/public/styles
+      # - ./deployment/hmz/data:/app/public/data
+      # - ./deployment/hmz/images:/app/public/images
+    networks:
+      - net
+
   scrapers:
     build: ./scrapers
     image: rsd/scrapers:1.1.0
@@ -160,6 +200,7 @@ services:
     ports:
       - "80:80"
       - "443:443"
+      - "3000:3000"
     depends_on:
       - database
       - backend

documentation/README.md

@@ -2,7 +2,7 @@
 
 [Visit the documentation here.](https://research-software-directory.github.io/RSD-as-a-service/)
 
-Any changes merge to the main branch will trigger automatically a build deploy to githuv pages.
+Any changes merge to the main branch will trigger automatically a build deploy to github pages.
 
 ## Running locally: 
 ```bash

frontend/Dockerfile.dev

@@ -0,0 +1,14 @@
+# SPDX-FileCopyrightText: 2022 Helmholtz Centre Potsdam - GFZ German Research Centre for Geosciences
+# SPDX-FileCopyrightText: 2022 Matthias Rüster (GFZ) <matthias.ruester@gfz-potsdam.de>
+#
+# SPDX-License-Identifier: Apache-2.0
+
+FROM node:18.5-buster-slim
+
+WORKDIR /app
+
+VOLUME [ "/app" ]
+
+EXPOSE 3000
+
+CMD [ "sh", "-c", "yarn install ; yarn dev" ]

nginx/nginx.conf

@@ -80,3 +80,60 @@ server {
 		proxy_pass http://backend/oaipmh?select=data;
 	}
 }
+
+server {
+	listen       3000;
+	server_name  localhost;
+
+	charset utf-8;
+
+	# enable gzip file compression
+	gzip on;
+	gzip_proxied any;
+	gzip_comp_level 4;
+	gzip_types text/css application/javascript image/svg+xml;
+
+
+	# auth
+	location /auth/ {
+		proxy_set_header Host $host;
+		proxy_set_header X-Real-IP $remote_addr;
+		proxy_pass http://authentication/;
+	}
+
+	# PostgREST backend API
+	# Note! NextJS has api/fe for citation files and images
+	location /api/v1/ {
+		# needed to increase size for the migration script
+		client_max_body_size 40M;
+		proxy_set_header Host $host;
+		proxy_set_header X-Real-IP $remote_addr;
+		default_type  application/json;
+		proxy_hide_header Content-Location;
+		add_header Content-Location  /api/$upstream_http_content_location;
+		proxy_set_header  Connection "";
+		proxy_http_version 1.1;
+		proxy_pass http://backend/;
+	}
+
+	# reverse proxy for next fontend server
+	location / {
+		proxy_pass http://frontend-dev:3000;
+		proxy_http_version 1.1;
+		proxy_set_header Upgrade $http_upgrade;
+		proxy_set_header Connection 'upgrade';
+		proxy_set_header Host $host;
+		proxy_cache_bypass $http_upgrade;
+		# we need to remove this 404 handling
+		# because next's _next folder has own 404 handling
+		# try_files $uri $uri/ =404;
+	}
+
+	# serve postgrest images with binary header
+	location /image/ {
+		proxy_set_header "Authorization" "Bearer $cookie_rsd_token";
+		rewrite /image/(.+) /$1 break;
+		proxy_set_header Accept application/octet-stream;
+		proxy_pass http://backend/;
+	}
+}