본문 바로가기

Search/Code Formatter & Linter4

husky && lint-staged husky husky는 git hook을 쉽게 제어하도록 도와주는 매니저이다. Git hook Git도 다른 버전 관리 시스템처럼 어떤 이벤트가 생겼을 때 자동으로 특정 스크립트를 실행하도록 할 수 있다. 이것을 Git hook이라고 하고, Git hook은 클라이언트 훅과 서버 훅으로 나눌 수 있다. 클라이언트 훅은 커밋이나 Merge 할 때 실행되고 서버 훅은 Push 할 때 서버에서 실행된다. Git hook의 라이프 사이클은 아래와 같다. 각 단계는 아래와 같은 특성을 갖는다. pre-commit: 커밋 메시지를 작성하기 전에 호출된다. prepare-commit-msg: 커밋 메시지 생성 후 편집기 실행 전에 호출된다. commit-msg: 커밋 메시지와 관련된 명령을 넣을 때 호출된다. pos.. 2021. 8. 12.
Javascript Linter 조사 자바스크립트는 인터프리터 언어에 속하기 때문에, 런타임에 에러가 발생할 확률이 높다. 따라서, LINT TIME 즉, 소스 코드를 작성할 때, 사전에 에러들을 발견하고 해결하는 것이 중요하다. 자세한 내용은 아래 두 링크를 참고하자. [코드스피츠] Compile Language vs Script Language 해당 게시글은 코드 스피츠 동영상의 정리 내용이다. Program은 물리적인 파일인 컴퓨터의 실행파일을 실행해서 OS가 메모리에 적재한 상태이다. 즉, 메모리에 명령과 값으로 분리되어서 올라간 egas.tistory.com GitHub - hochan222/Everything-in-JavaScript: Everything in JavaScript Everything in JavaScript. Co.. 2021. 8. 10.
Prettier vs Beautify Code Formatter란 개발자가 작성한 코드를 정해진 코딩 스타일을 따르도록 변환해주는 도구를 뜻한다. VSCode Extension 중 Javascript Code Formatter로는 대표적으로 Prettier와 Beautify가 존재한다. TL;DR custom .prettierrc { "singleQuote": true, "trailingComma": "all", "printWidth": 120 } Prettier 스타일 형식이 대부분 강제. prettier: (Star: 40.3k, Used by: 3.1m, Contributors: 546) prettier-vscode: (Star: 3.9k, Contributors: 74) .prettierrc을 사용 (옵션 21개) Beautify P.. 2021. 8. 10.
ESLint를 설정해보자! 우선 용어에 대해 알아보자. 린트(lint): 소스 코드에 문제가 있는지 탐색하는 작업 린터(linter): 린트 작업을 도와주는 소프트웨어 도구 오늘은 많은 기업들이 쓰고있는 ESLint를 사용해보자. 아래는 ESLint의 스폰서들이다. Airbnb, Chrome도 있따! ESLint 설치, 기본 설정 - package.json 추가 및 설치 (ESLint getting-started) yarn init yarn add --dev eslint - .eslintrc.js 생성 node_modules/.bin/eslint --init 알맞은 자신의 상황에 맞춰 선택지를 선택해준다. 그러면 아래와 같이 파일이 생성된다. module.exports = { "env": { "browser": true, "es2.. 2021. 5. 23.