Intro 💻

RSS is a web feed that allows users and applications to access updates to websites in a standardized, computer-readable format.

Visual Studio Code is full of amazing extensions that make our life simple. I was curious about how these extensions are made and published in the marketplace.

I decided to look up the docs that VS Code offers to make extensions. This document is really thorough and very well documented. We install the yo library and generator code library to start with. code.visualstudio.com/api/get-started/your-..

What I Have Made? ⚡️

The extensions can be made using JavaScript or TypeScript. I have used JavaScript to make a Hashnode Blogs Search extension which only searches my blogs within VS Code and opens it on the browser on command. I have used the rss.xml file instead of Hashnode API in the project.

async function activate(context) {
  // you can replace the rss.xml file with yours to get your blogs
  const res = await axios.get("https://anirudhpanda.hashnode.dev/rss.xml");
  const articles = xmlParser.parse(res.data).rss.channel.item.map((article) => {
    return {
      label: article.title,
      link: article.link,
    };
  });

My project structure looked like this:

We have to work on extension.js as it will have all our code.

How to? 💡

1. First open VSCode and press Ctrl+Shift+P on your keyboard(after installing the extension).

2. Type in 'Search Hashnode Blog' in the space and press enter.

3. Choose a Blog

Requirement/Dependencies 🤖

1. Hashnode Blog Account

2. npm and NodeJS

3. VS Code API

4. Axios Package

5. XML-Parser Package

6. Microsoft Workspace Account

Publishing extension 🎆

code.visualstudio.com/api/working-with-exte..

• We will install the library by

• We can only publish extensions using Personal Access Tokens

Visual Studio Code uses Azure DevOps for its Marketplace services. This means that authentication, hosting, and management of extensions are provided through Azure DevOps.

vsce can only publish extensions using Personal Access Tokens. You need to create at least one in order to publish an extension.

• After that we will create an Azure DevOps account here dev.azure.com

• We will create an organization and then generate the Personal Access Tokens.

• To manage extensions we will open marketplace.visualstudio.com/manage and fill out all the necessary information. Remember the id of your publisher that will be shown on the web. The highlighted one is the id.

• We will go to the official document under Create to the publisher and follow the commands

• You can publish an extension using vsce with the publish command:

This command will ask for the personal access token, if you haven't already provided it with the vsce login command above.

• Modify the

``` to remove all the errors that occurred while publishing because this Readme file is what shows up in your extension. 

After it is verified in the marketplace our extension gets onto the VS Code.

**Our Extension Is LIVE!!**  

*It can be downloaded by anyone across the entire world.*

![vsc.PNG](https://cdn.hashnode.com/res/hashnode/image/upload/v1623321981659/J9MrP7leB.png)

**Links:** 📌
- [My GitHub Repo](https://github.com/AnirudhPanda/Hashnode-Blog-Search)
- [My Extension Marketplace](https://marketplace.visualstudio.com/items?itemName=AnirudhPanda.hashnode-blogs-search#review-details)
- [VS Code Offical Docs](https://code.visualstudio.com/api/get-started/your-first-extension)