[생활코딩]Node.js : 13-23강

ChoHyerin·2024년 9월 23일
0

Node.js

목록 보기
2/3
post-thumbnail

13. App 제작 - 파일을 이용해 본문 구현

: 폴더 내부에 data 폴더 생성 → HTML, CSS, JavaScript 각 파일 생성(확장자x) → 본문 <p>태그 내용들 파일에 넣어줌

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 = url.parse(_url, true).query;
    var title = queryData.id;
    if(_url == '/'){
      title = 'Welcome';
    }
    if(_url == '/favicon.ico'){
      return response.writeHead(404);
    }
    response.writeHead(200);
    fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){

        var template = `
        <!doctype html>
        <html>
        <head>
        <title>WEB1 - ${title}</title>
        <meta charset="utf-8">
        </head>
        <body>
        <h1><a href="/">WEB</a></h1>
        <ul>
            <li><a href="/?id=HTML">HTML</a></li>
            <li><a href="/?id=CSS">CSS</a></li>
            <li><a href="/?id=JavaScript">JavaScript</a></li>
        </ul>
        <h2>${title}</h2>
        <p>${description}</p>
        </body>
        </html>
        `;
        response.end(template);
 
    })
    
});
app.listen(3000);
  • fs.readFile(data/${queryData.id}, 'utf8', function(err, description){ }
    → data파일 속에 있는 ${queryData.id} 파일 경로에 맞게 내용을 ${description} 속으로 가지고 온다.

14-17. JavaScript(Boolean, 비교연산자, 제어문, 조건문)

  • Boolean

    console.log(true); // 1
console.log(false);

  • 비교연산자(Comparison operator)

    console.log(1==1); // true
console.log(1==2); // false(값 비교)
console.log(1>2); // false
console.log(1<2); // false
console.log(1===1); // true
console.log(1===2); // false(값과 데이터 타입 비교)
    • ==과 ===의 차이
      • ==는 서로의 값이 같은지 비교
      • ===은 값과 데이터 타입이 같은지 비교

  • 제어문(Flow control statements)
    : 여러 프로그램을 수행하거나 수행하지 않도록 하거나, 특정 문장을 여러 번 반복 수행하게 함.

    ex) 조건문, 반복문 등
    • Program = 어떤 일의 진행 목록이나 순서, 차례 등을 뜻함

  • 조건문(Conditional statements)

    console.log('A');
console.log('B');
if(false){
  console.log('C1');
} else {
  console.log('C2');
}
console.log('D');
// 기본 true라 C2 출력됨

18. Node.js - 콘솔에서의 입력값

var args = process.argv; //js는 내용을 배열로 저장함
console.log(args[2]);
console.log('A');
console.log('B');
if(args[2] === '1'){
  console.log('C1');
} else {
  console.log('C2');
}
console.log('D');

19-1. App 제작 - Not found 구현

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 = url.parse(_url, true).query;
    var title = queryData.id;
    var pathname = url.parse(_url, true).pathname; // pathname으로 변경

    if(pathname === '/'){  // if-else문으로 변경
      fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){

        var template = `
        <!doctype html>
        <html>
        <head>
        <title>WEB1 - ${title}</title>
        <meta charset="utf-8">
        </head>
        <body>
        <h1><a href="/">WEB</a></h1>
        <ul>
            <li><a href="/?id=HTML">HTML</a></li>
            <li><a href="/?id=CSS">CSS</a></li>
            <li><a href="/?id=JavaScript">JavaScript</a></li>
        </ul>
        <h2>${title}</h2>
        <p>${description}</p>
        </body>
        </html>
        `;
        response.writeHead(200);
        response.end(template);
 
      })
    }else{ //없는 페이지일 경우 Not found
      response.writeHead(404);
      response.end('Not found');
    }
    
    
});
app.listen(3000);
  • url.parse(_url, true) : 반환된 Url 객체에서 pathname프로퍼티는 쿼리스트링을 제외한 path만을 보여줌

