Two personal must-haves for me are Todo Tree (extends the custom tracking of TODOs to a customizable list of code words) and Rainbow Brackets (for when your statements get a bit too self-embedded). Heartily recommend both.
Thanks so much! Just started HTML+CSS and really love VCS so far. Just didn't know where to start with extensions for what i need. You explained all of these so well.
Dude, seriously, thank you so much! That was really clear and really helpful. I so appreciated that you actually showed what each one does in real time.
Hell yes man, thank you for the suggestions. I’m barely getting back into HTML and I didn’t really use it much outside of school, so it’s nice to improve quality of life
Extension config is outdated bro. 1. Auto-rename for HTML is inbuilt into VScode under the setting "editor.LinkedEditing". The only reason to run the extension is if you want additional capability in js or jsx files. Note if you don't like the red background highlight you can style that using - "editor.linkedEditingBackground". 2. Instead of "IntelliSense for CSS" and "CSS peek", you can get rid of both those extensions and just run the "CSS Navigation " extension (by pucelle) instead which gives you the same capabilities, and then some. 3. Lorem Ipsum isn't an extension by itself, it's built into emmet and it's pretty powerful when used with it. For example - div>(p>lorem)*3 Other extensions i recommend: - Auto Schema - File utils (rebind make new file and move file shortcuts) - Path Intellisense - Image preview
As someone who is learning and sometimes get mixed up putting styles on the wrong element, it would be cool if there was some sort of inheritance or relationship tree extension that was color-coded or something, does such a thing exist? Or maybe something like peek but shows you associated elements.
Very cool and helpful thanks! Not sure why but CSS peek is not working in my workspace, it keeps kind of "loading" (showing a blue bar moving on top) but nothing shows up, any clues?
Cool, helpfull! But the colors of CSS peek are really bad... I miss Brackets :( Brackets have a wonderfull integrated "peek"... It's possible to change the selcted peeked id/class backgroundcolors?
Thanks, some really useful extensions there. There is one function however that I cannot find anywhere... To be able to inspect an element in the browser/preview then click to edit any of the CSS styles for that element. I can't find an extension for this anywhere. Do you know of one?
Thank you for this tutorial, but you forgot to clarify how the Lorem Ipsum works to get reduced to the word Lorem3000 instead of appearing that supper long annoying line of dummy text.
I unable to run my html code on vs code they give a error you don’t have html debugger and recommend to download I download 3-4 recommend extension from the list but nothing is working same error came again and again what should I do please suggest.
Excellent! Thank you very much for these suggestions. In my case, "Intellisense for CSS class names in HTML" worked beautifully with Typescript React components.
I assume they called it "prettier" because "uglify" was already taken. 😁 Seriously, prettier is the kudzu of web development. Difficult to contain, and impossible to eradicate once it takes hold. 🤬
Two personal must-haves for me are Todo Tree (extends the custom tracking of TODOs to a customizable list of code words) and Rainbow Brackets (for when your statements get a bit too self-embedded). Heartily recommend both.
Update : rainbow brackets is not implemented directly in VScode ^^
Thanks so much! Just started HTML+CSS and really love VCS so far. Just didn't know where to start with extensions for what i need. You explained all of these so well.
Dude, seriously, thank you so much! That was really clear and really helpful. I so appreciated that you actually showed what each one does in real time.
Hell yes man, thank you for the suggestions. I’m barely getting back into HTML and I didn’t really use it much outside of school, so it’s nice to improve quality of life
Thanks for putting me on the fast track to setting up VSCode for HTML.
With peek you can edit the CSS straight in the peek window, no need for actually visiting the file. it's amazing.
Extension config is outdated bro.
1. Auto-rename for HTML is inbuilt into VScode under the setting "editor.LinkedEditing". The only reason to run the extension is if you want additional capability in js or jsx files. Note if you don't like the red background highlight you can style that using - "editor.linkedEditingBackground".
2. Instead of "IntelliSense for CSS" and "CSS peek", you can get rid of both those extensions and just run the "CSS Navigation
" extension (by pucelle) instead which gives you the same capabilities, and then some.
3. Lorem Ipsum isn't an extension by itself, it's built into emmet and it's pretty powerful when used with it. For example - div>(p>lorem)*3
Other extensions i recommend:
- Auto Schema
- File utils (rebind make new file and move file shortcuts)
- Path Intellisense
- Image preview
lol
Thanks
Auto rename also doesn't work with .vue files
probably coolest guy that i saw doing tutorials
As someone who is learning and sometimes get mixed up putting styles on the wrong element, it would be cool if there was some sort of inheritance or relationship tree extension that was color-coded or something, does such a thing exist? Or maybe something like peek but shows you associated elements.
Love the clear explanations of every extension, thanks! :D
Very useful thanks!
I'm currently looking for a very basic tutorial of how and what I need to do to Visual Studio Code to start coding .HTML & .CSS basic code.
Auto Rename Tag is life saver! :)
Mad respect my man, thanks for this video im new to coding and this will help me so much. I subbed and liked -_-
They are all very helpful. I think they are going to be very handy! Thank you!!
Thanks man, it’s helps me a lot , you are amazing.
hello! im new to coding, thanks for making this easier!! i look forward to watching more of your videos!
Great tips! Thanks, im like the cool kid in my college course now.
Thank's bro you help a lot
Very cool and helpful thanks!
Not sure why but CSS peek is not working in my workspace, it keeps kind of "loading" (showing a blue bar moving on top) but nothing shows up, any clues?
Cool, helpfull! But the colors of CSS peek are really bad... I miss Brackets :( Brackets have a wonderfull integrated "peek"... It's possible to change the selcted peeked id/class backgroundcolors?
Thanks, some really useful extensions there. There is one function however that I cannot find anywhere...
To be able to inspect an element in the browser/preview then click to edit any of the CSS styles for that element.
I can't find an extension for this anywhere. Do you know of one?
Man this guy seriously his voice is like asmr goes 90s 😂 its soooo good his voice is awesome I can watch this video all day long ❤️
thanks for all the extensions
Thank you very much. it's really helpful broo..
Is there a way to see how many times each extension was installed? Some kind of ranking or something.
Yes, just expand the left pane out a touch and you’ll see the number of installs. You can also go to the vscode marketplace link see it there.
Awesome and very well explained!! Thanks!
Nice job , buddy. tks for you 👍
Really loved this video. It was informative and fun.
great topic, thanks👍
this is awesome, loved it
So good man . it is so helpfull.
I appreciate your help. Thank you so much.
thank you for you good mood ! you are a cool man
Excellent extentions you told it helps me a lot
Yes, it is very useful. Thank you!
This is a great video, thanks a lot!!
Thank you for this tutorial, but you forgot to clarify how the Lorem Ipsum works to get reduced to the word Lorem3000 instead of appearing that supper long annoying line of dummy text.
U r the best Mann saved my time 🤝
How is the extension called for the coulours before each lines text?
Indent Rainbow
Nice vid. ps change your fire alarm battery
Man, your tutorials are so soothing. Thank you.
Thanks so much! This helped me a lot!
thank you bro, you are a genius!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
nice video
Given too much knowledge
this is great! :D
I unable to run my html code on vs code they give a error you don’t have html debugger and recommend to download I download 3-4 recommend extension from the list but nothing is working same error came again and again what should I do please suggest.
Thank you! :)
Thanks for this _ very helpful 👍
If I put .grid, auto-complete wont propigate to make the code. What do I have to install to get this working. I won't make it.
How do you get the html and css code to display side by side view? Sure its a toggle.
Cool video and great extension thanks so much
Excellent! Thank you very much for these suggestions. In my case, "Intellisense for CSS class names in HTML" worked beautifully with Typescript React components.
A++ for positivity
awesome tutorial sir
that was grate thank you friend
Out of 10 extensions how much extensions i should download...
Thank you!
on the 3rd extensions how to go to settings?
Thank youu!!!!!1
css peak not working for me, i just see a white line loading at the top
css peek ain't working for me it keeps on saying
"no definition found"
helpful brother
How can I use the shortcode ctrl + K K. I dont know how use two combination short code. If anyone knows, can teach me?
nice video, thanks
Dr. Seuss Hop and Pop, I'll take my $10 on paypal thank you
You win! But I said “points”, not dollars. 😉
@@DevelopingDadCodes oh man what's the conversion rate on those
@@ABoringTool unfortunately, they’re a lot like Schrute bucks, virtually useless. 😆
@@DevelopingDadCodes I have some stanley nickels too, what about those?
THANKS A LOT
i think i've found my coding teacher with the jokes🤣🔥🔥
شكرا لك 🌹💕🌷
Great video
How to on color gap columns like in video? smn knows that?
nice bro
continue
If it doesn't work for you, search for Default Formatter and select prettier
Super and fun :-)
Thank you so much.
thank you buddy👍
It comes from the the p tags?
Edit: lol faillllll... it's true, but after reading the comment section....🤦♂️
🙌🏾🙌🏾🙌🏾🙌🏾🙌🏾🙌🏾
why prettier deletes empty line?
thank you
such a cool guy thank you
Only works for HTML. You t need to Paht PHP n ur enviroment variables as too
cool video)
what about VS IDE
it's Dr.Suess , Cat in the hat
Brackets pair colorizer
that live server is made by my friend in college
Looks like VS Code won
You can just use format document instead of prettier...
WE ALL ARE TALL ಥ_ಥ
I assume they called it "prettier" because "uglify" was already taken. 😁 Seriously, prettier is the kudzu of web development. Difficult to contain, and impossible to eradicate once it takes hold. 🤬
Classic html... "I D u N n O w H a T t O d o W i T h T h a t"
CSS: "I'll help you!" *dies*
Nice teaching but you probably talking fast 😭😭 Thanks though ✌🏾
Thank you!
thank you very much
Thank you!