#1 node.js, git workflow, nvm, package.json

Angelo·2020년 6월 8일
0
post-thumbnail

- 자바스크립트 런타임 & Node.js

런타임

프로그래밍 언어가 구동되는 환경. "어떤 프로그래밍 언어가 동작할 수 있는 프로그램". 자바스크립트는 브라우저와 브라우저가 아닌 Node.js라는 런타임에서도 가능

Node.js

  • 노드는 v8엔진으로 만들어진 자바스크립트 런타임이다.
    자바스크립트를 기계어로 컴파일(compile) 해서 구동.
  • 다양한 버전이 존재한다. 버전마다 몇몇의 코드가 동작을 달리해 여러 버전을 쓸 줄 알아야 한다.
    이 다양한 버전을 설치,사용을 도와주는 프로그램이 NVM (Node Version Manager), NPM(Node Package Manager) 이다.
  • Nvm 역시 하나의 프로그램이므로 설치 해줘야 한다.
  1. nvm ls (nvm 을 통해 설치한 node version 조회)
  2. nvm install 10.13.0 (버전 설치)
  3. nvm use 12.13.0 (사용하고 싶은 버전 사용)

  • 이벤트 기반의 논블로킹 I/O 모델이다
    -> 유저의 버튼 클릭이나 네트워크에 리소스를 요청하는 이벤트가 논블로킹으로 이루어지는 Input Output model이다.
    -> 다음 함수의 실행이 현재 함수의 종료를 기다리지 않음(논블로킹)
    -> I/O 모델이란, Input을 주면 Output을 반환하는 모델

  • Node core modules
    별도의 설치 없이, 노드 상에서 쓸 수 있는 모듈이 있다.
    reuir(") 방식으로 사용 할 수 있다
    ex) fx, http, url, path

Node.js body -parser

요청 받은 바디에 접근하는 방법 :

  • req는 ReadableStream 인터페이스 구현체다.
  • 이것은 스트림이기 때문에 "data"와 "end" 이벤트를 이용해서 데이터를 수신할 수 있다.
  • "data" 이벤트와 함께 들어온 데이터는 Buffer 타입이다.
  • 이것을 문자열로 변환하려면 데이터를 배열로 들고 있다가 "end" 이벤트 시점에 합치면 된다.
let body = []
request.on('data', (chunk) => {
  body.push(chunk)
}).on('end', () => {
  body = Buffer.concat(body).toString();
  // 이 시점에 body는 전체 요청 데이터를 문자열 형태로 가지고 있다
  // (at this point, `body` has the entire request body stored in it as a string)
});
 if (request.method === 'POST') {
    if (request.url === '/something') {
      let body = '';  
      req.on('data', chunk => { 
        body += chunk.toString(); // convert Buffer to string
      });
      req.on('end', () => {
        console.log(body);
        res.end('ok');
      });

Package.json

하나의 프로그램은 다양한 모듈이 합쳐져서 만들어진다.
내가 만든 프로젝트는 어떤 모듈이 필요하고, 어떻게 실행시키는지 알고 있지만
다른 사람이 내가 만든 프로젝트를 실행시키려면 가이드가 필요하다. 그 가이드라인이 package.json

package.json에는 필요한 모듈이 무엇인지, 프로그램 실행 방법, 프로그램 테스트 방법이 명시되어있다. 흔히 하는 npm install은 package.json에 있는 dependency를 바탕으로 설치.

  1. dependencies : 프로젝트가 돌아가기위해 반드시 필요한 모듈들이 무엇인지가 적혀있다. 직접 production과 관계
"dependencies" : {
  "react" : "^16.8.6",
}
  • npm을 쓸 때는 --save 옵션을 줘야한다.
$yarn add react
or
$ npm install --save react
  1. devDependencies " 프로젝트를 개발하는 환경에서 필요한 모듈이 무엇인지가 적혀있다.
    ex) lint 나 테스팅 모듈
"devDependencies" : {
  "jest": "^2.3.0",
    "eslint" : "^2.0.0"
}
  • dev 옵션을 줘서 등록한다
$yarn add @babel.core --dev
or
$ npm install @babel.core --save-dev

3.scripts : npm으로 실행시킬 수 있는 명령어를 정의 (npm start). 명령어를 입력하면 어떤 동작을 해야하는지가 적혀있다.

"scripts" {
  "start" : "node app.js",
    "test" : "node test.js"
}

- git work flow

  • 페어와 함께 코드를 쉽게 작성하고 수정이 가능하다.
  1. code states Repo 에서 나의 레포로
    Fork.

  2. 나의 레포에서 로컬로 이동.
    git clone 'repo URL

  3. 페어 연결.
    git remote add pair 'repo URL for pairs fork
    git remote -v

  4. user 1(본인)이 코드 작성 후.
    git add change file
    git commit -m "change name"

  5. 작업한 코드를 user 1(본인)레포에 푸쉬.
    git push orgin master

  6. user 2가 user1 레포에서 코드를 가져온다.
    git pull pair master

  7. user2가 코드 수정 + 작성 후 커밋.
    git add 'change file'
    git commit -m "change TOO"

  8. 수정 + 작성한 코드를 user2(본인) 레포에 푸쉬.
    git push origin master

  9. user 1이 다시 user2 레포에서 가져온다
    git pull pair master

    이후 반복 ~~

*충돌의 경우 : user 2와 user 1이 같은 라인의 함수를 수정 후 레포에 푸쉬할경우

( user 1이 먼저 함수를 수정후 레포에 푸쉬하고 user2가 같은 라인을 나중에 레포에 푸쉬한다했을때, 이미 레포의 함수가 user1의해 고쳐져 있기 때문에 user2가 수정한 함수와 충돌이 일어남 )

- Branch

사본을 만들어 코드를 작성, 테스트를 해 원본에 지장이 안가게 하는것이 팀 프로젝트에 필요. 원본에 영향을 주지 않고 다양한 시도가 가능.
*깃 웹에서도 branch 직접 생성 가능.

git init : git을 생성
git remote add origin
git checkout 브랜치 이름 : branch로 이동
git checkout -b 브랜치 이름 : branch 생성 + branch로 작업공간 이동
git checkout 원본 : 작업공간을 원본으로 이동
git push origin 브랜치 이름 : local과 저장소의 remote branch가 생성
-> 생성된 branch는 각자가 local 저장소 기준이므로, local의 branch를 remote branch 와 연동하는 작업이 필요 : git branch --set-upstream-to origin/브랜치이름
git branch --delete 브랜치 이름 : 해당 branch를 삭제하기 위해서는 다른 branch로 이동 후 삭제

profile
나만의 학습 노트

0개의 댓글