Skip to content
This repository was archived by the owner on Aug 8, 2022. It is now read-only.

Commit ac7123e

Browse files
erikh3erikh3
committed
Initial commit
0 parents  commit ac7123e

19 files changed

+370
-0
lines changed

Diff for: ‎.dockerignore

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.git/
2+
.gitignore
3+
LICENSE
4+
README.md

Diff for: ‎.gitignore

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Logs
2+
logs
3+
*.log
4+
5+
# Runtime data
6+
pids
7+
*.pid
8+
*.seed
9+
10+
# Dependency directory
11+
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
12+
app/node_modules
13+
14+
# Webpack autogenerate files
15+
app/dist
16+
17+
.idea

Diff for: ‎Dockerfile

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
FROM node:7.4.0
2+
3+
# download and configure nginx for production use
4+
RUN apt-get update && apt-get install -y nginx
5+
RUN mkdir -p /app/dist && chown www-data:www-data /app/dist
6+
COPY nginx.conf /etc/nginx/nginx.conf
7+
8+
# download dependancies to /tmp
9+
WORKDIR /tmp
10+
COPY app/package.json /tmp/
11+
RUN npm config set registry http://registry.npmjs.org/ &&\
12+
npm install
13+
14+
# copy node_modules from /tmp and copy ./app from host to image
15+
WORKDIR /app
16+
COPY ./app/ /app/
17+
RUN cp -a /tmp/node_modules /app/
18+
19+
# set mode to production by default
20+
ENV NODE_ENV=production
21+
22+
# run webpack in production
23+
CMD ["npm", "run", "production"]
24+
25+
EXPOSE 80

Diff for: ‎app/.babelrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
'presets': ['react', 'es2015']
3+
}

Diff for: ‎app/package.json

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "generic-react-docker",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"webpack-development": "./node_modules/.bin/webpack-dev-server --config webpack.config.dev.js",
8+
"dev": "echo Open at http://localhost:8080 && npm run webpack-development",
9+
"webpack-production": "NODE_ENV='production' ./node_modules/.bin/webpack --config webpack.config.prod.js",
10+
"production": "npm run webpack-production && echo Open at http://localhost:80 && service nginx start"
11+
},
12+
"repository": {
13+
"type": "git",
14+
"url": "git+https://github.com/Driftersk/generic-react-docker"
15+
},
16+
"author": "df",
17+
"license": "MIT",
18+
"bugs": {
19+
"url": "https://github.com/Driftersk/generic-react-docker/issues"
20+
},
21+
"homepage": "https://github.com/Driftersk/generic-react-docker",
22+
"devDependencies": {
23+
"babel-core": "^6.3.26",
24+
"babel-loader": "^6.2.0",
25+
"babel-preset-es2015": "^6.3.13",
26+
"babel-preset-react": "^6.3.13",
27+
"css-loader": "^0.26.1",
28+
"file-loader": "^0.10.0",
29+
"style-loader": "^0.13.1",
30+
"stylus": "^0.54.5",
31+
"stylus-loader": "^2.4.0",
32+
"react-hot-loader": "^1.3.1",
33+
"webpack-dev-server": "^2.3.0"
34+
},
35+
"dependencies": {
36+
"babel-preset-es2015": "^6.3.13",
37+
"react": "^15.4.2",
38+
"react-dom": "^15.4.2",
39+
"webpack": "^2.2.1"
40+
}
41+
}

Diff for: ‎app/src/css/style.styl

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
body
2+
background: embedurl('../images/electronics/image.jpg')
3+
color: red

Diff for: ‎app/src/images/abstract.jpg

55.6 KB
Loading

Diff for: ‎app/src/images/electronics/image.jpg

28.8 KB
Loading

Diff for: ‎app/src/index.html

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="x-ua-compatible" content="ie=edge">
6+
<title>Webpack + React</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<meta name="description" content="Generic Webpack + React">
9+
<meta name="author" content="">
10+
11+
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
12+
<!--[if lt IE 9]>
13+
<script src="https://raw.githubusercontent.com/aFarkas/html5shiv/master/dist/html5shiv.min.js"></script>
14+
<![endif]-->
15+
16+
</head>
17+
<body>
18+
<div id="app"></div>
19+
</body>
20+
<script src="bundle.js"></script>
21+
</html>

