Hello friends, I'm now on Twitter 🐦 twitter.com/SuboptimalEng

When you learn Vim you never want to edit code without it, it's so incredibly efficient and ergonomic

@SuboptimalEng

3 жыл бұрын

❌ Impossible 🔥 Vimpossible

@Tantandev

3 жыл бұрын

@@SuboptimalEng haha never heard that one :)

@Dorbellprod

2 жыл бұрын

Tantan... real??

@Tantandev

2 жыл бұрын

@@Dorbellprod it's a me! Hi Dorbell!

I've been wanting to improve my workflow for a while now and reduce the mouse and the arrow keys usage within VSCode. I've always known about vim but never tried to learn. There's for sure a lot of material online, one can easily get lost, but I think I have found the perfect channel for productivity and workflow tips, to get me jump started. I have already watched some of your vids and will do more, you explain in a clear way and showcase common use cases where ergonomics can be optimized, thanks for sharing :)

@SuboptimalEng

2 жыл бұрын

Appreciate the comment Hawk! Glad my style of videos helped you get started with Vim ☺️

Another simpler way to enable tabs: Go to the normal keybinding as you show in the video and right click on it. Select the "Change When Expression" and remove the !editorReadonly option. Same for outdent and shift tab.

@atalatal

Жыл бұрын

Won't that interfere with other things. Like reading a git change.

Having switched from mac to pc, it takes a lot of effort to map all the keys and commands, especially with the home, end, page up and down keys. So having keybindings like Vim is quite "universal" and definitely helps.

@Ikram-Hussain

Жыл бұрын

do you know which theme he used?

@liggodoggo998

Жыл бұрын

​@@Ikram-Hussainlooks like gruvbox

Your channel looks great for frontend developers. Productivity+Tailwind+Vue=🔥❤️

@SuboptimalEng

3 жыл бұрын

I’m slowly getting into TypeScript (and GraphQL) as well 😛

Sounds like setting up Vim is pretty straightforward, I'll need to try it. The defaults are just so ingrained though...

@SuboptimalEng

3 жыл бұрын

Do it for the ergonomics 👀

5:35 "The only way you can enter vim mode is by pressing escape". I don't understand why you call it the vim mode rather than normal mode, but you can enter into normal mode from insert mode using ctrl + c (C_c) or even ctrl + [. I use these two all the time.

@klimmesil9585

2 жыл бұрын

Most vim users use escape on caps lock. I use it and now I yell very hard and high when someone doesn't bind caps lock onto escape (my information source is my teacher, and stack overflow so don't take it for granted haha)

@hemanthkotagiri8865

2 жыл бұрын

@@klimmesil9585 i bound escape to jk. No kidding, there's a tone of people who do this their own way. But, my comment was originally intended to clarify that "escape key is not the only way you enter into normal mode" - as the dude states otherwise in his video.

@nekusakuraba4000

2 жыл бұрын

Yeah! I use have Caps lock bound to LCtrl, so I can just press "Caps + [" and I can enter normal mode

@jabuxas

Жыл бұрын

@@klimmesil9585 how did you set caps in vim.insertModeKeyBindings? I use caps instead of Esc in my regular config of vim but don't know how I should set it here

Just found this channel. So cool!

Great video. Good information with explanations at a nice pace. Too many KZread “so-called tutorials” simply show stuff without adequate explanations.

@SuboptimalEng

Жыл бұрын

Thanks, I’m glad you appreciate the “why vim” explanation!

Very good point about the ergonomics

Vim helped me to relieve my wrist pain alot. && it also follows atomic habits temptation bundling!!!

this is very helpful. thank you!

It's not the case that Vim doesn't have the tab to indent feature, it's just that the keybinding is different. Visually select some text and Use the ">" or "

@SuboptimalEng

3 жыл бұрын

Oh interesting, I did not know that. Thanks for explaining!

@SisiraSomaratne

3 жыл бұрын

That's very nice! But how can we do 2 or 3 tabs? In that way after one tab selection disappears.

@hemanthkotagiri8865

3 жыл бұрын

