Express-웹페이지를 표현하는 방법 - 생활코딩
여기서는 웹페이지를 정적으로 만드는 방법과 동적으로 만드는 방법의 장점과 단점을 살펴봅니다. app.js var express = require('express'); var app = express(); app.use(express.static('public')); app.get('/', function(req
opentutorials.org
생활코딩의 Node.js에서 Express를 공부하던 중 의문점이 생겼다.
express.static을 통해 정적 파일을 전달하는 것은 이해가 갔다.
하지만
var express = require('express');
var app = express();
app.use(express.static('public'));
app.get('/', function(req, res){
res.send('Hello home page');;
});
app.get('/dynamic', function(req, res){
var lis = '';
for(var i=0; i<5; i++){
lis = lis + '<li>coding</li>';
}
var time = Date();
var output = `
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
Hello, Dynamic!
<ul>
${lis}
</ul>
${time}
</body>
</html>`;
res.send(output);
});
app.get('/route', function(req, res){
res.send('Hello Router, <img src="/route.png">')
})
app.get('/login', function(req, res){
res.send('<h1>Login please</h1>');
});
app.listen(3000, function(){
console.log('Conneted 3000 port!');
});
위와 같이 express.static을 사용하지 않고서 html에 JavaScript 코드를 붙여 보내는 것을 동적파일을 보내는 것이라고 하였다.
구글링한 결과 동적파일이라는 용어의 정확한 정의가 없었고 애초에 정적파일에는 html, css, javascript가 모두 포함되는 것이여서 무슨 말씀을 하시는 것인지 헷갈렸다.
정적파일, 동적파일, 미디어파일
오늘 정적파일의 정의와 그 반댓말을 공부하다가 많은 사람들이 잘못이해하고 게시글에서 오용하고 있는 글을 봐서 이에 대해서 올바르게 정의내리고 이해하기 위해서 글을 쓴다. 정적파일 정
higher77.tistory.com
해답:
여기서 말하는 동적파일이란
정적파일의 html코드(정적언어)에 동적인 언어 javaScript를 추가하여 단순한 정보를 보여주는 것이 아닌
사용자가 웹페이지와 상호작용할 수 있도록 해줘서 동적파일이라고 한 것이다.
#여기서 말하는 정적언어와 동적언어는 타입스크립트와 자바스크립트의 관계를 말하는 것이 아니다.
#생활코딩에서 말하는 정적언어와 동적언어는 reference에 나와있고 https://higher77.tistory.com/9 을 통해서도 알 수 있다.
reference:
https://velog.io/@shanells/%EB%8F%99%EC%A0%81%EC%96%B8%EC%96%B4-JavaScript
https://opentutorials.org/course/2136/11858
https://www.youtube.com/watch?v=q4c69koKcOc&list=PLuHgQVnccGMBB348PWRN0fREzYcYgFybf&index=2