# Prettier

React + Typescript eslint, prettier설정
ESLint : 코드의 문법을 검사하는 린팅과 코드의 스타일을 잡아주는 포맷팅 기능을 한다. 쉽게 말해 자바스크립트 문법 중 에러가 있는 곳에 표시를 달아놓는 도구이다.Prettier : 코드의 스타일을 잡아주는 포맷팅 기능을 한다.eslint 와 prettier 연결
VSCODE - eslint & prettier 사용 및 window 에러
프로젝트를 진행하며 프론트 간의 초기세팅시 eslint 와 prettier를 세팅을 진행했고그 과정에서 나왔던 window가 겪게 되는 error 에 관해서 블로깅을 남겨본다.먼저 간단히 소개를 하자면 ESlint는 해당 소스코드를 확인하여 문법적으로 에러가 있거나 버

vscode에서 lint, prettier, settings.json 설정
https://jeonghwan-kim.github.io/series/2019/12/30/frontend-dev-env-lint.htmlESLint: ECMAScript 코드를 검사하고 코드를 정정하는데 도움을 주는 도구 중 하나포맷팅코드 품질 적용eslint

[Prettier] htmlWhitespaceSensitivity 속성
prettier.htmlWhitespaceSensitivity의 세가지 속성 / prettier가 공백을 처리하는 방법
Prettier 적용
Prettier는 코드를 읽어들여서 사용자 옵션에 따라 코드를 다시 포맷팅하는 코드 포맷터 입니다.코드 스타일에 초점을 맞추고 있기 때문에, 코드 품질을 위해 사용하는 ESLint와는 성격이 다릅니다.Prettier를 사용하는 가장 큰 이유는 공통된 코딩 스타일 가이드

[React] create-react-app & Typescript 초기 세팅 완벽 정리
최근에 타입스크립트를 배우고 타입스크립트로 create-react-app을 설정하는데 시간이 많이 걸렸다..그리고 새로 프로젝트를 시작할 때 초기세팅을 완벽하게 하자! 라고 생각을 해서 협업을 할 때 문법이 서로 틀리는 것, 코드 구조가 틀리는 것을 방지하고자 esl
etc
visual studio code prettier : setting default formatter에서 esbenp-prettier vscode 등록 해주어야함.seetings: editor : format on Save 체크 해주어야 함.cmd + shift + p

[Type script] CRA 프로젝트에 타입 스크립트 와 eslint & prettier 끼얹기
가장 빠르고 손쉽게 리액트 프로젝트를 시작할 수 있는 방법인 CRA를 통해 프로젝트를 생성해준다. 타입스크립트 환경에서 개발하기 위해선 cra 생성 시 --template typescript를 붙여주면 된다.npx create-react-app . --template

[Typescript & React & Eslint 환경설정 2편] ESLint & Prettier 설정
Typescript & React & Eslint 환경설정 2편 ESLint, Prettier 설정하기 !
2021 / 01 / 02 리팩토링2 - Recoil
recoil 설정 및 간단 정리 recoil 을 설치 한 후 상위에 RecoilRoolt를 씌워 recoil을 사용할 수 있게 해준다. 1) atom atom은 리액트의 state와 비슷하다. atom을 변경하면 해당 atom을 구독하고 있는 컴포넌트들이 모두 다

2021 / 01 / 02 리팩토링1
기존의 통계 프로젝트를 리팩토링 해야한다고 하여 기본환경 세팅 / 라이브러리 설정을 맡아 하게 되었다.기본환경 세팅은 다음과 같이 했다기본 아키텍쳐 구조 정의컨벤션 정의eslint 설정prettier 설정서버 - express / js클라이언트 - react / ts

TS 개발 환경 구축(CRA, ESlint, Prettier)
vscode환경에서 react 프로젝트를 위해 ESlint와 Prettier을 하는 방법을 서술합니다.
ESLint + Prettier + TypeScript + Husky + VSCode (+ Node)
TypeScript, Node 환경에서 Visual Studio Code를 통해 작성한 코드를 저장할 때마다 자동으로 포맷하고, ESLint를 통해 문법 오류를 확인하고, Husky를 통해 커밋하기 전에 스크립트를 실행하는 기능을 사용해보도록 하자.

[babel] SyntaxError : Support for the experimental syntax 'classProperties' isn't currently enabled 에러 해결하기
npm start로 실행시 위와 같은 에러가 발생했다.SyntaxError: /{경로}/CMS/backend/controller/hello.controller.js: Support for the experimental syntax 'classProperties' isn

React + TypeScript 환경에서 ESLint, Prettier 설정하기
이번 포스팅은 React + TypeScript 환경에서 ESLint와 Prettier 설정하는 방법에 대해서 알아보려고 한다.개발을 진행하다보면 일관적이지 않은 코드들 때문에 코드 정리를 하는데 많은 시간을 쓰게된다. 혼자하는 프로젝트라면 어떻게 코드를 작성하든 문제

[React] Create-React-App에 Prettier & ES Lint 적용하기
협업을 진행하다보면 각기 다른 코드 스타일 때문에 코드의 통일성과 가독성이 떨어지거나, 잠재적으로 여러 문제를 일으킬 수 있는 위험이 있다. 그렇기에 협업시엔 코드 스타일을 합일화 할 필요성이 있는데, Prettier와 ES Lint를 적절히 사용한다면 협업시의 코드스