I'm fairly new to docker. I was trying to separate my web app on modules for backend (django), frontend (react) and with some postgres db.
Here is my docker-compose.yml :
version: "3.8"
services:
db:
image: postgres
container_name: postgres
environment:
- POSTGRES_DB=postgres
- POSTGRES_USER=postgres
- POSTGRES_PASSWORD=postgres
volumes:
- ./private/posgtesql/data/data:/var/lib/postgresql/data
app:
build: .
container_name: app
working_dir: /app/label_it
command: python manage.py runserver 0.0.0.0:8000
volumes:
- .:/app
ports:
- "8000:8000"
depends_on:
- db
front:
build:
context: ./label_it
dockerfile: Dockerfile
container_name: front
command: npm run dev
working_dir: /app/label_it/front
volumes:
- ./label_it/front:/app/label_it/front
- ./label_it/front/node-modules:/app/./label_it/front/node_modules
ports:
- "8001:8000"
depends_on:
- app
Django side runs like dream, browsing 127.0.0.1:8000 responses with server site. BUT.
There is nothing on 127.0.0.1:8001.
Correct me if I'm wrong, but I should be getting both servers for django AND for react on respecting ports??
Searched whole internet looking for solution. All I found was to check if node server actually runs on 0.0.0.0:8001 and it does according to :
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
baa18d3bfa73 labeling-lab-platform_front "docker-entrypoint.s…" 24 minutes ago Up 24 minutes 3000/tcp, 0.0.0.0:8001->8000/tcp front
6a76ba3a901b labeling-lab-platform_app "python manage.py ru…" About an hour ago Up 24 minutes 0.0.0.0:8000->8000/tcp app
c0d1d27ed930 postgres "docker-entrypoint.s…" About an hour ago Up 24 minutes 5432/tcp postgres
It's my second day dealing with this issue and I'm realy stuck.
EDIT:
my package.json with declared dev server:
{
"name": "static",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"#babel/plugin-proposal-class-properties": "^7.12.1",
"#date-io/date-fns": "^1.3.13",
"#emotion/core": "^11.0.0",
"#emotion/react": "^11.1.4",
"#emotion/styled": "^11.0.0",
"#material-ui/core": "^5.0.0-alpha.20",
"#material-ui/data-grid": "^4.0.0-alpha.17",
"#material-ui/icons": "^4.11.2",
"#material-ui/pickers": "^3.2.10",
"#material-ui/unstyled": "^5.0.0-alpha.20",
"axios": "^0.21.1",
"babel-preset-react": "^6.24.1",
"clsx": "^1.1.1",
"date-fns": "^2.16.1",
"react-desktop-notification": "^1.0.9",
"react-redux": "^7.2.2",
"react-router-dom": "^5.2.0",
"react-window": "^1.8.6",
"react-window-infinite-loader": "^1.0.5",
"redux": "^4.0.5",
"regenerator-runtime": "^0.13.7",
"xlsx": "^0.16.9"
},
"devDependencies": {
"#babel/core": "^7.12.10",
"#babel/preset-env": "^7.12.11",
"#babel/preset-react": "^7.12.10",
"babel-loader": "^8.2.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"webpack": "^5.11.0",
"webpack-cli": "^4.3.0"
}
}
Related
I have a pipeline set up for my Bitbucket repository that runs npm install if there is no node cache. Up until now it has worked fine, but the node cache was recently cleared, and now I'm getting the following output from Bitbucket (Pastebin link, due to character limit): https://pastebin.com/fY9TznNn
package.json:
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"#types/geojson": "^7946.0.7",
"#types/google-libphonenumber": "^7.4.19",
"#types/google-map-react": "^2.1.0",
"#types/jest": "^24.0.0",
"#types/node": "^12.12.55",
"#types/react": "^16.9.49",
"#types/react-bootstrap": "^0.32.22",
"#types/react-dom": "^16.9.8",
"#types/react-modal": "^3.10.6",
"#types/react-router-dom": "^5.1.5",
"#types/supercluster": "^5.0.2",
"axios": "^0.21.1",
"bootstrap": "^4.5.2",
"enzyme": "^3.11.0",
"eslint": "^6.8.0",
"firebase": "^7.24.0",
"geojson": "^0.5.0",
"google-libphonenumber": "^3.2.14",
"google-map-react": "^2.1.3",
"node-sass": "^4.0.0",
"react": "^16.13.1",
"react-async": "^10.0.1",
"react-bootstrap": "^1.3.0",
"react-cool-img": "^1.2.4",
"react-dom": "^16.13.1",
"react-dropzone": "^11.3.2",
"react-modal": "^3.12.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.4",
"supercluster": "^7.1.0",
"typescript": "^3.2.1",
"use-supercluster": "^0.2.9"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"lint": "npx prettier --write src && npx eslint src --fix --ext .ts --ext .tsx"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"#types/enzyme": "^3.10.8",
"#types/enzyme-adapter-react-16": "^1.0.6",
"#typescript-eslint/eslint-plugin": "^3.10.1",
"#typescript-eslint/parser": "^3.10.1",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.6",
"eslint": "^7.23.0",
"eslint-config-airbnb": "^18.2.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-promise": "^4.3.1",
"eslint-plugin-react": "^7.20.6",
"eslint-plugin-react-hooks": "^4.1.0",
"eslint-plugin-sort-keys-fix": "^1.1.1",
"prettier": "^2.1.1"
}
}
bitbucket-pipelines.yml:
image: node
definitions:
steps:
- step: &lint
name: Check code style
script:
- npm install # this is where the error occurs
- npx eslint **/*.ts[x]
caches:
- node
- step: &build
name: Build and test
script:
- echo > ".env"
- echo REACT_APP_GOOGLE_API_KEY=$GOOGLE_API_KEY >> ".env"
- echo REACT_APP_HANDSHAKE_API_KEY=$HANDSHAKE_API_KEY >> ".env"
- npm install
- npm run test
- npm run build
artifacts:
- build/**
caches:
- node
- step: &deploy
name: Deploy to Firebase
script:
- cd functions
- npm install
- cd ..
- pipe: atlassian/firebase-deploy:1.0.0
variables:
FIREBASE_TOKEN: $FIREBASE_TOKEN
PROJECT_ID: $FIREBASE_PROJECT
pipelines:
pull-requests:
"**":
- step: *lint
- step: *build
branches:
master:
- step: *lint
- step: *build
- step: *deploy
I'm concerned it might have something to do with the node-sass package as I've experienced issues with it before, and it's the first dependency to appear in the error. But I'm really not sure how to interpret this output or how to fix it. Thanks for any help!
Looks like my intuition was right—it was because of the node-sass package. Apparently it's deprecated. Installing sass instead fixed the problem!
I receive the following error message after deploying my Next.js app on Google Cloud's AppEngine. Before deploying the app I run npm run-scrip build locally. Starting the app locally does work fine as well.
While deploying glcoud app deploy I do not receive any error. After opening the app gcloud app browse I receive server response [500].
In the log I find following error:
Error: Could not find a valid build in the '/workspace/.next' directory! Try building your app with 'next build' before starting the server.
at Server.readBuildId (/workspace/node_modules/next/dist/next-server/server/next-server.js:137)
at Server (/workspace/node_modules/next/dist/next-server/server/next-server.js:3)
at createServer (/workspace/node_modules/next/dist/server/next.js:2)
at start (/workspace/node_modules/next/dist/server/lib/start-server.js:1)
at nextStart (/workspace/node_modules/next/dist/cli/next-start.js:19)
at (/workspace/node_modules/next/dist/bin/next:26)
This is my package.json:
{
"name": "next-project",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start -p 8080",
"preinstall": "node lock_node_version.js"
}
app.yaml file:
env: standard
runtime: nodejs14
service: default
handlers:
- url: /.*
secure: always
script: auto
EDIT/ADDED
"dependencies": {
"#apollo/client": "^3.3.6",
"#apollo/react-hooks": "^4.0.0",
"#date-io/date-fns": "^1.3.13",
"#material-ui/core": "^4.11.2",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.57",
"#material-ui/pickers": "^3.2.10",
"apollo-server-micro": "^2.19.0",
"check-node-version": "^4.1.0",
"date-fns": "^2.16.1",
"firebase": "^8.2.2",
"firebase-admin": "^9.4.2",
"js-cookie": "^2.2.1",
"lowdb": "^1.0.0",
"next": "10.0.3",
"next-i18next": "^7.0.1",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-material-ui-carousel": "^2.1.1"
}
,
"devDependencies": {
"#types/lowdb": "^1.0.9",
"#types/node": "^14.14.10",
"#typescript-eslint/eslint-plugin": "^4.9.0",
"#typescript-eslint/parser": "^4.9.0",
"eslint": "^7.14.0",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "^7.21.5",
"eslint-plugin-react-hooks": "^4.2.0",
"typescript": "^4.1.2"
},
Any help much appreciated!
You can have the same identical behavior of build script to build your app before deployment in App Engine by using gcp-build. It is well documented on GCP docs and here's an example for you:
"scripts": {
"dev": "next dev",
"gcp-build": "next build",
"start": "next start -p 8080",
"preinstall": "node lock_node_version.js"
}
To address the confusion in the comments, you may have noticed that in the docs, the command tsc -p . specified as a custom build step. What it does is it compiles Typescript code because the example itself is a Typescript app. You don't need to run it unless you're using Typescript. It's always up to you and you're free to specify any commands when using gcp-build.
I used the following command to run the container :
docker run -p 3333:3333 -d maill/node-web-app
Here is the result of docker ps :
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
f26270107bfa maill/node-web-app "npm run dev" 49 seconds ago Up 46 seconds 0.0.0.0:3000->3000/tcp musing_fermi
However when I try to access webserver on host using localhost:3333 it doesn't work.
I am using windows 10 pro.
docker logs musing_fermi shows:
DONE Compiled successfully in 3541ms16:04:50 | OPEN localhost:3000
Dockerfile :
FROM node:8
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm i
COPY . .
EXPOSE 3333
CMD [ "npm", "run", "dev" ]
package.json :
{
"name": "webapp-pst-horizon",
"version": "1.0.0",
"description": "Webapp pour les formations enedis",
"author": "Léo Coletta",
"private": true,
"scripts": {
"dev": "cross-env HOST=0.0.0.0 PORT=3333 nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"
},
"dependencies": {
"#nuxtjs/axios": "^5.3.1",
"#nuxtjs/proxy": "^1.2.4",
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"cookie": "^0.3.1",
"js-cookie": "^2.2.0",
"nuxt": "^1.4.1",
"vuetify": "^1.0.19",
"webpack": "^3.1.0"
},
"devDependencies": {
"babel-eslint": "^8.2.3",
"cross-env": "^5.2.0",
"eslint": "^4.9.0",
"eslint-config-airbnb-base": "^12.1.0",
"eslint-loader": "^2.0.0",
"eslint-plugin-import": "^2.7.0",
"eslint-plugin-vue": "^4.5.0",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2"
}
}
Based on what you have in the question so far, and that you have OPEN localhost:3000 coming from your container logs, I'd guess your application is listening on localhost. This is != localhost outside the container. You need to configure your application to listen on 0.0.0.0 inside the container.
To go along with johnharris85's answer, add the following to your package.json:
From nuxt documentation on "How to edit HOST and PORT?"
You can configure the PORT with 3 different ways:
...
...
Via a nuxt config in the package.json:
Inside your package.json:
"config": {
"nuxt": {
"host": "0.0.0.0",
"port": "3333"
}
},
"scripts": {
"dev": "nuxt"
}
I am trying to use Google App Engine (Standard) for our nodejs app(runtime nodejs10) and trying to use PM2 as process manager. We have been able to deploy the app successfully and runs perfectly fine for a few hours, without any issues.
Suddenly after a few hours we are seeing error by PM2 and the app doesn't respond.
PM2 warn: [pidusage] We couldn't find uptime from /proc/uptime, using os.uptime() value
We are using standard Google App Engine with nodejs10 configuration. We tried printing os platform and version with os library
platform - Linux
version - 4.4 which is linux kernel version I believe
Initially we thought it was because of app engine lifecycle going to a sleep mode and PM2 isn't able to recover from wake up of the instance, but we realised that this happened to us when the server is active as well
package.json
"scripts": {
"start": "pm2-runtime --public key --secret key --deep-monitoring start ecosystem.config.js --env production",
"test": "echo \"Info: no test created yet\"",
"snyk-protect": "snyk protect",
"prepare": "npm run snyk-protect"
},
"dependencies": {
"#google-cloud/logging-bunyan": "^1.2.1",
"#google-cloud/profiler": "^2.0.2",
"#google-cloud/storage": "^2.5.0",
"bcrypt": "^3.0.6",
"bunyan": "^1.8.12",
"cookie-parser": "~1.4.4",
"cors": "^2.8.5",
"debug": "^2.6.9",
"dotenv": "^8.0.0",
"easy-rbac": "^3.1.0",
"ejs": "~2.6.1",
"express": "~4.16.1",
"express-validator": "^6.1.1",
"firebase": "^6.3.1",
"firebase-admin": "^8.2.0",
"helmet": "^3.19.0",
"http-errors": "~1.6.3",
"jsonschema": "^1.2.4",
"memory-cache": "^0.2.0",
"morgan": "~1.9.1",
"multer": "^1.4.2",
"node-rest-client": "^3.1.0",
"passport": "^0.4.0",
"pm2": "^3.5.1",
"rxjs": "~6.4.0",
"snyk": "^1.195.1",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
}
ecosystem.config.js
module.exports = {
apps: [{
name: "ChallengeApp",
script: "./bin/www",
instances : "2",
env: {
NODE_ENV: "local"
},
env_development: {
NODE_ENV: "development",
},
env_staging: {
NODE_ENV: "staging",
},
env_production: {
NODE_ENV: "production",
}
}]
}
I am getting 502 Bad Gateway response for requests after a few hours but expect 200 response and seeing an error in log file
PM2 warn: [pidusage] We couldn't find uptime from /proc/uptime, using
os.uptime() value
I'm trying to build my test container using drone ci but it always fails
when trying to install websocket.io
with the error, I added npm install -g node-gyp as adviced but the problem still exists
npm info lifecycle compression#1.6.2~install: compression#1.6.2
npm info lifecycle express#4.14.0~install: express#4.14.0
npm info lifecycle nodeadmin#0.1.2~install: nodeadmin#0.1.2
npm info lifecycle vizion#0.2.13~install: vizion#0.2.13
npm info lifecycle websocket#1.0.24~install: websocket#1.0.24\
websocket#1.0.24 install /drone/src/bitbucket.org/xxxx/xxxxxxx/node_modules/websocket
(node-gyp rebuild 2> builderror.log) || (exit 0)
make: Entering directory '/drone/src/bitbucket.org/xxxxxx/xxxx/node_modules/websocket/build'
CXX(target) Release/obj.target/bufferutil/src/bufferutil.o
this is my package.json
{
"name": "calm-cell",
"version": "1.0.0",
"description": "th backend app",
"scripts": {
"start": "node server.js",
"setup":"./node_modules/.bin/mocha 'test/setupDb.js' --reporter spec --timeout 3000",
"test": "./node_modules/.bin/mocha 'test/appTest.js' --reporter spec --timeout 3000",
"test:client": "karma start --single-run",
"test:server": "mocha --recursive"
},
"dependencies": {
"async": "^1.5.2",
"bcrypt-nodejs": "^0.0.3",
"bluebird": "^3.4.1",
"body-parser": "^1.15.1",
"bookshelf": "^0.9.2",
"compression": "^1.6.2",
"cookie-parser": "^1.4.1",
"dotenv": "^2.0.0",
"express": "^4.13.4",
"express-validator": "^2.20.4",
"json-2-csv": "^2.0.22",
"json2csv": "^3.6.2",
"jsonwebtoken": "^5.7.0",
"jwt-decode": "^2.1.0",
"jwt-then": "^0.4.1",
"knex": "^0.10.0",
"loadtest": "^1.4.4",
"mkdirp": "^0.5.1",
"moment": "^2.12.0",
"morgan": "^1.7.0",
"mysql": "^2.10.2",
"node-uuid": "^1.4.7",
"nodeadmin": "^0.1.2",
"nodemailer": "^2.5.0",
"opbeat": "^3.16.0",
"pdf-invoice": "^1.0.2",
"pm2": "^1.1.3",
"pmx": "^0.6.3",
"request": "^2.69.0"
},
"devDependencies": {
"chai": "^3.5.0",
"chai-http": "^3.0.0",
"karma": "^0.13.22",
"karma-chai": "^0.1.0",
"karma-coverage": "^0.5.5",
"karma-mocha": "^1.0.1",
"mocha": "^2.5.3",
"nodeman": "^1.1.2",
"mocha-junit-reporter": "^1.12.1",
"sinon": "^1.17.3",
"sinon-chai": "^2.8.0",
"supertest": "^1.2.0"
},
"engines": {
"node": "6.1.0"
}
}
and this is drone yml file
build:
image: node:boron
commands:
- npm install -g node-gyp
- npm update # Update your personal npm local repository again.
- npm install
- npm run setup
- npm run test
environment:
- EXAM_SERVER_URL=http://S8.dummy.com
- FETCH_SERVER_FETCH_API='/getSomething?something='
- TOKEN_SECRET=superSecretFakeToken
- DB_HOST=localhost
- DB_USER=root
- DB_PASSWORD=thisIsFakePassword
- DB_NAME=thisIsFakeDB
compose:
database:
image: mysql:5.6
environment:
- MYSQL_ROOT_PASSWORD=thisIsFakePassword
- MYSQL_DATABASE=thisIsFakeDB