코드라이언 1주차 멋진 에디터를 익히자
일반 모드에서 입력 모드로 전환할 때 i 키 이외에 a 키와 o 키도 사용할 수 있다. i 키, a 키, o 키 모두 일반 모드에서 입력 모드로 전환할 때 사용할 수 있으나, 그 방식에 약간의 차이가 있다. 아래의 표에 잘 정리되어 있으니 참고하도록 하자:
| 키 | 설명 |
| i | 현재 커서 위치에서 입력 모드로 전환 (Insert) |
| o | 현재 커서 바로 아래에 새로운 행을 하나 만들고, 새로운 행의 맨 앞으로 커서가 이동하면서 입력 모드로 전환 (Open line) |
| a | 커서를 현재 위치에서 한 칸 뒤로 옮긴 뒤, 입력 모드로 전환 (Append) |
실제로 빔 상에서 i 키, o 키, a 키를 눌러보면서 어떻게 변화하는지 직접 관찰해 보도록 하자! 만약 위의 키들을 다 기억하기 어려우면, 일단 i 키만 잘 기억해도 코드를 작성하는 데 크게 문제는 없다.
| 키 | 설명 |
| e | 바로 다음 단어의 맨 마지막 문자로 커서 이동 (end of word) |
| w | 바로 다음 단어의 맨 첫 번째 문자로 커서 이동 (word) |
| b | 바로 이전 단어의 맨 첫 번째 문자로 커서 이동 (before word) |
| $ | 현재 위치한 행의 맨 마지막 문자로 커서 이동 |
| ^ | 현재 위치한 행의 맨 첫 번째 문자로 커서 이동 |
| gg | 현재 파일 내용의 맨 첫 번째 행으로 커서 이동 (go) |
| G | 현재 파일 내용의 맨 마지막 행으로 커서 이동 |
위 표에 나온 키들 중에서 $, ^, G는 각각 Shift+4, Shift+6, Shift+g 키를 나타낸 것임에 주의하자. 또, gg 키의 경우 g 키를 연속으로 두 번 누른 것을 나타낸 것이다.
| 키 | 설명 |
| x | 현재 커서 위치에 있는 문자를 삭제 |
| X | 현재 커서 위치의 한 칸 앞의 문자를 삭제 |
| dd | 현재 커서가 위치한 행 전체를 삭제 |
| dw | 현재 커서 위치에서부터, 현재 위치한 단어의 마지막 부분까지의 문자를 모두 삭제 |
| d$ | 현재 커서 위치에서부터, 현재 위치한 행의 맨 마지막 부분까지의 문자를 모두 삭제 |
코드 삭제와 관련된 키는 위에서 제시한 것 이외에도 많지만, 위의 5개 정도면 충분하다고 보면 될 것이다. 사실 초심자인 여러분에게는 위의 5개를 기억하는 것도 벅찰 것임을 충분히 이해한다.
| 키 | 설명 |
| v | 비주얼 모드로 전환 - 블록 지정 (visual) |
| V | 현재 커서가 위치한 행 전체를 블록 지정 |
| y | 지정된 블록을 복사 (yank) |
| yy | 현재 커서가 위치한 행 전체를 복사 |
| x | 지정된 블록을 잘라내기 |
| p | 복사하거나 잘라낸 내용을 현재 커서 위치의 바로 다음 위치에 붙여넣기 (paste) |
위 표에 나온 키들 중에서 V는 Shift+v 키를 나타낸 것임에 주의하자. 또, yy 키의 경우 y 키를 연속으로 두 번 누른 것을 나타낸 것이다.
| 키 | 설명 |
| u | 방금 수행한 작업을 실행 취소 (undo) |
| Ctrl + r | 방금 실행 취소한 작업을 다시 실행 (redo) |
| 키 | 설명 |
| Ctrl+f | 한 화면 아래 방향으로 스크롤 |
| Ctrl+b | 한 화면 윗 방향으로 스크롤 |
| Ctrl+d | 반 화면 아래 방향으로 스크롤 |
| Ctrl+u | 반 화면 윗 방향으로 스크롤 |
:/<단어> 명령어를 실행하여 단어 찾기를 수행하는 과정에서 사용했던 키들을 아래의 표에 정리해 놓았다:| 키 | 설명 |
| n | 현재 위치 아래쪽에서 해당 단어가 등장하는 위치로 커서 이동 |
| N | 현재 위치 위쪽에서 해당 단어가 등장하는 위치로 커서 이동 |
참고로,
:/<단어> 명령어를 실행하여 해당 단어가 등장하는 위치가 하이라이트되도록 하였을 때, :noh 명령어를 실행하면 하이라이트를 해제할 수 있다. 반드시 기억할 필요는 없으나, 하이라이트된 결과가 눈에 거슬려서 없애고 싶은 경우에 한해 가끔씩 사용하면 좋다.
현재 파일 내용 상의 특정 부분에 대하여 비주얼 블록을 지정한 뒤,
:'<,'>s/<기존 단어>/<새로운 단어> 명령어를 사용하면, 해당 블록 내에 등장하는 특정 단어들만 모두 찾아 새로운 단어로 손쉽게 바꿀 수 있다.
HTML은 태그로 구성되어 있으며, 하이퍼링크를 지원한다.
HTML 문서의 내용은 기본적으로 html 태그 안에 포함된다. 그런데 이 html 태그 안은 크게 ‘머리’의 영역인‘head 태그’와 ‘몸통’의 영역인 ‘body 태그’로 나뉜다. head 태그는 HTML 문서의 제목이나 키워드 등 해당 HTML 문서에 대한 정보를 포함하며, body 태그는 HTML 문서가 웹 페이지 상에서 실제로 보여주는 텍스트나 이미지, 하이퍼링크 등의 내용을 포함한다.
charset="utf-8"이라는 내용을 명시하였는데, 이는 HTML 문서가 한글 문자를 제대로 인식하도록 설정하는 기능을 한다.
a 태그의
href 속성은 하이퍼링크 지정 시 필수적인 부분인데, 해당 하이퍼링크를 따라 이동해 갈 웹 페이지의 URL을 그 값으로 가진다. a 태그에서 href 속성값이 “http://codelion.net”이라는 것은, 곧 해당 하이퍼링크를 클릭했을 때 “http://codelion.net”이라는 URL로 이동하도록 설정한 것이다. 한편 이어지는 target 속성값이 “_blank”라는 것은, 해당 하이퍼링크를 클릭했을 때 “http://codelion.net” URL에 해당하는 웹 페이지를 새로운 웹 브라우저 창(또는 탭)에서 띄우도록 설정한 것이다.
제목을 나타내는 태그에는 h1, h2, h3, h4, h5, h6 태그가 있다. 이를 간략하게 ‘h# 태그’라고 표기할 것이다. ‘h’ 뒤에 붙는 ‘#’는 제목의 크기를 결정짓는 숫자에 해당하며, 숫자가 작을수록 제목의 크기가 커진다. 즉, h1 태그가 적용된 제목이 가장 크고, h6 태그가 적용된 제목이 가장 작게 보여지는 것이다.
하나의 문단(paragraph)을 나타낼 때 사용하는 태그도 있다. 이를 ‘p 태그’라고 한다. 특정 텍스트에 p 태그를 적용하여 문단으로 설정하면, 웹 페이지 상에서는 이 텍스트 위아래에 자동으로 빈 행을 만들어 문단의 모양을 갖추도록 한다.
p 태그 안에 포함되는 텍스트는 하나의 연결된 문단으로서 화면 상에 표시된다. 그런데 경우에 따라서는 문단 내의 텍스트 일부를 다음 줄로 넘기고 싶을 수 있다. 이러한 경우 원하는 지점에서 줄바꿈(line break)을 수행하는 ‘br 태그’를 사용하면 된다.
순서가 있는 리스트(ordered list)는, 말 그대로 각각의 리스트 항목 앞에 순서대로 번호가 붙는 리스트이다. 순서가 있는 리스트는 ‘ol 태그’를 사용하여 나타내며, 리스트 내 각각의 항목들을 ‘li 태그’를 사용하여 표시할 수 있다.
순서가 없는 리스트(unordered list)는, 각각의 리스트 항목 앞에 (번호 대신) 일정한 형태의 표식이 붙는 리스트이다. 순서가 없는 리스트는 ‘ul 태그’를 사용하여 나타내며, 리스트 내 각각의 항목들을 ‘li 태그’를 사용하여 표시할 수 있다.
댓글
댓글 쓰기