Diff for: ‎app/src/index.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom';
3+
4+
import styles from './css/style.styl';
5+
import image from './images/abstract.jpg'
6+
7+
ReactDOM.render(<div>
8+
<pre>yay helpp</pre>
9+
<img src={image} />
10+
</div>, document.getElementById('app'));

Diff for: ‎app/webpack.config.dev.js

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
const webpack = require('webpack');
2+
3+
const paths = require('./webpack.paths');
4+
5+
module.exports = {
6+
devServer: {
7+
hot: true,
8+
contentBase: './src/',
9+
host: '0.0.0.0',
10+
stats: 'minimal'
11+
},
12+
devtool: 'cheap-module-eval-source-map',
13+
entry: [
14+
paths.javascriptEntryPath,
15+
paths.htmlEntryPath
16+
],
17+
output: {
18+
path: paths.buildPath,
19+
filename: 'bundle.js'
20+
},
21+
module: {
22+
loaders: [{
23+
test: /\.jsx?$/,
24+
exclude: /node_modules/,
25+
loaders: ['react-hot-loader', 'babel-loader']
26+
}, {
27+
test: /\.html$/,
28+
loader: 'file-loader?name=[name].[ext]'
29+
}, {
30+
test: /\.styl$/,
31+
loader: 'style-loader!css-loader!stylus-loader'
32+
}, {
33+
test: /\.(jpg|png|svg|bmp|gif)$/,
34+
loader: 'file-loader?name=[path][name].[ext]'
35+
}]
36+
},
37+
plugins: [
38+
new webpack.optimize.OccurrenceOrderPlugin(),
39+
new webpack.HotModuleReplacementPlugin(),
40+
new webpack.NoEmitOnErrorsPlugin()
41+
]
42+
};

Diff for: ‎app/webpack.config.prod.js

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
const webpack = require('webpack');
2+
3+
const paths = require('./webpack.paths');
4+
5+
module.exports = {
6+
devtool: 'cheap-module-source-map',
7+
entry: [
8+
paths.javascriptEntryPath,
9+
paths.htmlEntryPath
10+
],
11+
output: {
12+
path: paths.buildPath,
13+
filename: 'bundle.js',
14+
},
15+
module: {
16+
loaders: [{
17+
test: /\.jsx?$/,
18+
exclude: /node_modules/,
19+
loader: 'babel-loader',
20+
}, {
21+
test: /.html$/,
22+
loader: 'file-loader?name=[name].[ext]',
23+
}, {
24+
test: /\.styl$/,
25+
loader: 'style-loader!css-loader!stylus-loader'
26+
}, {
27+
test: /\.(jpg|png|svg|bmp|gif)$/,
28+
loader: 'file-loader?name=[path][name].[ext]'
29+
}],
30+
},
31+
plugins: [
32+
new webpack.optimize.OccurrenceOrderPlugin(),
33+
new webpack.DefinePlugin({
34+
'process.env': {
35+
'NODE_ENV': JSON.stringify(process.env.NODE_ENV)
36+
}
37+
}),
38+
new webpack.optimize.UglifyJsPlugin({
39+
compress: {
40+
screw_ie8: true
41+
}
42+
})
43+
]
44+
};

Diff for: ‎app/webpack.paths.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
const path = require('path');
2+
3+
4+
module.exports = {
5+
javascriptEntryPath: path.resolve(__dirname, 'src', 'index.js'),
6+
htmlEntryPath: path.resolve(__dirname, 'src', 'index.html'),
7+
buildPath: path.resolve(__dirname, 'dist')
8+
};

