How To Create And Deploy A VSCode Extension

[@hsjeevan]

I was able to create my own extension and publish it to the marketplace. Appriciate all the effort that goes around making such informational videos. Thanks WDS!

[@CodeWithTomi]

I've been waiting for this video... Because I know it will be simplified here☺️

[@AMP_PLUS]

TOMI!!!! REMEMBER ME ;)))))

[@JenuelDevTutors]

I just realized this is the only channel where I can easily understand what you are talking about, SUBSCRIBED!

[@CodingNuggets]

I always see Ben making these extensions and wondered a little about how it's done. Now you come along and teach me how to do it Kyle. Thanks. See you soon!

[@zafaris]

Exactly! Ben Awad is the CEO of making VS Code extensions 🤣

[@maksimhristov3904]

Ben did a tutorial on how to make vs code extension

[@CodingNuggets]

@@maksimhristov3904 Guess I missed it. I'll have to look back.

[@santoshpathak8201]

I want your help to build my own Extension in VS code , Currently confused how to get started and how to integrate it with ML. Can you please help me out ??

[@BrianKapellusch]

I started building extensions for some of my clients about a year ago, and I was pretty amazed at how easy it is to get one up and running. There always seemed like a barrier to entry when it came to building Visual Studio (not Code) extensions. But now I feel like we're getting to the point where there needs to be frameworks or at least patterns for building larger vs code extensions. Or perhaps even vscode extensions to help to build other vscode extensions. I know I've saved my clients a fair bit of money by utilizing extension points like diagnostics to provide custom warnings and errors for things that simple linting rules can't catch. But as those extensions have gotten bigger, I've really had to focus organizing that code so that I and the others who will ultimately maintain it don't get lost.

[@Mr_Addy1]

hey are u still active i wanna know can we open the link of the blogs in the vs code itself

[@lesmatheson6001]

Appreciate your focus on packing the video with meat and removing filler. I like when I have to hit pause frequently to try things out -- talking fast is not a problem.

[@zafaris]

I was thinking how someone would make a VS Code extension and then you upload this video! I know this is gonna be great 🤩👍🏽

[@laurenzrausche2387]

Hey Web Dev Simplified, I‘m that guy with the git repository. I‘ve always wanted to make a vscode Extension, but i dont want to watch the whole 3h of it. Thank you so much for your tutorials

[@aqua7897]

You are a true JS master, I can’t wait for your course!

[@thisissyedbasim]

You literally have a video on whatever I need 🥰. Thank you so much Kyle

[@jonasboon3702]

Great video! I was able to make my first VS Code extension watching it. Thanks!

[@RudraprasadMohapatraa]

Thank You Sir. Love and Support from Bharat (India).

[@swdodg]

If not, replace it with the code below. 10:56 const { XMLParser, XMLBuilder, XMLValidator} = require("fast-xml-parser"); 11:18 const parser = new XMLParser(); console.log(parser.parse(res.data));

[@ambroseleung4730]

Thanks for that. For others wondering why this works - it's because fast-xml-parser made breaking changes from v3 to v4. You can also install the package again with: npm i fast-xml-parser@3

[@randospawn7495]

Thanks bro, with this knowledge I'm makin' an assembler x64_86 program to test out some theories on possible compression or error correction and data recovery algorithms.

[@xdanier4872]

A very clear and concise introduction

[@pranavjain9799]

This is an incredible video. It helped me make my first extension!

[@dawid_dahl]

Great and straight to the point. Thanks! 🙏🏻

[@lofistudio9652]

I had this curiosity this morning

[@RobDuarte]

This is such a great tutorial - thanks!

[@elihappinesspie]

What I had to do differently to make this work in typescript: 1. You have to invoke the .default thingy for axios. "const axios = require('axios').default;" 2. You have to import the XMLParser like this: "import { XMLParser } from 'fast-xml-parser';" 3. You then have to instantiate a parser from the XMLParser constructor, like this: "const parser = new XMLParser();" 4. THEN you can use the xml parser like this: "const articles = parser.parse(res.data)" 5. You have to declare article as any, like this: "const article : any = await vscode.window.showQuickPick..."

[@luckyvanilla388]

Maybe awkward but love your voice and the way you speak 😅

[@vrindatyagi6744]

THANKYOU SO MUCH I SUCCESSFULLY MADE THIS TODAY!

[@hammasshahid3566]

Great video kyle! Can you show how to make chrome extensions next? It will be very helpful for me since i really like your teaching style 😊

[@tiffanyk2743]

This would be awesome

[@vedantthombare1028]

kzbin.info/www/bejne/oIKkp4ODh5WJiNU

[@MalluMonkAthul]