@@SisiraSomaratne There's a neat little trick for that. Say, you know how many tab overs you want to have. You can simply do n> or n or

@SisiraSomaratne

3 жыл бұрын

@@hemanthkotagiri8865 Oh! Again the Vim basic! Thanks.

@DragonKidPlaysMC

3 жыл бұрын

It doesn’t work for me. However pressing shift before pressing does the trick

hello thank you so much for this it actually incresed my productivity

@SuboptimalEng

3 жыл бұрын

🦾

Great video! Subscribed.

thanks for leaving your configuration in the description

@SuboptimalEng

2 жыл бұрын

How else can I up my stars on GitHub 😉

@shawnbeans7389

2 жыл бұрын

@@SuboptimalEng lol i forgot to do that ill go do it rn :)

nice vid, also learned outro was a thing!

Hi, just found your channel today! Really like your videos, subscribed.

@SuboptimalEng

3 жыл бұрын

More videos coming out 🔜

@dominikm1457

3 жыл бұрын

@@SuboptimalEng Awesome, looking forward to it!

I don't know if this will work for everyone, but if you really want fluidity between normal and insert mode, the fastest thing is probably to remap (through iOS, Linux or Windows config files) the keys "Esc" to "Caps Lock" and vice versa (since most of us don't really use Caps Lock not even once a month but Esc is one of the most used keys if you use vim keystrokes)

@SuboptimalEng

3 жыл бұрын

I remapped Caps Lock to CTRL for that utility 🦾

@channalbert

3 жыл бұрын

@@SuboptimalEng Oh, I see, emacs style 👍 #respect

@leondu

2 жыл бұрын

@@SuboptimalEng FWIW, I switched `Esc` and `CapLock`, `Win` and `Ctrl`, and things are working quite smoothly.

@LocalTrashyt

Жыл бұрын

I was thinking the same but I can seem to right caps lock the right way to do it

@conradmbugua9098

10 ай бұрын

I remapped mine to "jk"

Could you make a video on your vim setup? (more vim related content) I think its really good, as you have a better experience with vim.

@SuboptimalEng

3 жыл бұрын

I definitely plan to do more videos related to Vim and VSCode next year 💪

this got me going. thanks.

Thanks a lot for this video

Thanks for the vid! Super cool! Curious, what syntax theme are you using?

@SuboptimalEng

2 жыл бұрын

Thanks Noah! I usually switch between GitHub dark, Gruvbox, and Gruvbox material themes.

great video, thanks mate

Thanks, we need another video please more on vim tutorial

@SuboptimalEng

3 жыл бұрын

Will do, in 2021!

Great video. May I ask what key stroke overlay are you using?

@SuboptimalEng

3 жыл бұрын

Thanks! I’m using KeyCastr 🦾

keep up the work small coding channel

Great vid, thanks

Great and THANKS!

I remapped ii to esc and thanks for that tip.

@SuboptimalEng

3 жыл бұрын

🔥

This was helpful for me, thank you. Personally, I prefer to not add tabs in normal mode because I prefer that only insert mode has the potential to augment the code.

@nihancj

2 жыл бұрын

I don't want to edit my code in normal mode but I do want to add/remove tabs on multiple lines when I'm on visual mode. The only way to do this is by enabling the option to use tabs in normal mode.

@Yuna_Maxwell

2 жыл бұрын

@@nihancj just do ">"

Thanks dude!!

