This is short and simple guide of docker, useful for frontend developers.
Why should you use docker?
Long long back when business nee...
For further actions, you may consider blocking this person and/or reporting abuse
Oh, also you can get more bang for your buck...
if you use
or
Becasue... Size matters 😜, and so does security 🔒
You are right Derek, slimming your images is important, but then i think that is an vast agenda having your multistage bulids, and trimming your code among other things :)
Indeed. But hypothetically if you could only do one thing, utilizing
alpineordistrolessis a low hanging fruit with a huge ROI.Because, even if you do a multistage build without it you won't trim too much in comparison.
Docker Slim: Hold my beer 😅
Take a look at docker-slim - dockersl.im/
🍺held! Very cool
Confirmed! They've successfully implemented the
middle-outcompression 😆does it have node-gyp?
Earlier when I started on Docker tutorials online, I couldn't understand how different OSs make it possible to run an isolated environment without having a VM.
Later only I understood that Docker is designed for Linux and uses a kernel-level isolation feature that is built into the Linux OS. And when installing Docker in Windows or Mac, they are running Docker inside a Linux OS that is running on a VM inside that Windows/Mac computer.
I really like every Docker tutorial to include the line clearly saying that "A Container is all about filesystem/resources isolation, which is a system-level feature built-into Linux, and Docker is a tool that abstracts this feature."
So, if we want to use Docker in Windows or Mac, we will end up using VM technology at the end of the day. Is that correct?
Correct. From Wikipedia: "Docker on macOS uses a Linux virtual machine to run the containers. It is also possible to run those on Windows using Hyper-V or docker-machine."
Windows has two types of containers — Windows Server Containers and Hyper-V Isolation — in which Hyper-V is a VM. More details are here - docs.microsoft.com/en-us/virtualiz...
I understand that production servers are running on Linux machines.
--
Note: Microsoft will soon start shipping a full Linux kernel within Windows. This may change how Docker runs in Windows computers. Let's wait and see.
Why copy package.json separately?
I'll try answer with my bad english :)
It's very good question. Docker creates layers for each command COPY/ADD (and some others, you need to read documentation). In build time docker will see to the changes, if in some layer will detected change all below layers will be rebuild.
For example, assume we have like this Dockerfile:
And we will change source code very frequently, then docker will execute
npm installfor each change. It's very bad and not efficient. Because for each little change you will reinstall whole nodejs packages (and if you not using volume or cache it will take loooong time).In this case:
we will execute
npm installonly when package.json changes (some package added or removed so on).Thank you for the detailed response! Your English are perfect btw.
right on :)
Great explanation. I too had the same question.
Thank you! i was looking for this answer too
The best explanation so far. Much better than 99% of the youtubers/tutorials online ! Thanks Raimbek ! This is awesome
This is used to download the node package/dependencies your application needs.
With the help of adding node_modules folder to your DockerIgnore file, you only need to use the package.json file which gives a clear description of all the packages your node app needs inorder to run.
Still the same article without a proper solution to work with IDE feature as autocomplete.
node_modules is installed in the container and you also need to install it locally and try to not mess with it when you mount your source if you want to have the best of the 2 worlds. (Currently working on it and writing an article describing the need and the issue all developer met).
Otherwise, nice article :)
You should check out Gitpod. It builds your image together with the project within it, deploys it in the cloud and provides VS Code like browser IDE with autocomplete and so on. Also VS Code releases remote extensions which are deployed in containers. Although i'm not sure how they get files from host to container os, if they mount them then you will get the same issues.
If I understand you right, VS Code just implemented an extension so you can use vs code in the container environment. It needs the insiders build. They just announced this yesterday.
In order to solve this problem, just develop locally on your container no?
That's not possible, how can I use an IDE that way and be productive? Using Vim or other text editor is not the solution at all :)
Thank you very much for this write up! It's very easy to understand and I have been curious about docker because I see the term often.
In your example you have set up a node server. As of right now I don't need to do that because I'm focused on front end things. Do you see any reason to use docker for front end development? (I.e. simple webpages that don't require backend services)
Also, one thing that is unclear to me about docker containers is, where are the files (for example if I make
hello.txtin the container? Are those files in the docker file folder? Can I access them if I'm not using the docker container? In a docker container if I runcd ~, where does that take me? Virtual or real home?Hey Dan,
Thank you for your feedback :)
While dockers are not a necessity to develop frontend, it is advisable to do so. For example there are simple webpages, you need a server which serves it to consumers, that entire setup should be dockerized (in my opinion) so that other devs do not have to put effort in setting up their local server. It just makes development easier. Also, next part is deployment
While the config for that is little more complex, but in simple terms docker would allow you to scale it as and when needed based on traffic.
For your second question, for example you have
my-appfolder, then your folder structure is going to be like this:Then your docker file your can write
Also for your last question , Inside container, paths that you navigate, they point to virtual paths inside container.
Wow thank you! I understand now about the
COPYpart in the docker file. I had to go back up and re-read your explanation. Makes sense now.I'm certainly interested in trying these things out - but at the moment I think it will introduce a great many other things that I need to learn and I think I will wait for a bit. But your post certainly helped clear some things up in my head about what docker containers are all about.
So please correct me if I'm wrong, but I'm curious about the following:
I assume that you would also use version control for all of this, including the docker file. I also assume that the container running on the server has some kind of way to update files from version control when a commit is done on a certain branch. (I know that hooks exist for this sort of thing with GitHub but I don't have experience with this yet.)
If you have the time, I'd be interested to read more about this sort of stuff in another dev.to post. Diagrams are helpful for sure! There's a lot of moving parts for all of this technology and it's a challenge to see how things fit together.
Hey Dan,
Yes using dockerfile, you can build and share your image. There is a version control for docker images, hub.docker.com/, here you can store and share your images.
I did not understand your last question, could you please elaborate?
Thaaaaaaaaaank you! I was loking for a tutorial like this. <3
Thanks for the post 👍🏽. Not only I learnt what docker is, I also learnt how to use docker in node.js 🙂
I do more frontend at work, and I just needed a quick intro to the concepts so I can grasp what the DevOps guys are talking about. 😅
Didn't want to sit through a 2-hour tutorial, so this is exactly what I needed.
Thanks for this short-and-sweet demo!
Nice post!
Here my little contribution for front-end project with docker and bundler (also valid with few mods to help on backend/ full stack projects).
dev.to/joelbonetr/simplifying-dock...
Hope it helps :)
This is awesome, absolutely love this platform because of such information, I'm going to complicate things about and try with ASP.NET
Microsoft has really nice base images that will do this, it's a bit tricky because the sdk you need to compile is separate from the runtime you need to run it so they do a 2 pass build.
It's not bad, but I would definitely start with their examples: docs.microsoft.com/en-us/aspnet/co...
Thank you, be blessed 🙏
Very nice article
Hello Akanksha:
Great tutorial - now I have a better understanding of docker. But when I run the following command, I get - > /bin/sh: 1: mode: not found.?
ubuntu@ubuntu-VirtualBox:~/my-node-app$ sudo docker container run -p 4000:8081 hello-world
/bin/sh: 1: mode: not found
Thanks and much appreciated.
/Biju
Hi Biju,
It is hard to say what should be causing this error. Maybe you need to source /bin/sh. I maybe wrong. Do not have a lot of experience in ubuntu. Sorry :(
The first few paragraphs are wonderful, you have a knack of explaining things in simple language, keep it up. +1 from my side.
Hi, I'd like to translate this excellent tutorial to Chinese. The translated text will be published at nextfe.com
Can you give me the permission?
Yes sure, send me the link when it is published :)
Just finished translation: nextfe.com/docker-for-frontend-dev...
During translation, I noticed some possible typos:
t -> T
a very simple node.js app
Wonderful introduction, thank you
Thanks for explain each line by line of Dockerfile.
I build my react apps with webpack and point nginx to the dist folder. Would there ever be a point in using docker for a setup like this?
Is it actually effective? I just started with docker, but it just slows down my deving? Nice explaination btw :')
brief, but broad explanation.
Thank you Akanksha
Thanks for the intuitive tutorial!
Thank you for the explanation ! But i think you should change the title to "Docker for backend developers" , FrontEnd ones have nothing to do with express servers !
Really nice article 🙌
but I think you should do a part 2 with docker-compose and volumes so backend devs can use it too. 👍
Simple and straightforward.
Thank you