angelmmiguel/docker-rails5-react-redux-boilerplate

Docker + Rails 5 API + React + Redux

Docker + Rails 5 + Webpack + React + Redux

An easy template with the minimum you need to start to work with Rails 5 and React!

# Developing

To start the server you only need to run the following magic command:

docker-compose up -d

After the containers finish the initialization, you can go to http://localhost:3000

docker-rails5-react-redux-boilerplate's Issues

frontend : webpack not compiling and hence main.sass / css-loader issue.

Hello Team,
I am getting webpack not compiling and hence main.sass / css-loader issue.

Please find the terminal screenshot and the logs here.

docker-compose up
Starting dockerrails5reactreduxboilerplate_frontend_1 ... done
Starting dockerrails5reactreduxboilerplate_db_1 ... done
Starting dockerrails5reactreduxboilerplate_backend_1 ... done
Starting dockerrails5reactreduxboilerplate_nginx_1 ... done
Attaching to dockerrails5reactreduxboilerplate_frontend_1, dockerrails5reactreduxboilerplate_db_1, dockerrails5reactreduxboilerplate_backend_1, dockerrails5reactreduxboilerplate_nginx_1
frontend_1 | Node Version: v7.0.0
db_1 | LOG: database system was shut down at 2018-04-04 17:46:52 UTC
frontend_1 | Node ENV: development
backend_1 |
backend_1 | Checking gems
db_1 | LOG: MultiXact member wraparound protections are now enabled
db_1 | LOG: autovacuum launcher started
db_1 | LOG: database system is ready to accept connections
frontend_1 | Npm Version: 3.10.8
frontend_1 | Installing missing dependencies...
backend_1 |
backend_1 | Running server
nginx_1 | Starting application ...
nginx_1 |
nginx_1 | *** Welcome to the nginx image ***
nginx_1 | *** Brought to you by Bitnami ***
nginx_1 | *** More information: https://github.com/bitnami/bitnami-docker-nginx ***
nginx_1 | *** Issues: https://github.com/bitnami/bitnami-docker-nginx/issues ***
nginx_1 |
backend_1 | => Booting Puma
backend_1 | => Rails 5.0.0.1 application starting in development on http://0.0.0.0:3000
backend_1 | => Run rails server -h for more startup options
frontend_1 | npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules/chokidar/node_modules/fsevents):
frontend_1 | npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
frontend_1 | npm WARN [email protected] No repository field.
frontend_1 |
frontend_1 | > [email protected] start /app
frontend_1 | > sudo webpack-dev-server --hot --inline --progress --colors --host=0.0.0.0 --port=80 --content-base
frontend_1 |
nginx_1 | 172.19.0.1 - - [04/Apr/2018:16:56:55 +0000] "GET /favicon.ico HTTP/1.1" 502 575 "http://10.1.10.182:8080/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:01:36 +0000] "GET / HTTP/1.1" 200 2554 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:01:36 +0000] "GET /favicon.ico HTTP/1.1" 404 148 "http://localhost:8080/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:01:39 +0000] "GET /vendor.js HTTP/1.1" 200 970256 "http://localhost:8080/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:02:34 +0000] "GET /api HTTP/1.1" 404 3680 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:09:52 +0000] "GET /app HTTP/1.1" 404 142 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:10:41 +0000] "GET / HTTP/1.1" 200 2554 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:11:28 +0000] "GET / HTTP/1.1" 200 2554 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:26:57 +0000] "GET / HTTP/1.1" 200 2554 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
nginx_1 | 172.19.0.1 - - [04/Apr/2018:17:27:07 +0000] "GET / HTTP/1.1" 200 2554 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36"
frontend_1 | Building: Main project for [undefined]
70% 1/1 build modules http://0.0.0.0:80/
frontend_1 | webpack result is served from /
frontend_1 | content is served from ./dist
webpack: Failed to compile.
frontend_1 | Hash: 1ce8f6d7c63bcb4d20ab
frontend_1 | Time: 8418ms
frontend_1 | chunk {0} main.js (main) 240 kB [rendered]
frontend_1 |
frontend_1 | ERROR in ./src/stylesheets/main.sass
frontend_1 | Module build failed: Error
frontend_1 | at NormalModule.onModuleBuildFailed (/app/node_modules/webpack-core/lib/NormalModuleMixin.js:315:19)
frontend_1 | at nextLoader (/app/node_modules/webpack-core/lib/NormalModuleMixin.js:270:31)
frontend_1 | at /app/node_modules/webpack-core/lib/NormalModuleMixin.js:292:15
frontend_1 | at context.callback (/app/node_modules/webpack-core/lib/NormalModuleMixin.js:148:14)
frontend_1 | at /app/node_modules/postcss-loader/index.js:148:13
frontend_1 | @ ./src/app.jsx 26:0-34
frontend_1 | Child html-webpack-plugin for "index.html":
frontend_1 | chunk {0} index.html 540 kB [rendered]
frontend_1 | Child extract-text-webpack-plugin:
frontend_1 |
frontend_1 | ERROR in .//css-loader!.//postcss-loader!./~/sass-loader?indentedSyntax=sass&includePaths[]=/app/src!./src/stylesheets/main.sass
frontend_1 | Module build failed: Error: No PostCSS Config found in: /app/src/stylesheets
frontend_1 | at /app/node_modules/postcss-load-config/index.js:51:26
backend_1 | Puma starting in single mode...
backend_1 | * Version 3.6.0 (ruby 2.3.1-p112), codename: Sleepy Sunday Serenity
backend_1 | * Min threads: 5, max threads: 5
backend_1 | * Environment: development
backend_1 | * Listening on tcp://0.0.0.0:3000
backend_1 | Use Ctrl-C to stop

Update React version

Update the frontend to the latest version

What I should do from create Rails in production?

Can you give me instruction?

Error on client container

Output of docker-compose up command show some errors on frontend container, exiting it with code 1.

frontend_1 | npm ERR! Error: EACCES: permission denied, mkdir '/app/node_modules/.staging'
frontend_1 | npm ERR!  { Error: EACCES: permission denied, mkdir '/app/node_modules/.staging'
frontend_1 | npm ERR!   errno: -13,
frontend_1 | npm ERR!   code: 'EACCES',
frontend_1 | npm ERR!   syscall: 'mkdir',
frontend_1 | npm ERR!   path: '/app/node_modules/.staging' }
...
frontend_1 | npm ERR! Error: EACCES: permission denied, open 'npm-debug.log.139430072'
frontend_1 | npm ERR!  { Error: EACCES: permission denied, open 'npm-debug.log.139430072'
frontend_1 | npm ERR!   errno: -13,
frontend_1 | npm ERR!   code: 'EACCES',
frontend_1 | npm ERR!   syscall: 'open',
frontend_1 | npm ERR!   path: 'npm-debug.log.139430072' }
...
frontend_1 | Building: Main project for [undefined]
frontend_1 | module.js:474
frontend_1 |     throw err;
frontend_1 |     ^
frontend_1 | 
frontend_1 | Error: Cannot find module '/app/vendor/vendor-manifest.json'
frontend_1 |     at Function.Module._resolveFilename (module.js:472:15)
frontend_1 |     at Function.Module._load (module.js:420:25)
frontend_1 |     at Module.require (module.js:500:17)
frontend_1 |     at require (internal/module.js:20:19)
frontend_1 |     at buildConfig (/app/config/plugins.js:26:17)
frontend_1 |     at Object.<anonymous> (/app/webpack.config.js:70:14)
...

README screenshot