[Node.js] 2일차 190108 : Nodejs설치, URL parse, template literals

[Node.js] 2일차 190108
: Nodejs설치, URL parse, template literals

만든 날짜:

2019-01-08 오전 9:34

 본 글은 출처 생활코딩-https://opentutorials.org/course/3332/21029-에 있는 강의를 들으며 요약정리한 내용입니다. 원내용은 위 링크에서 확인할 수 있습니다. 감사합니다.

---

Node.js - 설치

 웹브라우저 에서 돌아갈 웹 어플리케이션

이런식으로 말이다.

 Node.js도 마찬가지다. Node.js runtime에서 웹 브라우저에서 했던 것 처럼 JavaScript 여러기능 중 우리가 필요한 것을 호출하며 어플리케이션을 만든다.

 Node.js Runtime을 설치하자.

---

Windows 에서 설치하기

https://nodejs.org/ko/ 로 방문을해서 LTS라고 되어있는 것을 다운로드하자.

 설치가 완료됬다면 잘 설치됬는지 확인해보자.

 Window->R->"CMD"

node -v 라고 했을 때 위 같이 떠야한다.

 node라고 입력후

 꺽쇠가 뜨는데 자바스크립트 문법을 이용해서 console.log()를 사용한다. 괄호안에 있는 값을 화면에 출력해주는 기능이다. 나갈때는 ctrl+c를 두 번 누르면된다.

아톰에디터를 사용해서 프로젝트 폴더를 추가해주자.

cmd창을 사용하여 해당 프로젝트 폴더로 이동해주자.

그 후 저장한 파일을 node로 실행해주면 2가 정상적으로 실행되는 것을 확인할 수 있다.

---

Node.js 공부방법

목표 : Node.js로 된 웹 애플리케이션을 만드는 것이다.

 먼저 자바스크립트 문법을 공부한다. Nodejs가 갖고있는 우리가 필요한 기능들을 적당히 배울 것이다. 그 다음 그 기능을 이용해서 애플리케이션을 완성할 것이다.

 나는 자바스크립트를 공부했지만, 다시 빠르게 복습하고 공부를 하려고한다.

---

Node.js - 웹서버 만들기

 가장 큰 틀을 얘기해보자

브라우저 요청 웹서버의 응답.

Node.js는 웹서버 기능을 내장하고 있다. 아파치가 할 수 없는 것을 할 수 있다.

var http = require('http');

var fs = require('fs');

var app = http.createServer(function(request,response){

    var url = request.url;

    if(request.url == '/'){

      url = '/index.html';

    }

    if(request.url == '/favicon.ico'){

      return response.writeHead(404);

    }

    response.writeHead(200);

    response.end(fs.readFileSync(__dirname + url));

});

app.listen(3000);

위 코드를 main.js로 저장하고 실행해주면 localhost:3000에서 웹 페이지를 정상적으로 열 수 있다. 웹서버를 구동한 것이다.

코드 수정후 실행하면,

 사용자가 요청한 html파일과 이미지 파일경로가 출력된다. 사용자가 접근할 때마다 우리가 읽어들여야될 파일을 만들게된다. Node.js가 경로에 있는 파일을 읽어서 가져온다.

 코드를 위와 같이 수정한다면,

 웹 페이지에 요청한 파일명이 뜨게된다. 사용자에게 전송되는 데이터가 저 부분을 따라 바뀌게된다. 프로그래밍 적으로 사용자에게 전달될 데이터를 생성한다.

 

var http = require('http');

var fs = require('fs');

var app = http.createServer(function(request,response){

    var url = request.url;

    if(request.url == '/'){

      url = '/index.html';

    }

    if(request.url == '/favicon.ico'){

      response.writeHead(404);

      response.end();

      return;

    }

    response.writeHead(200);

    response.end(fs.readFileSync(__dirname + url));

});

app.listen(3000);

---

JavaScript 문법 - Number Data type

 데이터를 어떻게 처리할 것인가? 어떠한 데이터가 있는가? 데이터의 종류와 처리하는 방법은 중요하다.

---

JavaScript - Data type - String

'문자열'.length를 하면 String을 count할 수 있다.

---

JavaScript - 변수

---

JavaScript - Template Literal

 자바스크립트에서 문자를 표현하는 방법.

 줄바꿈 한곳에는 \(역슬레시)를 붙여주어야한다. 코드상에서 줄바꿈이며, 출력상에는 줄바꿈이 없다. 개행 \n사용.

 그러나 이런것이 불편해서 템플릿사용.

 `이 문자가 템플릿 리터럴의 시작과 끝을 나타내는 기호다.

줄바꿈시 특수기호 사용하지 않아도된다. +연산이아닌 ${변수}를 사용하면 변수로 치환된다. 이것이 템플릿 리터럴 이다.

---

Node.js - URL로 입력된 값 사용하기

 자바스크립트를 이용해서 Node.js가 갖는 기능을 호출. 

 똑같은 파일을 요청해서 받는 페이지이다. 하지만 뒤 숫자값을 달리하는 것을 통해 php애플리케이션이 서로 다른 페이지를 만들어서 보내는 것이다. 우리도 할 수 있다. URL형식을 자세히 보자.

http - 어떤 방식으로 통신할지 (프로토콜)

(ex. ftp면 ftp)

host(domain name) - 인터넷에 접속되 있는 각각의 호스트

:3000 - 포트 번호  3000번 포드 사용. 80포트는 일반적으로 웹서버를 의미한다. Well Known port!

/ - path

id=HTML&page=12 - query string. 쿼리 스트링은 물음표로 시작되며, 값과 값은 &(엔퍼센드)를 쓰기로 약속되어있다. 값의 이름과 값은 =(equal)로 구분하기로 약속되어있다.

Node.js에서 URL을 통해서 입력된 값을 사용하는 방법

id값에 따라 적당한 페이지를 보여주자 분홍색 부분이 바로 쿼리 스트링.

 URL값을 추출해서 원하는 값을 알아내자. URL을 분석해야한다. (구글링 : nodejs url parse query string) 

fs, http, url 등은 모듈이다. require('url') url모듈을 사용할 것이다. url변수를 통해서 라는 뜻이다.

queryData 변수는 객체.

queryData.id 이런식으로 쿼리스트링의 값을 가져올 수 있따.

id=css

name=html 등과 같이 사용할 수 있게된다.