저번주 주제지만 어제 수업 들으면서 의문이 해결되어서 짧게 적는다!
수업시간에 항상 뚫어져라 보고 있는 멘토 님의 vs code 하단에는 항상 이런 것들이 적혀있었다.
graphQL도 익숙하고 go Live는 뭔지 모르겠지만 느낌적으로 알 것 같고...
근데 Prettier과 ESLint 뭘까?
결론부터 말하면 둘 다 개발환경에서 설정하면 편한 확장 프로그램들이고, typescript 설정을 하면 보통 자동으로 내장이 된다!
설치는 npm
이나 yarn
을 통해서 해도 되고 확장 프로그램을 통해서도 받는다.
자바스크립트는 에러를 정확히 찝어주지 않는데, ESLint
를 사용하면 코드를 분석해서 문제점을 찾고 고쳐주는 코드 린터이
다.
여기서 린터
는?
린트(lint) 또는 린터(linter)는 소스 코드를 분석하여 프로그램 오류, 버그, 스타일 오류, 의심스러운 구조체에 표시(flag)를 달아놓기 위한 도구들을 가리킨다.
그렇다고 한다!
이 ESLint를 사용하면 나중에 폴더 안에 있는 설정파일을 수정해서 사용자의 편의대로 코딩 문법 규칙을 더 정하고 더 수정할 수도 있다. 너무 편하다!
항상 노드로 돌리고 나서야 에러가 있는지 없는지 알려주던 js
에 비하면 정말 천사같다.고마워 타입스크립트! 고마워 ESLint! 🥲
ESLint
가 문법 구조를 정해주는 툴이라면, Prettier
은 코드의 구조적인 부분을 자동으로 조정해주는 코드 포맷터(Formatter)
이다. 포맷터는 포맷을 정해주는 도구를 말하는게 아닐까~ 하는 추측을 할 수 있었다. 실제로 사용자가 원하는 포맷을 지정해고 저장을 하면 알아서 적용이 된다. 이건 setting.json
에서 따로 설정을 해줘야하는 부분이지만 여튼 그렇다.
typescipt
를 사용하면 자연스럽게 사용하게 될 도구이고, 수많은 오류, 들여쓰기를 사용하게 될 개발자들에게 필수적인 프로그램이다. 혹여나 빼먹지 말고 꼭 사전에 설치하고 사용해서 노드 돌리기 전에 에러를 찾고 광명도 찾자!! 🥲