Back to blog

node.js express debugging inside a docker container with Webstorm

14/04/2020 - Posted in knowledge , programming , Software , tutorial Posted by:

Tags: , , , , ,

reading time: 3 minutes

If you don’t care how I came to write this post and you only care about the meat in the title then scoll down to “setting up the Webstorm project“. Beware that this info was written in the midst of virulent ragnarök and the information might be stale.

wasting time on the old internet

Recently I have found some love for Javascript after realizing that it had evolved from a nightmare to something actually useful. Long gone are the days when its’ only purpose was to make the web more flashy. “Now” (talk about being late to the party) that there is node.js and therefore serverside JS and quite impressive performance, JS has intrigued me. In theory it is possible to write the everything from client to server in the same language which means that code maintenance becomes easier. Heck what do I know, I write code almost exclusively for research and I am a good enough programmer to know that I am not good.

For a research project I am playing around with containerizing a framework for easy deployment. Being a good researcher I set up all the dockerfiles and everything works beautifully. However, I noticed that debugging is quite cumbersome and rebuilding as well as restarting the whole (distributed) system I am working on is annoying. So I wrote myself some shell scripts to automate all the building, stopping and starting of containers away. Nonetheless, this is cumbersome so I thought I set up my IDE (Webstorm) to do these tasks for me. I found a tutorial that looks exactly what I want. “Debugging Node apps in Docker containers through WebStorm” goes through setting up dockerfiles, debugging, etc. and I happily tagged along. Everything worked out — except — the last step where I should connect my debugger to the container port. I could not find the options of Webstorm mentioned by the author. It turns out the internet became old; or rather its’ content became stale. Webstorm became better and also got rid of the functions mentioned in the tutorial. After some looking around I found a small step-by-step explanation by Jetbrains themselves. I probably should have looked at the source from the beginning and avoided wasting time. So I want to provide you with the new new (go and watch Scott Pilgrim now! )way of debugging node.js code inside a docker container in Webstorm.

setting up the Webstorm project

If you are new to Webstorm then you should head over to the original source at Jetbrains as it is a lot more detailed with pretty GIFs to show you exactly how it works. You should check it out in any case if you read this years after I published the following steps. Things might have changed and I don’t want to waste your time as mine was wasted before finding the current solution below.

  1. Setup your node express project
  2. Run the project to make sure that the basics work
  3. In the global Webstorm settings add a docker server (assuming you installed it on your system)
  4. Connect to your docker server to check that this works
  5. Edit your (run/debug) configuration and add a remote node.js interpreter of type docker
  6. Webstorm complains that some settings are missing and we can tell it to auto configure by checking the checkbox — make sure that the automatically filled in infos make sense (This means that the correct source files are being mapped as a volume and that the port mapping is setup so you can actually connect to your container)
  7. Run your project to make sure your docker server works and you can build images (be patient with this step — it might take some time
  8. If it is running successfully connect to your express app through your browser or the Webstorm REST client
  9. Be happy

I hope I could make the internet a little younger again or at least add a drop of up-to-date information to the sea of stale and broken tutorials.

Leave a Reply

Your email address will not be published. Required fields are marked *