반응형
본 글은 생활코딩의 Node.js 강의를 보고 정리한 것입니다.
var fs = require('fs');
fs.readFile('sample.txt', 'utf8', (err, data) => {
if (err) {
console.error(err)
return
}
console.log(data);
});
err: error 발생시 찍히는 로그
위의 문법은 Node.js 공식 홈페이지에 나온 버전을 참고한 것입니다. 반면, 생활코딩에선 function 메서드를 사용했습니다.
var fs = require('fs');
fs.readFile('sample.txt', 'utf8', function(err, data) {
console.log(data);
});
위에서 배운 파일 읽기를 통해 본문을 구현해보겠습니다.
먼저 "data" 라는 폴더를 만들고 그 안에 html, css, javascript 내용을 복사해서 새로운 파일을 만듭니다.
그리고 아래처럼 main.js 파일을 수정해주어야 합니다.
var http = require('http');
var fs = require('fs');
var url = require('url');
var app = http.createServer(function(request, response) {
var _url = request.url;
var queryData = new URL('http://localhost:3000' + _url);
var title = queryData.searchParams.get('id');
if(_url == '/') {
title = 'Welcome';
}
if(_url == '/favicon.ico') {
response.writeHead(404);
response.end();
return;
}
response.writeHead(200);
// 파일 읽기
fs.readFile(`data/${title}`, 'utf8', (err, data) => {
var description = data;
var template = `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="index.html">WEB</a></h1>
<ol>
<li><a href="/?id=HTML">HTML</a></li>
<li><a href="/?id=CSS">CSS</a></li>
<li><a href="/?id=JavaScript">JavaScript</a></li>
</ol>
<h2>${title}</h2>
<p>${description}</p>
</body>
</html>
`;
response.end(template);
});
});
app.listen(3000);
기본 탬플릿 html 코드와 response.end() 를 fs.readFile() 내부에 옮겨야 합니다. 파일 읽은 내용(데이터)를 description 이란 변수에 저장하고 Template literal 로 <p></p> 부분에 추가해주면 됩니다.
html의 하이퍼링크 부분이 헷갈리시는 분들을 위해 정리해보겠습니다. 우리는 url 주소를 다음과 같이 입력합니다.
1. localhost:3000
2. localhost:3000/?id=HTML
3. localhost:3000/?id=CSS
4. localhost:3000/?id=JavaScript
1번 url에 접속하면 아래와 같은 화면이 나올 것입니다.
참고로 undefined 부분은 main.js 파일에서
if(_url == '/') {
title = 'Welcome!!';
}
부분만 입력해서 index.html의 본문 내용이 나오지 않은 것
위에서 1. HTML 을 클릭하면 주소가 "localhost:3000/?id=HTML" 으로 바뀌면서 아래 코드를 통해 저장된 본문이 등장합니다.
<h2>${title}</h2>
<p>${description}</p>
728x90
반응형
'문돌이 존버 > Node.js 스터디' 카테고리의 다른 글
AWS EC2 우분투에 Node.js 설치하기 (0) | 2021.07.15 |
---|---|
(Node.js) 자바스크립트 반복문 및 Array 특성 feat. 생활코딩 (0) | 2021.07.15 |
Node.js 홈페이지 구현해보기 feat. 생활코딩 (0) | 2021.07.15 |
Node.js 콘솔 입력값(input) 및 Not found 오류 구현 feat. 생활코딩 (0) | 2021.07.13 |
Node.js 웹 서버 구축하기 feat. 생활코딩 (0) | 2021.07.13 |