Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to Design Driven API Development
Similar to Design Driven API Development (20)
Recently uploaded
Recently uploaded (20)
Design Driven API Development
- 2. Generation of API Description Languages
- 3. Swagger
- 4. RAML
- 6. API Description Languages • XML • WADL, RADL, WSDL2 • JSON • Swagger, I/O Docs • YAML • Swagger, RAML • Markdown • API-Blueprint Popular in GitHub, NPM, …
- 7. Why
- 8. Server Code API Document SDKs Specification Document Samples Mock Server API Console Test code Manually developed resources as a reference
- 9. Server Code API Document SDKs Samples Mock Server API Console Test code Manually developed resources It is incorrect or doesn’t exist Sometimes,
- 10. To avoid publishing un-updatable APIs • Publishing or updating API are not so hard, • if you can ignore lots of related resources. • e.g. SDKs, Documents, Tests, Clients, …
- 12. Server Code API Document SDKs API Schema generate/validate SamplesAPI ConsoleMock Server Non-manually developed resources codegenswagger-UIswagger-node swagger-spec swagger-editor swagger-js
- 13. Demo
- 14. Demo • Hacker News API • Swagger-Node • Hacker News Client • React, Swagger-js, Electron
- 15. Swagger-nodeElectron *.yaml Swagger Editor Express express-swagger controller React Swagger-js - component DidMount etc. state render (Dynamically JS SDK) Cheerio https://news.ycombinator.com
- 16. Server : Swagger-Node swagger project create [project name] swagger project edit 1. Generate a template for express | hapi | restify | sails 2. Write API specs vim api/controller/[controller file name].js 3. Just write controllers that meet the API specs
- 18. filename of the controllers name of the controller
- 19. Client : Swagger-js var swagger = new SwaggerClient({ url: "http://localhost:8080/swagger.yaml", success: function() { swagger.apis.hackernews.fetch( {page:api}, {responseContentType: 'application/ json'}, function(res) { : }); } }); Dynamically Swagger SDK for JavaScript
- 20. Client : Swagger-js with React var self = this; var swagger = new SwaggerClient({ url: "http://localhost:8080/swagger.yaml", success: function() { swagger.apis.hackernews.fetch( {page:api}, {responseContentType: 'application/json'}, function(res) { self.setState({data:res.obj}); }); } }); at componentDidMount