노트패드++(Notepad++) 코드 자동 정렬(XML, HTML, Javascript)하는 방법

노트패드++ 은 프로그램 개발 도구로도 많이 사용하는 툴입니다. 왜냐하면 프로그래밍과 관련한 여러 기능들을 제공하고 있기 때문입니다. 그 중 하나가 코드 자동 정렬 기능입니다. 보통 javascript 같은 경우 난독화 때문에 1열로 배치해서 배포하는 경우가 많습니다. 소스 파악하기 쉽지 않은 자바스크립트 코드를 보기 쉽게 자동 정렬해 보겠습니다. 우선 자동 정렬 관련한 플러그인을 다운받아야 합니다.

 

 

 

◎ 자바스크립트(javascript) 자동 정렬

 

 

▼ 보통 코드 난독화로 인해 1열로 보입니다. 이런 코드를 분석하기는 거의 불가능합니다. 먼저 자바스크립트 코드를 정렬해 보겠습니다.

 

▼ 먼저 파일 포맷을 해당 언어인 Javascript 로 변경합니다. 언어 메뉴에서 선택할 수 있습니다. 

 

▼ 다음은 자동 정렬을 도와줄 플러그인을 설치해야 합니다. 플러그인 > Plugin Manager > Show Plugin Manager 메뉴를 선택합니다. 

 

▼ 플러그인 관리 화면에서 Available 탭으로 이동합니다. 그리고 플러그인 목록에서 JSTool 을 찾아 설치를 진행합니다. 해당 플러그인을 체크하고 오른쪽 하단에 Install 버튼을 클릭합니다. 

 

※ 아래는 참고하면 좋을 만한 글들의 링크를 모아둔 것입니다. ※ ▶ 노트패드++ (notepad++) 메뉴 한글 전환하기 ▶ 노트패드++(Nodepad++) 세로 편집(세로 붙여넣기) 사용하는 방법 ▶ 노트패드++(Notepad++) 다양한 테마 적용하기 ▶ 노트패드 Notepad++ 기본 파일 확장자 연결하는 방법 ▶ 노트패드++ (notepad++) 자동 줄바꿈 설정하기

 

 

 

 

 

▼ 자동 정렬을 위해 설치한 플러그인을 실행해 보겠습니다. 플러그인 메뉴를 클릭하면 방금 설치한 JSTool 을 볼 수 있습니다. JSTool 하위 메뉴로 가서 JSFormat 을 선택합니다. 

 

▼ JSTool 의 포맷 기능을 실행한 결과는 다음과 같습니다. 문법에 맞게 자동으로 정렬이 되었습니다. 이같이 극단적이 경우가 아니더라도 조금 틀어진 소스를 정렬하는데도 많이 사용합니다. 

 

 

 

◎ HTML, XML 정렬하기

 

 

▼ 다음은 HTML 과 XML 을 정렬하는 방법입니다. HTML 은 XML 범주에 들어가기 때문에 방법은 동일합니다. 그림처럼 정렬이 안된 HTML 파일이 있다고 합시다. 

 

▼ 먼저 파일 포맷을 해당 언어인 HTML 로 변경합니다. 언어 메뉴에서 선택할 수 있습니다. 

 

▼ 다음은 자동 정렬을 도와줄 플러그인을 설치해야 합니다. 플러그인 > Plugin Manager > Show Plugin Manager 메뉴를 선택합니다. 플러그인 목록에서 XML Tools 를 체크하고 설치합니다. 

 

▼ 자동 정렬을 위해 설치한 플러그인을 실행해 보겠습니다. 플러그인 메뉴를 클릭하면 방금 설치한 XML Tools 을 볼 수 있습니다. JSTool 하위 메뉴로 가서 Pretty print 을 선택합니다. 

 

▼ 결과는 다음과 같습니다. XML Tool 플러그인을 통해서 코드 구분을 쉽게 할 수 있도록 한방에 정렬할 수 있었습니다. 

※ 아래는 참고하면 좋을 만한 글들의 링크를 모아둔 것입니다. ※ ▶ 노트패드++ (notepad++) 메뉴 한글 전환하기 ▶ 노트패드++(Nodepad++) 세로 편집(세로 붙여넣기) 사용하는 방법 ▶ 노트패드++(Notepad++) 다양한 테마 적용하기 ▶ 노트패드 Notepad++ 기본 파일 확장자 연결하는 방법 ▶ 노트패드++ (notepad++) 자동 줄바꿈 설정하기