Node.js 시작하기 express로 hello world 찍어보자

Node를 공부하면서 지난 블로그에 셋팅 과정들을 기록해왔다.

 

NVM 설치하기 (node 버전 관리 / 윈도우에서 작업 환경 세팅하기)

 

이제 셋팅은 완료했으니, 직접 node를 통해 hello world를 찍어보기로 한다.

 

npm init 으로 셋팅을 완료하면 기본적으로 app.js 파일이 생성되는데 얘를 통해 hello world를 찍어낼 수 있다

 

app.js를 열고

 

var express = require('express');      // express를 불러오고 var app = express();      // 변수 app에 express 메서드를 넣는다 var port = 8080;      // 포트 넘버를 설정 app.get('/', function (req, res) {      // front 단에서 보여질 부분을 수정한다     res.send('Hello World!') }); app.listen(port, function () {      // 서버 연결이 성공시에 터미널 콘솔창에서 확인할 수 있다     console.log("Port:", port); });

저장하고 노드를 실행한다

 

node app.js

 

app.js를 실행하는 위의 명령어를 치고 노드를 실행한다.

그러면 터미널 콘솔창에는 app.listen에 적어둔 console.log("Port:", port); 가 보여진다.

이렇게 뜨면 잘 연결된 것. 확인하기 위해 인터넷 창에 IP주소를 치고 들어가면 "Hello World!"가 잘 뜨는걸 확인할 수 있다.

 

 

 

이제 hello world에서 더 나아가 html로 페이지 구성하고 ajax통신으로 json형식의 데이터를 받아오는 것까지 해보자.

 

html 파일을 구성하기 위해 public이란 이름의 폴더를 하나 만들었다.

그 안에는 html파일과 json 파일을 각각 index.html index.json 으로 만들었다.

 

 

- index.html

hello world <button type="button" onClick="goData()">show data</button> <h1 id="title"></h1> <p id="desc"></p>

 

- index.json

{     "title" : "Node.js 배우기",     "desc" : "Node와 함께하는 신나는 시간" }

 

ajax는 제이쿼리로 연결할 예정이므로 제이쿼리 cdn도 넣고 html에 스크립트도 따로 넣어준다.

<script>     function goData () {         $.ajax({             url: '/aa',             dataType: 'json',             type: 'GET',             data: {data: "aa"},             success: function (data) {                 if (data) {                     data = JSON.parse(data);                     var title = document.getElementById('title');                     var desc = document.getElementById('desc');                     title.innerHTML = data;                     desc.innerHTML = data.desc;                 }             }         })     } </script>

 

ip주소:포트넘버/aa 

ex) 123.123.123.12:8080/aa

 

aa가 붙은 url로 데이터를 넘기고 데이터 넘기는 방식은 GET으로,

data: 는 파라미터 값을 넘기는 데에 쓰인다.

통신이 된다면 success 콜백 함수 대로 실행된다.

title과 desc 아이디를 가진 태그 안에 각각의 데이터가 들어간다. 쉽다쉽다