1 of 75

Vim, 어디까지 알고 있니?

근거 기반으로 살펴보는 생산성 도구로서의 Vim

2 of 75

간단한 소개

INTP/ENFP 하이브리드 개발자��VSCode/RoamResearch/GitKraken 번갈아가면서 쓰다가

Neovim 으로 대동단결해서 사용한지 1년 하고도 8개월

https://vim.kr <- 요런 디스코드를 운영하는 사람입니다.

twitter : @kodingwarrior

3 of 75

이 세션에서는 Vim을 어떻게 하면 내 입맛에 맞게 개조할 수 있는지를 소개합니다.��어떤 도구를 사용하더라도 생산성을 극대화할 수는 있습니다만,�“Vim으로는 이런 것까지 가능하다” 라는 관점을 소개하는 �편파적인 내용이 주요 흐름이 될 수 있는 점 양해바랍니다.

4 of 75

이번 강연에서 다룰 주제

  • 우리가 Vim에 대해서 어렴풋이 알고 있는 기능들
  • 많은 사람들이 알지 못하는 Vim의 몇가지 기능들
    • Textobject, Terminal 모드, 커맨드라인 명령어 실행 + 파이프라이닝
  • 실전으로 체험해보기
    • vscode-vim, ideaVim 에서도 되는 것들 위주로 맛보기 체험
  • 그리고… 원조 맛집에서만 이용가능한 것들..
    • vim-fugitive (vim의 git client)
    • Neovim 겉핥기로 살펴보기

5 of 75

어떻게 Vim을 접하게 되었나요?

  • 호기심에 시작
  • 학교에서 리눅스 실습 겸 과제 제출용 서버로 쓰기 때문
  • git commit message 작성
  • 서버 로그를 읽다보니 Vim을 쓰게 됨
  • 왠지 간지가 촬촬 넘쳐보이니까
  • Vim 없이 살 수 없는 몸이 될 수준으로 선배한테 강제급여를 당함

6 of 75

어떻게 Vim을 접하게 되었나요?

7 of 75

우리가 Vim에 대해서 �어렴풋이 아는 것들

8 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (문자열 조작)

  • 이동
    • 단어 단위의 이동 - w, W, e, E, b, B
    • 같은 행 안에서의 이동 - ^, $, 0, h, l, 좌우 화살표
    • 다른 행으로의 이동 - ESC 입력 후 :<number>, j, k, 위아래 화살표
    • 1행으로 이동 - gg / 마지막 행으로 이동 G
    • 짝이 맞는 괄호로 이동 - %
  • 패턴 치환 - :%s/foo/bar/g
  • 창 이동 - C-w 입력 후 h/j/k/l 혹은 화살표 키 입력
  • 반복 - d22d (22개의 라인 삭제), y22y (22개의 라인 복사), …

9 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (모드 스위칭)

  • Normal mode
    • 한 발짝 물러서서 yank, delete, macro, paste, 빠르고 효율적인 커서 이동
    • Command mode로 진입하기 위해 : 키를 타이핑
  • Input mode
    • 현재 위치한 커서 기준으로 소스코드를 편집
  • Visual mode
    • 어디부터 어디까지 조작할지를 선택 (마우스로 드래그하는 것과 같음)
  • Command mode
    • normal mode -> command mode
    • visual mode -> command mode

10 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (매크로)

  • 오타로 뭐 잘못 눌렀는데 아래에 이상한게 떠있음

11 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (매크로)

12 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (relative num)

  • 일부의 의견 : 각각 몇번째 줄인지 안 나와서 불편함
  • But, Repetition을 응용할 때 만큼은 굉장히 쓸모가 있음

뺄셈으로 암산하고 이동

바로 보이는 숫자를 입력해서 이동

13 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

  • Normal mode에서 v 키를 타이핑하면 visual mode가 됨
  • 영역을 선택하고 선택한 영역을 조작하기 위한 기능
  • 얼마나 유용한지 알기 전까지는 평소에는 쓰게 될 일이 잘 없음

14 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

  • 여러 개의 행으로 개행된 라인들을 하나의 라인으로 합치기
    • Backspace, delete 키를 연타하지 않아도 됨.

15 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

  • ChatGPT 에 프롬프트를 넣기
    • “git diff --cached 읽고 커밋메시지를 작성해줘”

16 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

  • ChatGPT 에 프롬프트를 넣기
    • “내가 커밋메시지를 이렇게 작성했는데 �git diff --cached 읽고 좀 더 적절하게 다듬어줘”

17 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

  • CLI 도구에 파이프라인으로 넘기기

