Can't dockerize Nuxt.js application - javascript

I have simple Nuxt.js application and I want to dockerize it. Here is the script:
FROM node
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 8010
CMD [ "npm", "start" ]
When I build it and run container it seems to work and I can see something like this:
Entrypoint app = server.js server.js.map
READY Server listening on http://127.0.0.1:8010
But when I'm trying to see it in browser I get just error - This page isn’t working.
So, in general, how can I dockerize my Nuxt.js application and make it work on my machine?

Your app binds to 127.0.0.1 which means that it'll only accept connections from inside the container. By reading the docs, it seems you can set the HOST environment variable to the binding address you want. Try this, which sets it to 0.0.0.0 which means that the app accepts connections from everywhere
FROM node
ENV HOST=0.0.0.0
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 8010
CMD [ "npm", "start" ]
When running it, you should see READY Server listening on http://0.0.0.0:8010 rather than READY Server listening on http://127.0.0.1:8010

Related

Docker container exits right away, but not when using the Docker desktop application to run the command

I am creating a console-based app in Node JS. No ports are being used... It's just a basic app. The problem I am having is using Docker to run my app.
Here's my docker file:
FROM node:16
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
CMD [ "node", "index.js" ]
After building the image, I try to run 'docker run ' and the container just exits right away. However, when i use the Docker desktop app, after building the image, if I click 'run' it builds the container and does not exit, but actually runs. When I log into that container, I am able to run 'node index.js' and my node app runs fine.
My question is, why does it work when using the GUI docker run and not my command?
Also, why do I have to run 'node index.js' manually when the docker file should take care of that?
Commands to build image and run the container:
Image build:
docker build -t 'appname' .
Create container:
docker run 'appname'

Running the server in Local Machine without showing cmd the window

I' ve created my node.js app with express, now i want to upload it on my local server machine.
I've created a bat file (I will use task planner to run this) that basically move to folder app and launch "npm run start".
The question is: There's a more correct way to this? (no cloud) and is it possible to hide the cmd window?
Putting a node.js application to production can be done with pm2. Pm2 will spin up your application and keep it alive, without having any terminal/cmd open.
Simply install pm2 globally on your machine:
$ npm install pm2 -g
Then launch your application with pm2:
$ pm2 start app.js
There are some configurations you could do, so I suggest you look at their repo

Running nuxt js application in Docker

I'm trying to run nuxt application in docker container. In order to do so, I created the following Dockerfile:
FROM node:6.10.2
RUN mkdir -p /app
EXPOSE 3000
COPY . /app
WORKDIR /app
RUN npm install
RUN npm run build
CMD [ "npm", "start" ]
However, when I build the image and run the container (docker run -p 3000:3000 <image-id>) I get nothing while hitting localhost:3000 in my browser. What could be the cause?
The application inside Docker container by default is accepting network traffic onhttp://127.0.0.1:3000. This interface does not accept external traffic so no wonder that it does not work. In order to make it work we need to set HOST environmental variable for nuxt app to 0.0.0.0 (all ip addresses). We can do this either in Dockerfile, like this:
FROM node:6.10.2
ENV HOST 0.0.0.0
# rest of the file
or in package.json in the script's "start" command:
"scripts": { "start": "HOST=0.0.0.0 nuxt start" ...}
Or any other way that will make the nuxt application to listen elsewhere than on localhost inside container only.

What is difference between node and nodemon?

in my package.json I am using
"scripts": {
"start": "node app.js"
},
but if I use nodemon replace with node app.js like
"scripts": {
"start": "nodemon app.js"
},
then what will happen? Because when I got any error at server side, other API also close working. So I think it happen because I use node app.js if I use nodemon app.js than server will restart or not.
When you develop a node app and you make some changes, to see them in effect you have to restart the server.
When you launch your node.js application with Nodemon it will monitor for any changes and automatically restart the server, improving your productivity.
Nodemon is a utility that will monitor for any changes in your source and automatically restart your server. Perfect for development. Install it using npm.
npm install -g nodemon
How to use nodemon?
nodemon "filename" ignore the quotation and place name of the server file.
Nodemon:
monitors for any changes in your Node.js application
automatically restarts the server,
saving time and tedious work.
it's one way to make your development efficient with Opn:
Opn is a dependency that opens web browser links, files, and executables. We will be using Opn to automatically open a web browser to our local host every time our server restarts.Install with npm
npm install opn.
How to use node?
node "filename" ignore the quotation and place the filename (ex app.js ,server.js)
node:
no automatic restart the server every time you do the tedious work
no monitors for any change
nodemon is like a live-server for your node application. any changes made in your node application will get reflected as server will restart again.
as stated here :
nodemon will watch the files in the directory in which nodemon was
started, and if any files change, nodemon will automatically restart
your node application.
nodemon is a tool that helps develop node.js based applications by automatically restarting the node application when file changes in the directory are detected.
To use nodemon, replace the word node on the command line when executing your script.
In terminal,instead of typing node app.js,you can type: npm start
In package.json file,you can change it to:
"scripts": {
"start": "nodemon app.js"
},
In short,it is like a live server for node js, like we have in HTML & CSS.
When you are using node you have to restart on your own to see the changes you made But nodemon watches the particular path for any changes.If you make any changes in your file, nodemon will restart it for you.
when we install node, we will get automatically node and npm global variable.
for using nodemon you need to install it
npm install -g nodemon
we can access files with node as well but each time when we do changes we need to stop server and restart it.
node "filename" // provide filename
but if we accessing file with nodemon you no need to stop server and restart it only one line of command will save restart server time
nodemon "filename" // provide filename
this one line helps you saving lot of development time and test your sample javascript code
Nodemon stands for Node Monitor.
When you run a server using the command node index.js, after every change in your code you have to again run the node index.js command and reload the page to see the changes. Nodemon solves this problem for you. It auto-updates the server for you.

How to run sails in watch mode(during development)

I started my new project in sails(express on nodejs). I am currently starting my server using command
sails lift
But whenever I make changes, I need to restart my server. How do I start my server such a way any changes during development are automatically reflected on my localhost website?
Previously I created webserver using mean.io and starting server with command
grunt
used to start server in watch mode.
There is a hook for that for sails >= 0.11:
npm install sails-hook-autoreload
Here is how to configure it:
// [your-sails-app]/config/autoreload.js
module.exports.autoreload = {
active: true,
usePolling: false,
dirs: [
"api/models",
"api/controllers",
"api/services"
]
};
Models, controllers or services will be reloaded without having to relift the app
Alternatively, you could use Forever to start your app.
// In a terminal, from the root directory of your project
forever -w -o log/out.log -e log/err.log app.js
The -w option restarts the app on file changes. You can use a .foreverignore file to exclude some paths:
// [your-sails-app]/.foreverignore
**/.tmp/**
**/views/**
**/assets/**
**/log/**
With this solution, the app will be completely stopped and restarted but you can use it with any version of sails and there is not this limitation from the sails-hook-autoreload documentation:
As for now, it's not possible to add new directories to be reloaded.

Categories

Resources