JavaScript Integration with Docker

Manojnagabairu
4 min readSep 7, 2022

Task 07 👨🏻💻

JavaScript Integration with Docker

Task Description 📄

⚙️ Task 7.1 -

📌 In this task you have to create a Web Application for Docker (one of the great Containerization Tool which provides the user Platform as a Service (PaaS)) by showing your own creativity and UI/UX designing skills to make the Web Portal user friendly.

📌 This app will help the user to run all the docker commands like:

👉docker images

👉docker ps

👉docker run

👉docker rm -f

👉docker exec

👉 add more if you want. (Optional)

👉 Make a blog/article/video explaining this task step by step.

Let’s move to the solution straightaway:-

So in this task , I used my RedHat Linux as the server and my windows as the client using chrome browser. So I used “httpd” to start Apache server on my RedHat Linux O.S and I also disabled the firewall so that foreign users can connect to my server.

So after this my server started.

Then after this in my server I wrote the front-end code using HTML,CSS and JavaScript in a file named “lw.html” in the directory “/var/www/html”.

And the main JavaScript responsive code is given below:-

For the code you can check my git repo. link given at the end of this task .

After this for the backend code I shifted to the “var/www/cgi-bin” directory which is the by default directory for writing “python cgi” code and then I wrote the whole backend code in file “lw.py” using “Python”.

The code is as follows:-

After this so that any non-root user can access from my server, I made changes as follows so that using the “sudo” command the non-root user can access the docker services:-

So this is all the work I did in my RedHat Linux O.S now after this I kept my server open and then went to my Windows Chrome Browser to use go to my front end page using the URL:- “http://192.168.43.48/lw.html".

I used my browser to open the front end web page saved at RedHat in “/var/www/html” and using it I fetched the output from the backend code present at RedHat in “/var/www/cgi-bin” which was which was the result of the command sent by the front end page.

The frontend of the web page looked like this:-

So I used the “input box” to get the command from the user and then sent it to the backend code so that backend can evaluate the command and give the corresponding output.

Since this is a docker service provider so I ran all the significant docker commands:-

The illustration for showing the docker images present in the server O.S using “docker images”:-

The illustration for launching a new container using “docker run” using centos image:-

The illustration for showing the docker containers present in the server O.S using “docker ps”:-

The illustration for stopping a running container using “docker stop” :-

The illustration for destroying a stopped container using “docker rm”:-

The illustration to run a new command in the docker using “docker exec”:-

So, in this way I have successfully completed my Task 7.1.

So this was all about my Task:- docker web app.

For the code check my git repo. at:-

Thanks for reading my blog😀

--

--