Enthamee.... Enth chekkan daa nee... Nee verum Poli...

[@SuboptimalEng]

♋︎ articles, obligatory N I C E

[@sainathsingineedi2922]

Is there a place that I cannot find you?😂

[@SuboptimalEng]

@@sainathsingineedi2922 It is the KZbin algorithm, recommending us the same channels

[@proflead]

Thanks for sharing! I should try!

[@insaneviruss]

Thanks mate! This was helpful

[@neozoid7009]

Awesome tutorial , I have a Question Can I make and use a extension personally without publishing or uploading in vs code market place ??

[@dancehalllyrics1303]

I was so close to go back and rename my project "The Other Side", so VS Code would print out "Hello from the other side".

[@OndrejPopp]

Tx for the intro!

[@neonwatty]

super helpful!

[@pawejakubowski829]

Anynone has the same problem that after running F5 it doesn't run extension? Nothing shows in console and also no hello world command was available?

[@othmane8954]

hey Kyle, nice video ! I have some sound issues sometimes, it goes really low for a sec or two, then go back to normal volume, and again ! (juste in this video in particular) Have a nice day

[@btcls]

Fk this is the best video I ever find you save my life

[@arvindkumar-ug1zf]

Thanks for amazing video

[@sairfan06]

Thanks for a great tutorial, I want to know can we publish locally for installing extension for personal use only?

[@mplovecraft]

My Bookmarks tab is basically turning into a Web Dev Simplified playlist...

[@kavilivishnu2258]

Thank you very much for the tutorial sir! My projects are all hosted on Netlify. I'm not able to get the XML format as you got for your blog page, sir. What should I do to get the same format?

[@a3fckx]

Helpful

[@Caiomsilva]

about the step of adding the command string and title in package.json, I'll always have to add it manually? what if I have 1000 commands to be added?

[@kavindesivalli]

Woah what a coincidence... I was just looking at Ben Awad's how to create an extension video

[@sainathsingineedi2922]

Double coincidence I watched that video yesterday

[@amitdutta3875]

can you make a video about how to create google chrome extension using node js?

[@WebDevSimplified]

I already have a video on that topic.

[@amitdutta3875]

@@WebDevSimplified yes sir i watched that but I want to use node js module like puppeteer to scrape data that kind of thing.

[@amitdutta3875]

and is it possible to deploy node js packages without running on server??

[@islamis_powerful]

At starting of this extension I faced a issue related to yo code i resolved it by these commands and also installed a package : command1: Get-ExecutionPolicy command2: Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser command3: PowerShell -ExecutionPolicy Bypass -Command "yo --generators" Please install this package : npm i -g yeoman-generator Thanks

[@bridgersilk]

thank you so much, i had the same problem and this fixed it. :)

[@islamis_powerful]

@@bridgersilk good man HAPPY CODING/

[@BostYT]

I don't like how you're always like "And it should work now. But of course, you need to install...."

[@rangabharath4253]

Awesome 👍😎

[@haydees1158]

thanks!

[@oomg_litx1957]

Nice video

[@jillpatel2998]

Hello,Can anyone please tell me which tools you used to create the pdf of webdev roadmap 2021 which was both in light and dark mode

[@WebDevSimplified]

I used Figma to design it completely.

[@jillpatel2998]

@@WebDevSimplified ok, thanks for reply

[@VidTDM_XD]

I have two questions 1. How do I set a git rep for it? 2. How do I change the icon?

[@prajjwaldubey721]

i am getting an error: "Activating extention: undefined publisher_wds how to resolve it????

[@quochoangang6014]

Help me. When I use Fast xml parser in typescripts I have error "Command result ed in an error (command not found)". How to fix???

[@huizhong3713]

nice course. but I came cross a problem when I start my project with typescript, 'axios' will be undefined

[@keithh7994]

How did he find out you need a label && descriptions for the showQuickPick function? I couldn’t find that anywhere in the documentation ?

[@haralc]

Is it possible to have normal extension project and also declare snippets?

[@ravikiran925]

my extension is working finally local but after publishing . It's throwing command not found issue. any idea bro?

[@hosstaba]

When I try to use "require", I get an error, had to use" import" instead. Then when I use "axios", there's no "get" method. There's a "axios.default.get" method, but calling that causes this error: "Activating extension 'undefined_publisher.helloworld' failed: Cannot read properties of undefined (reading 'get')." I'm completley stuck, can you please help? I ssem to have similar issues when trying to use any npm package within an extension. I tried to use the package 'clipboardy", & again there was only a "default" method, & all other methods were within default, & calling any one of them would result in this error: "require() of ES Module c:\helloworld ode_modules\clipboardy\index.js from c:\helloworld\out\extension.js not supported. Instead change the require of index.js in c:\helloworld\out\extension.js to a dynamic import() which is available in all CommonJS modules." Please help! Your help would be greatly appreciated

