bash
bash script to dockerfile drag-n-drop converter

This drag-n-drop application will hopefully convert most bash scripts automatically to Dockerfile!
thinkmelt@protonmail.com

Feb 1, 2026 • 3 min read
Yes. Awesome!
Bash to Dockerfile Converter
Drag and drop your bash script here
Or make your own embedding. It doesn't get any better than this!
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bash to Dockerfile Converter</title>
    <style>
        #dropZone {
            width: 300px;
            height: 200px;
            border: 2px dashed #ccc;
            border-radius: 10px;
            text-align: center;
            padding: 20px;
            margin: 20px auto;
        }
        #output {
            margin: 20px;
            white-space: pre-wrap;
            border: 1px solid #ddd;
            padding: 10px;
        }
    </style>
</head>
<body>
    <div id="dropZone">Drag and drop your bash script here</div>
    <div id="output"></div>

    <script>
        // Function to handle the conversion of bash script to Dockerfile
        function convertBashToDockerfile(bashContent) {
            // Assume a basic Ubuntu base image; this can be customized
            let dockerfile = 'FROM ubuntu:latest\n';
            dockerfile += 'RUN apt-get update && apt-get install -y \\\n';

            // Extract install commands if present (e.g., apt-get install)
            const installRegex = /apt-get install -y ([\w\s-]+)/g;
            let installs = bashContent.match(installRegex);
            if (installs) {
                let packages = installs.map(cmd => cmd.replace('apt-get install -y ', '').trim()).join(' \\\n    ');
                dockerfile += `    ${packages}\n`;
            } else {
                dockerfile += '    # No packages detected; add manually if needed\n';
            }

            // Add the rest of the script as a multi-line RUN command
            dockerfile += '\nRUN ';
            const lines = bashContent.split('\n').filter(line => line.trim() && !line.startsWith('#'));
            dockerfile += lines.join(' && \\\n    ');

            // Add an entrypoint or CMD if needed; default to bash
            dockerfile += '\n\nCMD ["/bin/bash"]\n';

            return dockerfile;
        }

        // Set up drag-and-drop functionality
        const dropZone = document.getElementById('dropZone');
        const output = document.getElementById('output');

        // Prevent default drag behaviors
        ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
            dropZone.addEventListener(eventName, preventDefaults, false);
            document.body.addEventListener(eventName, preventDefaults, false);
        });

        function preventDefaults(e) {
            e.preventDefault();
            e.stopPropagation();
        }

        // Highlight drop zone on drag enter/over
        ['dragenter', 'dragover'].forEach(eventName => {
            dropZone.addEventListener(eventName, () => dropZone.style.borderColor = '#aaa', false);
        });

        ['dragleave', 'drop'].forEach(eventName => {
            dropZone.addEventListener(eventName, () => dropZone.style.borderColor = '#ccc', false);
        });

        // Handle file drop
        dropZone.addEventListener('drop', handleDrop, false);

        function handleDrop(e) {
            const dt = e.dataTransfer;
            const files = dt.files;

            if (files.length > 0) {
                const file = files[0];
                if (file.name.endsWith('.sh') || file.type === 'text/x-shellscript') {
                    const reader = new FileReader();
                    reader.onload = function(event) {
                        const bashContent = event.target.result;
                        const dockerfileContent = convertBashToDockerfile(bashContent);
                        output.textContent = dockerfileContent;
                    };
                    reader.readAsText(file);
                } else {
                    alert('Please drop a bash script file (.sh).');
                }
            }
        }
    </script>
</body>
</html>