react-code

.dockerignore

@@ -0,0 +1,2 @@
+node_modules
+build

.gitignore

@@ -0,0 +1,49 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/my-app/build
+/tmp
+/out-tsc
+# Only exists if Bazel was run
+/bazel-out
+
+# dependencies
+/node_modules
+/my-app/node_modules
+/api/node_modules
+
+# profiling files
+chrome-profiler-events*.json
+speed-measure-plugin*.json
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db

Dockerfile

@@ -0,0 +1,15 @@
+FROM node:10 AS ui-build
+WORKDIR /usr/src/app
+COPY my-app/ ./my-app/
+RUN cd my-app && npm install && npm run build
+
+FROM node:10 AS server-build
+WORKDIR /root/
+COPY --from=ui-build /usr/src/app/my-app/build ./my-app/build
+COPY api/package*.json ./api/
+RUN cd api && npm install
+COPY api/server.js ./api/
+
+EXPOSE 80
+
+CMD ["node", "./api/server.js"]

api/README.md

@@ -0,0 +1,2 @@
+# react-nodejs-example
+Example Project demonstrating how to develop React application with Nodejs 

api/gulpfile.js

@@ -0,0 +1,69 @@
+const { src, dest, series, parallel } = require('gulp');
+const del = require('del');
+const fs   = require('fs');
+const zip = require('gulp-zip');
+const log = require('fancy-log');
+const webpack_stream = require('webpack-stream');
+const webpack_config = require('./webpack.config.js');
+var exec = require('child_process').exec;
+
+const paths = {
+  prod_build: '../prod-build',
+  server_file_name: 'server.bundle.js',
+  react_src: '../my-app/build/**/*',
+  react_dist: '../prod-build/my-app/build',
+  zipped_file_name: 'react-nodejs.zip'
+};
+
+function clean()  {
+  log('removing the old files in the directory')
+  return del('../prod-build/**', {force:true});
+}
+
+function createProdBuildFolder() {
+
+  const dir = paths.prod_build;
+  log(`Creating the folder if not exist  ${dir}`)
+  if(!fs.existsSync(dir)) {
+    fs.mkdirSync(dir);
+    log('📁  folder created:', dir);
+  }
+
+  return Promise.resolve('the value is ignored');
+}
+
+function buildReactCodeTask(cb) {
+  log('building React code into the directory')
+  return exec('cd ../my-app && npm run build', function (err, stdout, stderr) {
+    log(stdout);
+    log(stderr);
+    cb(err);
+  })
+}
+
+function copyReactCodeTask() {
+  log('copying React code into the directory')
+  return src(`${paths.react_src}`)
+        .pipe(dest(`${paths.react_dist}`));
+}
+
+function copyNodeJSCodeTask() {
+  log('building and copying server code into the directory')
+  return webpack_stream(webpack_config)
+        .pipe(dest(`${paths.prod_build}`))
+}
+
+function zippingTask() {
+  log('zipping the code ')
+  return src(`${paths.prod_build}/**`)
+      .pipe(zip(`${paths.zipped_file_name}`))
+      .pipe(dest(`${paths.prod_build}`))
+}
+
+exports.default = series(
+  clean,
+  createProdBuildFolder,
+  buildReactCodeTask,
+  parallel(copyReactCodeTask, copyNodeJSCodeTask),
+  zippingTask
+);