Visual Studio Code Editor

Introduction

Visual Studio Code Edutor is a free source-code editor made by Microsoft for Windows, Linux, and Mac. Here in this blog, we will see how to use Visual code to publish web API to azure or web apps to azure.

Getting Started

Visual Studio Code provides local emulators and extensions to build, run, and debug cloud apps directly from the editor. It includes basic support for most common programming languages. This basic support includes syntax highlighting, bracket matching, code folding, and configurable snippets. It also ships with IntelliSense for JavaScript, TypeScript, JSON, CSS, and HTML, as well as debugging support for Node.js.

To support for additional languages can be provided by freely available extensions on the VS Code Marketplace. For example, to work with C# languages and python languages, you need to install extensions, visual studio code c# for C# language, and visual studio python extension for python language.

Like Microsoft Visual Studio, it also supports features like debugging, syntax highlighting, intelligent code completion, snippets, code refactoring, and embedded Git. Users can change the theme, keyboard shortcuts, preferences, and install extensions that add additional functionality.

Visual Studio Code Download

To download and install visual studio code in windows, Visit the official site. I am not going to discuss how to install as it is very easy to install just you have to press next and next button for default installation

Publish web API to Azure using Visual Code

This is a very important topic we are going to discuss now, only for this purpose I have written this blog. Using Visual Code, you can deploy any application but here we will discuss only one of them like web API.

Here in the below demonstration, we will see how to publish a web API developed in Microsoft Visual Studio through Visual Studio Code. Note that you must have Azure account to continue this, follow the below steps to publish web API to Azure.

  1. If you have not installed Visual Code, fist install it. Then open visual code.

  2. Now to publish web API to Azure app service, we will install the Azure app service extension.

  3. To do that click on the extension icon ( the last icon), you will find it in the left vertical toolbar of visual code. search the azure app service extension, and install it.

  4. After a successful installation, you will find the Azure icon in the toolbar.

  5. Click on the icon, you will be asked for authentication. Authenticate your account by providing the details of the azure account.

  6. After successful authentication, the list of Azure resources will be listed that you have created in the Azure portal.

  7. Select your resource created for your web API than to the File menu and click on the “Add Folder to Workgroup”.

  8. Then right-click on your azure app service and click on the refresh.

  9. Again right-click on the azure app service and click on ‘Deploy to Web App…’
  10. On the top below the menu bar, you will be asked to select the deploy folder, select that.

  11. The deployment process will be started. After complete this process, you can browse your web API.

Summary

In the above, we discussed what is visual studio code, the features of visual code and how to use it to publish web apps to Azure. I hope you have enjoyed it a lot.

Thanks

Kailash Chandra Behera

An IT Professional with 12 years experience in development life cycle in windows, service and Web based application using Microsoft.Net technologies. Proven record of developing all phases of projects in Microsoft.Net technology from initiation to closure aligning with the company's Business objectives to drive process improvements, competitive advantage and bottom-line gains. -> Good exposure of independently working and developing multiple projects ->Committed to efficient and effective development of projects in a fast-paced and deadline driver environment. Skill :- Develop and design projects in various technologies of Microsoft Technology. Total IT Experience- 13+

Previous Post Next Post

نموذج الاتصال