• node.js와 브라우저 둘다 JS 런타임이다.

• node.js에 대한 오해 : node.js는 서버를 만드는 환경이나 백엔드 환경일 뿐만 아니라 프론트 영역에도 사용 가능하다.

node.js로 할 수 있는 것

• Command-line options
• Console
• Debugger
• Event
• File system
• HTTP, HTTPS(웹서버)
• OS(운영체제)
• Path(파일 혹은 또는 디렉토리의 경로)
• Timers
• ETC node.js 기능 상세사항

node.js로 할 수 없는 것.

• node.js에는 DOM이 존재하지 않다. (node.js에는 window 대신 global키워드가 존재하지만 완전히 똑같지 않다. 대부분 스코프 규칙이 모듈과 관련되어 있는 경우가 많다.)

• fetch API가 node.js에는 존재하지 않습니다. 서버에 요청할 때에는 다른 방법을 사용

프론트엔드 영역에서의 node.js의 의미

현대의 프론트엔드 개발은 다양한 node.js 모듈을 활용하며, npm 생태계를 활용. 또한 CLI에서 다양한 형태의 자동화 과정(빌드, 패키징, 배포 등)을 처리하는 경우가 많으므로, 프론트엔드 영역에서도 node.js 의 학습은 필수적

NPM(Node Package Manager)

node.js 환경에서 외부 라이브러리를 다운로드 받기 위한 방법. 앱스토어 처럼 필요한 모듈을 다운로드할 수 있는, 모듈들이 모여있는 모듈 스토어. (리눅스의 패키지 매니저 : apt, macOS의 패키지 매니저 : brew이듯, node.js 생태계의 패키지 매니저 : npm)

npm 패키지를 사용해서 얻는 장점은, 이미 누군가가 개발해놓은 유용한 모듈을 이용해 레고를 조립하듯이 앱을 만들 수 있다는 데 있습니다. 소위 이야기하는 바퀴를 재발명하지 않아도 된다는 큰 장점이 있습니다.

• 모듈 : 타인이 만든 검증된 코드(모듈)

package.json : npm 모듈에 대한 정보 를 담아둔 곳.

프로젝트에 관한 정보 : name, version, description CLI에서 사용 가능한 명령어 : scripts : { 명령어 : 실행 코드 …} 개발과 관련된 dependency : dependencies

헷갈리면 안되는 점 : 모듈을 실행시키기 위해 필요한 실제 모듈은 따로 node_modules이라는 폴더에 저장. package.json에는 어떤 모듈인지만 적혀 있음. (일종의 제품 카탈로그라고 생각하면 이해가 쉽다. 카탈로그만 보면 어떤 제품이 있는지 파악할 수 있는 것처럼 package.json만 보면 어떤 모듈이 들어가 있는지를 알 수 있음)

package.json이 주는 또 하나의 이점은 프로젝트 코드를 전달할 때, 포함하고 있는 모든 모듈을 다 전달하지 않아도 된다는 점. 프로젝트 코드를 넘겨줄 때, “우리 코드는 여기 있고, 필요한 모듈은 package.json에 적어놨으니 네가 직접 다운받아서 쓰면 돼” 라고 하면 됩니다.

필요한 모듈까지 모두 넘겨주는 것은 전달해야 하는 파일도 너무 많거니와 필요없는 일입니다. 사용하는 사람이 직접 다운받으라고 하면 됩니다. 우리는 무엇이 필요한지만 알려주면 됩니다.

앞으로 스프린트를 진행할 때, 해당 스프린트의 레파지토리를 열어보시면 node_modules 는 없고, package.json 만 있을겁니다. 그럼 여러분은 package.json에서 필요하다고 하는 모듈을 npm을 이용해 다운받으시면 됩니다.

npm install 명령어를 입력하시면, package.json에서 필요하다고 하는 모듈을 다운받습니다. npm install이 완료되면 node_modules 디렉토리가 생긴 걸 확인하실 수 있습니다.

dependency(의존성 모듈)

dependencies 해당 코드가 돌아가기 위해 반드시 필요한 모듈 ex: React, underscore 등

• 세팅 방법

$ npm install react

// $ nom install --save react
--save 옵션과 함께 설치하면, 자동으로 dependencies에 추가. (--save 옵션은 생략 가능)

{
	"dependencies" : { 
		// 이름 : 버전
		"react": "^16.7.0"
	}
}

devDependency

실제 코드 동작에 직접적으로 영향을 주지 않는 모듈들을 명시.

• 세팅 방법 npm install 명령어로 npm에 있는 모듈을 설치할 수 있는데, 이 때 –save-dev 옵션과 함께 설치하면, 자동으로 devDependencies에 추가.

$ npm install 설치할모듈이름 --save-dev

{
	"devDependencies" : { 
		// JSON 형식에서, 키에 적힌 것은 모듈 이름 : 값은 버전. 
		"@mochajs/json-file-reporter": "^1.2.1"
	}
}

package.json에 dependency를 적어주는 이유 : 협업 / 오픈소스 프로젝트를 위해 어떤 모듈이 필요한지 어떻게 실행 시킬 수 있는지 표시

npm script

$ npm run <스크립트 이름>

scripts 주요 항목

{ 	
    "scripts" : { 
		"start" : "node index.js", // node.js 앱 실행. 실행 스크립트: nam run start
		"test" : "mocha test/index.est.js", // 테스트 실행. 실행 스크립트: nam run test
		"init" : "aslant", // 테스트 실행. 실행 스크립트: nam run init
		"submit" : "submission" // 테스트 실행. 실행 스크립트: nam run submit	
    }
}

CLI에서 실행 예시

{ 	
    "scripts" : { 		
    "test" : 실행할 명령어	
    }
}

• CLI로 test 실행

$ npm run test 

> 실행할 명령어

npm 패키지, npm 모듈, npm dependency 는 전부 동일한 대상을 가리킨다.(관점에 따라 다른 용어를 쓸 뿐)

• npm package : “독립적인 하나의 완성된 조각”
• modul : npm 패키지를 가져다 사용할 때
• npm dependency : 다른 프로그램에서 이 패키지를 모듈로 사용하면, 프로그램을 실행할 때 이 모듈에 의존할 수밖에 없음. 이때는 dependency(의존성)라고 부른다.

[npm 명령어]

• npm 설치 : node_modules라는 디렉토리가 생성. (npm install 모듈이름을 이용해 다운로드한 패키지가 node_modules 디렉토리에 담긴다.)

$ npm install

• npm 모듈(패키지) 설치

$ npm install 설치할모듈이름