18 of 75

우리가 Vim에 대해 어디까지 알고 있나요? (Visual mode)

19 of 75

우리가 Vim에 대해서 �모르는 것들

20 of 75

Textobjects

텍스트를 묶음 단위로 편집할 수 있다!

  • 괄호로 감싸져 있는 부분
  • 따옴표로 감싸져 있는 부분
  • xml 태그로 감싸져 있는 부분
  • word, paragraph 단위

자세한 내용은 :h text-objects 를 참고해보세요.

21 of 75

Textobjects

  • ciw
  • ci(
  • ci[
  • ci{
  • ci”
  • ci’
  • ci`
  • cit

22 of 75

Textobjects

  • ciw - 단어를 비우고 입력 모드 진입
  • ci( - 소괄호를 비우고 입력 모드 진입
  • ci[ - 대괄호를 비우고..
  • ci{ - 중괄호를 비우고..
  • ci’ - 따옴표로 감싸진 부분을 비우고 …
  • ci” - 쌍따옴표로 감싸진 부분을 비우고 …
  • ci` - 인용부호로 감싸진 부분을 비우고 …
  • cit - html/xml로 감싸진 부분을 비우고 …

23 of 75

Terminal mode

  • 터미널 에뮬레이터의 다른 탭을 키지 않고도 �대화형 CLI 도구를 사용할 수 있다는 독보적인 장점이 있음

24 of 75

Terminal mode

  • Copilot Chat 처럼 활용하기 (aider-chat)

25 of 75

pipelining from Visual mode

  • 기본 쉘 명령 말고도… 서드파티 CLI 로도 연동이 가능하다..? (ex. Todoist CLI)

26 of 75

에디터 확장으로 체험해보기

using vscode-vim, ideaVim

27 of 75

VSCode, intelliJ 로도 정말 가능한가요?

  • 몇가지 기능은 어디선 되고 어디선 안됩니다.
    • 우리가 흔히 Vim에 대해서 알고 있는 것들은 올바르게 동작합니다.
  • 직접 체험해보니 “안 쓸 이유가 있나..?” 싶은 생각이 들었습니다.�
  • VSCode는 vscode-vim 를 설치해보시고,
  • intelliJ는 ideaVim 를 설치하시면 됩니다.

28 of 75

Textobjects

  • ciw - 단어를 비우고 입력 모드 진입
  • ci( - 소괄호를 비우고 입력 모드 진입
  • ci[ - 대괄호를 비우고..
  • ci{ - 중괄호를 비우고..
  • ci’ - 따옴표로 감싸진 부분을 비우고 입력 모드 진입
  • ci” - 쌍따옴표로 감싸진 부분을 비우고 입력 모드 진입
  • ci` - 인용부호로 감싸진 부분을 비우고 입력 모드 진입
  • cit - html/xml로 감싸진 부분을 비우고 입력 모드 진입

29 of 75

Terminal mode

Live Demo

30 of 75

pipelining from Visual mode

Live Demo

31 of 75

원조 맛집 �Vim/Neovim 살펴보기

32 of 75

Vim이 어떻게 생산성 개선에 도움이 될까?

  • 사실은 쓰는 사람 나름입니다.
  • 몇몇 분들은 개인적인 경험에 근거하여 �어느 정도 쓸모 있는지 와닿으실 수도 있습니다.
  • CLI 친화적인 에디터이기 때문에,�CLI 도구를 어느 정도 알고 있느냐에 따라 활용할 수 있는 가짓수가 많아집니다.

33 of 75

그래서… 정말 Vim 해도 괜찮은 거 맞죠…?

하셔도 되고 안 하셔도 됩니다�

천천히 적응하고 싶으신 분들은 VSCode / IntelliJ 통해서 천천히 접근하시고..

슬슬 마우스를 굳이 쓸 필요가 없겠다 싶은 분들은..

천천히 kickstart.nvim 같은 미리 세팅된 스타터킷을 통해 접하는 것을 권장합니다.

34 of 75

Vim에서 좀 더 편하게 git을 사용하기 (vim-fugitive)

  • VSCode의 git client 부럽지 않다!

35 of 75

Vim에서 좀 더 편하게 git을 사용하기 (vim-fugitive)

Vim은 CLI 도구를 에디터에 잘 녹아들게 해주는 만능 도구

https://github.com/tpope/vim-fugitive/blob/dac8e5c2d85926df92672bf2afb4fc48656d96c7/autoload/fugitive.vim#L4935-L4967 : 변경사항을 펼쳐보기

https://github.com/tpope/vim-fugitive/blob/dac8e5c2d85926df92672bf2afb4fc48656d96c7/autoload/fugitive.vim#L5246-L5288 : 변경사항을 stage 영역에 넣었다 빼기

36 of 75

그리고 Neovim…?

37 of 75

Vim vs Neovim

https://kodingwarrior.github.io/wiki/vim/versus-neovim/

  • 스크립팅 언어 : 대중에게 익숙한 Lua! VimScript와는 다르다!
  • 플러그인 생태계 : vim plugin + lua 버전으로 작성한 neovim 플러그인
    • Plenary.nvim - curl, async job, scheduler, …
    • mini.nvim 등등 IDE에 가까운 UI를 만들기 위한 여러가지 실험의 흔적
    • telescope.nvim, nvim-cmp 같은 킬러 플러그인

38 of 75

Treesitter

  • 소스코드를 AST의 관점에서 바라보기
  • 응용 사례
    • folding
    • scope 기반의 selection
    • Comment/docstring 안에서 Syntax highlighting
    • Semantic highlighting
    • 함수가 선언된 순서 바꾸기
      • -> sibling 노드의 위치를 바꾸는 문제로 환원

39 of 75

LSP builtin Support

  • 소스코드 자동 완성 / linter / formatter / code action
    • ex. pyright, ts-server, rust-analyzer
  • 한국어 맞춤법 검사
    • 부산대 한국어 맞춤법 검사기를 Language Server에 연동하여�맞춤법이 틀릴때마다 warning 띄우기
  • Vale.sh
    • MS/Redhat/Adobe의 스타일 가이드 기반으로 톤 앤 매너 교정

40 of 75

Neovim의 Killer Plugin – Telescope.nvim

Neovim 진영의 “범용성 검색 엔진”

키맵을 따닥따닥 하는 것 만으로도 �파일 검색 및 패턴 검색이 가능하게 해주는�Neovim 생태계의 핵심 플러그인 그 자체!

Query를 넣고 싶은 것이라면 무엇이든 개조해서 사용할 수 있음.

41 of 75

Neovim의 Killer Plugin – Telescope.nvim

(Telescope.nvim) 파일 검색

42 of 75

Neovim의 Killer Plugin – Telescope.nvim

(Telescope.nvim) 패턴 검색

43 of 75

Neovim의 Killer Plugin – Telescope.nvim

Telescope에서 지원하는 다양한 기능들

필요에 따라 확장도 가능하고, 쿼리할 수 있는 모든 기능들을 검색할 수 있음�(git commit, 사용가능한 keymap, manpage, …)

44 of 75

Neovim의 Killer Plugin – nvim-cmp

  • 자동 완성이 되면 편한 것들이라면 무엇이든지
    • Language Server에서 제공해주는 자동 완성
    • emoji
    • GitHub issue
    • git commit hash
    • Snippet

45 of 75

Vim/Neovim as Personal Developmenet Environment

  • 내 입맛에 맞는 개발환경
    • 스크립트를 짜서 설정을 관리하기
    • API에 직접 접근해서 기능을 확장하기
    • 개발 경험에 목마른자가 우물을 판다
  • 사실상 제한이 없는 여러가지 CLI 도구와의 조합
    • git, sed, perl, grep, gh cli, docker, …
  • 코드를 짜는 행위 + 코드를 짜는 행위를 보조해주는 환경에 대한 깊은 이해
    • word / text-object / paragraph / macro / snippet — 덩어리를 묶은 단위의 작업
    • Language server / Linter / Formatter — 타고 올라가면 결국엔 CLI
    • Treesitter — 소스코드를 단순한 텍스트가 아닌 AST의 관점에서 바라보기

46 of 75

Vim/Neovim as Personal Developmenet Environment

  • Programmable하고 입 맛에 맞게 개조 가능한 환경 (ex. Time Blocking)

47 of 75

Vim/Neovim as Personal Developmenet Environment

  • Programmable하고 입 맛에 맞게 개조 가능한 환경 (ex. Time Blocking)

48 of 75

함께 알면 좋은 도구 - wezterm/kitty/alarcritty

건강한 정신이 건강한 신체에서 나오듯이,�훌륭한 터미널 기반 개발 경험은 훌륭한 터미널에서 나옵니다.

파일 시스템 기반으로 설정을 관리할 수 있는 �터미널을 사용하는 것과 아닌 것의 차이는 큽니다.�

투명도 조절, 탭 이동, 탭 이름 변경, 탭 위치 변경, …�내 입맛에 맞게 튜닝하면, 어떤 환경에서든 동일한 경험을 누릴 수 있습니다.

49 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

타입(기껏해봐야 String..) 이라는게 있나 싶을 정도로 난해한 bash script��소스코드는 기껏해봐야 1차원/2차원 문자열이기 때문에 �내 입맛대로 우아하게 처리하고 싶을 땐 스크립트 언어만한 것이 없음.

vim/lua 스크립팅의 한계를 극복하고 싶을때 Plan B로 활용하기에도 좋음

perl - git이 깔려있으면, 어느 기기에서든 이용이 가능

ruby - 직접 설치를 해야 하지만, mac에는 기본으로 깔려있음. perl보다 가독성이 좋음

python - 언어 자체로는 많은 사람들에게 권장은 하지만, one-liner 용으로는 비추

50 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

예시 1 - Vim 인스턴스를 띄울때 여러개의 버퍼를 동시에 띄우기

51 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

예시 1 - Vim 인스턴스를 띄울때 여러개의 버퍼를 동시에 띄우기

# => nvim -O planner/2024-04.md monthly/2024-04.md

52 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

예시 2 - 월간 계획 양식 찍어내기

53 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

예시 2 - 월간 계획 양식 찍어내기

54 of 75

함께 알면 좋은 도구 - 스크립트 언어(perl, python, ruby, …)

한 줄 짜리 perl 스크립트 튜토리얼

https://learnbyexample.github.io/learn_perl_oneliners/

한 줄 짜리 ruby 스크립트 튜토리얼

https://learnbyexample.github.io/learn_ruby_oneliners/

55 of 75

함께 알면 좋은 도구 - chezmoi (dotfiles manager)

dotfiles�.zshrc, .vimrc, .config/nvim, .config 등등 파일로 관리할 수 있는 개발환경 구성

chezmoi를 이용하면 git으로 버전을 관리하듯이, �내 개발환경의 버전을 관리하기가 수월해집니다.

제 개발환경은 사실... 아래 명령어만 실행하면 누구나 이용하실 수 있습니다.

sh -c "$(curl -fsLS get.chezmoi.io)" -- init --apply git@github.com:malkoG/dotfiles

56 of 75

함께 알면 좋은 도구 - mise

  • 프로그래밍 언어의 버전관리 (ruby, perl, python, elixir, …)
  • CLI 툴의 버전 관리 (bat, delta, lsd, …)
  • 여기에 플러스로 커스텀 태스크를 정의하는 기능까지!

57 of 75

함께 알면 좋은 도구 - mise (example: custom task)

  • mise run todoist
  • mise run pomo
  • mise run gh
  • mise run pip:sync
  • mise run monthly_plan

58 of 75

마치며..

59 of 75

나에게 맞는 도구를 찾고 다듬는 여정

  • 생산성 개선은 내가 어떤 행위에서 불필요하게 시간을 �소모하는지 분석하는 메타인지에서 시작합니다.�
  • 나에게 맞는 도구를 찾고, �나의 워크플로우에 맞게 최적화하는 과정에서 �중요한 것에 집중할 수 있는 시간을 확보할 수 있습니다.�

https://myme.no/posts/2024-03-19-focus-by-automation.html

60 of 75

나에게 맞는 도구를 찾고 다듬는 여정

  • 나에게 맞는 도구를 찾고, �나의 워크플로우에 맞게 최적화하는 과정에서 �중요한 것에 집중할 수 있는 시간을 확보할 수 있습니다.�

ex1) 괄호 안쪽을 비우고 싶어! — ci(, ci{, ci[ vs 마우스 드래그 + delete�ex2) 100번째 라인에서 발생한 에러 확인하기 — :100 vs 눈금보면서 확인하기 �ex3) 몸이 기억하는 빠른 텍스트 편집 / ex4) 생산성 도구의 가짓수를 줄이기��“Practical Vim”라는 책의 부제는… Edit Text at the Speed of Thought

61 of 75

62 of 75

63 of 75

원하는대로 가져다 쓰세요

https://github.com/malkoG/dotfiles

  • Mise task로 정의된 스크립트 : todoist 유틸리티, 불렛저널 템플릿 생성기
  • Neovim 개발 환경
  • Wezterm 설정
  • Tmuxinator 기반의 작업환경 구성
  • .gitconfig

64 of 75

And more..?

65 of 75

사전 Q&A

66 of 75

Q. 빔을 통해 생산성을 올리려면 아무것도 모르는 상태에서

어떤 컨텐츠로 배우는 게 좋을지 궁금합니다!

다른 사람이 일을 하는 방식을 보면서

“이걸 어떻게 하는거지?” 라는 호기심에서 출발하는 것도 좋습니다.

CLI 도구들을 알게 되는 과정도 비슷합니다.

무엇보다도 생산성 개선에는 목적성이 있어야 합니다.

일단 본인이 어떤 것을 개선하고 싶은지를 생각해볼 필요는 있습니다.

67 of 75

Q. 빔을 통해 생산성을 올리려면 아무것도 모르는 상태에서

어떤 컨텐츠로 배우는 게 좋을지 궁금합니다!

추천하는 스트리머

  • https://www.youtube.com/@teej_dv
    • telescope.nvim 플러그인 개발자 (주제가 다양함)
  • https://www.youtube.com/@devaslife
    • 제품 하나를 꾸준히 만드는 ASMR 스트리머 (ReactNative)
  • https://www.twitch.tv/bashbunni
    • Golang 기반의 프로젝트를 라이브 코딩하는 스트리머

68 of 75

Q. 기존 편집기 단축키(vscode)에 익숙한 상태인데 vim 플러그인과 함께할 수 있을까요?

vscode-vim과 함께하세요

https://marketplace.visualstudio.com/items?itemName=vscodevim.vim

물론 vim 플러그인 생태계와는 호환이 되진 않습니다.

69 of 75

Q. 다른 text editor 대비 vim을 꼭 써야만 하는 이유가 있다면, � vim이 아니면 할 수 없는 일이 있다면 무엇이 있을까요? � 편의성이 뛰어난 다른 에디터들을 쓰지 않고 vim을 파고들 이유가 있다면..?

  • CLI 도구와의 조합
  • 내가 온전히 제어할 수 있는 configuration
  • programmable한 개발환경

emacs도 위와 비슷한 장점이 있습니다.

70 of 75

Q. 외부 plugin 등을 사용하지 않고 순수하게 vim만 사용한다고 했을 때, � vim을 사용할 메리트?가 충분할까요..?

외부 플러그인을 사용할 수가 없는 환경에서도 잘 적응하는게 목표라면 메리트는 있을겁니다.

예를 들면…. �ssh로 원격서버에 접근해서 로그를 들여다본다던가.. �configuration을 효율적으로 편집한다던가..

보통은 1) 내가 해야하는 번거로운 일들/ 2) 일을 하다보니 느껴지는 인지부하 같은 것들을 줄이기 위해 플러그인을 설치하게 됩니다.

71 of 75

Q. 매크로 기능 유용하게 사용하는 방법과 스니펫 같은것도 만들어서 사용가능한가요!?

매크로 기능은…. �키바인딩에 익숙해지는 것에서부터 시작해야 합니다.�개인적으론 알고리즘 문제를 내가 인터프리터가 되어서 직접 푼다는 느낌으로 접근합니다

스니펫은 �“내가 자주 사용하긴 하는데 이거 타이핑한다고 시간 잡아먹고 싶지 않은거"�위주로 필요에 따라 직접 만들면 됩니다.

72 of 75

Q. vim 외에도 생산성을 올리기 위해 어떤 도구를 사용하는지 궁금합니다. � 또는 생산성 향상을 위한 강연자님만의 업무 프로세스가 있는지 궁금합니다.

의외로 미니멀리즘을 지향합니다.�생산성 도구를 도입하면서 각 생산성 도구의 사용법을 기억해야하는 �생산성 도구의 늪에 빠지고 싶지는 않거든요.

�앞서 말했듯, 개선이 필요하다 싶은 순간이 왔을 때 튜닝을 합니다.�가끔은… 커뮤니티에서 귓동냥하거나 혹은 �뉴스레터에서 괜찮은 물건들을 건질때도 있습니다.

73 of 75

Q. neovim에서도 각종 편의 기능(import문 정리나 메서드 추출, 중복 코드 판별 기능, 변수 이름 편집 기능)을 제공하는 익스텐션 같은게 있는지 궁금합니다.

이건 랭귀지 서버의 기능입니다

참고로, Spring은 IntelliJ 쓰는게 좋습니다.

Spring 진영은 랭귀지서버를 쓸 순 있어도 쓸만한게 없습니다 (ㅜㅜ)

74 of 75

Q&A

75 of 75

강연을 들어주셔서 감사합니다

강의자료는 https://slides.kodingwarrior.dev 에 모아놨습니다.

이메일 문의는 jaeyeol.lee@hey.com

SNS를 통한 문의는 @kodingwarrior

Vim을 사용하는 사람들과 네트워킹하고 싶다면? https://vim.kr