[@jieqiangwei7569]

can we use addEventListener or keyboardevent in vscode extension? I basically need to execute sth if user press a specific key.

[@AlThePal78]

How would I edit the code because I want to do some other stuff to it updated my extension

[@penocrat]

How did you create the rss.xml file, please?

[@tazimrahbar7882]

Hey can you please make a video about how to use "registerWebviewViewProvider" using JavaScript?

[@mastergamer4335]

can i use the same personal access token for all my VSCode extensions? =D

[@yash1152]

0:21 no stack to full stack to overflown stack oh lol

[@KrishnaTiwari-fz4ev]

Hello can we create vs code extensions with c# language?

[@codedecode1498]

Madlad coded a vs code extension in vs code

[@dreamslayer2424]

The first part of the video shows him typing the code npm install - g yo generator-code; however, what he does not tell you are what configurations and installs he has made to VS Code that allows him to run the extension to use the npm command.

[@janwilmans]

exactly, I still have no idea how to start

[@olamilekanajibola7686]

@@janwilmans install node

[@waadlingpenguin4863]

because it's assumed that people who are watching this already know how to use node

[@abhishekabramaina6167]

VS code extension tab is flooded people trying your example😀

[@gajjalasrinivasrao3430]

When we publish, it is public, how can we make private

[@ayushnautiyal9469]

how can i use the graphics here. i mean like react graphics

[@prajjwaldubey721]

how to resolve :"xmlParser.parse() is not a function" error????

[@kiko_codes]

Respected Lord! I have a great video idea for you and I personally wanna make it, a VSCode ChatGPT extension that reads all the code and finds bug and replaces the code with debugged code in a click! I think it will be a fantastic video.. Guys please like so that he sees it!!!

[@EdgarCostanzo]

Can anyone point me to a beginner's resource that will help me develop an extension that interfaces with the default git extension? Thanks in advance.

[@n0o0b090lv]

4:27 i paused video then tested and in the console was nothing THEN i went on 2 day rambaling instaling reinstaling typescript instaling typescript other nonsence and today i got tierd and just started tutorial agene got angry agene at this part but then i heard magical words "dont worry its my extension" ..... to say the least i was dead inside

[@n0o0b090lv]

it works just fine now

[@tgp.dusted]

npm isnt on cmd prompt what you on about

[@haralc]

How to auto-activate the extension?

[@martyrd0m]

Make a petty print extension in vs code for HTML CSS JS JSON

[@william3588]

why not use TS?

[@shahadathimel8629]

how to update the extension after publishing ???

[@rahulkhandelwal7034]

Can anyone help me I am getting an ERROR : property `name` is mandatory and must be of type `string ` Pls help me , how should be I resolve this error .

[@tonyfang5618]

Did you solve this problem?

[@armaganboi]

yay

[@muhmmadirshad7376]

how to make this ubuntu linux extenstion

[@zencraftitalia9368]

i've not VS Code Extension Development (Preview) Option

[@kumarutsav1123]

4:00

[@abhisheksrivas4589]

I tried everything but can't find the hello world command.

[@rishabhverma7730]

Who the hell is that one dislike guy 😕😕😕😕😕😕

[@avijitchanda7944]

Please make a music player in react js please

[@tigidou3344]

Don't work. The extention is not listed in Developpement host.

[@prakhargupta5410]

going through the same issue did you find out what was going wrong

[@akgang602]

Second

[@starboy_AJStar]

sir make one more extension for indian, all comments of programming library any language will change english language to hindi language

[@bco-fm5qu]

For you it said added 2 new packages! for me. well... 856

[@mohamedshuaau632]

69 items. Yeah that was not planned

[@samarmohan9891]

First

[@santoshpathak8201]

Anybody in the community who knows that how to build a extension from scratch . I want a guide for my project. Please let me know if there is anyone who can assist me++

[@andrewchu6370]

I feel uncomfortable with that thumbnail. Staring into my soul... Little do I know, I’m staring at his screen. He should feel more scared

[@kartikmahajan620]

69 articles noice

[@grzegorzsokalski7328]

VSC < JetBrains Tools

[@sebin7856]

is it possible to build it with python

[@NinjaAhmed-cp3pe]

10th

[@thehood0279]

fifth

[@zedleclair6638]

the ternimal

[@prathamrajgor]

How to add a sidebar to an extension. You didn't teach things which a person would actually use. You taught what 100s of tutorials have allready explained before you. You should try to make videos on topics which haven't been covered yet not those which allready have been explained before by other people.