Skip to content

Commit d92da70

Browse files
authored
Merge pull request #17 from SamWanekeya/feature-deployment-nginx-adjustments
Feature deployment nginx adjustments
2 parents ffef709 + b559299 commit d92da70

10 files changed

+3356
-3121
lines changed

README.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@
1111
### Contributing
1212

1313
1. Fork this repo and make changes in your own fork.
14-
2. Commit your changes and push to your fork `git push origin master`
14+
2. Commit your changes and push to your fork `git push origin main`
1515
3. Create a new pull request and submit it back to the project.
1616

1717

1818
### Bugs & Issues
1919

20-
To report bugs (or any other issues), use the [issues page](https://github.com/Wanekeya/safe-secure-password-generator/issues).
20+
To report bugs (or any other issues), use the [issues page](https://github.com/SamWanekeya/dockerizing-react-js-with-nginx-and-self-signed-ssl-certificate/issues).

docker-compose.yml

+11-5
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,19 @@
1-
version: "3.7"
1+
version: "3.9"
22

33
services:
4-
dkrz_frt:
5-
container_name: dockerized_frontend
6-
image: dockerized_frontend_web
4+
reactapp_svc:
5+
container_name: reactapp_svc
6+
image: reactapp_svc_img
7+
hostname: reactapp_svc
78
build:
89
context: .
910
dockerfile: docker/Dockerfile
1011
ports:
1112
- "80:80"
1213
- "443:443"
13-
restart: "always"
14+
restart: "always"
15+
volumes:
16+
- reactapp_volume:/reactapp
17+
18+
volumes:
19+
reactapp_volume:

docker/Dockerfile

+11-11
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
# base image
2-
FROM node:13.10.1-alpine as builder
2+
FROM node:16.2.0-alpine as builder
33

44
# send signal to containers to stop them
55
STOPSIGNAL SIGTERM
66
# create working directory
7-
RUN mkdir -p /usr/src/app
7+
RUN mkdir -p /usr/src/reactapp
88
# set working directory
9-
WORKDIR /usr/src/app
9+
WORKDIR /usr/src/reactapp
1010
# copy package.json file to working directory
1111
COPY package*.json ./
1212
# install dependencies with precise, for more stories visit - https://yarnpkg.com/lang/en/docs/cli/install/
1313
RUN yarn install --silent --non-interactive --frozen-lockfile --ignore-optional
1414
COPY . .
1515
RUN PUBLIC_URL=/ yarn run build
1616

17-
FROM nginx:1.18.0-alpine as app
17+
FROM nginx:1.21.0-alpine as reactapp
1818

1919
# Add bash
2020
RUN apk add --no-cache bash
2121

22-
FROM debian:10.4-slim
22+
FROM debian:10.10-slim
2323

2424
RUN apt-get update \
2525
&& apt-get install -y nginx openssl \
@@ -33,11 +33,11 @@ RUN apt-get update \
3333
-out /etc/ssl/certs/nginx-selfsigned.crt
3434

3535
RUN rm -rf /usr/share/nginx/html/*
36-
COPY --from=builder /usr/src/app/docker/nginx.conf /etc/nginx/nginx.conf
37-
COPY --from=builder /usr/src/app/docker/nginxconfig/general.conf /etc/nginx/general.conf
38-
COPY --from=builder /usr/src/app/docker/nginxconfig/security.conf /etc/nginx/security.conf
39-
COPY --from=builder /usr/src/app/build /usr/share/nginx/html
40-
COPY --from=builder /usr/src/app/.env /usr/share/nginx/html/.env
36+
COPY --from=builder /usr/src/reactapp/docker/nginx.conf /etc/nginx/nginx.conf
37+
COPY --from=builder /usr/src/reactapp/docker/nginxconfig/general.conf /etc/nginx/general.conf
38+
COPY --from=builder /usr/src/reactapp/docker/nginxconfig/security.conf /etc/nginx/security.conf
39+
COPY --from=builder /usr/src/reactapp/build /usr/share/nginx/html
40+
COPY --from=builder /usr/src/reactapp/.env /usr/share/nginx/html/.env
4141

4242
EXPOSE 80 443
43-
CMD ["/bin/bash", "-c", "nginx -g \"daemon off;\""]
43+
CMD ["/bin/bash", "-c", "nginx -g \"daemon off;\""]

docker/nginx.conf

+75-18
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,20 @@
11
#https://wiki.owasp.org/index.php/SCG_WS_nginx#SSL_Module
2-
3-
# This value auto allows binding worker processes automatically to available CPU
2+
# This value auto allows binding worker processes automatically to available CPUs
43
worker_processes auto;
54
# Allows binding worker processes automatically to available CPUs
65
worker_cpu_affinity auto;
7-
# The number of simultaneous connections is limited by the number of file descriptors available on the system as each socket will open a file descriptor. If NGINX tries to open more sockets than the available file descriptors, it will lead to the Too many opened files message in the error.log.
6+
# The number of simultaneous connections is limited by the number of file descriptors available on the system as each socket will open a file descriptor. If NGINX tries to open more sockets than the available file descriptors, it will lead to the too many opened files message in the error.log.
87
worker_rlimit_nofile 65535;
9-
10-
# logging
8+
# error logging
119
error_log /var/log/nginx/error.log;
10+
# log warning errors
1211
error_log /var/log/nginx/error.log warn;
13-
error_log /var/log/nginx/error.log notice;
14-
error_log /var/log/nginx/error.log info;
12+
# log notice errors
13+
error_log /var/log/nginx/error.log notice;
14+
# log info errors
15+
error_log /var/log/nginx/error.log info;
16+
# log critical errors
17+
error_log /var/log/nginx/error.log crit;
1518

1619
pid /var/run/nginx.pid;
1720

@@ -32,15 +35,37 @@ events {
3235
}
3336

3437
http {
38+
# cache informations about FDs, frequently accessed files
39+
# can boost performance, but you need to test those values
40+
# This directive is disabled by default. Enable it if you want implement caching in Nginx. This directive stores metadata of files and directories commonly requested by users.
41+
open_file_cache max=200000 inactive=20s;
42+
# This directive contains backup information inside the open_file_cache directive. You can use this directive to set a valid period usually in seconds after which the information related to files and directories is re-validated again.
43+
open_file_cache_valid 30s;
44+
# Nginx usually clear information inside the open_file_cache directive after a period of inactivity based on the open_file_cache_min_uses. You can use this directive to set a minimum number of access to identify which files and directories are actively accessed.
45+
open_file_cache_min_uses 4;
46+
# You can make use of this directive to allow Nginx to cache errors such as “permission denied” or “can’t access this file” when files are accessed. So anytime a resource is accessed by a user who does not have the right to do so, Nginx displays the same error report “permission denied”.
47+
open_file_cache_errors on;
3548
# To support larger number of server names that are defined
3649
server_names_hash_bucket_size 64;
3750
# Sets the bucket size for the server names hash tables. The default value depends on the size of the processor’s cache line.
3851
server_names_hash_max_size 512;
52+
log_format upstreamlog '$server_name to: $upstream_addr [$request] '
53+
'upstream_response_time $upstream_response_time '
54+
'msec $msec response_time $request_time ';
55+
56+
upstream reactapp_service {
57+
# Load balancing method
58+
least_conn;
59+
# Defines a shared memory zone with the zone directive
60+
zone reactapp_service 64k;
61+
server reactapp_svc weight=10 max_fails=10 fail_timeout=60;
62+
}
63+
3964
# redirect all http traffic to https
4065
server {
4166
listen 80 default_server;
4267
listen [::]:80 default_server ipv6only=on;
43-
server_name samwanekeya.com;
68+
server_name *.samwanekeya.com *.samwanekeya.co.ke;
4469
root /usr/share/nginx/html;
4570
index index.html index.htm index.nginx-debian.html;
4671
return 301 https://$host$request_uri;
@@ -49,13 +74,13 @@ http {
4974
server {
5075
listen 443 ssl;
5176
listen [::]:443 ssl ipv6only=on;
52-
server_name samwanekeya.com;
77+
server_name *.samwanekeya.com *.samwanekeya.co.ke;
5378
# MIME
5479
include /etc/nginx/mime.types;
5580
default_type application/octet-stream;
5681
# Display nginx Version number in error or http header may result in hacker to search for known vulnerability. Therefore, the version number should be removed for every http response.
57-
server_tokens "off";
58-
#charset utf-8;
82+
server_tokens off;
83+
charset utf-8;
5984
# This directive, by default, is disabled to allow small packets to wait for a specified period before they are sent at once. To allow all data to be sent at once, this directive is enabled.
6085
tcp_nodelay on;
6186
# Because we have enabled tcp_nodelay directive, small packets are sent at once. However, if you still want to make use of John Nagle’s buffering algorithm, we can also enable the tcp_nopush to add packets to each other and send them all at once.
@@ -82,17 +107,18 @@ http {
82107
#keepalive_disable;
83108
#Sets a timeout for transmitting a response to the client. The timeout is set only between two successive write operations, not for the transmission of the whole response. If the client does not receive anything within this time, the connection is closed.
84109
send_timeout 75s;
85-
# TLS certificate and key
86110
ssl_certificate /etc/ssl/certs/nginx-selfsigned.crt;
87111
ssl_certificate_key /etc/ssl/private/nginx-selfsigned.key;
88112
# enable session resumption to improve https performance
89113
# http://vincent.bernat.im/en/blog/2011-ssl-session-reuse-rfc5077.html
90114
ssl_session_cache shared:SSL:10m;
115+
# Specifies a time during which a client may reuse the session parameters.
91116
ssl_session_timeout 10m;
92117
ssl_buffer_size 1400;
93118
# generated using:# openssl dhparam -dsaparam -out /etc/ssl/dh4096.pem 4096
94-
ssl_ecdh_curve secp384r1;
95-
ssl_session_tickets off;
119+
ssl_ecdh_curve prime256v1:secp384r1;
120+
# Enables or disables session resumption through TLS session tickets.
121+
ssl_session_tickets on;
96122
# enables server-side protection from BEAST attacks
97123
# http://blog.ivanristic.com/2013/09/is-beast-still-a-threat.html
98124
ssl_prefer_server_ciphers on;
@@ -113,14 +139,45 @@ http {
113139
# enable ocsp stapling (mechanism by which a site can convey certificate revocation information to visitors in a privacy-preserving, scalable manner)
114140
# http://blog.mozilla.org/security/2013/07/29/ocsp-stapling-in-firefox/
115141
#Cloudflare resolver 1dot1dot1dot1.cloudflare-dns.com
116-
resolver 1.1.1.1 1.0.0.1 [2606:4700:4700::1111] [2606:4700:4700::1001];
117-
resolver_timeout 5s;
142+
# Enables or disables stapling of OCSP responses by the server.
118143
ssl_stapling off;
119144
ssl_stapling_verify on;
145+
resolver 1.1.1.1 1.0.0.1 [2606:4700:4700::1111] [2606:4700:4700::1001] 8.8.8.8 8.8.4.4 [2001:4860:4860::8888] [2001:4860:4860::8844] 208.67.222.222 208.67.220.220 [2620:119:35::35] [2620:119:53::53] 9.9.9.9 149.112.112.112 [2620:fe::fe] [2620:fe::9] 64.6.64.6 64.6.65.6 [2620:74:1b::1:1] [2620:74:1c::2:2] valid=60s;
146+
resolver_timeout 5s;
147+
148+
access_log /var/log/nginx/access.log upstreamlog;
149+
150+
location / {
151+
proxy_set_header Host $host;
152+
proxy_set_header X-Real-IP $remote_addr;
153+
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
154+
proxy_set_header X-Forwarded-Proto $scheme;
155+
# Allows passing requests to another server
156+
proxy_pass http://reactapp_service;
157+
# Sets the size of the buffer used for reading the first part of the response received from the proxied server.
158+
proxy_buffer_size 2k;
159+
# Enables or disables buffering of responses from the proxied server.
160+
proxy_buffering on;
161+
# Sets the number and size of the buffers used for reading a response from the proxied server, for a single connection.
162+
proxy_buffers 4 2k;
163+
# Limits the total size of buffers that can be busy sending a response to the client while the response is not yet fully read.
164+
proxy_busy_buffers_size 4k;
165+
# Defines a shared memory zone used for caching.
166+
proxy_cache off;
167+
# Allows starting a background subrequest to update an expired cache item, while a stale cached response is returned to the client.
168+
proxy_cache_background_update off;
169+
# Can be used along with the proxy_no_cache directive.
170+
proxy_cache_bypass $cookie_nocache $arg_nocache $arg_comment;
171+
proxy_cache_bypass $http_pragma $http_authorization;
172+
proxy_no_cache $cookie_nocache $arg_nocache $arg_comment;
173+
proxy_no_cache $http_pragma $http_authorization;
174+
# Disable directory listing
175+
autoindex off;
176+
autoindex_exact_size off;
177+
}
120178

121179
# additional config
122180
include /etc/nginx/general.conf;
123181
include /etc/nginx/security.conf;
124-
}
125-
182+
}
126183
}

docker/nginxconfig/general.conf

-29
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,6 @@ location = /public/favicon.ico {
55
error_log off;
66
}
77

8-
# Disable directory listing
9-
location / {
10-
autoindex off;
11-
}
12-
138
# assets, media, and Static File Caching while allowing safe files
149
location ~* \.(?:css(\.map)?|js(\.map)?|ttf|ttc|otf|eot|woff2?|svgz?|jpe?g|png|gif|ico|cur|heic|webp|tiff?|mp3|m4a|aac|ogg|midi?|wav|mp4|mov|webm|mpe?g|avi|ogv|flv|wmv|pdf|docx?|dotx?|docm|dotm|xlsx?|xltx?|xlsm|xltm|pptx?|potx?|pptm|potm|ppsx?)$ {
1510
add_header Access-Control-Allow-Origin "*";
@@ -19,21 +14,6 @@ location ~* \.(?:css(\.map)?|js(\.map)?|ttf|ttc|otf|eot|woff2?|svgz?|jpe?g|png|g
1914
access_log on;
2015
}
2116

22-
# deny access to .htaccess files
23-
location ~ /\.ht {
24-
deny all;
25-
error_log off;
26-
log_not_found off;
27-
}
28-
29-
# Deny access to hidden files (beginning with a period)
30-
location ~ /\. {
31-
deny all;
32-
error_log off;
33-
log_not_found off;
34-
}
35-
36-
3717
location /video/ {
3818
# To utilize operating system resources, set the value of this directive to on. sendfile transfers data between file descriptors within the OS kernel space without sending it to the application buffers. This directive will be used to serve small files.
3919
sendfile on;
@@ -88,12 +68,3 @@ if ($host !~ ^(samwanekeya.com|localhost)$ ) {
8868
#gzip_vary on;
8969
# Some browsers such as Internet Explorer 6 do not have support for gzip compression. This directive make use of User-Agent request header field to disable compression for certain browsers.
9070
#gzip_disable "MSIE [4-6] \.";
91-
92-
# This directive is disabled by default. Enable it if you want implement caching in Nginx. This directive stores metadata of files and directories commonly requested by users.
93-
open_file_cache max=1000 inactive=30s;
94-
# This directive contains backup information inside the open_file_cache directive. You can use this directive to set a valid period usually in seconds after which the information related to files and directories is re-validated again.
95-
open_file_cache_valid 30s;
96-
# Nginx usually clear information inside the open_file_cache directive after a period of inactivity based on the open_file_cache_min_uses. You can use this directive to set a minimum number of access to identify which files and directories are actively accessed.
97-
open_file_cache_min_uses 4;
98-
# You can make use of this directive to allow Nginx to cache errors such as “permission denied” or “can’t access this file” when files are accessed. So anytime a resource is accessed by a user who does not have the right to do so, Nginx displays the same error report “permission denied”.
99-
open_file_cache_errors on;

docker/nginxconfig/security.conf

+30-6
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,33 @@
1+
# deny access to .htaccess files
2+
location ~ /\.ht {
3+
deny all;
4+
error_log off;
5+
log_not_found off;
6+
}
7+
8+
# Deny access to hidden files (beginning with a period)
9+
location ~ /\. {
10+
deny all;
11+
error_log off;
12+
log_not_found off;
13+
}
14+
15+
# Deny access to hidden files (beginning with a period)
16+
location ~ /\. {
17+
deny all;
18+
error_log off;
19+
log_not_found off;
20+
}
21+
22+
# Deny access to . files
23+
location ~ /\.(?!well-known) {
24+
deny all;
25+
}
126
# config to don't allow the browser to render the page inside an frame or iframe
227
# and avoid clickjacking http://en.wikipedia.org/wiki/Clickjacking
328
# if you need to allow [i]frames, you can use SAMEORIGIN or even set an uri with ALLOW-FROM uri
429
# https://developer.mozilla.org/en-US/docs/HTTP/X-Frame-Options
5-
add_header X-Frame-Options "SAMEORIGIN";
30+
add_header X-Frame-Options "SAMEORIGIN" always;
631
add_header X-XSS-Protection "1; mode=block";
732
#Handled by CDN admin
833
# when serving user-supplied content, include a X-Content-Type-Options: nosniff header along with the Content-Type: header,
@@ -11,13 +36,12 @@ add_header X-XSS-Protection "1; mode=block";
1136
# currently suppoorted in IE > 8 http://blogs.msdn.com/b/ie/archive/2008/09/02/ie8-security-part-vi-beta-2-update.aspx
1237
# http://msdn.microsoft.com/en-us/library/ie/gg622941(v=vs.85).aspx
1338
# 'soon' on Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=471020
14-
add_header X-Content-Type-Options "nosniff";
39+
add_header X-Content-Type-Options "nosniff" always;
1540
# This header enables the Cross-site scripting (XSS) filter built into most recent web browsers.
1641
# It's usually enabled by default anyway, so the role of this header is to re-enable the filter for
1742
# this particular website if it was disabled by the user.
1843
# https://www.owasp.org/index.php/List_of_useful_HTTP_headers
19-
add_header X-XSS-Protection "1; mode=block";
20-
44+
add_header X-XSS-Protection "1; mode=block" always;
2145
add_header Referrer-Policy "no-referrer-when-downgrade";
2246
# with Content Security Policy (CSP) enabled(and a browser that supports it(http://caniuse.com/#feat=contentsecuritypolicy),
2347
# you can tell the browser that it can only download content from the domains you explicitly allow
@@ -27,7 +51,7 @@ add_header Referrer-Policy "no-referrer-when-downgrade";
2751
# directives for css and js(if you have inline css or js, you will need to keep it too).
2852
# more: http://www.html5rocks.com/en/tutorials/security/content-security-policy/#inline-code-considered-harmful
2953
# add_header Content-Security-Policy "default-src 'self' http: https: data: blob: 'unsafe-inline'";
30-
#For Clouflare users comment this out as it's handle from the admin UI
54+
#Disable this when using Cloudflare CDN as it is already taken care of
3155
add_header Strict-Transport-Security "max-age=31536000; includeSubDomains; preload";
3256
# Prevent search engine indexing
33-
#add_header X-Robots-Tag "noindex, nofollow, nosnippet, noarchive";
57+
#add_header X-Robots-Tag "noindex, nofollow, nosnippet, noarchive";

frontend_deploy.sh

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
11
#!/usr/bin/env bash
2+
# safety switch, exit script if there's error.
23
set -e
3-
docker-compose -f docker-compose.yml up -d --build --remove-orphans
4+
# safety switch, uninitialized variables will stop script.
5+
set -u
6+
docker-compose -f docker-compose.yml build
7+
docker-compose -f docker-compose.yml down
8+
docker-compose -f docker-compose.yml up -d

frontend_destroy.sh

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
11
#!/usr/bin/env bash
2+
# safety switch, exit script if there's error.
23
set -e
3-
docker-compose -f docker-compose.yml down -v --rmi local
4+
# safety switch, uninitialized variables will stop script.
5+
set -u
6+
docker-compose -f docker-compose.yml down --rmi=all --volumes --remove-orphans

package.json

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,16 @@
11
{
2-
"name": "my-app",
3-
"version": "0.1.0",
4-
"private": true,
2+
"name": "react-js-hello-world",
3+
"description": "A simple example of a dockerized default create React app with Nginx and self signed SSL certificate",
4+
"version": "0.0.4",
5+
"private": false,
6+
"license": "MIT",
57
"dependencies": {
6-
"@testing-library/jest-dom": "^4.2.4",
7-
"@testing-library/react": "^9.3.2",
8-
"@testing-library/user-event": "^7.1.2",
9-
"react": "^16.13.1",
10-
"react-dom": "^16.13.1",
11-
"react-scripts": "3.4.1"
8+
"@testing-library/jest-dom": "^5.14.1",
9+
"@testing-library/react": "^12.0.0",
10+
"@testing-library/user-event": "^13.1.9",
11+
"react": "^17.0.2",
12+
"react-dom": "^17.0.2",
13+
"react-scripts": "4.0.3"
1214
},
1315
"scripts": {
1416
"start": "react-scripts start",

0 commit comments

Comments
 (0)