Convert SQL Scripts to Indexes Instantly with This Simple Web Tool! 🚀

2 min readJan 6, 2025

If you’ve ever found yourself needing to transform SQL query outputs into CREATE INDEX statements, this lightweight web tool is just what you need! 🚀 Built using HTML, CSS, and JavaScript, it simplifies the process of converting complex SQL JSON outputs into usable Couchbase index creation scripts.

Why This Tool?

When working with Couchbase or similar NoSQL databases, converting raw SQL outputs into CREATE INDEX statements manually can be tedious and error-prone. This web-based solution offers:

• Ease of Use: Simply paste your JSON-formatted SQL output, and click “Convert.”

• Clean Design: A modern, split-screen interface with an input panel on the left and an output preview on the right.

Instant Results: Converts JSON data into index creation scripts in milliseconds.
How It Works
1. Paste your JSON SQL output into the input box on the left.
2. Click the “Convert” button in the top-right corner.
3. View the generated CREATE INDEX statements instantly on the right.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>SQL to Index Converter</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      display: flex;
      height: 100vh;
      font-family: 'Arial', sans-serif;
      background-color: #f4f4f9;
    }
    #left, #right {
      flex: 1;
      padding: 20px;
    }
    #left {
      border-right: 2px solid #dcdcdc;
    }
    h2 {
      margin-bottom: 10px;
      color: #333;
      font-size: 22px;
    }
    #scriptInput {
      width: 100%;
      height: 85%;
      font-size: 16px;
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 5px;
      background-color: #fff;
    }
    #output {
      background-color: #ffffff;
      height: 85%;
      overflow-y: auto;
      border: 1px solid #ccc;
      padding: 10px;
      border-radius: 5px;
    }
    #convertButton {
      position: absolute;
      top: 20px;
      right: 20px;
      padding: 10px 20px;
      background-color: #007bff;
      color: white;
      border: none;
      border-radius: 5px;
      font-size: 16px;
      cursor: pointer;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transition: background-color 0.3s, transform 0.2s;
    }
    #convertButton:hover {
      background-color: #0056b3;
      transform: scale(1.05);
    }
    #convertButton:active {
      background-color: #004494;
    }
  </style>
</head>
<body>
  <button id="convertButton">Convert</button>
  <div id="left">
    <h2>SQL Script Input</h2>
    <textarea id="scriptInput" placeholder="Enter your script here..."></textarea>
  </div>
  <div id="right">
    <h2>Output</h2>
    <div id="output">The converted script will be displayed here.</div>
  </div>

  <script>
    document.getElementById('convertButton').addEventListener('click', () => {
      const input = document.getElementById('scriptInput').value;

      try {
        const parsedData = JSON.parse(input); 
        const indexes = parsedData.map(item => {
          const index = item.indexes;
          return `CREATE INDEX \`${index.name}\` ON \`${index.keyspace_id}\`(${index.index_key.join(", ")});`;
        }).join("\n");
        document.getElementById('output').innerText = indexes;
      } catch (error) {
        document.getElementById('output').innerText = 'Invalid JSON format. Please check your input.';
      }
    });
  </script>
</body>
</html>

Convert SQL Scripts to Indexes Instantly with This Simple Web Tool! 🚀

Written by İbrahim Yıldız

No responses yet