Diff for: ‎docker-compose.yml

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
version: "2"
2+
3+
services:
4+
web:
5+
build: .
6+
image: generic-react
7+
container_name: generic-react
8+
env_file:
9+
- ./mode.env
10+
ports:
11+
# for production
12+
- "80:80"
13+
# for development
14+
- "8080:8080"
15+
volumes:
16+
- ./app/:/app/:rw
17+
command: >
18+
sh -c '
19+
if test -d node_modules;
20+
then
21+
echo node_modules already exist in `pwd`;
22+
else
23+
cp -a /tmp/node_modules /app/;
24+
fi &&
25+
if test -d dist;
26+
then
27+
echo dist already exist in `pwd`;
28+
else
29+
mkdir dist;
30+
fi &&
31+
chown www-data:www-data dist &&
32+
if [ $${NODE_ENV} = "production" ] || [ $${NODE_ENV} = "PRODUCTION" ];
33+
then
34+
echo Running in PRODUCTION mode.
35+
npm run production
36+
else
37+
echo Running in DEVELOPMENT mode.
38+
npm run dev
39+
fi
40+
'

Diff for: ‎mode.env

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
NODE_ENV=production

Diff for: ‎nginx.conf

+77
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
user www-data;
2+
worker_processes 4;
3+
pid /var/run/nginx.pid;
4+
5+
# keep nginx running in foreground
6+
daemon off;
7+
8+
events {
9+
worker_connections 1024;
10+
# multi_accept on;
11+
}
12+
13+
http {
14+
##
15+
# Basic Settings
16+
##
17+
18+
sendfile on;
19+
tcp_nopush on;
20+
tcp_nodelay on;
21+
keepalive_timeout 65;
22+
types_hash_max_size 2048;
23+
# server_tokens off;
24+
25+
# server_names_hash_bucket_size 64;
26+
# server_name_in_redirect off;
27+
28+
include /etc/nginx/mime.types;
29+
default_type application/octet-stream;
30+
31+
##
32+
# Logging Settings
33+
##
34+
35+
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
36+
'$status $body_bytes_sent "$http_referer" '
37+
'"$http_user_agent" "$http_x_forwarded_for"';
38+
access_log /var/log/nginx/access.log main;
39+
error_log /var/log/nginx/error.log warn;
40+
41+
##
42+
# Gzip Settings
43+
##
44+
45+
gzip on;
46+
gzip_disable "msie6";
47+
48+
# gzip_vary on;
49+
# gzip_proxied any;
50+
# gzip_comp_level 6;
51+
# gzip_buffers 16 8k;
52+
# gzip_http_version 1.1;
53+
# gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
54+
55+
##
56+
# Virtual Host Configs
57+
##
58+
59+
include /etc/nginx/conf.d/*.conf;
60+
61+
server {
62+
listen 80 default_server;
63+
listen [::]:80 default_server;
64+
65+
root /app/dist;
66+
67+
index index.html;
68+
69+
server_name _;
70+
71+
location / {
72+
# First attempt to serve request as file, then
73+
# as directory, then fall back to displaying a 404.
74+
try_files $uri $uri/ =404;
75+
}
76+
}
77+
}

Diff for: ‎start-development.sh

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#!/bin/bash
2+
echo "NODE_ENV=dev" > mode.env
3+
docker-compose up

Diff for: ‎start-production.sh

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#!/bin/bash
2+
echo "NODE_ENV=production" > mode.env
3+
docker-compose up

Diff for: ‎webpack.config.prod.js.save

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
const path = require('path');
2+
const webpack = require('webpack');
3+
4+
const javascriptEntryPath = path.resolve(__dirname, 'src', 'index.js');
5+
const htmlEntryPath = path.resolve(__dirname, 'src', 'index.html');
6+
const buildPath = path.resolve(__dirname, 'public', 'build');
7+
8+
module.exports = {
9+
entry: [
10+
javascriptEntryPath,
11+
htmlEntryPath
12+
],
13+
output: {
14+
path: buildPath,
15+
filename: bundle.js,
16+
},
17+
module: {
18+
loaders: [{
19+
test: /\.jsx?$/,
20+
exclude: /(node_modules|bower_compoments)/,
21+
query:loader: 'babel-loader',
22+
23+
}],
24+
},
25+
plugins: [
26+
new webpack.optimize.OccurrenceOrderPlugin()
27+
]
28+
};

0 commit comments

Comments
 (0)