{"id":13802831,"url":"https://github.com/mulesoft/api-designer","last_synced_at":"2025-10-22T20:22:11.746Z","repository":{"id":9485222,"uuid":"11373986","full_name":"mulesoft/api-designer","owner":"mulesoft","description":"A web editor for creating and sharing RAML API specifications","archived":true,"fork":false,"pushed_at":"2024-05-09T22:48:50.000Z","size":63739,"stargazers_count":1072,"open_issues_count":53,"forks_count":269,"subscribers_count":517,"default_branch":"master","last_synced_at":"2024-05-10T01:14:47.627Z","etag":null,"topics":["raml","raml-design","raml-tooling"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mulesoft.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2013-07-12T17:16:40.000Z","updated_at":"2024-06-18T16:46:30.894Z","dependencies_parsed_at":"2024-01-13T10:42:44.167Z","dependency_job_id":"94b82081-8197-46d0-8c20-65b73cda0b3a","html_url":"https://github.com/mulesoft/api-designer","commit_stats":{"total_commits":1529,"total_committers":71,"mean_commits":"21.535211267605632","dds":0.8476128188358404,"last_synced_commit":"1d5892f31530f1829830ffa99776c28448ad128e"},"previous_names":[],"tags_count":49,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mulesoft%2Fapi-designer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mulesoft%2Fapi-designer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mulesoft%2Fapi-designer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mulesoft%2Fapi-designer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mulesoft","download_url":"https://codeload.github.com/mulesoft/api-designer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234563123,"owners_count":18853056,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["raml","raml-design","raml-tooling"],"created_at":"2024-08-04T00:01:59.181Z","updated_at":"2025-09-28T21:30:22.348Z","avatar_url":"https://github.com/mulesoft.png","language":"JavaScript","funding_links":[],"categories":["Misc","others"],"sub_categories":[],"readme":"# API Designer\n\n[![Gitter](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/mulesoft/api-designer?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge\u0026utm_content=badge) [![npm version](https://badge.fury.io/js/api-designer.svg)](https://badge.fury.io/js/api-designer) [![Bower version](https://badge.fury.io/bo/api-designer.svg)](https://badge.fury.io/bo/api-designer)\n\n**API Designer** is a standalone/embeddable editor for [RAML](http://raml.org) (RESTful API Modeling Language) written in JavaScript using Angular.JS. By default, the editor uses an in-browser filesystem stored in HTML5 Localstorage.\n\n## Examples of designing RAML with API Designer in the Wild\n\n* [Remote Medicine API](http://static-anypoint-mulesoft-com.s3.amazonaws.com/API_examples_notebooks/raml-design4.html)\n* [Notes API](http://static-anypoint-mulesoft-com.s3.amazonaws.com/API_examples_notebooks/raml-design3.html)\n* [Congo API for Drone Delivery](http://static-anypoint-mulesoft-com.s3.amazonaws.com/API_examples_notebooks/raml-design2.html)\n\n## API Designer online\n\nThere is an online preview version of the API Designer, check it out a [different branch](http://mulesoft.github.io/api-designer/).\n\n## Running Locally\n\n```\nnpm install -g api-designer\n\napi-designer\n```\n\nThis will start a local designer instance using the in-browser filesystem.\n\n## Embedding\n\nThe following example details how to embed the API Designer:\n\n```html\n\u003c!doctype html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n  \u003cmeta charset=\"utf-8\"\u003e\n  \u003ctitle\u003eMy App\u003c/title\u003e\n  \u003clink rel=\"stylesheet\" href=\"styles/api-designer-vendor.css\"\u003e\n  \u003clink rel=\"stylesheet\" href=\"styles/api-designer.css\"\u003e\n\u003c/head\u003e\n\u003cbody ng-app=\"ramlEditorApp\"\u003e\n\u003craml-editor\u003e\u003c/raml-editor\u003e\n\u003cscript src=\"scripts/api-designer-parser.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  if (window.Worker) {\n    // enable optional web worker for raml parsing \n    window.RAML.worker = new Worker('scripts/api-designer-worker.js#parser=./api-designer-parser.js\u0026proxy=/proxy/');\n  }\n\u003c/script\u003e\n\u003cscript src=\"scripts/api-designer-vendor.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"scripts/api-designer.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  // This part is needed only if you want to provide your own Persistance Implementation\n  // Angular Module must match \"ramlEditorApp\"\n\n  function myFileSystem($q, config, $rootScope) {\n    var service = {};\n\n    service.directory = function (path) {\n      var deferred = $q.defer();\n\n      // Your magic goes here:\n      // Do deferred.resolve(data); to fulfull the promise or\n      // deferred.reject(error); to reject it.\n\n      // In case you want to send notifications to the user\n      // (for instance, that he must login to save).\n      // The expires flags means whether\n      // it should be hidden after a period of time or the\n      // user should dismiss it manually.\n      $rootScope.$broadcast('event:notification', {message: 'Loading directory' + path, expires: true});\n\n      return deferred.promise;\n    };\n\n    service.load = function (path, name) {\n      var deferred = $q.defer();\n\n      // Your magic goes here:\n      // Do deferred.resolve(data); to fulfull the promise or\n      // deferred.reject(error); to reject it.\n\n      return deferred.promise;\n    };\n\n    service.remove = function (path, name) {\n      var deferred = $q.defer();\n\n      // Your magic goes here:\n      // Do deferred.resolve(data); to fulfull the promise or\n      // deferred.reject(error); to reject it.\n\n      return deferred.promise;\n    };\n\n    service.save = function (path, name, contents) {\n      var deferred = $q.defer();\n\n      // Your magic goes here:\n      // Do deferred.resolve(data); to fulfull the promise or\n      // deferred.reject(error); to reject it.\n\n      return deferred.promise;\n    };\n\n    return service;\n  }\n\n  angular.module('ramlEditorApp')\n    .config(function (fileSystemProvider) {\n      // Set myFileSystem as the filesystem to use\n      fileSystemProvider.setFileSystemFactory(myFileSystem);\n    });\n\u003c/script\u003e\n\u003cstyle\u003e\n  html,\n  body {\n    height: 100%;\n  }\n\u003c/style\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Contribution\n\nIf you want to contribute to this project, please read our [contribution guide](https://github.com/mulesoft/api-designer/blob/master/CONTRIBUTING.md) first.\n\n## License\n\nCopyright 2013 MuleSoft, Inc. Licensed under the Common Public Attribution License (CPAL), Version 1.0\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmulesoft%2Fapi-designer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmulesoft%2Fapi-designer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmulesoft%2Fapi-designer/lists"}