프로그래밍의 스니펫이란?

프로그래밍을 수행하는 데 필요한 도구 중 하나는 텍스트 편집기입니다.

코딩하기 쉽도록 텍스트 에디터의 추천 플러그인이나 단축키 등 검색하고 있으면, 「스니펫」이라고 하는 익숙하지 않은 단어를 자주(잘) 보입니다.

이번은 이 「스니펫」에 대해서, 프로그래밍 초보자인 나가 조사해 정리해 보았습니다.

어디까지나 초보자가 조사한 것이므로, 중급자 이상의 분으로부터 보면 잘못된 인식일지도 모릅니다만, 눈치채는 분은 지적해 주시면 기쁩니다.

결론 : 프로그래밍 버전의 사전 등록 기능

PC를 자주 사용하는 사람이라면 단어 사전 등록 기능을 사용한 적이 있죠?

「아」라고 치면 「감사합니다.」라고 나오도록 사전에 등록해 두면,

「아」라고 치고 tab 키를 누르면 「감사합니다.」라고 낼 수 있는 녀석입니다.

스니펫은 이 사전 등록 기능의 프로그래밍 버전입니다.

스니펫(snippet)은 "단편"이라는 의미로 프로그래밍에서는 소스 코드나 텍스트의 일부를 가리킨다고 합니다.

아래는 Ruby의 프레임 워크 인 Ruby on Rails에서 사용하는 템플릿 엔진 "html.erb"에서 사용하는 스 니펫을 등록한 것입니다.

erb.json

{
    "embedded Ruby": {
        "prefix": "erb",
        "body": [
                "<% $1 %>"
        ]
    }
}

코드의 단어
의미


embedded Ruby
스니펫 제목

prefix
단축어

body
단축어를 입력하고 tab 키를 누르면 변환되는 코드


이런 느낌으로 등록해 두면, 불필요한 키 입력을 줄이고, 실수도 줄이고, 코딩의 시간 단축이 되므로, 적극적으로 스니펫을 늘려 가고 싶네요!

덤: Visual Studio Code에서 스 니펫을 등록하는 방법

현재 내가 사용하는 텍스트 편집기 "Visual Studio Code"에서 위의 html.erb 스 니펫을 등록하는 방법을 알려드립니다.

그건 그렇고, PC 환경은 Mac입니다.

1. Visual Studio Code를 열고 왼쪽 상단의 "Code"→ "기본 설정"→ "사용자 스 니펫"을 클릭하십시오.


2. 「erb」를 클릭.


이렇게 erb.json이 열렸습니다.

위와 같이 스니펫 등록하면 단축어를 입력하는 것만으로 긴 코드 등도 쉽게 입력할 수 있습니다.

참고 자료

VSCode에 코드 스니펫을 등록하여 효율적으로 코딩!