GUI for running Docker Commands with Python CGI and AJAX

Recently, I've written a blog on how Javascript is used being used in the industry and how it is changing the Web-development. But in that article, I've forgotten to mention one of the most used features of Javascript, which is AJAX.

What is AJAX?

AJAX stands for Asynchronous JavaScript and XML. AJAX is a new technique for creating better, faster, and more interactive web applications with the help of XML, HTML, CSS, and Java Script.

Ajax uses XHTML for content, CSS for presentation, along with Document Object Model and JavaScript for dynamic content display.
Conventional web applications transmit information to and from the sever using synchronous requests. It means you fill out a form, hit submit, and get directed to a new page with new information from the server.
With AJAX, when you hit submit, JavaScript will make a request to the server, interpret the results, and update the current screen. In the purest sense, the user would never know that anything was even transmitted to the server.
XML is commonly used as the format for receiving server data, although any format, including plain text, can be used.
AJAX is a web browser technology independent of web server software.
A user can continue to use the application while the client program requests information from the server in the background.
Intuitive and natural user interaction. Clicking is not required, mouse movement is a sufficient event trigger.
Data-driven as opposed to page-driven.

What is Python CGI?

Python CGI stands for Common Gateway Interface. An HTTP server invokes a Python CGI script so it can process user input that a user may submit through an HTML

or element. Such a script usually lives in the server’s special cgi-bin directory.

For a request, the server places information about it- the client’s hostname, the requested URL, the query string, and other information- in the script’s shell environment. It executes this script and sends the output back to the client. The input for this script connects to the client, and the server sometimes reads the form data this way.

Other times, it passes form data through a query string, which is a part of the URL. A query string holds data that doesn’t conventionally fit a hierarchical path structure.

Python CGI module handles situations and helps debug scripts. The latest addition, also lends us support for uploading files from a form.

What is Docker?

Docker is an open-source containerization platform. Docker enables developers to package applications into containers—standardized executable components that combine application source code with all the operating system (OS) libraries and dependencies required to run the code in any environment.

While developers can create containers without Docker, Docker makes it easier, simpler, and safer to build, deploy, and manage containers. It’s essentially a toolkit that enables developers to build, deploy, run, update, and stop containers using simple commands and work-saving automation.

Docker GUI.

So I've created an HTML page that will take the input from the user, then from the input, we use DOM (Document Object Model) to store the value in the Javascript variable, after which by using AJAX we send the value to the python CGI program of the same server which will execute the commands and give the output.

Then with AJAX only we will show the output into the screen with the help of a modal, without loading the screen.