{"id":497,"date":"2024-09-10T17:56:45","date_gmt":"2024-09-10T21:56:45","guid":{"rendered":"https:\/\/utkarshchoudhary.com\/?page_id=497"},"modified":"2024-09-10T18:04:42","modified_gmt":"2024-09-10T22:04:42","slug":"openapi-spec-generator","status":"publish","type":"page","link":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/","title":{"rendered":"OpenAPI Spec Generator Tool"},"content":{"rendered":"\n

Boost your API development process with our intuitive OpenAPI Spec creator tool, tailored to seamlessly generate OpenAPI specifications compliant with version 3.0 schema. This user-friendly platform guides you through defining API structures, endpoints, parameters, and responses, ensuring your documentation meets industry standards. Whether you’re an experienced API developer or a beginner, our tool simplifies the creation of precise, professional, and comprehensive API documentation, helping you save time and enhance efficiency.<\/p>\n\n\n\n\n\n\n\n \n \n OpenAPI Spec (version 3.0) Generator Tool<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n line-height: 1.6;\n color: #333;\n max-width: 1000px;\n margin: 0 auto;\n padding: 20px;\n }\n\n h1,\n h2,\n h3,\n h4 {\n color: #2c3e50;\n }\n\n h1 {\n text-align: center;\n }\n\n .container {\n background-color: #f9f9f9;\n border-radius: 5px;\n padding: 20px;\n margin-bottom: 20px;\n }\n\n label {\n display: block;\n margin-bottom: 5px;\n font-weight: bold;\n }\n\n input[type=\"text\"],\n input[type=\"url\"],\n textarea,\n select {\n width: 100%;\n padding: 8px;\n margin-bottom: 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n }\n\n button {\n background-color: #3498db;\n color: white;\n border: none;\n padding: 10px 15px;\n border-radius: 4px;\n cursor: pointer;\n margin-right: 5px;\n }\n\n button:hover {\n background-color: #2980b9;\n }\n\n .add-button {\n background-color: #2ecc71;\n }\n\n .add-button:hover {\n background-color: #27ae60;\n }\n\n .remove-button {\n background-color: #e74c3c;\n }\n\n .remove-button:hover {\n background-color: #c0392b;\n }\n\n .helper-text {\n font-size: 0.9em;\n color: #7f8c8d;\n margin-bottom: 10px;\n }\n\n .field-group {\n margin-bottom: 15px;\n border: 1px solid #ddd;\n padding: 10px;\n border-radius: 4px;\n }\n\n .nested-group {\n margin-left: 20px;\n border-left: 2px solid #3498db;\n padding-left: 10px;\n }\n <\/style>\n<\/head>\n\n<body>\n <h1>\n OpenAPI Spec (version 3.0) Generator Tool\n <\/h1>\n\n <div class=\"container\">\n <h2>Basic Information<\/h2>\n <p class=\"helper-text\">Fill in the basic details about your API here.<\/p>\n <label for=\"apiTitle\">API Title:<\/label>\n <input type=\"text\" id=\"apiTitle\" placeholder=\"e.g., My Awesome API\">\n\n <label for=\"apiDescription\">API Description:<\/label>\n <textarea id=\"apiDescription\" rows=\"3\" placeholder=\"Brief description of your API\"><\/textarea>\n\n <label for=\"apiVersion\">API Version:<\/label>\n <input type=\"text\" id=\"apiVersion\" placeholder=\"e.g., 1.0.0\">\n\n <label for=\"termsOfService\">Terms of Service URL:<\/label>\n <input type=\"url\" id=\"termsOfService\" placeholder=\"e.g., http:\/\/example.com\/terms\/\">\n\n <h3>Contact Information<\/h3>\n <label for=\"contactName\">Name:<\/label>\n <input type=\"text\" id=\"contactName\" placeholder=\"Contact name\">\n\n <label for=\"contactEmail\">Email:<\/label>\n <input type=\"email\" id=\"contactEmail\" placeholder=\"contact@example.com\">\n\n <label for=\"contactUrl\">URL:<\/label>\n <input type=\"url\" id=\"contactUrl\" placeholder=\"http:\/\/example.com\/contact\">\n\n <h3>License Information<\/h3>\n <label for=\"licenseName\">Name:<\/label>\n <input type=\"text\" id=\"licenseName\" placeholder=\"e.g., Apache 2.0\">\n\n <label for=\"licenseUrl\">URL:<\/label>\n <input type=\"url\" id=\"licenseUrl\" placeholder=\"http:\/\/www.apache.org\/licenses\/LICENSE-2.0.html\">\n\n <h3>External Documentation<\/h3>\n <label for=\"externalDocsDescription\">Description:<\/label>\n <input type=\"text\" id=\"externalDocsDescription\" placeholder=\"e.g., Find out more about our API\">\n\n <label for=\"externalDocsUrl\">URL:<\/label>\n <input type=\"url\" id=\"externalDocsUrl\" placeholder=\"https:\/\/example.com\/docs\">\n <\/div>\n <div class=\"container\">\n <h2>Server Information<\/h2>\n <p class=\"helper-text\">Add one or more server URLs for your API. Use (+) to add and (-) to remove.<\/p>\n <div id=\"serverUrls\">\n <div class=\"field-group\" id=\"serverGroup1\">\n <label for=\"serverUrl1\">Server URL 1:<\/label>\n <input type=\"url\" id=\"serverUrl1\" placeholder=\"e.g., https:\/\/api.example.com\/v1\">\n <label for=\"serverDescription1\">Description:<\/label>\n <input type=\"text\" id=\"serverDescription1\" placeholder=\"e.g., Production server\">\n <button class=\"remove-button\" onclick=\"removeServerUrl(1)\" style=\"display:none;\">– Remove<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addServerUrl()\">+ Add Server URL<\/button>\n <\/div>\n\n <div class=\"container\">\n <h2>Tags<\/h2>\n <p class=\"helper-text\">Define tags to group operations. Use (+) to add and (-) to remove.<\/p>\n <div id=\"tags\">\n <div class=\"field-group\" id=\"tagGroup1\">\n <label for=\"tagName1\">Tag Name:<\/label>\n <input type=\"text\" id=\"tagName1\" placeholder=\"e.g., user\">\n <label for=\"tagDescription1\">Description:<\/label>\n <input type=\"text\" id=\"tagDescription1\" placeholder=\"e.g., User operations\">\n <label for=\"tagExternalDocsDescription1\">External Docs Description:<\/label>\n <input type=\"text\" id=\"tagExternalDocsDescription1\" placeholder=\"e.g., Find out more\">\n <label for=\"tagExternalDocsUrl1\">External Docs URL:<\/label>\n <input type=\"url\" id=\"tagExternalDocsUrl1\" placeholder=\"https:\/\/example.com\/docs\/user\">\n <button class=\"remove-button\" onclick=\"removeTag(1)\" style=\"display:none;\">– Remove Tag<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addTag()\">+ Add Tag<\/button>\n <\/div>\n\n <div class=\"container\">\n <h2>Paths and Operations<\/h2>\n <p class=\"helper-text\">Define the endpoints of your API. Use (+) to add and (-) to remove.<\/p>\n <div id=\"paths\">\n <div class=\"field-group\" id=\"pathGroup1\">\n <label for=\"path1\">Path:<\/label>\n <input type=\"text\" id=\"path1\" placeholder=\"e.g., \/users\">\n\n <div id=\"operations1\">\n <div class=\"nested-group\" id=\"operationGroup1_1\">\n <label for=\"method1_1\">HTTP Method:<\/label>\n <select id=\"method1_1\">\n <option value=\"get\">GET<\/option>\n <option value=\"post\">POST<\/option>\n <option value=\"put\">PUT<\/option>\n <option value=\"delete\">DELETE<\/option>\n <option value=\"patch\">PATCH<\/option>\n <\/select>\n\n <label for=\"operationId1_1\">Operation ID:<\/label>\n <input type=\"text\" id=\"operationId1_1\" placeholder=\"e.g., getUsers\">\n\n <label for=\"summary1_1\">Summary:<\/label>\n <input type=\"text\" id=\"summary1_1\" placeholder=\"Brief summary of this operation\">\n\n <label for=\"description1_1\">Description:<\/label>\n <textarea id=\"description1_1\" rows=\"2\"\n placeholder=\"Detailed description of this operation\"><\/textarea>\n\n <label for=\"tags1_1\">Tags (comma-separated):<\/label>\n <input type=\"text\" id=\"tags1_1\" placeholder=\"e.g., user, list\">\n\n <h4>Parameters<\/h4>\n <div id=\"parameters1_1\">\n <div class=\"nested-group\" id=\"paramGroup1_1_1\">\n <label for=\"paramName1_1_1\">Name:<\/label>\n <input type=\"text\" id=\"paramName1_1_1\" placeholder=\"e.g., id\">\n\n <label for=\"paramIn1_1_1\">In:<\/label>\n <select id=\"paramIn1_1_1\">\n <option value=\"query\">Query<\/option>\n <option value=\"path\">Path<\/option>\n <option value=\"header\">Header<\/option>\n <option value=\"cookie\">Cookie<\/option>\n <\/select>\n\n <label for=\"paramDescription1_1_1\">Description:<\/label>\n <input type=\"text\" id=\"paramDescription1_1_1\"\n placeholder=\"Description of the parameter\">\n\n <label for=\"paramRequired1_1_1\">Required:<\/label>\n <select id=\"paramRequired1_1_1\">\n <option value=\"true\">Yes<\/option>\n <option value=\"false\">No<\/option>\n <\/select>\n\n <label for=\"paramType1_1_1\">Type:<\/label>\n <select id=\"paramType1_1_1\">\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"object\">Object<\/option>\n <\/select>\n\n <label for=\"paramEnum1_1_1\">Enum (comma-separated):<\/label>\n <input type=\"text\" id=\"paramEnum1_1_1\" placeholder=\"e.g., value1,value2,value3\">\n\n <label for=\"paramMinimum1_1_1\">Minimum:<\/label>\n <input type=\"number\" id=\"paramMinimum1_1_1\" placeholder=\"e.g., 1\">\n\n <label for=\"paramMaximum1_1_1\">Maximum:<\/label>\n <input type=\"number\" id=\"paramMaximum1_1_1\" placeholder=\"e.g., 100\">\n\n <label for=\"paramPattern1_1_1\">Pattern:<\/label>\n <input type=\"text\" id=\"paramPattern1_1_1\" placeholder=\"e.g., ^[a-zA-Z0-9]+$\">\n\n <button class=\"remove-button\" onclick=\"removeParameter(1, 1, 1)\" style=\"display:none;\">–\n Remove Parameter<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addParameter(1, 1)\">+ Add Parameter<\/button>\n <h4>Request Body<\/h4>\n <div id=\"requestBody1_1\">\n <label for=\"requestBodyDescription1_1\">Description:<\/label>\n <input type=\"text\" id=\"requestBodyDescription1_1\"\n placeholder=\"Description of the request body\">\n\n <label for=\"requestBodyRequired1_1\">Required:<\/label>\n <select id=\"requestBodyRequired1_1\">\n <option value=\"true\">Yes<\/option>\n <option value=\"false\">No<\/option>\n <\/select>\n\n <div id=\"requestBodyContent1_1\">\n <div class=\"nested-group\" id=\"requestBodyContentType1_1_1\">\n <label for=\"requestBodyContentType1_1_1\">Content Type:<\/label>\n <input type=\"text\" id=\"requestBodyContentType1_1_1\"\n placeholder=\"e.g., application\/json\">\n\n <label for=\"requestBodySchema1_1_1\">Schema Reference:<\/label>\n <input type=\"text\" id=\"requestBodySchema1_1_1\"\n placeholder=\"e.g., #\/components\/schemas\/User\">\n\n <label for=\"requestBodyExample1_1_1\">Example:<\/label>\n <textarea id=\"requestBodyExample1_1_1\" rows=\"3\"\n placeholder=\"Provide an example of the request body\"><\/textarea>\n\n <button class=\"remove-button\" onclick=\"removeRequestBodyContent(1, 1, 1)\"\n style=\"display:none;\">– Remove Content Type<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addRequestBodyContent(1, 1)\">+ Add Content Type<\/button>\n <\/div>\n\n <h4>Responses<\/h4>\n <div id=\"responses1_1\">\n <div class=\"nested-group\" id=\"responseGroup1_1_200\">\n <label for=\"responseCode1_1_200\">Status Code:<\/label>\n <input type=\"text\" id=\"responseCode1_1_200\" value=\"200\" readonly>\n\n <label for=\"responseDescription1_1_200\">Description:<\/label>\n <input type=\"text\" id=\"responseDescription1_1_200\"\n placeholder=\"e.g., Successful response\">\n\n <div id=\"responseContent1_1_200\">\n <div class=\"nested-group\" id=\"responseContentType1_1_200_1\">\n <label for=\"responseContentType1_1_200_1\">Content Type:<\/label>\n <input type=\"text\" id=\"responseContentType1_1_200_1\" value=\"application\/json\"\n placeholder=\"e.g., application\/json\">\n\n <label for=\"responseSchema1_1_200_1\">Schema Reference:<\/label>\n <input type=\"text\" id=\"responseSchema1_1_200_1\"\n placeholder=\"e.g., #\/components\/schemas\/User\">\n\n <label for=\"responseExample1_1_200_1\">Example:<\/label>\n <textarea id=\"responseExample1_1_200_1\" rows=\"3\"\n placeholder=\"Provide an example of the response\"><\/textarea>\n\n <button class=\"remove-button\" onclick=\"removeResponseContent(1, 1, 200, 1)\"\n style=\"display:none;\">– Remove Content Type<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addResponseContent(1, 1, 200)\">+ Add Content\n Type<\/button>\n\n <label for=\"responseHeaders1_1_200\">Headers (comma-separated):<\/label>\n <input type=\"text\" id=\"responseHeaders1_1_200\"\n placeholder=\"e.g., X-Rate-Limit,X-Expires-After\">\n\n <button class=\"remove-button\" onclick=\"removeResponse(1, 1, 200)\"\n style=\"display:none;\">– Remove Response<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addResponse(1, 1)\">+ Add Response<\/button>\n\n <h4>Security<\/h4>\n <div id=\"security1_1\">\n <div class=\"nested-group\" id=\"securityRequirement1_1_1\">\n <label for=\"securityScheme1_1_1\">Security Scheme:<\/label>\n <input type=\"text\" id=\"securityScheme1_1_1\" placeholder=\"e.g., api_key\">\n\n <label for=\"securityScopes1_1_1\">Scopes (comma-separated):<\/label>\n <input type=\"text\" id=\"securityScopes1_1_1\" placeholder=\"e.g., read:users,write:users\">\n\n <button class=\"remove-button\" onclick=\"removeSecurityRequirement(1, 1, 1)\"\n style=\"display:none;\">– Remove Security Requirement<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addSecurityRequirement(1, 1)\">+ Add Security\n Requirement<\/button>\n\n <button class=\"remove-button\" onclick=\"removeOperation(1, 1)\" style=\"display:none;\">– Remove\n Operation<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addOperation(1)\">+ Add Operation<\/button>\n\n <button class=\"remove-button\" onclick=\"removePath(1)\" style=\"display:none;\">– Remove Path<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addPath()\">+ Add Path<\/button>\n <\/div>\n <div class=\"container\">\n <h2>Components<\/h2>\n <h3>Schemas<\/h3>\n <div id=\"schemas\">\n <div class=\"field-group\" id=\"schemaGroup1\">\n <label for=\"schemaName1\">Schema Name:<\/label>\n <input type=\"text\" id=\"schemaName1\" placeholder=\"e.g., User\">\n\n <label for=\"schemaType1\">Type:<\/label>\n <select id=\"schemaType1\">\n <option value=\"object\">Object<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <\/select>\n\n <div id=\"schemaProperties1\">\n <div class=\"nested-group\" id=\"propertyGroup1_1\">\n <label for=\"propertyName1_1\">Property Name:<\/label>\n <input type=\"text\" id=\"propertyName1_1\" placeholder=\"e.g., id\">\n\n <label for=\"propertyType1_1\">Type:<\/label>\n <select id=\"propertyType1_1\">\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"object\">Object<\/option>\n <\/select>\n\n <label for=\"propertyFormat1_1\">Format (optional):<\/label>\n <input type=\"text\" id=\"propertyFormat1_1\" placeholder=\"e.g., date-time, int64\">\n\n <label for=\"propertyDescription1_1\">Description:<\/label>\n <input type=\"text\" id=\"propertyDescription1_1\" placeholder=\"Property description\">\n\n <label for=\"propertyExample1_1\">Example:<\/label>\n <input type=\"text\" id=\"propertyExample1_1\" placeholder=\"Example value\">\n\n <label for=\"propertyMinimum1_1\">Minimum:<\/label>\n <input type=\"number\" id=\"propertyMinimum1_1\" placeholder=\"e.g., 1\">\n\n <label for=\"propertyMaximum1_1\">Maximum:<\/label>\n <input type=\"number\" id=\"propertyMaximum1_1\" placeholder=\"e.g., 100\">\n\n <label for=\"propertyPattern1_1\">Pattern:<\/label>\n <input type=\"text\" id=\"propertyPattern1_1\" placeholder=\"e.g., ^[a-zA-Z0-9]+$\">\n\n <label for=\"propertyEnum1_1\">Enum (comma-separated):<\/label>\n <input type=\"text\" id=\"propertyEnum1_1\" placeholder=\"e.g., value1,value2,value3\">\n\n <h4>XML<\/h4>\n <label for=\"propertyXmlName1_1\">XML Name:<\/label>\n <input type=\"text\" id=\"propertyXmlName1_1\" placeholder=\"e.g., user\">\n\n <label for=\"propertyXmlNamespace1_1\">XML Namespace:<\/label>\n <input type=\"text\" id=\"propertyXmlNamespace1_1\" placeholder=\"e.g., http:\/\/example.com\/schema\">\n\n <label for=\"propertyXmlPrefix1_1\">XML Prefix:<\/label>\n <input type=\"text\" id=\"propertyXmlPrefix1_1\" placeholder=\"e.g., xmp\">\n\n <label for=\"propertyXmlAttribute1_1\">XML Attribute:<\/label>\n <input type=\"checkbox\" id=\"propertyXmlAttribute1_1\">\n\n <label for=\"propertyXmlWrapped1_1\">XML Wrapped:<\/label>\n <input type=\"checkbox\" id=\"propertyXmlWrapped1_1\">\n\n <button class=\"remove-button\" onclick=\"removeProperty(1, 1)\" style=\"display:none;\">– Remove\n Property<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addProperty(1)\">+ Add Property<\/button>\n\n <label for=\"requiredProperties1\">Required Properties (comma-separated):<\/label>\n <input type=\"text\" id=\"requiredProperties1\" placeholder=\"e.g., id,name\">\n\n <button class=\"remove-button\" onclick=\"removeSchema(1)\" style=\"display:none;\">– Remove Schema<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addSchema()\">+ Add Schema<\/button>\n <\/div>\n\n <div class=\"container\">\n <h2>Security Schemes<\/h2>\n <div id=\"securitySchemes\">\n <div class=\"field-group\" id=\"securitySchemeGroup1\">\n <label for=\"securitySchemeName1\">Name:<\/label>\n <input type=\"text\" id=\"securitySchemeName1\" placeholder=\"e.g., api_key\">\n\n <label for=\"securitySchemeType1\">Type:<\/label>\n <select id=\"securitySchemeType1\" onchange=\"toggleSecuritySchemeFields(1)\">\n <option value=\"apiKey\">API Key<\/option>\n <option value=\"http\">HTTP<\/option>\n <option value=\"oauth2\">OAuth2<\/option>\n <option value=\"openIdConnect\">OpenID Connect<\/option>\n <\/select>\n\n <div id=\"apiKeyFields1\" style=\"display:none;\">\n <label for=\"apiKeyName1\">Key Name:<\/label>\n <input type=\"text\" id=\"apiKeyName1\" placeholder=\"e.g., X-API-Key\">\n\n <label for=\"apiKeyIn1\">In:<\/label>\n <select id=\"apiKeyIn1\">\n <option value=\"header\">Header<\/option>\n <option value=\"query\">Query<\/option>\n <option value=\"cookie\">Cookie<\/option>\n <\/select>\n <\/div>\n\n <div id=\"httpFields1\" style=\"display:none;\">\n <label for=\"httpScheme1\">Scheme:<\/label>\n <input type=\"text\" id=\"httpScheme1\" placeholder=\"e.g., bearer\">\n <\/div>\n\n <div id=\"oauth2Fields1\" style=\"display:none;\">\n <label for=\"oauth2Flow1\">Flow:<\/label>\n <select id=\"oauth2Flow1\">\n <option value=\"implicit\">Implicit<\/option>\n <option value=\"password\">Password<\/option>\n <option value=\"clientCredentials\">Client Credentials<\/option>\n <option value=\"authorizationCode\">Authorization Code<\/option>\n <\/select>\n\n <label for=\"oauth2AuthorizationUrl1\">Authorization URL:<\/label>\n <input type=\"url\" id=\"oauth2AuthorizationUrl1\" placeholder=\"https:\/\/example.com\/oauth\/authorize\">\n\n <label for=\"oauth2TokenUrl1\">Token URL:<\/label>\n <input type=\"url\" id=\"oauth2TokenUrl1\" placeholder=\"https:\/\/example.com\/oauth\/token\">\n\n <label for=\"oauth2Scopes1\">Scopes (comma-separated):<\/label>\n <input type=\"text\" id=\"oauth2Scopes1\" placeholder=\"e.g., read:pets,write:pets\">\n <\/div>\n\n <div id=\"openIdConnectFields1\" style=\"display:none;\">\n <label for=\"openIdConnectUrl1\">OpenID Connect URL:<\/label>\n <input type=\"url\" id=\"openIdConnectUrl1\"\n placeholder=\"https:\/\/example.com\/.well-known\/openid-configuration\">\n <\/div>\n\n <button class=\"remove-button\" onclick=\"removeSecurityScheme(1)\" style=\"display:none;\">– Remove Security\n Scheme<\/button>\n <\/div>\n <\/div>\n <button class=\"add-button\" onclick=\"addSecurityScheme()\">+ Add Security Scheme<\/button>\n <\/div>\n\n <button onclick=\"generateYaml()\">Generate YAML<\/button>\n\n <script>\n let serverUrlCount = 1;\n let tagCount = 1;\n let pathCount = 1;\n let schemaCount = 1;\n let securitySchemeCount = 1;\n\n function addServerUrl() {\n serverUrlCount++;\n const serverUrls = document.getElementById('serverUrls');\n const newGroup = document.createElement('div');\n newGroup.className = 'field-group';\n newGroup.id = `serverGroup${serverUrlCount}`;\n newGroup.innerHTML = `\n <label for=\"serverUrl${serverUrlCount}\">Server URL ${serverUrlCount}:<\/label>\n <input type=\"url\" id=\"serverUrl${serverUrlCount}\" placeholder=\"e.g., https:\/\/api.example.com\/v1\">\n <label for=\"serverDescription${serverUrlCount}\">Description:<\/label>\n <input type=\"text\" id=\"serverDescription${serverUrlCount}\" placeholder=\"e.g., Production server\">\n <button class=\"remove-button\" onclick=\"removeServerUrl(${serverUrlCount})\">- Remove<\/button>\n `;\n serverUrls.appendChild(newGroup);\n document.querySelector(`#serverGroup1 .remove-button`).style.display = 'inline-block';\n }\n\n function removeServerUrl(id) {\n const serverGroup = document.getElementById(`serverGroup${id}`);\n serverGroup.remove();\n if (document.querySelectorAll('#serverUrls .field-group').length === 1) {\n document.querySelector(`#serverGroup1 .remove-button`).style.display = 'none';\n }\n }\n\n function addTag() {\n tagCount++;\n const tags = document.getElementById('tags');\n const newGroup = document.createElement('div');\n newGroup.className = 'field-group';\n newGroup.id = `tagGroup${tagCount}`;\n newGroup.innerHTML = `\n <label for=\"tagName${tagCount}\">Tag Name:<\/label>\n <input type=\"text\" id=\"tagName${tagCount}\" placeholder=\"e.g., user\">\n <label for=\"tagDescription${tagCount}\">Description:<\/label>\n <input type=\"text\" id=\"tagDescription${tagCount}\" placeholder=\"e.g., User operations\">\n <label for=\"tagExternalDocsDescription${tagCount}\">External Docs Description:<\/label>\n <input type=\"text\" id=\"tagExternalDocsDescription${tagCount}\" placeholder=\"e.g., Find out more\">\n <label for=\"tagExternalDocsUrl${tagCount}\">External Docs URL:<\/label>\n <input type=\"url\" id=\"tagExternalDocsUrl${tagCount}\" placeholder=\"https:\/\/example.com\/docs\/user\">\n <button class=\"remove-button\" onclick=\"removeTag(${tagCount})\">- Remove Tag<\/button>\n `;\n tags.appendChild(newGroup);\n document.querySelector(`#tagGroup1 .remove-button`).style.display = 'inline-block';\n }\n\n function removeTag(id) {\n const tagGroup = document.getElementById(`tagGroup${id}`);\n tagGroup.remove();\n if (document.querySelectorAll('#tags .field-group').length === 1) {\n document.querySelector(`#tagGroup1 .remove-button`).style.display = 'none';\n }\n }\n\n function addPath() {\n pathCount++;\n const paths = document.getElementById('paths');\n const newGroup = document.createElement('div');\n newGroup.className = 'field-group';\n newGroup.id = `pathGroup${pathCount}`;\n newGroup.innerHTML = `\n <label for=\"path${pathCount}\">Path:<\/label>\n <input type=\"text\" id=\"path${pathCount}\" placeholder=\"e.g., \/users\">\n <div id=\"operations${pathCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addOperation(${pathCount})\">+ Add Operation<\/button>\n <button class=\"remove-button\" onclick=\"removePath(${pathCount})\">- Remove Path<\/button>\n `;\n paths.appendChild(newGroup);\n addOperation(pathCount);\n document.querySelector(`#pathGroup1 .remove-button`).style.display = 'inline-block';\n }\n\n function removePath(id) {\n const pathGroup = document.getElementById(`pathGroup${id}`);\n pathGroup.remove();\n if (document.querySelectorAll('#paths .field-group').length === 1) {\n document.querySelector(`#pathGroup1 .remove-button`).style.display = 'none';\n }\n }\n\n function addOperation(pathId) {\n const operations = document.getElementById(`operations${pathId}`);\n const operationCount = operations.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `operationGroup${pathId}_${operationCount}`;\n newGroup.innerHTML = `\n <label for=\"method${pathId}_${operationCount}\">HTTP Method:<\/label>\n <select id=\"method${pathId}_${operationCount}\">\n <option value=\"get\">GET<\/option>\n <option value=\"post\">POST<\/option>\n <option value=\"put\">PUT<\/option>\n <option value=\"delete\">DELETE<\/option>\n <option value=\"patch\">PATCH<\/option>\n <\/select>\n <label for=\"operationId${pathId}_${operationCount}\">Operation ID:<\/label>\n <input type=\"text\" id=\"operationId${pathId}_${operationCount}\" placeholder=\"e.g., getUsers\">\n <label for=\"summary${pathId}_${operationCount}\">Summary:<\/label>\n <input type=\"text\" id=\"summary${pathId}_${operationCount}\" placeholder=\"Brief summary of this operation\">\n <label for=\"description${pathId}_${operationCount}\">Description:<\/label>\n <textarea id=\"description${pathId}_${operationCount}\" rows=\"2\" placeholder=\"Detailed description of this operation\"><\/textarea>\n <label for=\"tags${pathId}_${operationCount}\">Tags (comma-separated):<\/label>\n <input type=\"text\" id=\"tags${pathId}_${operationCount}\" placeholder=\"e.g., user, list\">\n <h4>Parameters<\/h4>\n <div id=\"parameters${pathId}_${operationCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addParameter(${pathId}, ${operationCount})\">+ Add Parameter<\/button>\n <h4>Request Body<\/h4>\n <div id=\"requestBody${pathId}_${operationCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addRequestBodyContent(${pathId}, ${operationCount})\">+ Add Request Body Content<\/button>\n <h4>Responses<\/h4>\n <div id=\"responses${pathId}_${operationCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addResponse(${pathId}, ${operationCount})\">+ Add Response<\/button>\n <h4>Security<\/h4>\n <div id=\"security${pathId}_${operationCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addSecurityRequirement(${pathId}, ${operationCount})\">+ Add Security Requirement<\/button>\n <button class=\"remove-button\" onclick=\"removeOperation(${pathId}, ${operationCount})\">- Remove Operation<\/button>\n `;\n operations.appendChild(newGroup);\n addParameter(pathId, operationCount);\n addRequestBodyContent(pathId, operationCount);\n addResponse(pathId, operationCount);\n addSecurityRequirement(pathId, operationCount);\n if (operations.children.length > 1) {\n operations.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeOperation(pathId, operationId) {\n const operationGroup = document.getElementById(`operationGroup${pathId}_${operationId}`);\n operationGroup.remove();\n const operations = document.getElementById(`operations${pathId}`);\n if (operations.children.length === 1) {\n operations.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addParameter(pathId, operationId) {\n const parameters = document.getElementById(`parameters${pathId}_${operationId}`);\n const parameterCount = parameters.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `paramGroup${pathId}_${operationId}_${parameterCount}`;\n newGroup.innerHTML = `\n <label for=\"paramName${pathId}_${operationId}_${parameterCount}\">Name:<\/label>\n <input type=\"text\" id=\"paramName${pathId}_${operationId}_${parameterCount}\" placeholder=\"e.g., id\">\n <label for=\"paramIn${pathId}_${operationId}_${parameterCount}\">In:<\/label>\n <select id=\"paramIn${pathId}_${operationId}_${parameterCount}\">\n <option value=\"query\">Query<\/option>\n <option value=\"path\">Path<\/option>\n <option value=\"header\">Header<\/option>\n <option value=\"cookie\">Cookie<\/option>\n <\/select>\n <label for=\"paramDescription${pathId}_${operationId}_${parameterCount}\">Description:<\/label>\n <input type=\"text\" id=\"paramDescription${pathId}_${operationId}_${parameterCount}\" placeholder=\"Description of the parameter\">\n <label for=\"paramRequired${pathId}_${operationId}_${parameterCount}\">Required:<\/label>\n <select id=\"paramRequired${pathId}_${operationId}_${parameterCount}\">\n <option value=\"true\">Yes<\/option>\n <option value=\"false\">No<\/option>\n <\/select>\n <label for=\"paramType${pathId}_${operationId}_${parameterCount}\">Type:<\/label>\n <select id=\"paramType${pathId}_${operationId}_${parameterCount}\">\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"object\">Object<\/option>\n <\/select>\n <label for=\"paramEnum${pathId}_${operationId}_${parameterCount}\">Enum (comma-separated):<\/label>\n <input type=\"text\" id=\"paramEnum${pathId}_${operationId}_${parameterCount}\" placeholder=\"e.g., value1,value2,value3\">\n <label for=\"paramMinimum${pathId}_${operationId}_${parameterCount}\">Minimum:<\/label>\n <input type=\"number\" id=\"paramMinimum${pathId}_${operationId}_${parameterCount}\" placeholder=\"e.g., 1\">\n <label for=\"paramMaximum${pathId}_${operationId}_${parameterCount}\">Maximum:<\/label>\n <input type=\"number\" id=\"paramMaximum${pathId}_${operationId}_${parameterCount}\" placeholder=\"e.g., 100\">\n <label for=\"paramPattern${pathId}_${operationId}_${parameterCount}\">Pattern:<\/label>\n <input type=\"text\" id=\"paramPattern${pathId}_${operationId}_${parameterCount}\" placeholder=\"e.g., ^[a-zA-Z0-9]+$\">\n <button class=\"remove-button\" onclick=\"removeParameter(${pathId}, ${operationId}, ${parameterCount})\">- Remove Parameter<\/button>\n `;\n parameters.appendChild(newGroup);\n if (parameters.children.length > 1) {\n parameters.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeParameter(pathId, operationId, parameterId) {\n const paramGroup = document.getElementById(`paramGroup${pathId}_${operationId}_${parameterId}`);\n paramGroup.remove();\n const parameters = document.getElementById(`parameters${pathId}_${operationId}`);\n if (parameters.children.length === 1) {\n parameters.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addRequestBodyContent(pathId, operationId) {\n const requestBody = document.getElementById(`requestBody${pathId}_${operationId}`);\n const contentCount = requestBody.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `requestBodyContentType${pathId}_${operationId}_${contentCount}`;\n newGroup.innerHTML = `\n <label for=\"requestBodyContentType${pathId}_${operationId}_${contentCount}\">Content Type:<\/label>\n <input type=\"text\" id=\"requestBodyContentType${pathId}_${operationId}_${contentCount}\" placeholder=\"e.g., application\/json\">\n <label for=\"requestBodySchema${pathId}_${operationId}_${contentCount}\">Schema Reference:<\/label>\n <input type=\"text\" id=\"requestBodySchema${pathId}_${operationId}_${contentCount}\" placeholder=\"e.g., #\/components\/schemas\/User\">\n <label for=\"requestBodyExample${pathId}_${operationId}_${contentCount}\">Example:<\/label>\n <textarea id=\"requestBodyExample${pathId}_${operationId}_${contentCount}\" rows=\"3\" placeholder=\"Provide an example of the request body\"><\/textarea>\n <button class=\"remove-button\" onclick=\"removeRequestBodyContent(${pathId}, ${operationId}, ${contentCount})\">- Remove Content Type<\/button>\n `;\n requestBody.appendChild(newGroup);\n if (requestBody.children.length > 1) {\n requestBody.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeRequestBodyContent(pathId, operationId, contentId) {\n const contentGroup = document.getElementById(`requestBodyContentType${pathId}_${operationId}_${contentId}`);\n contentGroup.remove();\n const requestBody = document.getElementById(`requestBody${pathId}_${operationId}`);\n if (requestBody.children.length === 1) {\n requestBody.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addResponse(pathId, operationId) {\n const responses = document.getElementById(`responses${pathId}_${operationId}`);\n const responseCount = responses.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `responseGroup${pathId}_${operationId}_${responseCount}`;\n newGroup.innerHTML = `\n <label for=\"responseCode${pathId}_${operationId}_${responseCount}\">Status Code:<\/label>\n <input type=\"text\" id=\"responseCode${pathId}_${operationId}_${responseCount}\" placeholder=\"e.g., 200\">\n <label for=\"responseDescription${pathId}_${operationId}_${responseCount}\">Description:<\/label>\n <input type=\"text\" id=\"responseDescription${pathId}_${operationId}_${responseCount}\" placeholder=\"e.g., Successful response\">\n <div id=\"responseContent${pathId}_${operationId}_${responseCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addResponseContent(${pathId}, ${operationId}, ${responseCount})\">+ Add Content Type<\/button>\n <label for=\"responseHeaders${pathId}_${operationId}_${responseCount}\">Headers (comma-separated):<\/label>\n <input type=\"text\" id=\"responseHeaders${pathId}_${operationId}_${responseCount}\" placeholder=\"e.g., X-Rate-Limit,X-Expires-After\">\n <button class=\"remove-button\" onclick=\"removeResponse(${pathId}, ${operationId}, ${responseCount})\">- Remove Response<\/button>\n `;\n responses.appendChild(newGroup);\n addResponseContent(pathId, operationId, responseCount);\n if (responses.children.length > 1) {\n responses.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeResponse(pathId, operationId, responseId) {\n const responseGroup = document.getElementById(`responseGroup${pathId}_${operationId}_${responseId}`);\n responseGroup.remove();\n const responses = document.getElementById(`responses${pathId}_${operationId}`);\n if (responses.children.length === 1) {\n responses.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addResponseContent(pathId, operationId, responseId) {\n const responseContent = document.getElementById(`responseContent${pathId}_${operationId}_${responseId}`);\n const contentCount = responseContent.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `responseContentType${pathId}_${operationId}_${responseId}_${contentCount}`;\n newGroup.innerHTML = `\n <label for=\"responseContentType${pathId}_${operationId}_${responseId}_${contentCount}\">Content Type:<\/label>\n <input type=\"text\" id=\"responseContentType${pathId}_${operationId}_${responseId}_${contentCount}\" placeholder=\"e.g., application\/json\">\n <label for=\"responseSchema${pathId}_${operationId}_${responseId}_${contentCount}\">Schema Reference:<\/label>\n <input type=\"text\" id=\"responseSchema${pathId}_${operationId}_${responseId}_${contentCount}\" placeholder=\"e.g., #\/components\/schemas\/User\">\n <label for=\"responseExample${pathId}_${operationId}_${responseId}_${contentCount}\">Example:<\/label>\n <textarea id=\"responseExample${pathId}_${operationId}_${responseId}_${contentCount}\" rows=\"3\" placeholder=\"Provide an example of the response\"><\/textarea>\n <button class=\"remove-button\" onclick=\"removeResponseContent(${pathId}, ${operationId}, ${responseId}, ${contentCount})\">- Remove Content Type<\/button>\n `;\n responseContent.appendChild(newGroup);\n if (responseContent.children.length > 1) {\n responseContent.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeResponseContent(pathId, operationId, responseId, contentId) {\n const contentGroup = document.getElementById(`responseContentType${pathId}_${operationId}_${responseId}_${contentId}`);\n contentGroup.remove();\n const responseContent = document.getElementById(`responseContent${pathId}_${operationId}_${responseId}`);\n if (responseContent.children.length === 1) {\n responseContent.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addSecurityRequirement(pathId, operationId) {\n const security = document.getElementById(`security${pathId}_${operationId}`);\n const securityCount = security.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `securityRequirement${pathId}_${operationId}_${securityCount}`;\n newGroup.innerHTML = `\n <label for=\"securityScheme${pathId}_${operationId}_${securityCount}\">Security Scheme:<\/label>\n <input type=\"text\" id=\"securityScheme${pathId}_${operationId}_${securityCount}\" placeholder=\"e.g., api_key\">\n <label for=\"securityScopes${pathId}_${operationId}_${securityCount}\">Scopes (comma-separated):<\/label>\n <input type=\"text\" id=\"securityScopes${pathId}_${operationId}_${securityCount}\" placeholder=\"e.g., read:users,write:users\">\n <button class=\"remove-button\" onclick=\"removeSecurityRequirement(${pathId}, ${operationId}, ${securityCount})\">- Remove Security Requirement<\/button>\n `;\n security.appendChild(newGroup);\n if (security.children.length > 1) {\n security.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeSecurityRequirement(pathId, operationId, securityId) {\n const securityGroup = document.getElementById(`securityRequirement${pathId}_${operationId}_${securityId}`);\n securityGroup.remove();\n const security = document.getElementById(`security${pathId}_${operationId}`);\n if (security.children.length === 1) {\n security.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addSchema() {\n schemaCount++;\n const schemas = document.getElementById('schemas');\n const newGroup = document.createElement('div');\n newGroup.className = 'field-group';\n newGroup.id = `schemaGroup${schemaCount}`;\n newGroup.innerHTML = `\n <label for=\"schemaName${schemaCount}\">Schema Name:<\/label>\n <input type=\"text\" id=\"schemaName${schemaCount}\" placeholder=\"e.g., User\">\n <label for=\"schemaType${schemaCount}\">Type:<\/label>\n <select id=\"schemaType${schemaCount}\">\n <option value=\"object\">Object<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <\/select>\n <div id=\"schemaProperties${schemaCount}\"><\/div>\n <button class=\"add-button\" onclick=\"addProperty(${schemaCount})\">+ Add Property<\/button>\n <label for=\"requiredProperties${schemaCount}\">Required Properties (comma-separated):<\/label>\n <input type=\"text\" id=\"requiredProperties${schemaCount}\" placeholder=\"e.g., id,name\">\n <button class=\"remove-button\" onclick=\"removeSchema(${schemaCount})\">- Remove Schema<\/button>\n `;\n schemas.appendChild(newGroup);\n addProperty(schemaCount);\n document.querySelector(`#schemaGroup1 .remove-button`).style.display = 'inline-block';\n }\n\n function removeSchema(id) {\n const schemaGroup = document.getElementById(`schemaGroup${id}`);\n schemaGroup.remove();\n if (document.querySelectorAll('#schemas .field-group').length === 1) {\n document.querySelector(`#schemaGroup1 .remove-button`).style.display = 'none';\n }\n }\n\n function addProperty(schemaId) {\n const schemaProperties = document.getElementById(`schemaProperties${schemaId}`);\n const propertyCount = schemaProperties.children.length + 1;\n const newGroup = document.createElement('div');\n newGroup.className = 'nested-group';\n newGroup.id = `propertyGroup${schemaId}_${propertyCount}`;\n newGroup.innerHTML = `\n <label for=\"propertyName${schemaId}_${propertyCount}\">Property Name:<\/label>\n <input type=\"text\" id=\"propertyName${schemaId}_${propertyCount}\" placeholder=\"e.g., id\">\n <label for=\"propertyType${schemaId}_${propertyCount}\">Type:<\/label>\n <select id=\"propertyType${schemaId}_${propertyCount}\">\n <option value=\"string\">String<\/option>\n <option value=\"integer\">Integer<\/option>\n <option value=\"number\">Number<\/option>\n <option value=\"boolean\">Boolean<\/option>\n <option value=\"array\">Array<\/option>\n <option value=\"object\">Object<\/option>\n <\/select>\n <label for=\"propertyFormat${schemaId}_${propertyCount}\">Format (optional):<\/label>\n <input type=\"text\" id=\"propertyFormat${schemaId}_${propertyCount}\" placeholder=\"e.g., date-time, int64\">\n <label for=\"propertyDescription${schemaId}_${propertyCount}\">Description:<\/label>\n <input type=\"text\" id=\"propertyDescription${schemaId}_${propertyCount}\" placeholder=\"Property description\">\n <label for=\"propertyExample${schemaId}_${propertyCount}\">Example:<\/label>\n <input type=\"text\" id=\"propertyExample${schemaId}_${propertyCount}\" placeholder=\"Example value\">\n <label for=\"propertyMinimum${schemaId}_${propertyCount}\">Minimum:<\/label>\n <input type=\"number\" id=\"propertyMinimum${schemaId}_${propertyCount}\" placeholder=\"e.g., 1\">\n <label for=\"propertyMaximum${schemaId}_${propertyCount}\">Maximum:<\/label>\n <input type=\"number\" id=\"propertyMaximum${schemaId}_${propertyCount}\" placeholder=\"e.g., 100\">\n <label for=\"propertyPattern${schemaId}_${propertyCount}\">Pattern:<\/label>\n <input type=\"text\" id=\"propertyPattern${schemaId}_${propertyCount}\" placeholder=\"e.g., ^[a-zA-Z0-9]+$\">\n <label for=\"propertyEnum${schemaId}_${propertyCount}\">Enum (comma-separated):<\/label>\n <input type=\"text\" id=\"propertyEnum${schemaId}_${propertyCount}\" placeholder=\"e.g., value1,value2,value3\">\n <h4>XML<\/h4>\n <label for=\"propertyXmlName${schemaId}_${propertyCount}\">XML Name:<\/label>\n <input type=\"text\" id=\"propertyXmlName${schemaId}_${propertyCount}\" placeholder=\"e.g., user\">\n <label for=\"propertyXmlNamespace${schemaId}_${propertyCount}\">XML Namespace:<\/label>\n <input type=\"text\" id=\"propertyXmlNamespace${schemaId}_${propertyCount}\" placeholder=\"e.g., http:\/\/example.com\/schema\">\n <label for=\"propertyXmlPrefix${schemaId}_${propertyCount}\">XML Prefix:<\/label>\n <input type=\"text\" id=\"propertyXmlPrefix${schemaId}_${propertyCount}\" placeholder=\"e.g., xmp\">\n <label for=\"propertyXmlAttribute${schemaId}_${propertyCount}\">XML Attribute:<\/label>\n <input type=\"checkbox\" id=\"propertyXmlAttribute${schemaId}_${propertyCount}\">\n <label for=\"propertyXmlWrapped${schemaId}_${propertyCount}\">XML Wrapped:<\/label>\n <input type=\"checkbox\" id=\"propertyXmlWrapped${schemaId}_${propertyCount}\">\n <button class=\"remove-button\" onclick=\"removeProperty(${schemaId}, ${propertyCount})\">- Remove Property<\/button>\n `;\n schemaProperties.appendChild(newGroup);\n if (schemaProperties.children.length > 1) {\n schemaProperties.querySelectorAll('.remove-button').forEach(button => button.style.display = 'inline-block');\n }\n }\n\n function removeProperty(schemaId, propertyId) {\n const propertyGroup = document.getElementById(`propertyGroup${schemaId}_${propertyId}`);\n propertyGroup.remove();\n const schemaProperties = document.getElementById(`schemaProperties${schemaId}`);\n if (schemaProperties.children.length === 1) {\n schemaProperties.querySelector('.remove-button').style.display = 'none';\n }\n }\n\n function addSecurityScheme() {\n securitySchemeCount++;\n const securitySchemes = document.getElementById('securitySchemes');\n const newGroup = document.createElement('div');\n newGroup.className = 'field-group';\n newGroup.id = `securitySchemeGroup${securitySchemeCount}`;\n newGroup.innerHTML = `\n <label for=\"securitySchemeName${securitySchemeCount}\">Name:<\/label>\n <input type=\"text\" id=\"securitySchemeName${securitySchemeCount}\" placeholder=\"e.g., api_key\">\n <label for=\"securitySchemeType${securitySchemeCount}\">Type:<\/label>\n <select id=\"securitySchemeType${securitySchemeCount}\" onchange=\"toggleSecuritySchemeFields(${securitySchemeCount})\">\n <option value=\"apiKey\">API Key<\/option>\n <option value=\"http\">HTTP<\/option>\n <option value=\"oauth2\">OAuth2<\/option>\n <option value=\"openIdConnect\">OpenID Connect<\/option>\n <\/select>\n <div id=\"apiKeyFields${securitySchemeCount}\" style=\"display:none;\">\n <label for=\"apiKeyName${securitySchemeCount}\">Key Name:<\/label>\n <input type=\"text\" id=\"apiKeyName${securitySchemeCount}\" placeholder=\"e.g., X-API-Key\">\n <label for=\"apiKeyIn${securitySchemeCount}\">In:<\/label>\n <select id=\"apiKeyIn${securitySchemeCount}\">\n <option value=\"header\">Header<\/option>\n <option value=\"query\">Query<\/option>\n <option value=\"cookie\">Cookie<\/option>\n <\/select>\n <\/div>\n <div id=\"httpFields${securitySchemeCount}\" style=\"display:none;\">\n <label for=\"httpScheme${securitySchemeCount}\">Scheme:<\/label>\n <input type=\"text\" id=\"httpScheme${securitySchemeCount}\" placeholder=\"e.g., bearer\">\n <\/div>\n <div id=\"oauth2Fields${securitySchemeCount}\" style=\"display:none;\">\n <label for=\"oauth2Flow${securitySchemeCount}\">Flow:<\/label>\n <select id=\"oauth2Flow${securitySchemeCount}\">\n <option value=\"implicit\">Implicit<\/option>\n <option value=\"password\">Password<\/option>\n <option value=\"clientCredentials\">Client Credentials<\/option>\n <option value=\"authorizationCode\">Authorization Code<\/option>\n <\/select>\n <label for=\"oauth2AuthorizationUrl${securitySchemeCount}\">Authorization URL:<\/label>\n <input type=\"url\" id=\"oauth2AuthorizationUrl${securitySchemeCount}\" placeholder=\"https:\/\/example.com\/oauth\/authorize\">\n <label for=\"oauth2TokenUrl${securitySchemeCount}\">Token URL:<\/label>\n <input type=\"url\" id=\"oauth2TokenUrl${securitySchemeCount}\" placeholder=\"https:\/\/example.com\/oauth\/token\">\n <label for=\"oauth2Scopes${securitySchemeCount}\">Scopes (comma-separated):<\/label>\n <input type=\"text\" id=\"oauth2Scopes${securitySchemeCount}\" placeholder=\"e.g., read:pets,write:pets\">\n <\/div>\n <div id=\"openIdConnectFields${securitySchemeCount}\" style=\"display:none;\">\n <label for=\"openIdConnectUrl${securitySchemeCount}\">OpenID Connect URL:<\/label>\n <input type=\"url\" id=\"openIdConnectUrl${securitySchemeCount}\" placeholder=\"https:\/\/example.com\/.well-known\/openid-configuration\">\n <\/div>\n <button class=\"remove-button\" onclick=\"removeSecurityScheme(${securitySchemeCount})\">- Remove Security Scheme<\/button>\n `;\n securitySchemes.appendChild(newGroup);\n document.querySelector(`#securitySchemeGroup1 .remove-button`).style.display = 'inline-block';\n }\n\n function removeSecurityScheme(id) {\n const securitySchemeGroup = document.getElementById(`securitySchemeGroup${id}`);\n securitySchemeGroup.remove();\n if (document.querySelectorAll('#securitySchemes .field-group').length === 1) {\n document.querySelector(`#securitySchemeGroup1 .remove-button`).style.display = 'none';\n }\n }\n\n function toggleSecuritySchemeFields(id) {\n const type = document.getElementById(`securitySchemeType${id}`).value;\n document.getElementById(`apiKeyFields${id}`).style.display = type === 'apiKey' ? 'block' : 'none';\n document.getElementById(`httpFields${id}`).style.display = type === 'http' ? 'block' : 'none';\n document.getElementById(`oauth2Fields${id}`).style.display = type === 'oauth2' ? 'block' : 'none';\n document.getElementById(`openIdConnectFields${id}`).style.display = type === 'openIdConnect' ? 'block' : 'none';\n }\n\n function generateYaml() {\n let yaml = 'openapi: 3.0.0\\n';\n yaml += 'info:\\n';\n yaml += ` title: ${document.getElementById('apiTitle').value}\\n`;\n yaml += ` description: ${document.getElementById('apiDescription').value}\\n`;\n yaml += ` version: ${document.getElementById('apiVersion').value}\\n`;\n\n const termsOfService = document.getElementById('termsOfService').value;\n if (termsOfService) {\n yaml += ` termsOfService: ${termsOfService}\\n`;\n }\n\n yaml += ' contact:\\n';\n yaml += ` name: ${document.getElementById('contactName').value}\\n`;\n yaml += ` email: ${document.getElementById('contactEmail').value}\\n`;\n yaml += ` url: ${document.getElementById('contactUrl').value}\\n`;\n\n yaml += ' license:\\n';\n yaml += ` name: ${document.getElementById('licenseName').value}\\n`;\n yaml += ` url: ${document.getElementById('licenseUrl').value}\\n`;\n\n const externalDocsDescription = document.getElementById('externalDocsDescription').value;\n const externalDocsUrl = document.getElementById('externalDocsUrl').value;\n if (externalDocsDescription || externalDocsUrl) {\n yaml += 'externalDocs:\\n';\n if (externalDocsDescription) yaml += ` description: ${externalDocsDescription}\\n`;\n if (externalDocsUrl) yaml += ` url: ${externalDocsUrl}\\n`;\n }\n\n yaml += 'servers:\\n';\n document.querySelectorAll('#serverUrls .field-group').forEach((group) => {\n const url = group.querySelector('input[type=\"url\"]').value;\n const description = group.querySelector('input[type=\"text\"]').value;\n if (url) {\n yaml += ` - url: ${url}\\n`;\n if (description) {\n yaml += ` description: ${description}\\n`;\n }\n }\n });\n\n yaml += 'tags:\\n';\n document.querySelectorAll('#tags .field-group').forEach((group) => {\n const name = group.querySelector('input[placeholder=\"e.g., user\"]').value;\n const description = group.querySelector('input[placeholder=\"e.g., User operations\"]').value;\n const externalDocsDescription = group.querySelector('input[placeholder=\"e.g., Find out more\"]').value;\n const externalDocsUrl = group.querySelector('input[placeholder=\"https:\/\/example.com\/docs\/user\"]').value;\n if (name) {\n yaml += ` - name: ${name}\\n`;\n if (description) yaml += ` description: ${description}\\n`;\n if (externalDocsDescription || externalDocsUrl) {\n yaml += ' externalDocs:\\n';\n if (externalDocsDescription) yaml += ` description: ${externalDocsDescription}\\n`;\n if (externalDocsUrl) yaml += ` url: ${externalDocsUrl}\\n`;\n }\n }\n });\n\n yaml += 'paths:\\n';\n document.querySelectorAll('#paths .field-group').forEach((pathGroup) => {\n const path = pathGroup.querySelector('input[type=\"text\"]').value;\n if (path) {\n yaml += ` ${path}:\\n`;\n pathGroup.querySelectorAll('.nested-group').forEach((operationGroup) => {\n const method = operationGroup.querySelector('select').value;\n yaml += ` ${method}:\\n`;\n yaml += ` summary: ${operationGroup.querySelector('input[placeholder=\"Brief summary of this operation\"]').value}\\n`;\n yaml += ` description: ${operationGroup.querySelector('textarea').value}\\n`;\n yaml += ` operationId: ${operationGroup.querySelector('input[placeholder=\"e.g., getUsers\"]').value}\\n`;\n\n const tags = operationGroup.querySelector('input[placeholder=\"e.g., user, list\"]').value;\n if (tags) {\n yaml += ' tags:\\n';\n tags.split(',').forEach(tag => {\n yaml += ` - ${tag.trim()}\\n`;\n });\n }\n\n \/\/ Parameters\n const parameters = operationGroup.querySelectorAll('#parameters' + operationGroup.id.split('_')[1] + ' .nested-group');\n if (parameters.length > 0) {\n yaml += ' parameters:\\n';\n parameters.forEach((param) => {\n yaml += ' - ';\n yaml += `name: ${param.querySelector('input[placeholder=\"e.g., id\"]').value}\\n`;\n yaml += ` in: ${param.querySelector('select').value}\\n`;\n yaml += ` description: ${param.querySelector('input[placeholder=\"Description of the parameter\"]').value}\\n`;\n yaml += ` required: ${param.querySelector('select[id^=\"paramRequired\"]').value}\\n`;\n yaml += ' schema:\\n';\n yaml += ` type: ${param.querySelector('select[id^=\"paramType\"]').value}\\n`;\n\n const enumValues = param.querySelector('input[placeholder=\"e.g., value1,value2,value3\"]').value;\n if (enumValues) {\n yaml += ' enum:\\n';\n enumValues.split(',').forEach(value => {\n yaml += ` - ${value.trim()}\\n`;\n });\n }\n\n const minimum = param.querySelector('input[placeholder=\"e.g., 1\"]').value;\n if (minimum) yaml += ` minimum: ${minimum}\\n`;\n\n const maximum = param.querySelector('input[placeholder=\"e.g., 100\"]').value;\n if (maximum) yaml += ` maximum: ${maximum}\\n`;\n\n const pattern = param.querySelector('input[placeholder=\"e.g., ^[a-zA-Z0-9]+$\"]').value;\n if (pattern) yaml += ` pattern: ${pattern}\\n`;\n });\n }\n\n \/\/ Request Body\n const requestBody = operationGroup.querySelector('#requestBody' + operationGroup.id.split('_')[1]);\n if (requestBody.children.length > 0) {\n yaml += ' requestBody:\\n';\n yaml += ` description: ${requestBody.querySelector('input[placeholder=\"Description of the request body\"]').value}\\n`;\n yaml += ` required: ${requestBody.querySelector('select').value}\\n`;\n yaml += ' content:\\n';\n requestBody.querySelectorAll('.nested-group').forEach((content) => {\n const contentType = content.querySelector('input[placeholder=\"e.g., application\/json\"]').value;\n yaml += ` ${contentType}:\\n`;\n yaml += ' schema:\\n';\n yaml += ` $ref: '${content.querySelector('input[placeholder=\"e.g., #\/components\/schemas\/User\"]').value}'\\n`;\n const example = content.querySelector('textarea').value;\n if (example) {\n yaml += ' example: |\\n';\n example.split('\\n').forEach(line => {\n yaml += ` ${line}\\n`;\n });\n }\n });\n }\n\n \/\/ Responses\n const responses = operationGroup.querySelectorAll('#responses' + operationGroup.id.split('_')[1] + ' .nested-group');\n if (responses.length > 0) {\n yaml += ' responses:\\n';\n responses.forEach((response) => {\n const statusCode = response.querySelector('input[placeholder=\"e.g., 200\"]').value;\n yaml += ` '${statusCode}':\\n`;\n yaml += ` description: ${response.querySelector('input[placeholder=\"e.g., Successful response\"]').value}\\n`;\n const responseContent = response.querySelectorAll('#responseContent' + response.id.split('_')[2] + ' .nested-group');\n if (responseContent.length > 0) {\n yaml += ' content:\\n';\n responseContent.forEach((content) => {\n const contentType = content.querySelector('input[placeholder=\"e.g., application\/json\"]').value;\n yaml += ` ${contentType}:\\n`;\n yaml += ' schema:\\n';\n yaml += ` $ref: '${content.querySelector('input[placeholder=\"e.g., #\/components\/schemas\/User\"]').value}'\\n`;\n const example = content.querySelector('textarea').value;\n if (example) {\n yaml += ' example: |\\n';\n example.split('\\n').forEach(line => {\n yaml += ` ${line}\\n`;\n });\n }\n });\n }\n const headers = response.querySelector('input[placeholder=\"e.g., X-Rate-Limit,X-Expires-After\"]').value;\n if (headers) {\n yaml += ' headers:\\n';\n headers.split(',').forEach(header => {\n yaml += ` ${header.trim()}:\\n`;\n yaml += ' schema:\\n';\n yaml += ' type: string\\n';\n });\n }\n });\n }\n\n \/\/ Security\n const security = operationGroup.querySelectorAll('#security' + operationGroup.id.split('_')[1] + ' .nested-group');\n if (security.length > 0) {\n yaml += ' security:\\n';\n security.forEach((sec) => {\n const scheme = sec.querySelector('input[placeholder=\"e.g., api_key\"]').value;\n const scopes = sec.querySelector('input[placeholder=\"e.g., read:users,write:users\"]').value;\n yaml += ' - ';\n yaml += `${scheme}:\\n`;\n if (scopes) {\n scopes.split(',').forEach(scope => {\n yaml += ` - ${scope.trim()}\\n`;\n });\n } else {\n yaml += ' []\\n';\n }\n });\n }\n });\n }\n });\n\n yaml += 'components:\\n';\n yaml += ' schemas:\\n';\n document.querySelectorAll('#schemas .field-group').forEach((schemaGroup) => {\n const schemaName = schemaGroup.querySelector('input[type=\"text\"]').value;\n if (schemaName) {\n yaml += ` ${schemaName}:\\n`;\n yaml += ` type: ${schemaGroup.querySelector('select').value}\\n`;\n yaml += ' properties:\\n';\n schemaGroup.querySelectorAll('#schemaProperties' + schemaGroup.id.split('Group')[1] + ' .nested-group').forEach((propertyGroup) => {\n const propertyName = propertyGroup.querySelector('input[placeholder=\"e.g., id\"]').value;\n const propertyType = propertyGroup.querySelector('select').value;\n if (propertyName) {\n yaml += ` ${propertyName}:\\n`;\n yaml += ` type: ${propertyType}\\n`;\n\n const format = propertyGroup.querySelector('input[placeholder=\"e.g., date-time, int64\"]').value;\n if (format) yaml += ` format: ${format}\\n`;\n\n const description = propertyGroup.querySelector('input[placeholder=\"Property description\"]').value;\n if (description) yaml += ` description: ${description}\\n`;\n\n const example = propertyGroup.querySelector('input[placeholder=\"Example value\"]').value;\n if (example) yaml += ` example: ${example}\\n`;\n\n const minimum = propertyGroup.querySelector('input[placeholder=\"e.g., 1\"]').value;\n if (minimum) yaml += ` minimum: ${minimum}\\n`;\n\n const maximum = propertyGroup.querySelector('input[placeholder=\"e.g., 100\"]').value;\n if (maximum) yaml += ` maximum: ${maximum}\\n`;\n\n const pattern = propertyGroup.querySelector('input[placeholder=\"e.g., ^[a-zA-Z0-9]+$\"]').value;\n if (pattern) yaml += ` pattern: ${pattern}\\n`;\n\n const enumValues = propertyGroup.querySelector('input[placeholder=\"e.g., value1,value2,value3\"]').value;\n if (enumValues) {\n yaml += ' enum:\\n';\n enumValues.split(',').forEach(value => {\n yaml += ` - ${value.trim()}\\n`;\n });\n }\n\n const xmlName = propertyGroup.querySelector('input[placeholder=\"e.g., user\"]').value;\n const xmlNamespace = propertyGroup.querySelector('input[placeholder=\"e.g., http:\/\/example.com\/schema\"]').value;\n const xmlPrefix = propertyGroup.querySelector('input[placeholder=\"e.g., xmp\"]').value;\n const xmlAttribute = propertyGroup.querySelector('input[type=\"checkbox\"]').checked;\n const xmlWrapped = propertyGroup.querySelectorAll('input[type=\"checkbox\"]')[1].checked;\n\n if (xmlName || xmlNamespace || xmlPrefix || xmlAttribute || xmlWrapped) {\n yaml += ' xml:\\n';\n if (xmlName) yaml += ` name: ${xmlName}\\n`;\n if (xmlNamespace) yaml += ` namespace: ${xmlNamespace}\\n`;\n if (xmlPrefix) yaml += ` prefix: ${xmlPrefix}\\n`;\n if (xmlAttribute) yaml += ' attribute: true\\n';\n if (xmlWrapped) yaml += ' wrapped: true\\n';\n }\n }\n });\n const requiredProperties = schemaGroup.querySelector('input[placeholder=\"e.g., id,name\"]').value;\n if (requiredProperties) {\n yaml += ' required:\\n';\n requiredProperties.split(',').forEach(prop => {\n yaml += ` - ${prop.trim()}\\n`;\n });\n }\n }\n });\n\n yaml += ' securitySchemes:\\n';\n document.querySelectorAll('#securitySchemes .field-group').forEach((schemeGroup) => {\n const schemeName = schemeGroup.querySelector('input[type=\"text\"]').value;\n const schemeType = schemeGroup.querySelector('select').value;\n if (schemeName) {\n yaml += ` ${schemeName}:\\n`;\n yaml += ` type: ${schemeType}\\n`;\n switch (schemeType) {\n case 'apiKey':\n yaml += ` name: ${schemeGroup.querySelector('#apiKeyName' + schemeGroup.id.split('Group')[1]).value}\\n`;\n yaml += ` in: ${schemeGroup.querySelector('#apiKeyIn' + schemeGroup.id.split('Group')[1]).value}\\n`;\n break;\n case 'http':\n yaml += ` scheme: ${schemeGroup.querySelector('#httpScheme' + schemeGroup.id.split('Group')[1]).value}\\n`;\n break;\n case 'oauth2':\n yaml += ' flows:\\n';\n yaml += ` ${schemeGroup.querySelector('#oauth2Flow' + schemeGroup.id.split('Group')[1]).value}:\\n`;\n yaml += ` authorizationUrl: ${schemeGroup.querySelector('#oauth2AuthorizationUrl' + schemeGroup.id.split('Group')[1]).value}\\n`;\n yaml += ` tokenUrl: ${schemeGroup.querySelector('#oauth2TokenUrl' + schemeGroup.id.split('Group')[1]).value}\\n`;\n yaml += ' scopes:\\n';\n schemeGroup.querySelector('#oauth2Scopes' + schemeGroup.id.split('Group')[1]).value.split(',').forEach(scope => {\n yaml += ` ${scope.trim()}: ''\\n`;\n });\n break;\n case 'openIdConnect':\n yaml += ` openIdConnectUrl: ${schemeGroup.querySelector('#openIdConnectUrl' + schemeGroup.id.split('Group')[1]).value}\\n`;\n break;\n }\n }\n });\n\n const blob = new Blob([yaml], { type: 'text\/yaml' });\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = 'openapi-spec.yaml';\n a.click();\n URL.revokeObjectURL(url);\n }\n <\/script>\n<\/body>\n\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Boost your API development process with our intuitive OpenAPI Spec creator tool, tailored to seamlessly generate OpenAPI specifications compliant with version 3.0 schema. This user-friendly platform guides you through defining API structures, endpoints, parameters, and responses, ensuring your documentation meets industry standards. Whether you’re an experienced API developer or a beginner, our tool simplifies the … <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/\" class=\"more-link\">Read more<span class=\"screen-reader-text\"> “OpenAPI Spec Generator Tool”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":296,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-497","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>OpenAPI Spec Generator Tool - Utkarsh's Blog<\/title>\n<meta name=\"description\" content=\"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"OpenAPI Spec Generator Tool - Utkarsh's Blog\" \/>\n<meta property=\"og:description\" content=\"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/\" \/>\n<meta property=\"og:site_name\" content=\"Utkarsh's Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/utkarsh121\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-10T22:04:42+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@utkarsh121\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/openapi-spec-generator\\\/\",\"url\":\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/openapi-spec-generator\\\/\",\"name\":\"OpenAPI Spec Generator Tool - Utkarsh's Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/#website\"},\"datePublished\":\"2024-09-10T21:56:45+00:00\",\"dateModified\":\"2024-09-10T22:04:42+00:00\",\"description\":\"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/openapi-spec-generator\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/openapi-spec-generator\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/openapi-spec-generator\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/utkarshchoudhary.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Tools\",\"item\":\"https:\\\/\\\/utkarshchoudhary.com\\\/index.php\\\/tools\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"OpenAPI Spec Generator Tool\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/#website\",\"url\":\"https:\\\/\\\/utkarshchoudhary.com\\\/\",\"name\":\"Utkarsh's Blog\",\"description\":\"Utkarsh's Blog\",\"publisher\":{\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/#\\\/schema\\\/person\\\/7a3c37bdc3b7eab320da0d28c7658fbe\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/utkarshchoudhary.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/#\\\/schema\\\/person\\\/7a3c37bdc3b7eab320da0d28c7658fbe\",\"name\":\"Utkarsh\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/21-04-08-13-26-26-0455-01-scaled.jpeg\",\"url\":\"https:\\\/\\\/utkarshchoudhary.com\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/21-04-08-13-26-26-0455-01-scaled.jpeg\",\"contentUrl\":\"https:\\\/\\\/utkarshchoudhary.com\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/21-04-08-13-26-26-0455-01-scaled.jpeg\",\"width\":1923,\"height\":2560,\"caption\":\"Utkarsh\"},\"logo\":{\"@id\":\"https:\\\/\\\/utkarshchoudhary.com\\\/wp-content\\\/uploads\\\/2022\\\/07\\\/21-04-08-13-26-26-0455-01-scaled.jpeg\"},\"sameAs\":[\"https:\\\/\\\/utkarshchoudhary.com\",\"https:\\\/\\\/www.facebook.com\\\/utkarsh121\",\"https:\\\/\\\/www.instagram.com\\\/utkarsh121\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/utkarsh121\\\/\",\"https:\\\/\\\/x.com\\\/utkarsh121\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"OpenAPI Spec Generator Tool - Utkarsh's Blog","description":"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/","og_locale":"en_US","og_type":"article","og_title":"OpenAPI Spec Generator Tool - Utkarsh's Blog","og_description":"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.","og_url":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/","og_site_name":"Utkarsh's Blog","article_publisher":"https:\/\/www.facebook.com\/utkarsh121","article_modified_time":"2024-09-10T22:04:42+00:00","twitter_card":"summary_large_image","twitter_site":"@utkarsh121","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/","url":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/","name":"OpenAPI Spec Generator Tool - Utkarsh's Blog","isPartOf":{"@id":"https:\/\/utkarshchoudhary.com\/#website"},"datePublished":"2024-09-10T21:56:45+00:00","dateModified":"2024-09-10T22:04:42+00:00","description":"Effortlessly create OpenAPI 3.0 compliant specifications with our user-friendly tool. Define your API\u2019s structure, endpoints, and responses with ease for clear, professional documentation.","breadcrumb":{"@id":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/openapi-spec-generator\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/utkarshchoudhary.com\/"},{"@type":"ListItem","position":2,"name":"Tools","item":"https:\/\/utkarshchoudhary.com\/index.php\/tools\/"},{"@type":"ListItem","position":3,"name":"OpenAPI Spec Generator Tool"}]},{"@type":"WebSite","@id":"https:\/\/utkarshchoudhary.com\/#website","url":"https:\/\/utkarshchoudhary.com\/","name":"Utkarsh's Blog","description":"Utkarsh's Blog","publisher":{"@id":"https:\/\/utkarshchoudhary.com\/#\/schema\/person\/7a3c37bdc3b7eab320da0d28c7658fbe"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/utkarshchoudhary.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/utkarshchoudhary.com\/#\/schema\/person\/7a3c37bdc3b7eab320da0d28c7658fbe","name":"Utkarsh","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/utkarshchoudhary.com\/wp-content\/uploads\/2022\/07\/21-04-08-13-26-26-0455-01-scaled.jpeg","url":"https:\/\/utkarshchoudhary.com\/wp-content\/uploads\/2022\/07\/21-04-08-13-26-26-0455-01-scaled.jpeg","contentUrl":"https:\/\/utkarshchoudhary.com\/wp-content\/uploads\/2022\/07\/21-04-08-13-26-26-0455-01-scaled.jpeg","width":1923,"height":2560,"caption":"Utkarsh"},"logo":{"@id":"https:\/\/utkarshchoudhary.com\/wp-content\/uploads\/2022\/07\/21-04-08-13-26-26-0455-01-scaled.jpeg"},"sameAs":["https:\/\/utkarshchoudhary.com","https:\/\/www.facebook.com\/utkarsh121","https:\/\/www.instagram.com\/utkarsh121","https:\/\/www.linkedin.com\/in\/utkarsh121\/","https:\/\/x.com\/utkarsh121"]}]}},"_links":{"self":[{"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/pages\/497","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/comments?post=497"}],"version-history":[{"count":3,"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/pages\/497\/revisions"}],"predecessor-version":[{"id":500,"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/pages\/497\/revisions\/500"}],"up":[{"embeddable":true,"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/pages\/296"}],"wp:attachment":[{"href":"https:\/\/utkarshchoudhary.com\/index.php\/wp-json\/wp\/v2\/media?parent=497"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}