Node ch.01
npm 프로젝트 시작하기
$ mkdir nodeProject
디렉토리 생성$ cd nodeProject
$ npm init
-
express 웹서버를 사용할거임
$ npm install express --save
(package.json 에서 확인가능) - app.js 생성
var express = require('express')
var app = express()
app.listen(3000, function() {
console.log("start@ on port 3000");
});
console.log("end if server code...");
-
node app.js
localhost:3000 < 서버 구동 확인
-
nodemon 설치 (수정 사항 감지해서 자동 업데이트해주는 패키지)
$ sudo npm install nodemon -g
-
$ nodemon app.js
url routing 처리(GET 요청 처리)
- app.js 수정
var express = require('express')
var app = express()
app.listen(3000, function() {
console.log("start@ on port 3000");
});
app.get('/', function(req,res){
res.send("<h1>hi Thor</h1>")
})
- /public/main.html 생성
<html>
<head>
<meta charset="utf-8">
<title>main.html</title>
</head>
<body>
<h1>main page </h1>
<p> lalalalalalal </p>
</body>
</html>
-
구동확인
localhost:3000/public/main.html
위 방법은 잘못된 방법임, 요청을 처리하도록 코드를 입력 해야함 :: res.sendFile()
-
app.js 수정
var express = require('express')
var app = express()
app.listen(3000, function() {
console.log("start@ on port 3000");
});
app.get('/', function(req,res){
res.sendFile(__dirname + "/public/main.html")
})
static 디렉토리 설정
- app.js 수정
app.use(express.static('public'))
public 경로 아래에 위치한 파일들을 모두 static으로 요청 받아옴
- /public/main.js 추가
console.log("main js loaded");
- main.html 수정
!<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>main</title>
</head>
<body>
<h1>main page </h1>
<p> lalalalalalal </p>
<script src="main.js"> </script>
</body>
</html>
main.js 파일을 요청할 수 있게 되었음을 확인
-
/main 으로 접속했을때에도 main.html 화면과 동일하게 나타내기
app.js 에 아래 app.get 추가
app.get('/main', function(req,res){
res.sendFile(__dirname + "/public/main.html")
})
localhost:3000/main < 으로 화면 확인
localhost:3000 < 화면과 같은 화면 출력