안녕하세요, 이곳에 적을 게시글은 제가 추천한 에디터인 브라켓의 유용한 플러그인을 소개하려고 작성하는 게시글 입니다.
해당 플러그인은 추천 플러그인일 뿐 여러분이 마음에 들지 않는다면 설치하지 않으셔도 됩니다.
모두 코딩하는데 편의성을 요하는 플러그인이니 필요하다 싶은거만 다운 받고 사용하시면 됩니다.
HTML 편집기 무료 소프트웨어 Adobe Brackets
우선 브라켓을 열게되면 오른쪽에 블럭 아이콘이 있습니다.
해당 아이콘을 눌러주시면 플러그인 다운로드 창이 뜨게 됩니다.
플러그인 종류가 무쟈게 많습니다, 그중에서 추천해드리는걸 소개하겠습니다.
1. Popup-menu-extension ( 우클릭 메뉴 확장 )
- 우클릭 메뉴 확장이라고 검색하시면 나옵니다. -
사용방법 : 마우스 오른쪽 클릭
우클릭 시 뜨는 메뉴에
잘라내기, 복사, 붙여넣기, 저장, 케이스 변환 등 여러가지 기능이 추가됩니다.
2. Emmet
사용방법 : 도움말 옆에 Emmet 메뉴가 생성된다.
코딩을 한층 더 빠르게 해줍니다.
예를 들어서 <div></div> 라고 입력을 했으면 div 요소 사이에서 엔터를 입력하면
</div>가 한줄 더 아래로 내려가고
그 사이에 자동으로 들여쓰기 공간이 만들어 집니다.
브라켓 필수 플러그인 중 하나입니다.
3. HTML Templates
사용방법 : 편집 > HTML Templates.. > 원하는 버전 선택
메뉴를 통해 들어가 자신이 원하는 HTML 서식 또는 프레임워크 서식을 선택해서 만들 수 있다.
4. Beautify
사용방법 : Ctrl + Shift + L
코드를 보기 좋게 자동으로 정리해줍니다.
5. Brackets Icons
사용방법 : 자동으로 적용됩니다.
좌측 사이드바에 있는 파일 목록에 아이콘이 적용되어 무슨파일인지 알아보기 편하게 해줍니다.
HTML = <>
CSS = #
스크립트 = {}
형식으로 표현
6. Indent Guides
사용방법 : 보기 > Indent Guides 체크
들여쓰기만으로는 가독성이 떨어질때 도움을 주는 가이드 라인을 만들어서 보여줍니다.
 |  |
7. Custom Work
사용방법 : 자동 적용
웹문서별로 탭을 만들어 줍니다.
브라켓 기본 화면은 왼쪽에 파일명으로 나열되는게 전부라서 문서 이동시 불편함이 조금 있는데
이 플러그인을 설치하면 불편함이 조금 해소 됩니다.
이런식으로 탭으로 형성되서 보기가 좋습니다.
설정값은 이러합니다.
8. Color Highlighter
사용 방법 : 자동 적용
색상코드에 색상이 입혀서 나옵니다.
보기가 좋습니다.
버그로 인해 색상표현이 안될때도 있긴합니다.