2 shortcuts that I use at least 10 times a day: - Cmd+Shift+L selects all occurrences of the highlighted text, very handy to rename a method, a variable or refactor a duplicated bit of code at all places at once - Cmd+Shift+F to search some text in the whole workspace
@Jonathan agreed, but I work a lot on data files (such as .csv or crappy .txt files) and whenever I want to change some text to another in the whole file, it's useful to use Ctrl-Shift-L 🙂
Hi Brad, I don't comment on videos much but I will here for a couple of reasons. First of all this was exactly what I was looking for when I did my search, I am so glad I chose your video. Second, I have watched a lot of your content and you have one of the best youtube channels for coders out there, if not hands down THE best. Last but most certainly not least, our life stories/experiences/hardships (as far as you've mentioned, anyway) have a creepy lot in common and you are very inspirational to me so I just wanted to thank you so, so, so very much. You might know, and I hope you do, that just showing people like me what is possible means so much more than I can say in a short comment. You have made a huge difference and I just thought you should know that. THANK YOU!!! -JD
I started using most of these shortcuts a while ago and the difference is really noticable, not only in speed but also the flow of coding feels much more natural and smooth :) thank you for the summary!
@@c1dk1n I'm using C++ and was just messing around with it - had a function named "func" and wanted to rename it with F2. It was wanting to also name symbols called "func" in the actual files inside my compiler. Quickly discarded that feature and decided to stick with normal find and replace haha. But for other interpreted languages it might be okay - just make sure you have a look at the refactor window quickly first
Thank you so much for the video, I was looking to learn VS Code too. As a dev a lot of the time we do not focus on learning our tools, learning our IDEs. Learning all these shortcuts has really helped me to be productive as a Software Eng. This was also one of the tips Tech lead has mentioned in his video.
1) Control +J will merge lines. I find it very helpful when editing HTML and even JavaScript sometimes. 2) there’s a shortcut to wrap HTML in another pair of HTML tags. you have to create a shortcut for it though. Search ‘Emmet: wrap with abbreviation’ 3) you can easily wrap a set of characters in () or {} or ‘’ or “” by highlighting the text and pressing the left version of the wrapper character. So if you highlight the word hello, then press (, the result will be (hello)
Roshan Jafri I’m on Mac. Cmd + J opens the command line for me. Control + J merges lines. Search “Emmet: merge lines” - you might have to manual set a key binding for it if you’re on pc.
Holy crap Go to Entity is super dope, I'm stealing that one ;) One my favorite shortcuts is Go to Definition: Cmd+Click on a function/variable and it will take you to where it was created. It's great for navigating.
what a coincidence - I have written down some shortcuts on Monday! F2 to rename the variable in a whole document is nuts! ALT+L ALT+O to start a live server (you need to install Live server extension before). Also installing ES7 snippets to quickly create promises, forEach etc! Alt+Down/Up to move lines. Ctrl+Shift+K to delete a line. Alt+Shift+Down/Up to duplicate a line. Ctrl+Enter to add a line below. Ctrl+Shift+Enter to add a line above.
Move by word should be Alt + Left/Right on Mac. My favourite is go back/forward with Ctrl + -/Ctrl + Shift + -. "Go to Entity" was one which I was not aware of and which I'm definitely going to use! Thanks :)
Not only that, but once a word is selected that way, every time you hit Ctrl+D after that will select the next instance of that word in your file, which you can then do multi-line editing on or just paste over the selections.
i used sublime text for years before and now i'm using VSC with Sublime text Keymap and Settings importer extension . It helps me a lot. Thanks Brad great video
Nice fact that you can use command+shift+t the same way in chrome browser too. Also I love to navigate through tabs in vscode with cmd+page up/page down it simply selects next/prev tab -also works the same in chrome :)
Alt+arrowUp or Alt+arrowDown will shift the current line of code up or down. This is better than cutting and pasting. If you hold shift down with the same command you will place cursor down or up in multiple lines.
@Traversy Media. Thank your for sharing us all your tutorials. They have been really helpful to me. You offer the best html, css and Javascript videos out there.
If you're the type of user that wants to minimize the time you spend moving your hand to and from the mouse, I recommend the VSCode extension VsVim. It emulates basic Vim operations, which have a learning curve for sure, but are super efficient once you get them down. You can also configure whether VSCode or Vim should handle each keybinding so you get the best of both worlds.
Thanks Brad! I use Sublime, but you just made me realise I could control the sidebar with the keyboard for the first time! 11:34 - R.E. the comment shortcuts - it's worth mentioning that you can also *un*comment a comment with the same shortcuts
Thanks Brad this is nice! Not sure if helpful to anyone else but you can map your own shortcut to collapse all folders in explorer. I find this to be one of the most used shortcuts for myself, especially when working with large frameworks and libraries like Laravel and Angular.
Be aware: Some of the standard settings of VSCode's shortcuts may depend on where in the world you are. Example given, I live in Denmark, so the standard keyboard shortcut for opening up the terminal for is by pressing CTRL + æ (a Danish letter). And then a little shortcut I found by accident but turns out being helpful. Instead of pressing CTRL + D to highlight the next coming appearance of a word, class or anything that appears multiple times on your screen, try pressing CTRL + SHIFT + L. This shortcuts highlight every single appearance of that word, class or anything that appears multiple times on your screen. And what's even more cool about it is that you do not have to go to the top to find the first one. You can simply highlight it wherever you find it first, press the shortcut buttons and you're good to go.
1)ctrl+w works in browsers too. Also, ctrl+t makes a new tab 2)ctrl+shift+t also works in browser 3)if you want to switch between windows, use alt-tab (works in win7, not sure about other systems) 4)if you want to refresh page with deleting all cashe, use ctrl+shift+r 5)alt+z use it all the time, if you want to wrap text 6)ctrl+shift+n makes folder (works in win7, not sure about other systems) 7)F11 opens any window at fullscreen mode. F opens youtube video at fullscreen 8)alt-F4 - closes window 9)Not a shortcut, but you can press win button, then write "code" (or any other word from Visual Studio Code) and press enter. It will open vscode. This is a quick way to open any programm
You should try the Vim plugin for VScode. You're basically already there with all these shortcuts, but using a modal editor allows for sensical shortcuts. y for copy, p for paste, w to move word by word.
i like to use the multiple cursor editing, it's like the one you showed but without having to click, you just ctrl + shift + up/down. But it needs to add "editor.multiCursorModifier": "ctrlCmd" to the settings
Thanks so much for this, I’ve been trying to use Atom just because another channel I like uses it a lot (EngineerMan) but I see how productive you are with vsCode that I’m going back to it. Love the channel and content, have bought several courses.
I'm a phpstorm user but I used all of the editors(almost), VSCode is good for an editor but i find that productivity is better with an IDE(since php storm is fully customizable too, i'm using less mouse than keyboard)! Great video Brad!
@@ilyesmilyesm2576 Usually companies give licences to their developers, if you are a student, you can use it for free and let's talk about things that makes you productive, if you are productive with it to get another project in a year, from which you get 200-300$ would you pay 160$ for it? Not sure how much is the license today, but it's worth it!
There's just one thing, on Windows (and probably Mac too) there are different layouts in different countries. for example, on my keyboard I can't do Ctrl+` to toggle terminal because the " ` " is behind Shift+Alt Gr+´ combination. On my Finnish multilingual layout I had to configure the settings to toggle terminal with Ctrl+ö
I cannot forget where you have brought me from, I will keep on supporting you where I can. I knew you this year May, so far have benefited a lot. Be blessed
How to configure keyboard shortcuts example in Dreamweaver I made the combination CTRL + B = or CTRL + P and in VSCODE you can configure keyboard shortcuts both in html files and in php?
Thanks Brad, you really help us a lot. Now, can you make a video about that code and explain it, please. I just finished you Modern JavaScript course on Udemy and I need more practice.
Navigating to content in an HTML doc seems impossible with the keyboard so I have to use the mouse for this (and have had RSI before) - any suggestions?
How can I move over the last } of a if statement, my cursor is after the ; on the line before. And I can see vsCode highlights the { and } if (1=1) { printf("test"); }
2 shortcuts that I use at least 10 times a day:
- Cmd+Shift+L selects all occurrences of the highlighted text, very handy to rename a method, a variable or refactor a duplicated bit of code at all places at once
- Cmd+Shift+F to search some text in the whole workspace
Thanks. Both are life savers :)
On Windows: Ctrl+Shift+L and Ctrl+F respectively
where can i refer for shortcuts like core css codes directly. i am beginer !
@Jonathan Agree. I use f2 frequently and it'll change the name in all files that reference that variable. Super handy
@Jonathan agreed, but I work a lot on data files (such as .csv or crappy .txt files) and whenever I want to change some text to another in the whole file, it's useful to use Ctrl-Shift-L 🙂
Hi Brad, I don't comment on videos much but I will here for a couple of reasons. First of all this was exactly what I was looking for when I did my search, I am so glad I chose your video. Second, I have watched a lot of your content and you have one of the best youtube channels for coders out there, if not hands down THE best. Last but most certainly not least, our life stories/experiences/hardships (as far as you've mentioned, anyway) have a creepy lot in common and you are very inspirational to me so I just wanted to thank you so, so, so very much. You might know, and I hope you do, that just showing people like me what is possible means so much more than I can say in a short comment. You have made a huge difference and I just thought you should know that. THANK YOU!!!
-JD
I started using most of these shortcuts a while ago and the difference is really noticable, not only in speed but also the flow of coding feels much more natural and smooth :) thank you for the summary!
Select variable and hit F2 to rename the variable in every places where it was used
@@c1dk1n I'm using C++ and was just messing around with it - had a function named "func" and wanted to rename it with F2. It was wanting to also name symbols called "func" in the actual files inside my compiler. Quickly discarded that feature and decided to stick with normal find and replace haha. But for other interpreted languages it might be okay - just make sure you have a look at the refactor window quickly first
@@c1dk1n Never. Not even once. I use it every day.
Wow that is so powerful
Thank you so much for the video, I was looking to learn VS Code too. As a dev a lot of the time we do not focus on learning our tools, learning our IDEs. Learning all these shortcuts has really helped me to be productive as a Software Eng. This was also one of the tips Tech lead has mentioned in his video.
1) Control +J will merge lines. I find it very helpful when editing HTML and even JavaScript sometimes.
2) there’s a shortcut to wrap HTML in another pair of HTML tags. you have to create a shortcut for it though. Search ‘Emmet: wrap with abbreviation’
3) you can easily wrap a set of characters in () or {} or ‘’ or “” by highlighting the text and pressing the left version of the wrapper character. So if you highlight the word hello, then press (, the result will be (hello)
Roshan Jafri I’m on Mac. Cmd + J opens the command line for me. Control + J merges lines. Search “Emmet: merge lines” - you might have to manual set a key binding for it if you’re on pc.
Oh I love these HTML ones! Update tag is really useful also.
omg idk but *Ctrl+L* opens the terminal win below the ide for me n vsCode for some reasons.. 🤷🏾♀️
Holy crap Go to Entity is super dope, I'm stealing that one ;)
One my favorite shortcuts is Go to Definition: Cmd+Click on a function/variable and it will take you to where it was created. It's great for navigating.
Or have your cursor on the instance and press F12
Brad is a mind reader! I was just looking for a tutorial like this the other day.
Brad is a shortcut expert, the React course changed my life for good, in the end it's the little things that matters the most.
Thanks 😊
This IMMEDIATELY made my life easier. I just DL'd the PDF and it's on my desktop
what a coincidence - I have written down some shortcuts on Monday!
F2 to rename the variable in a whole document is nuts!
ALT+L ALT+O to start a live server (you need to install Live server extension before).
Also installing ES7 snippets to quickly create promises, forEach etc!
Alt+Down/Up to move lines.
Ctrl+Shift+K to delete a line.
Alt+Shift+Down/Up to duplicate a line.
Ctrl+Enter to add a line below.
Ctrl+Shift+Enter to add a line above.
Move by word should be Alt + Left/Right on Mac.
My favourite is go back/forward with Ctrl + -/Ctrl + Shift + -.
"Go to Entity" was one which I was not aware of and which I'm definitely going to use! Thanks :)
also try to hit ctrl+D while cursor stays in the middle of the word - it will highlight the whole word
(cmd+D for Mac)
Not only that, but once a word is selected that way, every time you hit Ctrl+D after that will select the next instance of that word in your file, which you can then do multi-line editing on or just paste over the selections.
@@voidmind and if you want to select all instances of that word, Ctrl+F2 will do.
i used sublime text for years before and now i'm using VSC with Sublime text Keymap and Settings importer extension . It helps me a lot. Thanks Brad great video
Nice fact that you can use command+shift+t the same way in chrome browser too. Also I love to navigate through tabs in vscode with cmd+page up/page down it simply selects next/prev tab -also works the same in chrome :)
Thanks for the tips 👍. CMD + j, to open the terminal panel at the bottom also
thanks
Type ctrl + shift + p
And type keyboard shortcuts. This would open a pdf with all shortcuts
Best
And look for Help: Keyboard Shortcuts Reference
Or do control + k + s to see keyboard shortcuts.
Awesome.. Thanks
OP! :D
Alt+arrowUp or Alt+arrowDown will shift the current line of code up or down. This is better than cutting and pasting. If you hold shift down with the same command you will place cursor down or up in multiple lines.
how to move line of code to the right and to the left? i spend lot of time to move my line of code one by one
@@hvitserklothbro8298 you can select lines and move them right with Tab and left with Shift+Tab
@Traversy Media. Thank your for sharing us all your tutorials. They have been really helpful to me. You offer the best html, css and Javascript videos out there.
If you're the type of user that wants to minimize the time you spend moving your hand to and from the mouse, I recommend the VSCode extension VsVim. It emulates basic Vim operations, which have a learning curve for sure, but are super efficient once you get them down. You can also configure whether VSCode or Vim should handle each keybinding so you get the best of both worlds.
Cmd+D has helped me a lot when refactoring code by selecting each instance of a word and I can change all instances at once
Thanks Brad! I use Sublime, but you just made me realise I could control the sidebar with the keyboard for the first time!
11:34 - R.E. the comment shortcuts - it's worth mentioning that you can also *un*comment a comment with the same shortcuts
I gotta wach this when i have time. Im using vscode almost every day, and it is good to know more shortcuts.
Thanks Brad this is nice!
Not sure if helpful to anyone else but you can map your own shortcut to collapse all folders in explorer. I find this to be one of the most used shortcuts for myself, especially when working with large frameworks and libraries like Laravel and Angular.
Be aware: Some of the standard settings of VSCode's shortcuts may depend on where in the world you are. Example given, I live in Denmark, so the standard keyboard shortcut for opening up the terminal for is by pressing CTRL + æ (a Danish letter).
And then a little shortcut I found by accident but turns out being helpful. Instead of pressing CTRL + D to highlight the next coming appearance of a word, class or anything that appears multiple times on your screen, try pressing CTRL + SHIFT + L. This shortcuts highlight every single appearance of that word, class or anything that appears multiple times on your screen. And what's even more cool about it is that you do not have to go to the top to find the first one. You can simply highlight it wherever you find it first, press the shortcut buttons and you're good to go.
900k for now, congrats, Brad =) hopefully you and your channel will keep growing.
Great video! I usually use alt for tab travel too, u can go alt+1, alt+2, etc for quicker tab change!
These are great! F2 is also useful for renaming variables.
I don't even own a Mac or memorize a ton of shortcuts, but I'll watch a Traversy video, while I program my Stream Deck for VS Code ;-)
Dude yes I’ve been waiting for this!
Thank you!!!
1)ctrl+w works in browsers too. Also, ctrl+t makes a new tab
2)ctrl+shift+t also works in browser
3)if you want to switch between windows, use alt-tab (works in win7, not sure about other systems)
4)if you want to refresh page with deleting all cashe, use ctrl+shift+r
5)alt+z use it all the time, if you want to wrap text
6)ctrl+shift+n makes folder (works in win7, not sure about other systems)
7)F11 opens any window at fullscreen mode. F opens youtube video at fullscreen
8)alt-F4 - closes window
9)Not a shortcut, but you can press win button, then write "code" (or any other word from Visual Studio Code) and press enter. It will open vscode. This is a quick way to open any programm
You should try the Vim plugin for VScode.
You're basically already there with all these shortcuts, but using a modal editor allows for sensical shortcuts.
y for copy, p for paste, w to move word by word.
Alt+Shift+right/left was new to me.. Very nice!
i like to use the multiple cursor editing, it's like the one you showed but without having to click, you just ctrl + shift + up/down.
But it needs to add "editor.multiCursorModifier": "ctrlCmd" to the settings
Hello
I want to help
How to return the vscode interface first
Because I pressed the ctrl +} button and the interface became very large
Ctrl+K, Enter promotes a "preview" to a "tab".
Thanks Brad, made my weekend. A very useful content.
7:00 when you create a new file, you can select a language with Ctrl+K M
One I have recently found and started using every now and then, To retract all functions = Ctrl + K + 0 and to open them all back up = Ctrl + K + J
Thanks so much for this, I’ve been trying to use Atom just because another channel I like uses it a lot (EngineerMan) but I see how productive you are with vsCode that I’m going back to it. Love the channel and content, have bought several courses.
I really love coding after inspire from brad traversy i create my first youtube channel
I'm a phpstorm user but I used all of the editors(almost), VSCode is good for an editor but i find that productivity is better with an IDE(since php storm is fully customizable too, i'm using less mouse than keyboard)! Great video Brad!
but it's expensive x))
@@ilyesmilyesm2576 Usually companies give licences to their developers, if you are a student, you can use it for free and let's talk about things that makes you productive, if you are productive with it to get another project in a year, from which you get 200-300$ would you pay 160$ for it? Not sure how much is the license today, but it's worth it!
@@ProgrammingwithPeter I am student, how can I use it for free?
@@ilyesmilyesm2576 search jetbrains student pack
@@ProgrammingwithPeter ok thank you, I'll try it
Thanks! Very helpful video mate! 😎
Thanks bro. 😍 happy new month!
Nice
Brad I am not bragging but you are a gift from god
Press F1 for even easier Command Palette invocation. 😉
There's just one thing, on Windows (and probably Mac too) there are different layouts in different countries.
for example, on my keyboard I can't do Ctrl+` to toggle terminal because the " ` " is behind Shift+Alt Gr+´ combination.
On my Finnish multilingual layout I had to configure the settings to toggle terminal with Ctrl+ö
Thank you for the useful tips! ☺
Awesome man just the thing I wanted to know
Great video Brad
I cannot forget where you have brought me from, I will keep on supporting you where I can. I knew you this year May, so far have benefited a lot. Be blessed
Thanks Brad. I needed this one. I am also new to web development.
Very helpful video 💛
Thank you for your Gist With Shortcuts, it is helpful to review.
Thanks so much. This was super useful!
Thanks so much for the indispensable tutorial.
Brad, in which video do you talk about the reason you've switched from Windows to MacOS?
awesome shortcuts! thanks
Thanks so much for this video! It helped immensely
Command + D or Control + D to actually select an entire word where the cursor is. Instead of doing Cmd + Shift + left or right arrow. :) Amazing Video
Love the videos! Could you do a tutorial on hosting a node application on web server? Either way, thank you!
Daniel van den Akker i have one showing you how to deploy to digital ocean with ssl. Look back about a month ago. I have one with heroku as well
Thank you for sharing, Brad!
Nice and helpful video!
i did learned a lot from you man, thank you :D
Congrats on 900k
Great video, helped out!
helped me a lot . thanks
Brad you are my hero!
This really helps🥰
How to configure keyboard shortcuts example in Dreamweaver I made the combination CTRL + B = or CTRL + P and in VSCODE you can configure keyboard shortcuts both in html files and in php?
- Select a word and Cmd+shift+F find this word in the entire workspace, very useful when you want to know where this word is used.
Thanks, great tips...
Are your files in the "file explorer panel" categorized by types? if yes, what extension are you using?
Today my friends, I have taken the responsibility and decided to not play with mouse anymore.
Thankyou Brad ♥️
Pressing F2 will rename a variable/function/tag without having to select all occurrences with Ctrl+D (if it's different search for "Rename Symbol")
Much love Traversy!!!
Thank you Brad, love ❤️ and respect 🙏 from Sikkim India 🇮🇳
What extension gives you that nice line connecting brackets?
Thank you for this❤
This is a great video!
On Windows, you can scroll up or down in a file using Ctrl + Arrow key Up/Down 😀
my man really did record himself reading documentation
Thanks dude, holy shit this helped me, the amount of times I had to change or find shit is annoying
Thank you @brad sir..
Very helpful. :)
Thanh Brad because the videos is very good! I follow you
Thank you. Very beneficial. In which language they created VS code?
If I'm using a function from another file and I want to directly jump to that function definition. What is the shortcut key for that?
Thanks Brad, you really help us a lot.
Now, can you make a video about that code and explain it, please. I just finished you Modern JavaScript course on Udemy and I need more practice.
Could you do a tutorial on Payment using React.JS
This is just deep fried Vim. Learning Vim will pay off, VSCode also has good Vim extensions.
Great. So useful. Thanks!
Navigating to content in an HTML doc seems impossible with the keyboard so I have to use the mouse for this (and have had RSI before) - any suggestions?
Very Nice Video❤
How can I move over the last } of a if statement, my cursor is after the ; on the line before. And I can see vsCode highlights the { and }
if (1=1) {
printf("test");
}
Good article Thanks Brad.
Nice Mr Traversy
How can I set Enter as a Run code short cut?
How do you move the cursor a character forward or backward without using the left or right arrow keys?
I wanna stop using arrow keys to traverse through lines, etc. Because there is a lot of hand movement while doing that. Is there any tricks for that?
Thanks for sharing 👏
Thank you for content and inspired!