Heung-9

Express.js 를 이용하여 간단한 웹앱 구현하기 본문

Development /Node.Js

Express.js 를 이용하여 간단한 웹앱 구현하기

Heung-9 2018. 8. 13. 22:30

 Express 를 이용한 간단한 웹 구현 



Express 를 이용한 간단한 웹 로컬 서버 구현


1. 만들고자 하는 경로에 폴더와 js 파일을 생성한다.



2. cmd 창에서 해당경로로 이동 후 npm install express --save 명령어를 사용하여 express 모듈을 해당 폴더에 설치한다.   

   npm 명령어 이후

    --save 옵션 : 해당 경로에만 모듈 설치 (현재 패키지에서만 사용가능)

    --g 옵션 : 전역적으로 설치 (다른 패키지에서도 사용가능)

  


express 모듈 설치 이후 해당 경로에 package-lock.json 파일이 생성된걸 알 수 있다.



WebApp.js 파일 소스

var express = require('express');  //expess 변수를 선언하여 express 모듈을 제어
var app = express(); //express 함수를 사용

app.listen(3000 , function(){  //express 의 listen 이라는 함수를 이용하여 3000번 port 를 listening 할수있다.
  console.log('Success Connect 3000 Port');
});


app.get('/' , function(req, res){   //get 방식의 접속 경로 routing
  res.send('Exress Test WebApp');
});

app.get('/login' , function(req, res){   //get 방식의 접속 경로 routing
  res.send('Exress Login Page');
});


//get 의 역할 : 사용자의 요청과 요청에 대한 처리를 중개해주는 역할을 한다.


3. cmd 창에서 위의 소스 코드 작성 이후 node WebApp.js  node 명령어를 사용하여 js 파일 실행

   3.1 app.listen 으로 생성한 3000번 포트의 로컬서버가 정상실행된것을 확인할 수 있다.

app.listen(3000 , function(){  //express 의 listen 이라는 함수를 이용하여 3000번 port 를 listening 할수있다.
  console.log('Success Connect 3000 Port');
});




app.get('/' , function(req, res){   //get 방식의 접속 경로 routing
  res.send('Exress Test WebApp');
});

 3.2 app.get 방식에서 지정한 '/'  경로의 http://localhost:3000/ 실행 시 res.send 를 이용한 출력이 이루어짐을 확인할 수 있다. 


app.get('/login' , function(req, res){   //get 방식의 접속 경로 routing
  res.send('Exress Login Page');
});

3.3 app.get 방식에서 지정한 '/login'  경로의 http://localhost:3000/login 실행 시 res.send 를 이용한 출력이 이루어짐을 확인할 수 있다.

 



Express 를 이용한 간단한 웹앱 서버 실행 및 화면 출력 테스트 마침






'Development > Node.Js' 카테고리의 다른 글

NPM 과 Express.js  (0) 2018.07.16
Node.js 란  (0) 2018.07.16
Comments