소스 코드 구문 강조 #1 - 솔루션들의 스타일



오랜 시간동안 블로그 관리를 소홀히 하였더니 SyntaxHighlighter를 사용한 글이 제대로 표시되지 않는 문제를 발견하였습니다.

알고보니 SyntaxHighlighter의 사용법이 바뀌었더군요 +_+


그래서 소스 코드 구문 강조를 위한 몇가지 솔루션들을 찾아보았습니다.

우선 이러한 몇 가지 솔루션들의 소스 코드 구문 강조 스타일을 나열해 보도록 하겠습니다.

(물론 각 솔루션의 테마는 개인 취향으로 선택하여 나열하였습니다)


다음 포스팅에는 아래 나열되어 있는 소스 코드 구문 강조 솔루션들의 사용법에 대해 알아보도록 하겠습니다.

(이번은 스타일 정도만...사용법 포스팅이 되는데로 연결시켜 놓겠습니다.)


1. SyntaxHighlighter (Midnight)

#include <stdio.h>

int _tmain(int argc, _TCHAR* argv[])
{
	int nTemp = 0; // Comment : Dummy
	char szTemp[50] = "http://reslee.kr";

	printf("Hello World - %s\n", szTemp);

	return 0;
}

아마도 가장 많이 사용되는 솔루션이 아닐까 싶습니다.

설치형이지만 호스팅된 파일들을 이용하면 별도의 설치 없이 사용 가능합니다.

특징으로는 라인넘버 표시 기능과 라인강조 기능이 있습니다.

클립보드 복사 시 원문 그대로 복사됩니다.


공식사이트 : http://alexgorbatchev.com/SyntaxHighlighter/

사용법 : http://reslee.kr/59


2. highlight.js (vs)

#include <stdio.h>

int _tmain(int argc, _TCHAR* argv[])
{
	int nTemp = 0; // Comment : Dummy
	char szTemp[50] = "http://reslee.kr";

	printf("Hello World - %s\n", szTemp);

	return 0;
}

개인적으로는 가장 심플하면서 사용하기 편한 솔루션으로 생각합니다 (군더더기가 없다고 해야 할까요)

마찬가지로 설치형이지만 호스팅된 파일들을 이용하면 별도의 설치 없이 사용 가능합니다.

가장 최근까지 업데이트 되고 있는 것이 장점이기도 합니다.

또한 수많은 언어에 대한 코드 구문 강조를 지원한다는 것도 또 하나의 장점으로 생각합니다.


특징으로는 별도의 라인넘버 표시나 라인강조 기능이 없다는 것 입니다.

highlight.js 자체가 심플함을 표방하고 이를 바탕으로 만들어진 것이 그 이유입니다.

(물론 몇몇 유저들이 만들어 놓은 서드파티 모듈을 사용하면 가능한 것 같습니다만...)

이러한 highlight.js 만의 이념은 아래 페이지에 잘 나와 있습니다.

Line numbers

클립보드 복사 시 줄바꿈이 되지 않습니다.


공식사이트 : https://highlightjs.org/

사용법 : http://reslee.kr/60


3. syntaxhighlight.in (Default)

  1. #include <stdio.h>
  2. int _tmain(int argc, _TCHAR* argv[])
  3. {
  4.     int nTemp = 0; // Comment : Dummy
  5.      char szTemp[50] = "http://reslee.kr";
  6.     printf("Hello World - %s\n", szTemp);
  7.     return 0;
  8. }

하이브리드 형태를 보이는 솔루션입니다.

코드 구문 강조를 위한 코드 입력과 그 결과로 얻은 실제 사용될 html 코드는 웹 페이지를 통해서 이뤄집니다.

이 결과 코드를 위와 같이 표현되도록 하기 위해서는 설치(.css 파일과 .js 파일)가 필요합니다.

특징으로는 라인넘버 표시와 라인강조 기능을 제공합니다.

클립보드 복사 시 빈 라인은 줄바꿈이 되지 않습니다.


공식사이트 : http://syntaxhighlight.in/

사용법 : http://reslee.kr/61


4. https://tohtml.com (navy)

#include <stdio.h>

int _tmain(int argc, _TCHAR* argv[])
{
	int nTemp = 0; // Comment : Dummy
	char szTemp[50] = "http://reslee.kr";

	printf("Hello World - %s\n", szTemp);

	return 0;
}

별도의 설치나 소스 변경 없이 바로 웹 페이지에서 코드 구문 강조를 위한 html 코드를 획득하여 그대로 사용합니다.

특징으로는 간편하게 사용할 수 있고 라인넘버 표시나 라인강조 기능은 제공되지 않습니다.

클립보드 복사 시 원문 그대로 복사됩니다.


공식 사이트 : https://tohtml.com/


5. http://hilite.me (vs)

#include <stdio.h> int _tmain(int argc, _TCHAR* argv[]) { int nTemp = 0; // Comment : Dummy char szTemp[50] = "http://reslee.kr"; printf("Hello World - %s\n", szTemp); return 0; }

위 https://tohtml.com와 마찬가지로 별도의 설치나 소스 변경 없이 바로 웹 페이지에서 코드 구문 강조를 위한 html 코드를 획득하여 그대로 사용합니다.

특징으로는 간편하게 사용할 수 있고 https://tohtml.com와는 다르게 라인넘버 표시 기능을 제공합니다.

하지만 라인넘버 표시가 이쁘게 되지 않으므로 별로 추천하진 않습니다 (물론 개인 취향이라...)

클립보드 복사 시 줄바꿈이 되지 않습니다.


공식 사이트 : http://hilite.me/


그럼 서두에 말씀드린 것 처럼 각 솔루션 사용법은 다음에 알아보도록 하겠습니다.


+ Recent posts