Thanks for sharing that tabbing in normal mode fix! How did you even figure that out? I noticed it stops tab from working with vscode snippets though, so disabling it :(

@SuboptimalEng

2 жыл бұрын

Thanks! What is your issue with VS Code snippets? I put cmd j/k as keybindings to traverse VS Code suggestions.

@ArkFreestyle

2 жыл бұрын

@@SuboptimalEng ah, didn't realize I needed an additional keybinding. The issue was just that I could no longer tab through the snippets. Thanks for the quick response! I'll give it a shot.

what plugin do you use for the screencast while typing . i mean the key's showing the monitor when you type something

Loved it

Liked and subscribed ❤

I like the subject here but the where did you find the "keybindings.json" and can you share your settings with us?

@SuboptimalEng

3 жыл бұрын

Cmd + Shift + P -> start typing keybindings and you should see it appear My settings are on my Github under the Dotfiles repository 😇

In vscodevim, You know whenever you go to a line and hit ci' you delete whatever is inside the single quotes and you are left into insert mode. This works regardless of your cursor position on the row. Well how can I do the same with parentheses or curly brackets because currently, this works only if my cursor it at the opening bracket or between both. Example: a = (1234,123) If I want to change inside the parentheses I would go to the line, f(ci( Whereas if it was surrounded by quotes it would work from any column on the row. How can I do it with other text objects without remapping keys? Thanks

Installed Vim today; let's see how much time before I learn it well enough. Gratitude.

@SuboptimalEng

5 ай бұрын

You have started on a great journey 🎯

Usually you remap in your OS [CAPS LOCK] to [TAB]: you use TAB so much that pretty soon the TAB key is broken, also CAPS LOCK is more comfortable as it's on the main key line.

vim is essential for keeping yourself in focus, while typing

Hi does anyone know how to get to the vim settings json or were those vim settings manually added there? Thanks!

suboptimal is the right name. When you didnt use %. I died inside

@SuboptimalEng

2 жыл бұрын

😂

I set my keybindings in VS Code to that of WebStorm (migrated from WS), plus installed a few extensions that boost coding and code navigation. Is Vim much better than all the most popular code-snippet extensions in the Marketplace?

@SuboptimalEng

3 жыл бұрын

Never tried the WebStorm keybindings so idk. Would def recommend giving Vim keybindings a shot tho!

@DesertEagleNV

3 жыл бұрын

@@SuboptimalEng Thanks for your quick reply. Watching a few videos about Vim navigation right now to see if it can beat my current setup.

Can you remap the "caps lock" key to escape instead of using "k", "j"? if so whats the string of the key?

Thank you for this informative video! I'm trying to figure out how to change the "vim.insertModeKeyBindings" to use k,j. I'm new to using VSC and also VIM. Any help would be appreciated!

Hey man, hoping you can help me. Do you know how I can quickly navigate the CTRL+SHIFT+F "search in files" mode with VSCodeVim? And also how to go back to the editor window from there? Thank you.

@SuboptimalEng

3 жыл бұрын

You can press CTRL+b to close the left file search section. I still haven’t found a way to explore file search with Vim in VS Code unfortunately 🥲

@yogxoth1959

3 жыл бұрын

@@SuboptimalEng Well, luckily I found a way to do it just an hour ago! Put this in your keybindings.json: { "key": "ctrl+j", "command": "search.action.focusNextSearchResult", "when": "hasSearchResult || inSearchEditor" }, { "key": "ctrl+k", "command": "search.action.focusPreviousSearchResult", "when": "hasSearchResult || inSearchEditor" }, { "key": "ctrl+e", "command": "workbench.action.focusActiveEditorGroup", "when": "!editorFocus" } Then you can use CTRL+J or K for going up and down the search results, and CTRL+E for focusing the editor again. Have a nice weekend! 😊

@SuboptimalEng

3 жыл бұрын

@@yogxoth1959 OMG nice! (Pinned the comment for others.)

@goncaloazevedo9822

2 жыл бұрын

@@SuboptimalEng i used f and it works wonders. Those are the defaults from telescope plugin in nivm. So handy and doesnt clash with any default keynaps. The leader key open up a new section for keymaps!! Edit: oh, in VSCode since there is no distinction between normal and insert mode this might be kind of a pain for escape characters actually :/

Copy the JSON additions below. To access settings.json: CMD + Shift + P then type "Open User Settings (JSON)" To access keybindings.json: Open Keyboard Shortcuts editor and select the Open Keyboard Shortcuts (JSON) button on the right of the editor title bar. or CMD + Shift + P then type "Open Keyboard Shortcuts (JSON)" settings.json: "vim.insertModeKeyBindings": [ { "before": ["k", "j"], "after":[""] } ], ~~~~~~~~~~~~~~~~~~~~~ keybindings.json: { "key": "tab", "command": "tab", "when": "editorTextFocus && !editorTabMovesFocus" }, { "key": "shift+tab", "command": "outdent", "when": "editorTextFocus && !editorTabMovesFocus" }

@SuboptimalEng

4 ай бұрын

Thanks for this!

NIce video! Just to make it easy, you can toggle screencast mode in visual studio code rather than using another software for that. It's really good try it!

@SuboptimalEng

2 жыл бұрын

Thanks for the tip Yogit!

Thanks!

@SuboptimalEng

Жыл бұрын

Glad you found the video helpful!

Anyone else unable to see colon commands as a status bar at the bottom using the vim extension in vscode?

Comment for the algorithm

how did you do the multi-cursor thing at 0:27 ?

You can swap your caps-lock with escape in your preferred OS. It saves alo of distance

@SuboptimalEng

Жыл бұрын

That’s a good choice as well!

thanks

Do you have a way to use Cmd-D with vim installed? Also, how did you make it so when keep pressing j or k it repeats? If I do that in my Mac it will move just once.

@shynsky

Жыл бұрын

for key repeats, write this in terminal: defaults write com.microsoft.VSCode ApplePressAndHoldEnabled -bool false

Having mapped k j to esc to enter normal mode from insert mode, then how do u type k j as characters in insert mode?

@SuboptimalEng

Ай бұрын

You can set a time limit so that if you type the characters together slowly, the command does not get run and instead the characters get written.

@tomaszgora4353

12 күн бұрын

You can apply when conditions to bindings in the json. Read the docs i.e "when": "inputFocus && vim.mode == 'Normal'". I have bindings remapped and conditioned per mode i.e leader leader to enter visual line (V). Currently building new profile to fit new workflows trained on nvim :)