ex) pathname: ‘/’, path: ‘/?id=HTML’

19-2. App 제작 - 홈페이지 구현

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 = url.parse(_url, true).query;
    var pathname = url.parse(_url, true).pathname;

    if(pathname === '/'){
      if(queryData.id === undefined){ // if-else문으로 메인페이지를 나타낼 수 있도록 수정함.
        fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){
          var title = 'Welcome'; //여기
          var description = 'Hello, Node.js'; //여기 수정
          var template = `
          <!doctype html>
          <html>
          <head>
          <title>WEB1 - ${title}</title>
          <meta charset="utf-8">
          </head>
          <body>
          <h1><a href="/">WEB</a></h1>
          <ul>
              <li><a href="/?id=HTML">HTML</a></li>
              <li><a href="/?id=CSS">CSS</a></li>
              <li><a href="/?id=JavaScript">JavaScript</a></li>
          </ul>
          <h2>${title}</h2>
          <p>${description}</p>
          </body>
          </html>
          `;
          response.writeHead(200);
          response.end(template);
   
        })
      }else{
        fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){
          var title = queryData.id; //원래 if문 밖에서 선언했는데 안으로 옮김
          var template = `
          <!doctype html>
          <html>
          <head>
          <title>WEB1 - ${title}</title>
          <meta charset="utf-8">
          </head>
          <body>
          <h1><a href="/">WEB</a></h1>
          <ul>
              <li><a href="/?id=HTML">HTML</a></li>
              <li><a href="/?id=CSS">CSS</a></li>
              <li><a href="/?id=JavaScript">JavaScript</a></li>
          </ul>
          <h2>${title}</h2>
          <p>${description}</p>
          </body>
          </html>
          `;
          response.writeHead(200);
          response.end(template);
   
        })
      }
    }else{
      response.writeHead(404);
      response.end('Not found');
    }
});
app.listen(3000);

홈페이지에 undefined 뜨던 것을 해결함.

→ if(queryData.id === undefined) 조건으로 한 번 더 나눠줌.

20-22. JavaScript(반복문, 배열, 배열과 반복문)

  • 반복문(Loop statement)
    console.log('A');
console.log('B');
 
var i = 0;
while(i < 2){
  console.log('C1');
  console.log('C2');
  i = i + 1;
}
 
console.log('D');
  • 배열(Array)
    var arr = ['A','B','C','D'];
console.log(arr[1]);
console.log(arr[3]);
arr[2] = 3; // 인덱스 번호 2번째 원소 3으로 바꿈
console.log(arr); // 배열 전체 출력
console.log(arr.length); // 배열의 크기
arr.push('E'); // 배열의 끝에 추가함
console.log(arr);
  • 배열과 반복문 : 배열 내에 있는 숫자들의 합을 나타내는 코드
    var number = [1,400,12,34];
var i = 0;
var total = 0;
while(i < number.length){
  total = total + number[i];
  i = i + 1;
}
console.log(`total : ${total}`);

23. Node.js에서 파일목록 알아내기

var testFolder = './data'; //파일 목록 읽어올 폴더
var fs = require('fs'); // file system 모듈 가져옴
 
fs.readdir(testFolder, function(error, filelist){
  console.log(filelist);
})

  • fs.readFile(path [,options], callback) 메소드
    : 파일을 읽어옴

  • fs.readdir(path [,options], callback) 메소드
    : 디렉토리 목록을 읽어옴

    → 첫번째 인자(path) = 파일 목록을 읽을 폴더(dir) 가져옴

→ 콜백함수의 두번째 인자(filelist) = 폴더의 파일목록 가져옴

끄읕.

profile
ChoHyerin
이전 포스트

[생활코딩]Node.js : 1-12강

다음 포스트

MySQL 한 번에 끝내기

0개의 댓글