모듈과 NPM - nodejs 모듈

생활코딩 Node.js 강의
에플리케이션에서 부품으로 사용할 로직인 모듈에 대해서 알아보고 모듈을 편리하게 관리하는 기술인 NPM을 사용하는 기본적인 방법을 알아본다.

모듈 기초

• 모듈 = 부품
• 웹서버를 처음부터 끝까지 만드는 것은 아주 어려운 일
• 따라서 nodejs 에서는 기본적인 웹서버를 만들어 놓고, 사용자가 쓸 수 있도록 함
• 사용자는 nodejs가 마련해 놓은 웹서버를 가져다 쓸 수 있는 방법을 배운다.

nodejs의 서버 접속 모듈

코드 전체

const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

http 모듈 호출 코드

const http = require('http');
//아래 코드가 동작하게 위해서는 nodejs에서 제공하는 http라는 모듈(부품)이 필요하다.
//require라는 함수를 통해서 http 모듈을 가져오고 상수에 담는다.

• http 모듈 사용 설명서 : nodejs document
  • http.createServer() 메소드 : Returns a new instance of http.Server
    (http 모듈의 Server객체를 리턴)
  • http.createServer().listen() 메소드
• 모듈은 부품이다. 모듈이라는 부품을 사용하기 위해서는 require라는 함수로 호출한다.
• nodejs는 기본적으로 앱을 만들기 위한 부품을 기본적으로 제공한다. (ex. http)
• 부품의 사용설명서는 nodejs 사이트의 document에서 확인 가능하다.

nodejs의 os 모듈 사용해보기

os.js

const os = require('os');
console.log(os.platform());
// The os.platform() method returns a string identifying
// the operating system platform as set during compile time of Node.js.

터미널

$ node os.js
darwin

인터넷의 동작 방법

서버, 클라이언트, ip, port 의 개념에 대해서 이해한다.

용어 정의

• 클라이언트
  • 웹브라우저가 설치되어 있는 컴퓨터, a.com 주소를 쳐서 정보를 요청한다.
• 서버
  • a.com 에 해당하는 서버는 요청한 정보를 클라이언트에게 정보를 응답한다.
• 도메인 네임
  • a.com 이라는 주소의 컴퓨터(서버)의 주소 a.com 은 도메인 네임이라고 하며, 사람이 기억하기 쉽도록 만들어진 이름이다.
  • 실제로 컴퓨터에 접속할 때는 그 도메인에 해당되는 ip를 통해서 접속한다.

서버에서 일어나는 일 (포트)

• a.com을 가진 서버 컴퓨터에는 여러가지 서버 sw (엡서버, 게임서버, 채팅서버 등)가 설치되어 있을 수 있다.
• 그럼 사용자가 a.com을 치고 서버 컴퓨터에 접속했을때, 서버 컴퓨터는 어떤 서버애플리케이션을 연결해서 그 애플리케이션이 응답할 수 있게 하는가?

• 컴퓨터에는 0 ~ 65535번의 포트(port)라는 문이 있다.
• 보통 웹서버는 80번 포트에 연결시켜 놓는다.
  (웹서버가 80번 포트를 바라보게 한다. 80번 포트를 웹서버가 리스닝 하고 있다.)
• 사용자가 http://a.com:80 주소를 입력하고 엔터를 땅 치면,
  • 웹브라우저는 우선 http://a.com에 해당되는 컴퓨터를 찾는다.
  • 그리고 http://a.com에 해당되는 컴퓨터에게 80번 포트와 연결하고 싶다고 이야기 한다.
  • 80번 포트는 웹서버를 호출해서 응답한다.
  • 매번 웹서버에 접속할때 마다 :80 port를 적는 것은 귀찮기 때문에 생략 가능하다.

http://naver.com:80
// :80생략 가능, https인 경우 오류발생
http://daum.net:80
// http를 통해서 접속하는 경우 웹서버는 80번 포트를 쓰자고 약속되어 있음

nodejs 서버연결을 위한 코드 해석하기

서버연결을 위한 코드와 해석

  const http = require('http');

  const hostname = '127.0.0.1'; // 서버 컴퓨터의 ip
  const port = 3000; //

  const server = http.createServer((req, res) => {
    // createServer 명령을 통해 서버 한대를 만든다.
    res.statusCode = 200; // 통신 성공
    res.setHeader('Content-Type', 'text/plain');
    res.end('Hello World\n');
  });

  server.listen(port, hostname, () => {
    // 만든 서버가 이 컴퓨터에 리스닝을 하도록 시킨다.
    // 첫번째 인자 port는 3000번이고 hostname은 이 컴퓨터의 ip 같은 것
    console.log(`Server running at http://${hostname}:${port}/`);
  });

nodejs 간단한 웹앱 만들기

