From 93a86f81220b35ac64100008af53c1fec5d91faf Mon Sep 17 00:00:00 2001 From: Carl Kittelberger Date: Tue, 29 Aug 2017 00:44:56 +0200 Subject: [PATCH] Completely restructure all files to use Lerna, Webpack and Babel. We're completely moving away from nwb with this commit and fully set up on developing a backend and a frontend as two separate code bases. --- .babelrc | 7 +- .dockerignore | 7 +- .eslintignore | 7 +- .eslintrc.yml | 13 +- .gitignore | 7 +- .npmrc | 1 + .travis.yml | 32 +- Dockerfile.dist | 4 - Jenkinsfile | 58 +- config/webpack/environment.js | 133 + config/webpack/injectManifestPlugin.js | 26 + docker-compose.local.yml | 3 + docker/node/Dockerfile | 10 +- docker/web.sh | 2 +- index.js | 134 - lerna.json | 7 + node_modules/.gitkeep | 2 + nwb.config.js | 105 - package-lock.json | 13445 ---------------- package.json | 73 +- packages/backend/.babelrc | 34 + packages/backend/.npmrc | 1 + packages/backend/package.json | 86 + packages/backend/src/database.js | 0 packages/backend/src/index.js | 127 + packages/frontend/.babelrc | 16 + packages/frontend/.eslintrc.yml | 8 + packages/frontend/.npmrc | 1 + packages/frontend/node_modules/.gitkeep | 2 + packages/frontend/package.json | 127 + packages/frontend/src/middleware/.babelrc | 34 + packages/frontend/src/middleware/index.js | 97 + packages/frontend/src/website/.babelrc | 22 + .../frontend/src/website}/App.jsx | 0 .../frontend/src/website}/App.sass | 0 .../frontend/src/website}/Countdown.jsx | 0 .../frontend/src/website}/Countdown.sass | 0 .../frontend/src/website}/DigitBlock.jsx | 0 .../frontend/src/website}/DigitBlock.sass | 0 .../frontend/src/website}/Drawing.jsx | 0 .../frontend/src/website}/Drawing.sass | 0 .../frontend/src/website}/Footer.jsx | 0 .../frontend/src/website}/Footer.sass | 0 .../frontend/src/website}/Header.jsx | 0 .../frontend/src/website}/Header.sass | 0 .../frontend/src/website}/ProgressCircle.jsx | 0 .../frontend/src/website}/ProgressCircle.sass | 0 packages/frontend/src/website/debug.sass | 21 + .../src/website}/fonts/_colaborate.sass | 0 .../ColabBol-webfont.eot | Bin .../ColabBol-webfont.svg | 0 .../ColabBol-webfont.ttf | Bin .../ColabBol-webfont.woff | Bin .../ColabBol-webfont.woff2 | Bin .../colaborate_bold_macroman/stylesheet.css | 0 .../ColabLig-webfont.eot | Bin .../ColabLig-webfont.svg | 0 .../ColabLig-webfont.ttf | Bin .../ColabLig-webfont.woff | Bin .../ColabLig-webfont.woff2 | Bin .../colaborate_light_macroman/stylesheet.css | 0 .../ColabMed-webfont.eot | Bin .../ColabMed-webfont.svg | 0 .../ColabMed-webfont.ttf | Bin .../ColabMed-webfont.woff | Bin .../ColabMed-webfont.woff2 | Bin .../colaborate_medium_macroman/stylesheet.css | 0 .../ColabReg-webfont.eot | Bin .../ColabReg-webfont.svg | 0 .../ColabReg-webfont.ttf | Bin .../ColabReg-webfont.woff | Bin .../ColabReg-webfont.woff2 | Bin .../stylesheet.css | 0 .../ColabThi-webfont.eot | Bin .../ColabThi-webfont.svg | 0 .../ColabThi-webfont.ttf | Bin .../ColabThi-webfont.woff | Bin .../ColabThi-webfont.woff2 | Bin .../colaborate_thin_macroman/stylesheet.css | 0 .../frontend/src/website}/getUpcomingDate.js | 0 .../frontend/src/website}/index.html | 0 .../frontend/src/website}/index.jsx | 0 .../frontend/src/website}/index.sass | 3 +- .../frontend/webpack.config.babel.js | 181 +- src/.eslintrc.yml | 4 - 85 files changed, 876 insertions(+), 13964 deletions(-) create mode 100644 .npmrc delete mode 100644 Dockerfile.dist create mode 100644 config/webpack/environment.js create mode 100644 config/webpack/injectManifestPlugin.js delete mode 100644 index.js create mode 100644 lerna.json delete mode 100644 nwb.config.js delete mode 100644 package-lock.json create mode 100644 packages/backend/.babelrc create mode 100644 packages/backend/.npmrc create mode 100644 packages/backend/package.json create mode 100644 packages/backend/src/database.js create mode 100644 packages/backend/src/index.js create mode 100644 packages/frontend/.babelrc create mode 100644 packages/frontend/.eslintrc.yml create mode 100644 packages/frontend/.npmrc create mode 100644 packages/frontend/node_modules/.gitkeep create mode 100644 packages/frontend/package.json create mode 100644 packages/frontend/src/middleware/.babelrc create mode 100644 packages/frontend/src/middleware/index.js create mode 100644 packages/frontend/src/website/.babelrc rename {src => packages/frontend/src/website}/App.jsx (100%) rename {src => packages/frontend/src/website}/App.sass (100%) rename {src => packages/frontend/src/website}/Countdown.jsx (100%) rename {src => packages/frontend/src/website}/Countdown.sass (100%) rename {src => packages/frontend/src/website}/DigitBlock.jsx (100%) rename {src => packages/frontend/src/website}/DigitBlock.sass (100%) rename {src => packages/frontend/src/website}/Drawing.jsx (100%) rename {src => packages/frontend/src/website}/Drawing.sass (100%) rename {src => packages/frontend/src/website}/Footer.jsx (100%) rename {src => packages/frontend/src/website}/Footer.sass (100%) rename {src => packages/frontend/src/website}/Header.jsx (100%) rename {src => packages/frontend/src/website}/Header.sass (100%) rename {src => packages/frontend/src/website}/ProgressCircle.jsx (100%) rename {src => packages/frontend/src/website}/ProgressCircle.sass (100%) create mode 100644 packages/frontend/src/website/debug.sass rename {src => packages/frontend/src/website}/fonts/_colaborate.sass (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/ColabBol-webfont.eot (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/ColabBol-webfont.svg (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/ColabBol-webfont.ttf (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/ColabBol-webfont.woff (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/ColabBol-webfont.woff2 (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_bold_macroman/stylesheet.css (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/ColabLig-webfont.eot (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/ColabLig-webfont.svg (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/ColabLig-webfont.ttf (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/ColabLig-webfont.woff (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/ColabLig-webfont.woff2 (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_light_macroman/stylesheet.css (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/ColabMed-webfont.eot (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/ColabMed-webfont.svg (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/ColabMed-webfont.ttf (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/ColabMed-webfont.woff (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/ColabMed-webfont.woff2 (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_medium_macroman/stylesheet.css (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/ColabReg-webfont.eot (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/ColabReg-webfont.svg (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/ColabReg-webfont.ttf (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/ColabReg-webfont.woff (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/ColabReg-webfont.woff2 (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_regular_macroman/stylesheet.css (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/ColabThi-webfont.eot (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/ColabThi-webfont.svg (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/ColabThi-webfont.ttf (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/ColabThi-webfont.woff (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/ColabThi-webfont.woff2 (100%) rename {src => packages/frontend/src/website}/fonts/colaborate_thin_macroman/stylesheet.css (100%) rename {src => packages/frontend/src/website}/getUpcomingDate.js (100%) rename {src => packages/frontend/src/website}/index.html (100%) rename {src => packages/frontend/src/website}/index.jsx (100%) rename {src => packages/frontend/src/website}/index.sass (79%) rename webpack.config.babel.js => packages/frontend/webpack.config.babel.js (66%) delete mode 100644 src/.eslintrc.yml diff --git a/.babelrc b/.babelrc index 7c2a047..2f73205 100644 --- a/.babelrc +++ b/.babelrc @@ -4,13 +4,12 @@ "targets": { "node": true, "uglify": false - }, - "spec": true, - "debug": false + } }] ], "plugins": [ "babel-plugin-transform-class-properties", - "babel-plugin-syntax-dynamic-import" + "babel-plugin-transform-runtime", + "babel-plugin-dynamic-import-node" ] } \ No newline at end of file diff --git a/.dockerignore b/.dockerignore index 9916791..85dfff8 100644 --- a/.dockerignore +++ b/.dockerignore @@ -22,11 +22,12 @@ build/Release # Dependency directory # Deployed apps should consider commenting this line out: # see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git -node_modules/** -!node_modules/.gitkeep +**/node_modules/** +!**/node_modules/.gitkeep # Webpack output -/dist +packages/*/dist +packages/*/lib # Intermediate build files (cache, etc.) /build diff --git a/.eslintignore b/.eslintignore index 23a9be9..c112c0f 100644 --- a/.eslintignore +++ b/.eslintignore @@ -22,11 +22,12 @@ build/Release # Dependency directory # Deployed apps should consider commenting this line out: # see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git -node_modules/** -!node_modules/.gitkeep +**/node_modules/** +!**/node_modules/.gitkeep # Webpack output -/dist +packages/*/dist +packages/*/lib # Intermediate build files (cache, etc.) /build diff --git a/.eslintrc.yml b/.eslintrc.yml index 3f2c139..177798b 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -12,8 +12,19 @@ env: es6: true rules: - no-underscore-dangle: 'off' + no-console: off no-plusplus: - error - allowForLoopAfterthoughts: true + no-underscore-dangle: 'off' react/no-array-index-key: 0 + +overrides: + - files: + - "config/**" + - "**/webpack.config*.js" + - "**/.babelrc*" + rules: + import/no-extraneous-dependencies: + - error + - devDependencies: true diff --git a/.gitignore b/.gitignore index 23a9be9..c112c0f 100644 --- a/.gitignore +++ b/.gitignore @@ -22,11 +22,12 @@ build/Release # Dependency directory # Deployed apps should consider commenting this line out: # see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git -node_modules/** -!node_modules/.gitkeep +**/node_modules/** +!**/node_modules/.gitkeep # Webpack output -/dist +packages/*/dist +packages/*/lib # Intermediate build files (cache, etc.) /build diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000..43c97e7 --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +package-lock=false diff --git a/.travis.yml b/.travis.yml index a049d57..40cbcf4 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,16 +1,16 @@ -sudo: false - -language: node_js -node_js: - - 6 - -before_install: - - npm install codecov.io coveralls - -after_success: - - cat ./coverage/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js - - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js - -branches: - only: - - master +# sudo: false +# +# language: node_js +# node_js: +# - 6 +# +# before_install: +# - npm install codecov.io coveralls +# +# after_success: +# - cat ./coverage/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js +# - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js +# +# branches: +# only: +# - master diff --git a/Dockerfile.dist b/Dockerfile.dist deleted file mode 100644 index 6795de2..0000000 --- a/Dockerfile.dist +++ /dev/null @@ -1,4 +0,0 @@ -FROM icedream/caddy - -WORKDIR /data -COPY ./dist/ /data diff --git a/Jenkinsfile b/Jenkinsfile index 723563d..93ff925 100644 --- a/Jenkinsfile +++ b/Jenkinsfile @@ -1,29 +1,29 @@ -node("docker && linux && amd64") { - checkout scm - - docker.image("node:8.2.1").inside { - // Install dependencies - sh "npm install" - - // Build website with npm - sh "npm run build" - archive "dist/**" - } - - // Build docker image to be deployed - def image = docker.build("docker.dreamnetwork.oss:5000/icedream/carl-kittelberger-website:${env.BRANCH_NAME ?: "latest"}", "-f Dockerfile.dist .") - - // @NOTE - https://issues.jenkins-ci.org/browse/JENKINS-42152?focusedCommentId=307976&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-307976 - image.push() - if (env.BRANCH_NAME) { - switch(env.BRANCH_NAME) { - case "master": - image.push("latest") - break - default: - image.push() - break - } - } - image.push("${sh(script: "git describe --tags --always", returnStdout: true).trim()}") -} +// node("docker && linux && amd64") { +// checkout scm +// +// docker.image("node:8.2.1").inside { +// // Install dependencies +// sh "npm install" +// +// // Build website with npm +// sh "npm run build" +// archive "dist/**" +// } +// +// // Build docker image to be deployed +// def image = docker.build("docker.dreamnetwork.oss:5000/icedream/carl-kittelberger-website:${env.BRANCH_NAME ?: "latest"}", "-f Dockerfile.dist .") +// +// // @NOTE - https://issues.jenkins-ci.org/browse/JENKINS-42152?focusedCommentId=307976&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-307976 +// image.push() +// if (env.BRANCH_NAME) { +// switch(env.BRANCH_NAME) { +// case "master": +// image.push("latest") +// break +// default: +// image.push() +// break +// } +// } +// image.push("${sh(script: "git describe --tags --always", returnStdout: true).trim()}") +// } diff --git a/config/webpack/environment.js b/config/webpack/environment.js new file mode 100644 index 0000000..fd9497f --- /dev/null +++ b/config/webpack/environment.js @@ -0,0 +1,133 @@ +import autoprefixer from 'autoprefixer'; + +export default class Environment { + constructor(options) { + this.development = true; + this.production = false; + this.server = false; + + this.autoprefixerTargets = [ + '> 1%', + 'last 4 versions', + 'Firefox ESR', + 'ios >= 8', + ]; + this.locales = ['en']; + + if (options !== undefined && options !== null) { + this.input(options); + } + } + + input(options) { + if (options) { + switch (true) { + case typeof (options) === 'string': // string + this.inputString(options); + break; + + case Array.isArray(options): // array + options.forEach((arg) => { this.input(arg); }); + break; + + default: // object + Object.keys(options).forEach((k) => { + this[k] = options[k] || this[k]; + }); + break; + } + } else if (process.env.NODE_ENV) { + this.inputString(process.env.NODE_ENV); + } + } + + inputString(env) { + switch (env.toLowerCase()) { + case 'development': + this.development = true; + this.production = false; + break; + case 'production': + this.development = false; + this.production = true; + break; + case 'server': + this.server = true; + break; + default: + console.warn('Unknown environment:', env); + break; + } + } + + styleLoaders(...preprocessingLoaders) { + const { + production, + autoprefixerTargets, + server, + + ExtractTextPlugin, // @HACK + } = this; + + if (!ExtractTextPlugin) { + throw new Error('Need a valid ExtractTextPlugin fed into the environment object.'); + } + + let cssLoaders = [ + { + loader: 'style-loader', + }, + { + loader: 'css-loader', + options: { + importLoaders: 1, + sourceMap: true, + modules: true, + localIdentName: production + ? '[name]__[local]--[hash:base64:5]' + : '[name]__[local]--[hash:base64:5]', + }, + }, + { + loader: 'postcss-loader', + options: { + ident: 'postcss', + plugins: [ + autoprefixer({ + browsers: autoprefixerTargets, + grid: false, + }), + ], + sourceMap: true, + }, + }, + ].filter(loader => loader !== false); + + if (preprocessingLoaders && preprocessingLoaders.length > 0) { + cssLoaders.push( + { + loader: 'resolve-url-loader', + options: { + fail: true, + silent: false, + }, + }, + ...preprocessingLoaders.map(loader => Object.assign({}, loader, { + options: Object.assign({}, loader.options || {}, { + sourceMap: true, + }), + })), + ); + } + + if (!server) { + const fallback = cssLoaders.shift(); + cssLoaders = ExtractTextPlugin.extract({ + fallback, + use: cssLoaders, + }); + } + + return cssLoaders; + } +} diff --git a/config/webpack/injectManifestPlugin.js b/config/webpack/injectManifestPlugin.js new file mode 100644 index 0000000..11d044b --- /dev/null +++ b/config/webpack/injectManifestPlugin.js @@ -0,0 +1,26 @@ +/** + * Plugin for HtmlPlugin which inlines content for an extracted Webpack manifest + * into the HTML in a \n$1`); + // Remove the manifest from HtmlPlugin's assets to prevent a \n$1`); - // Remove the manifest from HtmlPlugin's assets to prevent a