Commet for the algo, thanks for the content!

If I remap Tab I can't use it for intellisense. Is there a way to only remap Tab based on if intellisense is active or another solution to that issue?

@SuboptimalEng

3 жыл бұрын

You can also select intellisense suggestions with the enter key.

Thx you

how is this extension any different from neovim extension , apart from not being an emulation ?

i'm using a 60% keyboard and it compromises on the arrow keys, i can switch my alt command /? and ctrl key out with the up down left right arrow keys, with vim i don't need to sacrifice on that and best part is i can now access the ~ key, before i can only do `

I can't find the vim settings inside the settings.json file

Thank you very much. Would be great if you could provide somewhere to copy those text settings and copy them in out files.

@SuboptimalEng

7 ай бұрын

Good to hear the video was helpful. I have these settings on my GitHub dotfiles repository.

@RobertAlexanderRM

7 ай бұрын

@@SuboptimalEng That is great! Thanks a lot. I am a vi veteran and sometimes pop out of VSCode just to be eiting more "naturally" and also sometimes pepper my vanilla VSCode with :x and related stuff :) Thanks a lot

3:10 I was really hoping you were going to type: dat Does exactly wat you did. Deletes the entire XML tag in 3 very simple key presses. It is a text object in Vim.

As for using Esc to enter visual, I think some default key binding should not change because one might connect to some remote machines, and access vim there and that would make work a hell ( because of muscle memory ). My 2 cents.

@SuboptimalEng

23 күн бұрын

That’s an interesting point. It’s possible that in some cases, keeping it as ESC is better.

Hey, would you mind telling us what VSCode theme that is

How do I navigate around my files? creating files and folders?

@SuboptimalEng

3 жыл бұрын

You should be able to traverse the project directory using vim commands `jkhl` As for making files/folders - I still do it manually

@s1dev

3 жыл бұрын

@@SuboptimalEng How do you close the explorer? (it can be opened by pressing ctrl + shift + e) can you open the file as a split screen (when opening with jl)? EDIT: closing the explorer was ctrl + b

@shaileshsundram

3 жыл бұрын

@@SuboptimalEng @S1DEV You can use advanced-new-file extension for VS Code to create files as well as folders just using your keyboard.

What theme are you using? and how to set them up?

@SuboptimalEng

3 жыл бұрын

The theme is Gruvbox! I made a video going over how to set it up called "Watch this before you install VS Code".

I think the best approach to entering normal mode from insert mode is to remap CAPS LOCK to Escape and the other way around.

@muhammadraza7231

Жыл бұрын

Yeah i do that with the help of karabiner :)

cool man

cool video

شكرا thanks

Do you know how to change the text caret to steady block?

@SuboptimalEng

2 ай бұрын

It’s a setting in VS Code.

Hi! I was delighted with your video and would like to know what color scheme was used in this example. Amazing.

@SuboptimalEng

2 жыл бұрын

Thanks Aline! I was using Gruvbox theme in the video.

there is a problem with vscode. while i coding react or jsx syntax, sometimes vim crashing. is there anyone encountering this issue?

@SuboptimalEng

2 жыл бұрын

Never had this problem before, can’t help you there unfortunately

I've set up VSCode like this but the only (pretty big) issue I've run into is with code folds. Whenever I fold my code in VSCode Vim, it becomes extremely difficult to scroll the screen past that fold. Ctrl+E, Ctrl+D, Ctrl+F, they all become powerless against a single code fold lol. It might seem small but it makes the whole experience so constantly awkward that I have to either not fold any of my code and jump across a bunch of lines all the time, or just not use VSCode Vim at all.

@SuboptimalEng

3 жыл бұрын

that's unfortunate 🥲

@ibgib

2 жыл бұрын

I also have this issue a bit, and I use code folding a lot. However I love using vscodevim and use three code fold keyboard commands extensively: 1) cmd + k, cmd + j - unfold all. 2) cmd + k, cmd + 2/3/4 - folds to level N. (most scoping inside for me is inside 2/3/4 levels.) 3) cmd + k, cmd + [ - fold at the current position. (All three chords are done without letting up on the cmd key with the left hand, so they are extremely quick.) So I fold to N scope usually when trying to scan through code. If I need to navigate down, I use [N]j/k, with quote-quote to go back if necessary. An _extremely_ quick jump down is 33,j or 44,j, with an optional z,z, which acts like ctrl+F without the need for the emac-like chording. Also, if you don't have it, I recommend setting relative line numbers to make navigation easier. But tastes differ!

@MiroredImage

2 жыл бұрын

@@ibgib I think you are onto something. I haven't though about this sort of quick-folding and unfolding since writing that comment months ago. These days when using VSCodeVim I just don't fold my code, but I think this technique of quickly folding for an overview and navigating with just cursor movements could be very helpful. I also like the idea of shift + l/h to quickly get the cursor to the bottom/top of the screen to start scrolling with the cursor. Thank you very much for the advice!

@ibgib

2 жыл бұрын

@@MiroredImage Shift High & Low! Some of my least-remembered commands. Interesting that Shift + L seems to scroll despite code folding which I'm sure will come in handy from now on. (H doesn't seem to do the trick.)

@ibgib

2 жыл бұрын

@@MiroredImage Oh I just had to respond one more thing...I had forgotten that I solved my scrolling with cmd + up/down arrow keys. Not HOME hardcore-vim blasphemy I'm sure, but I like to have different physical posture "modes" (helps like crop rotation, only it's muscle groups). To reproduce this default scrolling behavior, I include the following binding (also of course its down dual): ``` { "key": "cmd+up", "command": "editorScroll", "when": "textInputFocus", "args": { "to": "up", "value": 4, "revealCursor": true, "by": "line" } }, ``` (Maybe one day, YT will format code blocks! I wonder if it's today...)

like you got it bro

where i can open this setting.json for vim keybinding changes............... i tried but cannot find it plz help

@SuboptimalEng

3 жыл бұрын

Run "cmd + shift + p" and start typing "settings". You should be able to select "Preferences: Open Settings (JSON)". Note: I think it's "ctrl + shift + p" on windows.

can you use fzf and ripgrep ?

@SuboptimalEng

2 жыл бұрын

VS Code has those two features built-in, though they are named differently. Go to file, and find all (I believe).

at 5:08, how did you open that top search bar

@SuboptimalEng

3 жыл бұрын

mac: cmd + shift + p windows: ctrl + shift + p (i think)

lucky me i learnt shift+v to select line exists from this video otherwise i use to just use visual mode

can you drop that tab command here. and also can you tell how to remap caps into esc ...

@SuboptimalEng

3 жыл бұрын

The tab command is in my GitHub Dotfiles repository. To remap Cap to ESC, you will need to do so in the Mac Keyboard settings. It’s not something specific to VS Code. Def recommended because I’ve only ever pressed the Caps Lock key by accident 😇

WHAT IS THE BUTTON TO OPEN THAT TOP SCREEN AND TYPE THE VIM

@SuboptimalEng

2 жыл бұрын

What top screen?

What is cmd in cmd + key in "key" in keybindings?

@SuboptimalEng

2 жыл бұрын

It’s the Mac command key.

@phantombeing3015

2 жыл бұрын

@@SuboptimalEng what should I do it in Linux laptop? can I do super key here? And what suggestion extension do you recommend? i am trying to use tabnine. And, I want to add shortcut to close the suggestion pop up if I don't find good one. Esc works but it is too far. I want to map it to some key. What is the name to do that in keybindngs?

ummm bro can you have me, when i go to preferences setting (JSON) im not see vim or any key binding like that, how can i change key ?? :

@Eddie-um6cw

2 жыл бұрын

It's like there is no vim setting, just theme setting and other setting not vim setting help me pls ;-;

i use ;; to switch to ESC mode this is so faster i use vim-gtk3 and i use space with y to copy content from vim to clipboard and space p to paste from clipboard there are lot of nice thing you can do with vim ppl who want to custom keys search from map and remap keys in vim

how are you displaying you keystrockes?

@SuboptimalEng

Жыл бұрын

You can display keyboard clicks in VS Code by enabling it in your settings.json file.

@Ikram-Hussain

Жыл бұрын

@@SuboptimalEng btw I forgot to ask which theme u used in here 0:04

I cannot open setting like you 😢 why do it not work? 😂 I only see “Preferences: Open Settings(UI)”

This plugin does make vscode noticeably slower

@SuboptimalEng

3 жыл бұрын

Oh interesting, I never noticed any performance issues with the Vim plugin. I'm no expert, but I've heard (unconfirmed rumors) that the Neovim plugin is a little faster so maybe that would help your case.

@nodidog

3 жыл бұрын

You'll probably end up going full vim once you've dipped your toes in the water though, and then everything will be light speed

@lifeless9768

3 жыл бұрын

@@nodidog I do like vscode because of the integration with cmake. So it will be hard to switch.

@nodidog

3 жыл бұрын

@@lifeless9768 That makes sense, whatever works for you 👍 There is a good selection of cmake integration plugins out there that you may find useful though, cmake4vim, language servers for code completion etc.

why would you insert tabs in read only?

@SuboptimalEng

Жыл бұрын

I think I'm just used to it at this point.

what theme are you using?

@SuboptimalEng

Жыл бұрын

Gruvbox dark

Where do I find the settings file???

@SuboptimalEng

2 жыл бұрын

You can find them on my GitHub under the Dotfiles repository 👍🏾

what theme are u using?

@SuboptimalEng

3 жыл бұрын

Gruvbox

i dont see why tab not working in visual mode is an issue? but very nice video

@SuboptimalEng

2 жыл бұрын

Thanks! I got used to pressing tabs and I assumed most people were as well

thank you for the video but i would never name my child Suboptimal Engineer .

@SuboptimalEng

2 жыл бұрын

Maybe Optimal Engineer then?

why command + shift + x when you just move your mouse 1cm to the left....

@SuboptimalEng

2 жыл бұрын

Because using the mouse is suboptimal

@EDS432

2 жыл бұрын

@@SuboptimalEng no its not. Its like: Hey, instead of moving your mouse 1cm, just Press CTRL + V + X + F2 + Tab + K + L Why? because moving mouse is suboptimal, then you are not a good programmer

interesnate

can you share the settings.json file?

@SuboptimalEng

2 жыл бұрын

It’s on my GitHub dotfiles repository