![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](https://image.slidesharecdn.com/design-driven-api-development-150828143247-lva1-app6892/85/Design-Driven-API-Development-16-320.jpg)
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