프리티어
1. 개요
1. 개요
프리티어는 자바스크립트로 작성된 플러그인 방식의 다중 언어 코드 포매터이다. 제임스 롱에 의해 개발되었으며, 2017년 5월 27일에 처음 출시되었다. MIT 라이선스로 배포되는 오픈 소스 소프트웨어이다.
이 도구의 핵심 철학은 'opinionated'이다. 이는 코드의 의미가 동일한 여러 표현 방식이 존재하더라도, 프리티어가 정해진 하나의 스타일로 강제하여 포맷한다는 의미이다. 따라서 개발자 간의 코딩 스타일 논쟁을 줄이고, 프로젝트 전체의 코드 일관성을 유지하는 데 주된 목적이 있다.
프리티어는 HTML, CSS, JSON, 마크다운과 같은 웹 기술 언어들을 기본적으로 지원하며, 타입스크립트, JSX, Vue.js와 같은 확장 언어도 내장되어 있다. 또한 플러그인 시스템을 통해 자바, PHP, 러스트 등 다양한 프로그래밍 언어로의 지원을 확장할 수 있다.
2. 특징
2. 특징
프리티어는 '의견을 가진'이라는 뜻의 'opinionated'를 캐치프레이즈로 내세운 코드 포매터이다. 이는 의미상 동일한 여러 형태의 코드가 존재하더라도, 프리티어가 정한 단 하나의 스타일로 강제로 통일한다는 철학을 반영한다. 많은 코드 포매터가 들여쓰기나 화이트스페이스 같은 레이아웃만을 다루는 반면, 프리티어는 따옴표 사용 방식, 불필요한 괄호 제거, 이스케이프 문자 정리 등 구체적인 문법 요소까지도 정해진 규칙에 따라 변환한다.
이러한 철학 때문에 프리티어는 개발자 취향이나 팀 컨벤션에 맞춰 세밀하게 설정할 수 있는 수많은 옵션을 제공하는 다른 포매터들과 차별화된다. 프리티어의 기본 설정 옵션은 10개를 조금 넘는 수준으로 매우 제한적이다. 이마저도 들여쓰기 길이나 탭 대 공백 문자 사용 여부와 같이 논쟁이 잦은 사항에 집중되어 있으며, 대부분의 포매팅 규칙은 사용자가 변경할 수 없다. 이로 인해 코드 스타일 논쟁을 근본적으로 중단시키는 것이 프리티어 채택의 가장 큰 이유로 꼽힌다.
프리티어는 플러그인 아키텍처를 기반으로 한 다중 언어 코드 포매터로 설계되었다. 자바스크립트, 타입스크립트, CSS, HTML, JSON 등 웹 개발 생태계의 언어들을 내장 지원하며, 플러그인을 통해 러스트, 자바, PHP 등 다른 언어로도 확장 가능하다. 설정은 JSON이나 YAML 형식의 .prettierrc 파일을 통해 관리하며, 에디터컨피그 파일의 일부 설정을 상속받을 수도 있다.
주요 개발 환경과의 연동도 잘 구축되어 있다. 비주얼 스튜디오 코드, 웹스톰을 비롯한 제트브레인 IDE, 네오빔, 이맥스 등 대부분의 현대적 코드 에디터와 통합 개발 환경에서는 파일 저장 시 자동으로 포매팅을 적용할 수 있는 공식 또는 서드파티 확장을 제공한다.
3. 점유율
3. 점유율
프리티어는 프런트엔드 업계 및 자바스크립트 생태계에서 압도적인 점유율을 보이고 있다. 다른 자바스크립트 포매터와 비교했을 때 그 입지는 매우 확고하다. 2021년 Devographics의 State of JS 설문조사에 따르면, 응답자 중 83.2%가 프리티어를 사용하고 있는 것으로 나타났다. 이는 유틸리티 부문에서 2위에 해당하는 수치이며, 1위는 91.4%의 점유율을 기록한 ESLint였다.
프리티어의 광범위한 채택은 GitHub 저장소에서도 확인할 수 있다. 프로젝트에 프리티어를 설정하여 사용하는 경우, package.json의 devDependencies에 종속성으로 명시되거나 프로젝트 루트에 .prettierrc 설정 파일이 존재한다. GitHub의 Dependency graph를 통해 검색하면, 프리티어를 사용하는 GitHub 저장소가 1천만 개에 가까운 것으로 집계된다. 이는 전 세계 수많은 오픈 소스 및 사내 프로젝트에서 코드 스타일의 일관성을 위해 프리티어를 표준 도구로 채택하고 있음을 방증한다.
이러한 높은 점유율은 프리티어의 핵철 철학인 'opinionated'한 접근 방식에서 기인한다. 개발 팀 내에서 코딩 스타일을 두고 발생하는 끝없는 논쟁을 종식시키고, 일관된 포맷을 강제함으로써 생산성을 높이는 데 초점을 맞추고 있다. 따라서 리액트나 뷰와 같은 현대적 웹 프레임워크를 사용하는 프로젝트뿐만 아니라, 타입스크립트, CSS, 마크다운 등 다양한 언어를 아우르는 프로젝트에서도 널리 사용되고 있다.
4. 설정
4. 설정
프리티어의 설정은 설정 파일을 통해 이루어진다. 가장 일반적인 방법은 프로젝트 루트에 .prettierrc 확장자를 가진 파일을 생성하는 것이다. 이 파일은 JSON, YAML, TOML, JavaScript, TypeScript 등 다양한 형식을 지원한다. 또한, package.json 파일 내에 "prettier" 키를 추가하여 설정을 임베드할 수도 있으나, 권장되는 방법은 아니다.
프리티어는 opinionated 철학을 따르기 때문에, 대부분의 코드 스타일은 사전에 정의된 규칙에 따라 자동으로 결정된다. 사용자가 조정할 수 있는 설정 옵션의 수는 매우 제한적이며, 주로 들여쓰기 길이(tabWidth), 세미콜론 사용 여부(semi), 따옴표 종류(singleQuote) 등 논쟁의 여지가 있을 수 있는 기본적인 레이아웃 요소에 국한된다. 예를 들어, printWidth 옵션은 코드 한 줄의 최대 길이를 지정하며, 이를 초과하면 프리티어가 자동으로 줄을 바꾼다.
프리티어는 EditorConfig를 기본적으로 지원한다. indent_style, indent_size, end_of_line과 같은 EditorConfig 설정이 프로젝트에 존재할 경우, 프리티어는 해당 값을 관련 옵션(useTabs, tabWidth, endOfLine)의 기본값으로 자동 상속받아 사용한다. 이는 프로젝트 내 코딩 스타일 일관성을 유지하는 데 도움이 된다. 모든 설정은 명령 줄 인터페이스(CLI)를 통해서도 지정할 수 있다.
5. 지원 언어
5. 지원 언어
5.1. 내장
5.1. 내장
프리티어는 기본적으로 여러 프로그래밍 언어와 마크업 언어를 내장 지원한다. 이는 플러그인을 추가로 설치하지 않아도 즉시 사용할 수 있는 공식 지원 언어들이다. 주로 웹 개발 생태계와 밀접하게 연관된 언어들이 중심을 이루며, 자바스크립트와 타입스크립트를 비롯해 JSX 및 TSX 구문을 완벽하게 지원한다.
또한 CSS, SCSS, LESS와 같은 스타일시트 언어와 HTML, 마크다운, JSON 등의 마크업 및 데이터 형식도 내장되어 있다. 프론트엔드 프레임워크 중에서는 Angular의 템플릿과 Vue.js의 싱글 파일 컴포넌트(.vue 파일)에 대한 포매팅이 기본 제공된다. 그 외에도 GraphQL 쿼리 언어와 YAML 설정 파일 형식도 지원 목록에 포함되어 있다.
이러한 내장 언어 지원은 프리티어가 'opinionated' 철학을 유지하면서도 웹 개발 워크플로우에서 가장 흔히 마주치는 파일 형식들을 광범위하게 커버할 수 있도록 한다. 개발자는 별도의 설정 없이도 프로젝트의 자바스크립트, 타입스크립트, CSS, HTML 코드에 대해 일관된 포매팅 규칙을 쉽게 적용할 수 있다.
5.2. 확장
5.2. 확장
프리티어는 플러그인 시스템을 통해 공식적으로 내장되지 않은 프로그래밍 언어나 마크업 언어에 대한 포맷팅 지원을 확장할 수 있다. 이러한 확장 기능은 대부분 커뮤니티에서 개발한 prettier-plugin-* 형태의 npm 패키지로 제공된다. 이를 통해 자바, PHP, Ruby, Rust와 같은 범용 언어부터 Astro, Svelte와 같은 웹 프레임워크, Prisma 스키마, TOML, XML과 같은 설정 파일 형식까지 다양한 코드베이스를 프리티어의 일관된 스타일로 관리할 수 있게 된다.
확장 플러그인을 사용하려면 프로젝트에 해당 패키지를 개발 의존성으로 설치하고, 프리티어 설정 파일에 플러그인을 명시해야 한다. 예를 들어, Tailwind CSS 클래스를 정렬하는 prettier-plugin-tailwindcss를 사용하면 클래스 순서를 일관되게 유지할 수 있다. 그러나 이러한 플러그인들은 각자 고유의 설정 옵션을 추가할 수 있어, 프리티어의 핵심 철학인 '의견을 가진(opinionated)' 접근 방식과는 다소 상충될 수 있다.
6. 개발환경 연동
6. 개발환경 연동
프리티어는 다양한 코드 에디터 및 통합 개발 환경에서 플러그인이나 확장 형태로 연동되어 사용된다. 주요 기능은 파일을 저장할 때나 특정 이벤트가 발생했을 때 현재 파일의 코드를 자동으로 포맷하는 것이다. 프리티어 자체가 Node.js 런타임을 필요로 하기 때문에, 대부분의 연동 방식은 로컬 프로젝트의 node_modules 디렉터리나 전역에 설치된 프리티어 CLI를 찾아 실행하는 방식을 취한다.
주요 개발 도구별 지원 현황은 다음과 같다.
개발 도구 | 지원 확장/플러그인 | 비고 |
|---|---|---|
| 프로젝트 내 | |
| 특히 WebStorm은 기본 내장 지원이 있으며, 로컬에 설치된 프리티어를 자동으로 감지하여 사용한다. | |
| 통합 플러그인 시스템이 없어 여러 구현체가 존재하며, prettierd를 함께 지원하는 경우가 많다. | |
| ||
|
이러한 연동을 통해 개발자는 코드 스타일을 수동으로 정리하는 번거로움 없이, 일관된 포맷팅 규칙을 자동으로 적용할 수 있다. 특히 팀 프로젝트에서 코딩 컨벤션을 유지하는 데 큰 도움을 준다.
7. 파생 소프트웨어
7. 파생 소프트웨어
프리티어의 핵심 라이브러리와 API를 기반으로 하여 특정 목적을 위해 개발된 파생 소프트웨어들이 존재한다. 이들은 주로 성능 향상이나 특정 환경에서의 편의성을 목표로 한다.
대표적인 파생 소프트웨어로는 prettierd가 있다. 이는 프리티어를 CLI가 아닌 데몬 프로세스로 실행하여 포매팅 요청을 처리하는 래퍼이다. Node.js 런타임의 초기 로딩 시간을 줄여, 특히 vim이나 Neovim과 같이 표준 입출력을 통해 프리티어를 호출하는 환경에서 포매팅 속도를 크게 개선하는 데 목적이 있다. 비슷한 성능 개선 도구로는 parallel-prettier가 있으며, 이는 프리티어 CLI의 작업을 병렬화하여 대규모 프로젝트에서 여러 파일을 한꺼번에 처리할 때 유용하다.
또 다른 예로 prettier-chrome이 있다. 이는 크롬 브라우저의 확장 프로그램으로, 웹 페이지 내의 코드 편집기나 특정 텍스트 영역에 대해 프리티어 포매팅 기능을 제공한다. 이를 통해 온라인 코드 에디터나 개발자 도구 등 브라우저 환경에서도 코드 스타일을 일관되게 유지할 수 있다.
