React Developer Tools

리액트 개발자라면 꼭 쓰는!

chrome web store에서 react dev검색하면 React Developer Tools 다운로드할 수 있다.

이렇게 리액트로 만들어진 홈페이지면 불도 들어오고, 개발자 툴에서 어떤 방식으로 만들어졌는지, 구성된 건지도 확인할 수 있음! 디버깅도 가능

Reactjs code snippets

컴포넌트를 일일이 수동적으로 하지 않아도,

"rcc 엔터"만 누르면 바로 리액트 컴포넌트가 생길 수 있도록 도와주는 툴입니다!

이것을 설치하게 되면, React 관련 템플릿을 단축키로 작성할 수 있다.

rcc→	class component skeleton
`rrc→`	class component skeleton with react-redux connect
`rccp→`	class component skeleton with prop types after the class
`rcjc→`	class component skeleton without import and default export lines
`rcfc→`	class component skeleton that contains all the lifecycle methods
`rwwd→`	class component without import statements
`rpc→`	class pure component skeleton with prop types after the class
`rsc→`	stateless component skeleton
`rscp→`	stateless component with prop types skeleton
`rsf→`	stateless named function skeleton

가장 기본적인 단축키로 rcc와 rsc가 존재한다.

rcc 는 class 형태의 컴포넌트 템플릿이고, rsc는 stateless 즉, 함수형 컴포넌트를 만들어준다.

vs code에서 .js 자바스크립트 파일을 생성한 뒤,

rcc 또는 rsc를 입력하면 자동으로 생성하면 코드가 자으로 생성된다.

[괴발개발 개발새발 하는 개발자의 개발 블로그]

나중에 다른 리액트 컴포넌트를 import할 때 자동적으로 해주는 툴 입니다.