React 4

[react] .prettierrc

▶ Prettier - 다양한 코드 스타일을 사전 설정할 수 있음, 코드를 깔끔하게 정리하는 용도 - 자동코드 정리를 하면 코드가 제대로 정렬, 세미클론(;) 자동 추가, 작은따옴표 → 큰따옴표로 변경 - 프로젝트의 루트 디렉토리(src, public 디렉토리가 있는 곳)에서 .prettierrc 파일 생성 후 내용 입력하기 - 협업할 때 코딩 스타일을 맞출 수 있는 장점이 있음 - 관련내용은 참고링크를 참고 ▶ 예시 ▶ 참고링크 - https://prettier.io/docs/en/options.html Prettier · Opinionated Code Formatter Opinionated Code Formatter prettier.io

React 2019.12.03

[React] create react app 사용하기 (react프로젝트 생성하기)

▶ 사용하기전 확인사항 - react.js 설치가 되었나? - node.js 설치가 되었나? - npm/yarn 이 설치 되었는지? - VScode(visual Studio Code)가 설치되었는지? (다른 툴이여도 괜찮아요.) ** react.js를 사용하기 위해서는 패키지 사용을 위한 node.js가 설치되어야 하고 npm 또는 yarn 이 설치되면 된다. ▶ create react app 도구 사용하기 이전에는 package.json 작성해서 바벨이랑 웹팩을 직접 설치, 설정하고, 리액트 관련 라이브러리 설정을 했는데, 이 역할을 create react app이 한다. 페이스북에서 만들어준 도구야 해당 도구가 나오기 전에는 프로젝트 설정을 직접하거나 보일러플레이트(boilerplate) 이미 프로젝..

React 2019.11.20

[yarn] yarn이란(yarn 버전확인 및 최신버전 설치하기) / on windows

▶ yarn - Node.js 설치시 패키지를 관리해주는 도구인 npm이 설치된다. - yarn은 npm을 대체할 수 있는 도구이고 npm 보다 더 빠르며 효율적인 캐시 시스템과 기타 부가 기능을 제공하고 있다. ▶ yarn 버전 확인 (on windows) 1. ctrl + R 버튼을 동시에 누른 후 cmd 를 친 후 엔터를 누르면 검은창이 나온다. 2. yarn --version 이라 친 후 엔터를 누른다. - 설치가 되어 있지 않아서 'yarn'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니라 라는 문구가 뜬다. - 이제 설치를 하면 된다. ▶ yarn 최신 버전 설치 (on windows) 1. https://yarnpkg.com/lang/en/ 사이트에서 IN..

React 2019.11.19

[Node] Node.js란(Node.js 버전확인 및 최신버전 설치하기) / on windows

▶ Node.js - Node.js는 크롬 V8 자바 스크립트 엔진으로 빌드한 자바스크립트 런타임 - 웹 브라우저 환경이 아닌 곳에서도 자바스크립트를 사용하여 연산할 수 있음 - 2009년 Node.js 출시이후 자바스크립트는 웹 브라우저 영역 외에 웹 서버, 모바일, 데스크탑 영역에서도 활약 - 리액트 프로젝트시 반드시 설치해야 함 ▶ React와의 연관성 - 리액트 프로젝트 개발할 때 필요한 주요 도구들이 Node.js를 사용하기 때문에 설치가 필요함 - 주요 도구들에는 바벨(Babel), 웹팩(webpack) 이 있음. * 바벨(Babel) : ECMAScript 6(2015년 공식적으로 업데이트한 자바스크립트 문법)를 호환 시켜줌 * 웹팩(webpack) : 모듈화된 코드를 한 파일로 합치고(번들..

React 2019.11.18