Custom Key Binding In SublimeText, VSCode

평소에 Sublime Text를 이용해 마크다운 형식으로 블로그 포스팅을 작성하는데,

줄 간격을 넓게 해서 글을 쓰려면, <br/>태그를 자주 사용하게 됩니다.

줄 바꿈을 할 때 마다.. 엔터 두번 + <br/> + 엔터 두번을 반복하려다 보니,

글이 점점 쓰기 귀찮아지고.. 블로그도 잘 안쓰게 되는 것 같아 해결 방법을 찾아보았습니다!

Custom Key Binding

SublimeText는 사용자가 정의한 Key Binding을 사용해서, Command들을 사용할 수 있도록 기능을 제공합니다.

Mac 기준으로, 상단 메뉴 바에서 Sublime Text > Preferences > Key Bindings를 선택합니다.

그럼 아래 화면과 같은 창이 보이실 겁니다.

위 화면에서 왼쪽 부분은 SublimeText에 기본적으로 내장되어 있는 Key Bindings입니다. 이 부분은 수정할 수 없고,

저희가 새로운 Key Binding을 추가할 곳은 오른쪽 부분입니다.

가장 바깥쪽 level의 대괄호 안에, Key Binding들을 하나하나를 중괄호로 감싸 나열합니다.

위 사진에서 보이는 두번째 Key Binding을 보면, keys 필드에는 어떤 key로 이 key binding을 트리거 할 것 인지 지정합니다.

KeyBinding에 사용할 수 있는 Key들의 목록은 SublimeText Documentation에 나와 있으니 참고하세요!

그리고 시스템 KeyBindings에서 Cmd+F(찾기) 기능을 통해 겹치는 Key Binding이 없는지도 확인해주세요!

다음으로, command 필드에는 실행할 Command의 이름을 적어줍니다.

주의하실 점은, 여기에는 붙여넣고 싶은 내용이 아니라, 말 그대로 SublimeText에 있는 기능의 이름을 넣어야합니다!

예를 들어, 상단 탭을 닫는 Command의 이름은 close, 어떤 내용을 붙여넣는 Command의 이름은 insert입니다.

저는 \n\n<br/>\n\n라는 내용을 붙여넣고 싶으니, Command 부분에는 insert를 넣어줬습니다.

다음으로, args 필드에는 command를 실행하는 데 필요한 매개변수들을 적어줍니다.

insert Command의 경우에는 characters라는 이름으로 붙여넣을 내용을 매개변수로 받습니다.

저의 경우에는 \n\n<br/>\n\n을 args 필드 안에 contents라는 이름으로 적어줬습니다.

Command들의 리스트와 매개변수들은 SublimeText Community Documentation에서 확인할 수 있습니다.

그럼 저장한 뒤에, 아무 문서에서 Ctrl+Enter를 누르면,

위와 같이, 제가 원하는 내용이 한번에 입력되는 것을 확인할 수 있습니다.

정적인 문자를 붙여넣을 때는 위 방식이 좋을 듯 한데,

동적이고 긴 문자열을 붙여넣을 때는 Snippet이란 기능을 이용하는 것이 더 좋을 듯 하네요.

언젠간 Snippet 관련한 포스팅으로 돌아오도록 하겠습니다! 긴 글 읽어주셔서 감사합니다 :)

추가: VSCode Custom Key Binding

VSCode도 동일한 기능을 사용할 수 있습니다.

Command + Shift + P로 Command Palette를 열고, Preferences: Open Keyboard Shortcuts (JSON)을 열어줍니다.

그런 다음, 아래 코드를 keyboardbindings.json 파일에 붙여넣어 줍니다.

[
  {
    "key": "ctrl+enter",
    "command": "editor.action.insertSnippet",
    "args": {
      "snippet": "\n<br/>\n"
    },
    "when": "editorLangId == markdown"
  }
]