How to generate C# or TypeScript client code for OpenAPI (Swagger) specification
Tags: openapi, dotnet, connectedservice, csharp
Published: 2019-10-14 21:51:27

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/psp9c9o9t6nqls0wz0gx.png)

This How-To describes how to generate C# or TypeScript client code for OpenAPI (Swagger) specification with [Unchase OpenAPI (Swagger) Connected Service](https://marketplace.visualstudio.com/items?itemName=Unchase.unchaseopenapiconnectedservice) to Visual Studio 2017/2019 projects.

> The [Unchase OpenAPI (Swagger) Connected Service](https://marketplace.visualstudio.com/items?itemName=Unchase.unchaseopenapiconnectedservice) is a Visual Studio 2017/2019 extension to generate C# (TypeScript) HttpClient (or C# Controllers) code for [OpenAPI (formerly Swagger)](https://swagger.io/docs/specification/about/) web services with NSwag. Simply put, it is like kind old [Add Service Reference](https://docs.microsoft.com/en-us/dotnet/core/additional-tools/wcf-web-service-reference-guide) for WCF or [Add Web Reference](https://docs.microsoft.com/en-us/sharepoint/dev/general-development/step-2-adding-a-web-reference) for WSDL, but for JSON (YAML) API with customization of code generation like in [**NSwagStudio**](https://github.com/RicoSuter/NSwag/wiki/NSwagStudio).

Follow **4 steps* below to achieve this:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/cvrn5bomb6u3ys0csusr.gif)

### **Step 1. Install the Connected Service**

Launch the installed Visual Studio 2017/2019. Open the menu to manage Visual Studio extensions:

* For Visual Studio 2017: `Tools -> Extensions and Updates...`

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/k6nme6dnx46gtiqohhih.png)

* For Visual Studio 2019: Extensions -> Manage Extensions

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/b6a7umcanfzyh2fdka7o.png)

Choose `Online -> Visual Studio Marketplace` tab. In search field type *unchase*, then install Unchase OpenAPI (Swagger) Connected Service (just click Download button):

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/rztd1c7aotgk4vk74j6c.png)

After all, restart the Visual Studio to install the [Connected Service](https://marketplace.visualstudio.com/items?itemName=Unchase.unchaseopenapiconnectedservice).

### **Step 2. Open the Connected Service wizard for Visual Studio project**

Open the Visual Studio solution with project to generate client code in. In `Solution Explorer` make right-click on `Connected Services` or `Dependencies` item in the project for which you need to generate client code, and click on `Add Connected Service`:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/3p940opu4einqhk3mevi.png)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/0yz0ajplxovduak8jrc5.png)

Then choose [Unchase OpenAPI (Swagger) Connected Service](https://marketplace.visualstudio.com/items?itemName=Unchase.unchaseopenapiconnectedservice) to show the Connected Service wizard:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/hdet6j06334tbqyjyd86.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vt53wot0vi98s729uygb.png)

### **Step 3. Configure OpenAPI specification endpoint**

In the first page of the wizard you need to configure some necessary options:

* `Service name` - the name of the folder for generated files (by default, if field is empty - *OpenAPIService*);

* `Generated file name` - the name of the generated files prefix (by default, if field is empty - *OpenAPI*);

* `OpenAPI (Swagger) specification URI (path)` - the specification URI (URL or local file);

* One or few of `Generate CSharp Client`, `Generate TypeScript Client`, `Generate CSharp Controller` - to generate C# (TypeScript) client code or/and C# Controllers code file(s) for OpenAPI specification. *When you check a checkbox, the corresponding tab item with additional generation settings is added to the wizard*:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/zqtanvgpic1hk8n1kaiw.png)

After setting the necessary options, you can immediately start generating the code files by clicking the `Finish` button. In this case, there will choose default code generation options.


---

There are a few *optional* options you can specify before start generation process:

* In the `Runtime and variables` section - the same options as in [NSwagStudio](https://github.com/RicoSuter/NSwag/wiki/NSwagStudio):

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/juja0ys9ye3hqvzgpg12.png)

* `Copy OpenAPI (Swagger) json-specification to nswag-file` *checkbox* - the same as `Create local Copy` button in [NSwagStudio](https://github.com/RicoSuter/NSwag/wiki/NSwagStudio):

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/wb7hg40r82msyd9tayu7.png)

* `Open generated files on complete in IDE` *checkbox* - allows automatically open the generated files in IDE in generation process;

* If you need to set network credentials for connecting to the endpoint (specification file), you should specify options in the `Network Credentials` section. If your network used Proxy, you should specify options in the `Web Proxy `section:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/1pqvdirbmnw8bqskgziz.png)

### **Step 4 (Optional). Configure code generation options**

If you want to specify some options for generating code, just need to go to generation settings tab(s):

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/wa49mdl1fidz2451cakg.gif)

There are the same options like in [NSwagStudio](https://github.com/RicoSuter/NSwag/wiki/NSwagStudio).


---

Enjoy programming with [Unchase](https://dev.to/unchase)!