개발 환경 세팅

• 크롬브라우저 설치

• VScode 설치

• git 설치

• Node 설치 (신뢰성 높은 LTS 버전 설치 권장)

  • 터미널열어서 Node -v 입력 (버전 확인하기)

• Node를 설치해야 npm을 설치할 수 있다.( Node 설치하면 npm 자동 설치)

• npm : (node package manager) 패키지들을 관리해주는 매니저

  • third-party 패키지들이 모여있는 집합소라고 할 수 있다.
  • npm은 명령어이자 마켓이라고 볼 수 있다.
  • 우리는 npm에서 여러 패키지를 다운받아 활용할 수 있다.
  • 명령어로서 비슷한 것으로는 yarn이 있다. 둘 다 프론트엔드 의존성을 관리하기 위한 패키지 매니저.

• npm을 설치해야 리액트 패키지 설치 가능!

• yarn 설치

• yarn도 하나의 패키지이기 때문에 npm사이트에서 다운받을 수 있다.

• npm의 역할과 동일하지만 조금 더 성능적으로 개선됨.

• npm install -g yarn 명령어를 입력해 설치 가능.

  • -g 는 global이라는 뜻으로 내 컴퓨터 전반에 있어서 무조건 yarn 명령어를 쓸 수 있게 함.

• 설치 후 터미널에 yarn -v 명령어로 버전 확인 (제대로 설치되었는지 확인할 수 있다)

• yarn으로 패키지 설치하는 방법

  • yarn add (설치할 패키지 이름)

• npm 과 yarn의 차별적 특징

  1. NPM
     1. node.js를 설치할 때 자동으로 생성
     2. NPM platform 자체이다.
  2. YARN
     1. 2016년 페이스북에서 개발한 패키지 관리자
     2. npm과의 호환성이 좋고, 속도나 안정성 측면에서 npm보다 월등히 좋다.
  • 요약하자면 속도 : YARN
  • 보안 : YARN (하지만 최근npm 보안 업데이트도 크게 향상되었다.)

• -- save 명령어
  • 모든 프로젝트에는 package.json이라는 파일이 존재하는데 이 프로젝트에 담겨있는 dependency(이 프로젝트가 의존하고 있는 패키지들)를 넣기 위해서 npm은 반드시 --save 명령어를 넣어주어야 한다.
  • yarn 은 add만 하면 기본적으로 save 명령어가 내장되어 있다.

JavaScript 런타임 환경의 종류

런타임이란?

• 프로그래밍 언어가 구동(running)되는 환경(environment)을 말한다.
• 자바스크립트의 대표적 런타임 환경은 2가지
  1. 브라우저(ex : Chrome, Microsoft Edge, Firefox, Internet Explorer)
  2. node환경

즉, javascript 파일을 실행할 수 있는 방법이 2가지가 있다는 것이다.