<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Rui Soares, Author at Blog IT</title>
	<atom:link href="https://blogit.create.pt/author/ruisoares/feed/" rel="self" type="application/rss+xml" />
	<link>https://blogit.create.pt/author/ruisoares/</link>
	<description>Create IT blogger community</description>
	<lastBuildDate>Thu, 10 Jan 2019 12:46:13 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.1</generator>
	<item>
		<title>How to easily create beautiful REST API documentation with Spectacle</title>
		<link>https://blogit.create.pt/ruisoares/2017/10/31/how-to-easily-create-beautiful-rest-api-documentation-with-spectacle/</link>
					<comments>https://blogit.create.pt/ruisoares/2017/10/31/how-to-easily-create-beautiful-rest-api-documentation-with-spectacle/#respond</comments>
		
		<dc:creator><![CDATA[Rui Soares]]></dc:creator>
		<pubDate>Tue, 31 Oct 2017 23:42:34 +0000</pubDate>
				<category><![CDATA[Misc]]></category>
		<guid isPermaLink="false">http://blogit.create.pt/ruisoares/?p=114</guid>

					<description><![CDATA[<p>If you never heard of Spectacle it’s a platform developed by Sourcey with the goal to generate beautiful documentation from  OpenAPI/Swagger 2.0 API specifications. Using Spectacle is very straight forward but before doing so you must go through some steps. &#160; Install Node.js First things first. To use Spectacle, you need npm and to have [&#8230;]</p>
<p>The post <a href="https://blogit.create.pt/ruisoares/2017/10/31/how-to-easily-create-beautiful-rest-api-documentation-with-spectacle/">How to easily create beautiful REST API documentation with Spectacle</a> appeared first on <a href="https://blogit.create.pt">Blog IT</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>If you never heard of <a href="https://sourcey.com/spectacle/#usage">Spectacle</a> it’s a platform developed by <a href="https://sourcey.com/spectacle/">Sourcey</a> with the goal to generate beautiful documentation from  <a href="https://www.openapis.org/">OpenAPI</a>/<a href="https://swagger.io/">Swagger</a> 2.0 API specifications.</p>
<p>Using Spectacle is very straight forward but before doing so you must go through some steps.</p>
<p>&nbsp;</p>
<ol>
<li><strong> Install Node.js </strong></li>
</ol>
<p>First things first. To use Spectacle, you need <a href="https://www.npmjs.com/">npm</a> and to have npm you have to install Node.js.</p>
<p>If you’re on Windows just follow this <a href="https://nodejs.org/en/download/">link</a>, download and run the .msi file.</p>
<p>&nbsp;</p>
<ol start="2">
<li><strong> Install Spectacle</strong></li>
</ol>
<p>Now that you have Node.js to install Spectacle just open cmd and install it from npm like so:</p>
<p><code>npm install -g spectacle-docs</code></p>
<p>&nbsp;</p>
<ol start="3">
<li><strong> Configure Swagger</strong></li>
</ol>
<p>If you’re already using Swagger in your project then you could generate the documentation via Spectacle right away, but before doing so we’re going to do some tweaks on the Swagger UI configuration to make our lives easier.</p>
<p>To generate the documentation, Spectacle needs a swagger.json which you can get from Swagger UI.  By default, when accessing Swagger UI, you’ll be presented to something of the likes of this:</p>
<p><img fetchpriority="high" decoding="async" class="aligncenter wp-image-164 size-full" src="http://blogit-create.com/wp-content/uploads/2017/10/img2.png" alt="" width="1283" height="668" srcset="https://blogit.create.pt/wp-content/uploads/2017/10/img2.png 1283w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-300x156.png 300w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-768x400.png 768w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-1024x533.png 1024w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-696x362.png 696w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-1068x556.png 1068w, https://blogit.create.pt/wp-content/uploads/2017/10/img2-807x420.png 807w" sizes="(max-width: 1283px) 100vw, 1283px" /></p>
<p>&nbsp;</p>
<p>If you open with your browser the Url shown in the Swagger UI search bar, you’ll be redirected to the json document.<br />
Now, this is a perfectly acceptable way to access the json but to me it’s a bit cumbersome.</p>
<p>My suggestion would be to edit the Swagger Configuration of your project such to show a direct link to the json file. You can do so by editing SwaggerDocsConfig’s Description property.</p>
<p><img decoding="async" class="aligncenter wp-image-184 size-full" src="http://blogit-create.com/wp-content/uploads/2017/10/img3.png" alt="" width="810" height="264" srcset="https://blogit.create.pt/wp-content/uploads/2017/10/img3.png 810w, https://blogit.create.pt/wp-content/uploads/2017/10/img3-300x98.png 300w, https://blogit.create.pt/wp-content/uploads/2017/10/img3-768x250.png 768w, https://blogit.create.pt/wp-content/uploads/2017/10/img3-696x227.png 696w" sizes="(max-width: 810px) 100vw, 810px" /></p>
<p>Now your Swagger UI will have a very handy link to the swagger.json document.</p>
<p><img decoding="async" class="aligncenter wp-image-194 size-full" src="http://blogit-create.com/wp-content/uploads/2017/10/img4-e1509492864355.png" alt="" width="1284" height="658" srcset="https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355.png 1284w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-300x154.png 300w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-768x394.png 768w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-1024x525.png 1024w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-696x357.png 696w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-1068x547.png 1068w, https://blogit.create.pt/wp-content/uploads/2017/10/img4-e1509492864355-820x420.png 820w" sizes="(max-width: 1284px) 100vw, 1284px" /></p>
<p>&nbsp;</p>
<ol start="4">
<li><strong> Generate the documentation</strong></li>
</ol>
<p>To generate the documentation download the swagger.json, open cmd and run the following command:</p>
<p><code>Spectacle -d swagger.json</code></p>
<p>The documentation will be in the public directory by default. You can open the generated HTML with your browser, or view your docs by pointing your browser to <a href="http://localhost:4400/">http://localhost:4400/</a>.</p>
<p><img decoding="async" class="aligncenter wp-image-204 size-full" src="http://blogit-create.com/wp-content/uploads/2017/10/img5.png" alt="" width="1439" height="729" /></p>
<p>And that’s it.</p>
<p>If you want to know how you can embellish your response documentation with <a href="https://github.com/domaindrivendev/Swashbuckle">Swashbuckle</a>, be free to take a look at <a href="https://mattfrear.com/2015/04/21/generating-swagger-example-responses-with-swashbuckle/">this</a> example.</p>
<p>The post <a href="https://blogit.create.pt/ruisoares/2017/10/31/how-to-easily-create-beautiful-rest-api-documentation-with-spectacle/">How to easily create beautiful REST API documentation with Spectacle</a> appeared first on <a href="https://blogit.create.pt">Blog IT</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://blogit.create.pt/ruisoares/2017/10/31/how-to-easily-create-beautiful-rest-api-documentation-with-spectacle/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