생활코딩 Node.js 강의
Nodejs를 이용해서 간단한 서버 에플리케이션을 만들어 본다.

nodejs 서버연결

서버연결을 위한 코드

• node.org > about 에서 파일 복사 후 webserver.js 파일에 붙여넣기

  const http = require('http');
  
  const hostname = '127.0.0.1';
  const port = 3000;
  
  const server = http.createServer((req, res) => {
    res.statusCode = 200;
    res.setHeader('Content-Type', 'text/plain');
    res.end('Hello World\n');
  });
  
  server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
  });
  

• 터미널에서 node webserver.js 실행

  $ node webserver.js
  Server running at http://127.0.0.1:3000/
  

• 웹브라우저를 통해 http://127.0.0.1:3000/ 경로에 접속하면 브라우저에 hello world 가 출력

이것의 의미

• webserver.js 자바스크립트의 코드가 웹 브라우저를 통해서 요청한 내용을 받아서 우리에게 hello world 라는 텍스트를 전송 한 것
• 그 결과 우리의 웹브라우저는 화면에 hello world를 출력 할 수 있게 된 것
• 이 개념을 이해하기 위해서는 인터넷, 도메인 네임,IP, port 개념을 먼저 이해할 필요가 있음 (개념에 대한 설명은 다음 글 참고)

nodejs 설치 및 실행

생활코딩 Node.js 강의

Node.js는 자바스크립트(JavaScript)로 서버 프로그래밍을 할 수 있도록 해주는 플랫폼

설치

• nodejs.org 에서 파일 다운로드 후 설치
• 또는 npm 을 통하여 설치 (installing Node.js via package manager)
• 터미널에서 node --version 명령어 통해서 버전 확인

실행

• js 파일 작성 (ex. nodejs/hello.js)

  console.log('hello');
  

• 터미널 > cd nodejs (js 파일이 들어있는 폴더로 이동) > node hello.js

  $ node hello.js
  Hello world
  

배열 메소드 (Array)

map

설명

map() 메소드는 배열 내의 모든 요소 각각에 대하여 제공된 함수(callback)를 호출하고, 그 결과를 모아서 새로운 배열을 반환한다. 재구성 MDN

문법

arr.map(callback[, thisArg])

• callback : 새로운 배열 요소를 생성하는 함수로 다음 세 가지 인수를 가집니다.
  • currentValue : 배열의 요소 중, 현재 처리되고 있는 요소
  • index :현재 처리되는 요소의 배열 내 인덱스
  • array : map 메소드가 적용되는 본래 배열

예시

배열에 들어있는 숫자들의 제곱근을 구하여 새로운 배열을 만들기

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots의 값은 [1, 2, 3]이 되지만, numbers는 그대로 [1, 4, 9]입니다.

숫자가 들어있는 배열을 인수가 있는 함수를 사용하여 재구성하기

var numbers = [1, 4, 9];
var doubles = numbers.map(function(num) {
  return num * 2;
});
// doubles is now [2, 8, 18]. numbers is still [1, 4, 9]

filter

설명

filter() 메소드는 제공된 함수로 구현된 테스트를 통과(true)하는 모든 요소가 있는 새로운 배열을 만든다. 조건 검색, 재구성 MDN)

문법

var new_array = arr.filter(callback[, thisArg])

예시

다음 예는 값이 10 이하인 모든 요소가 제거된 걸러진 배열을 만들기 위해 filter()를 사용한다.

function isBigEnough(value) {
  return value >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered 는 [12, 130, 44]

JSON 오브젝트로 이루어진 배열중에 특정 값만 filter 시킬때 유용하다.

var arr = [    
  {"name":"apple", "count": 2},    
  {"name":"orange", "count": 5},    
  {"name":"pear", "count": 3},    
  {"name":"orange", "count": 16}
];    
var newArr = arr.filter(function(item){    
  return item.name === "orange";
});  
console.log("Filter results:",newArr); //
[{"name":"orange", "count": 5}, {"name":"orange", "count": 16}]

reduce

설명

배열의 모든 요소에 대해 지정된 콜백을 호출합니다.콜백 함수의 반환 값은 결과에 누적되며 다음에 콜백 함수를 호출할 때 인수로 제공됩니다. MDN

문법

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]

예시

배열의 값 모두 더하기

var total = [0, 1, 2, 3].reduce(function(a, b) {
  return a + b;
});
// total == 6

indexOf

설명

배열에서 특정 값이 있는지 검색한다. 배열에서 지정된 요소를 찾을 수있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환한다. MDN

문법

arr.indexOf(searchElement)
arr.indexOf(searchElement, fromIndex)

예시

var a = [2, 9, 9];
a.indexOf(2); // 0
a.indexOf(7); // -1

if (a.indexOf(7) === -1) {
  // 요소가 배열에 존재하지 않습니다.
}