​ React_Style 관리 전 css보다 scss가 더 좋습니다. Sassy CSS - 문법적으로 짱 멋진(Sassy) CSS이기 때문입니다. ​ ​ react에 scss 적용하기 간단히 라이브러리 하나만 설치해주고 파일명만 바꿔주면 됩니다. *CRA 공식 문서에 나와있는 방법을 따릅니다. ​ ​ package.json이 있는 위치에서 1 npm install sass ​ .css로 된 파일명을 .scss로 바꾸면 끝. ​ ​ ​ ​ ​ 👀 많은 레퍼런스가… 1 npm install node-sass 해당 명령어로 sass를 적용하는데, 동료가 깃헙에서 npm i를 하는데 계속 오류가 났고 저도 간헐적으로 에러가 발생해 설명한 방식으로 변경하였습니다.

​ React_Style 관리 Vue에는 .vue 파일마다 <style>가 있고 여기에 <style scoped>를 주면 해당 파일에만 적용되는 style을 구성할 수 있는데, react는 어떻게 하는지 알아봅니다. ​ ​ scoped css 설정 지역적으로 사용하고 싶은 css 설정 방법 ​ 폴더 구조를 보자면. (구조는 마음대로 구성하여도 됩니다. 아래는 제 마음대로 구성한 것입니다.) 1 2 3 4 5 6 7 8 9 10 11 12 src ├── assets │ ├── Styles │ ├── common.

​ React Style_관리 전역으로 사용할 css 설정은 어떻게 하는지 알아봅니다. *기본적으로 typescript가 적용되어 있습니다. ​ ​ Global css 설정 전역으로 사용하고 싶은 css 설정 방법 ​ 폴더 구조를 보자면. (구조는 마음대로 구성하여도 됩니다. 아래는 제 마음대로 구성한 것입니다.) 1 2 3 4 5 6 src ├── assets │ ├── Styles │ ├── common.css │ ... └── index.tsx ​ global css 만들기

​ npm Vs npx 예전부터 궁금했지만 굳이 알아볼 필요까지는 없었다가, 여드름이 터지듯 갑자기 궁금해서져 알아봤습니다. ​ ​ 가장 큰 차이는 설치를 할 것인가 아닌가 컴퓨터에 패키지 전역으로 설치하여 실행: npm 컴퓨터에 패키지 설치 없이 이번만 실행: npx npm는 컴퓨터 전역(global)에 패키지(npm 모듈 시스템)를 설치한다는 의미입니다. 만약 npm -g와 같이 뒤에 -g가 있다면, 전역으로 설치한다는 옵션입니다. -g 옵션이 없으면 NPM 패키지는 node_modules라는 이름의 폴더 안에 저장됩니다.