죽이죽이

Visual Studio Code ※ 사용하는 이유 - 개발하는데 필요한 Tool(IDE)로 코드 작성 시에 필요하다. ※ 공식 홈페이지 - https://code.visualstudio.com/ ※ 설치 - 본인 OS에 맞는 버전을 선택하면 된다. - Stable : 안정성이 높고 품질이 검증된 버전이다. (추천) - Insiders : 최신 기능이나 업데이트를 제공한다. Cmder (윈도우 사용 시 추천) - 선택사항 ※ 사용하는 이유 - Git, Unix 커맨드 명령어가 같이 포함되어 있어서 사용하기 편리하다. ※ 공식 홈페이지 - https://cmder.app/ ※ 설치 - Download Full : 다양한 기능 및 옵션을 포함하고 있다. (Git 포함) - Download Mini : 경량화..

카멜 표기법 (camelCase, lowerCamelCase) ※ 사용 방법 - 모든 단어의 시작을 대문자로 작성한다. (처음 단어만 소문자) ※ 사용하는 곳 - Javascript : 변수, 함수 - Java : 변수, 함수 파스칼 표기법 (PascalCase, UpperCamelCase) ※ 사용 방법 - 모든 단어의 시작을 대문자로 작성한다. (처음 단어도 대문자) ※ 사용하는 곳 - Javascript : 클래스 - React : 함수형 컴포넌트, 클래스형 컴포넌트 - Java : 클래스 - Python : 클래스 스네이크 표기법 (snake_case) ※ 사용 방법 - 모든 단어를 소문자로 작성하고 단어 사이에 underscore(_)를 넣어서 구분한다. ※ 사용하는 곳 - Python : 함수..

React Developer Tools ※ 사용하는 이유 - Components : 컴포넌트를 트리구조로 보여주고 해당 컴포넌트의 상태정보를 확인할 수 있다. - Profile : 렌더링된 컴포넌트를 소요시간과 함께 보여준다. ※ 설치 - Chrome 웹 스토어 : https://chrome.google.com/webstore/search/react%20developer%20tools?hl=ko ※ Components ※ Profile - 녹화 시작 - 녹화 중지 - 컴포넌트마다 렌더링 시간 확인 가능 Lighthouse (Chrome 사용 시 기본 설치) ※ 사용 - 페이지 로드 분석 - 성능, 접근성, 권장사항, SEO 등 점수표 - 개선점 확인 색상 선택 도구 - Geco ※ 사용하는 이유 - 웹 ..

Prettier - Code formatter ※ 사용하는 이유 - 저장(Ctrl + S) 시 코드를 가독성 좋게 정리를 해준다. ※ 설치 ※ 설정 Material Icon Theme ※ 사용하는 이유 - 소스파일 아이콘을 이쁘게 꾸며준다. ※ 설치 ※ 설정 Auto Rename Tag ※ 사용하는 이유 - 태그 변경 시 쌍을 이루는 태그도 자동으로 변경이 된다. ※ 설치 Live Server ※ 사용하는 이유 - 현재 작성하고 있는 코드를 실시간으로 브라우저에 업데이트해서 보여준다. ※ 설치 ※ 실행 open in browser ※ 사용하는 이유 - html 문서를 기본 웹 브라우저로 실행시킬 수 있도록 해준다. ※ 설치 ※ 실행 ES7+ React/Redux/React-Native snippets ※..