diff --git a/todo-frontend/Dockerfile b/todo-frontend/Dockerfile new file mode 100644 index 0000000000..b29a9614d5 --- /dev/null +++ b/todo-frontend/Dockerfile @@ -0,0 +1,31 @@ +FROM registry.access.redhat.com/ubi8/nodejs-14 AS appbuild + +LABEL version="1.0" +LABEL description="To Do List application builder" + +ENV REACT_APP_API_HOST=http://localhost:3000 + +USER 0 + +COPY . /tmp/todo-frontend + +RUN cd /tmp/todo-frontend && \ + npm install && \ + npm run build + +# https://github.com/sclorg/nginx-container +FROM registry.access.redhat.com/ubi8/nginx-118 + +LABEL version="1.0" +LABEL description="To Do List application front-end" +LABEL creationDate="2017-12-25" +LABEL updatedDate="2021-05-19" + +COPY nginx.conf /etc/nginx/ +COPY --from=appbuild /tmp/todo-frontend/build /usr/share/nginx/html + +EXPOSE 8080 + +USER nginx + +CMD nginx -g "daemon off;" diff --git a/todo-frontend/nginx.conf b/todo-frontend/nginx.conf new file mode 100644 index 0000000000..f0e4d7f9a5 --- /dev/null +++ b/todo-frontend/nginx.conf @@ -0,0 +1,65 @@ +# For more information on configuration, see: +# * Official English Documentation: http://nginx.org/en/docs/ +# * Official Russian Documentation: http://nginx.org/ru/docs/ + +env BACKEND_HOST; + +worker_processes auto; +error_log stderr; +pid /run/nginx.pid; + +# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic. +include /usr/share/nginx/modules/*.conf; + +events { + worker_connections 1024; +} + +http { + log_format main '$remote_addr - $remote_user [$time_local] "$request" ' + '$status $body_bytes_sent "$http_referer" ' + '"$http_user_agent" "$http_x_forwarded_for"'; + + sendfile on; + tcp_nopush on; + tcp_nodelay on; + keepalive_timeout 65; + types_hash_max_size 2048; + + include /etc/nginx/mime.types; + default_type application/octet-stream; + + # Load modular configuration files from the /etc/nginx/conf.d directory. + # See http://nginx.org/en/docs/ngx_core_module.html#include + # for more information. + include /etc/nginx/conf.d/*.conf; + + perl_set $backend 'sub { return $ENV{"BACKEND_HOST"}; }'; + + server { + listen 8080 default_server; + listen [::]:8080 default_server; + server_name _; + root /usr/share/nginx/html; + + # Load configuration files for the default server block. + include /etc/nginx/default.d/*.conf; + + sub_filter_types application/javascript; + sub_filter '_BACKEND_' $backend; + sub_filter_once off; + + location / { + } + +# error_page 404 /404.html; +# location = /40x.html { +# } + +# error_page 500 502 503 504 /50x.html; +# location = /50x.html { +# } + + } + +} diff --git a/todo-frontend/src/items/item-service.ts b/todo-frontend/src/items/item-service.ts index c9aac21ecc..c044411fbf 100644 --- a/todo-frontend/src/items/item-service.ts +++ b/todo-frontend/src/items/item-service.ts @@ -1,8 +1,7 @@ import wretch from 'wretch'; import { Item } from './Item'; -// TODO move to env var -const API_HOST = 'http://localhost:8080'; +const API_HOST = process.env.REACT_APP_API_HOST ?? 'http://localhost:8080'; const itemApi = wretch(`${API_HOST}/api/items`); /**