Node.js

App - 함수를 이용해서 정리 정돈하기

수업소개

함수를 이용해서 코드를 정리 정돈하는 모습을 경험해보겠습니다. 

 

 

 

강의

 

 

 

소스코드

main.js (변경사항)

var http = require('http');
var fs = require('fs');
var url = require('url');

function templateHTML(title, list, body){
  return `
  <!doctype html>
  <html>
  <head>
    <title>WEB1 - ${title}</title>
    <meta charset="utf-8">
  </head>
  <body>
    <h1><a href="/">WEB</a></h1>
    ${list}
    ${body}
  </body>
  </html>
  `;
}
function templateList(filelist){
  var list = '<ul>';
  var i = 0;
  while(i < filelist.length){
    list = list + `<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`;
    i = i + 1;
  }
  list = list+'</ul>';
  return list;
}

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){
        fs.readdir('./data', function(error, filelist){
          var title = 'Welcome';
          var description = 'Hello, Node.js';
          var list = templateList(filelist);
          var template = templateHTML(title, list, `<h2>${title}</h2>${description}`);
          response.writeHead(200);
          response.end(template);
        })
      } else {
        fs.readdir('./data', function(error, filelist){
          fs.readFile(`data/${queryData.id}`, 'utf8', function(err, description){
            var title = queryData.id;
            var list = templateList(filelist);
            var template = templateHTML(title, list, `<h2>${title}</h2>${description}`);
            response.writeHead(200);
            response.end(template);
          });
        });
      }
    } else {
      response.writeHead(404);
      response.end('Not found');
    }



});
app.listen(3000);

 

댓글

댓글 본문
  1. kujern
    이해가 안 되고, 따라하기도 힘들고, 자기 혼자 설명하고 자기 혼자 진도나가는 최악의 강의
    엔지니어로는 어떨지 모르겠지만, 가르치는 능력은 제로에 가깝다.
  2. 서쥐서쥐
    210404 완료
  3. 김원준
    templateList(filelist)도 결국 list를 return해주는 함수기에 그런 것 같네용
    대화보기
    • 이수완
      와.. 감사합니다 ㅋㅋ 이유는 잘 모르시겠죠?
      대화보기
      • byoonn
        완료
      • 21.02.25
      • chimhyangmoo
        21.02.19
      • jeisyoon
        2021.02.08 App - 함수를 이용하여 정리 정돈 하기 완료
        어렵게 넘어갑니다 ~~
      • 마아앙
        //Main 서버
        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) {
        queryData.id = 'WEB';
        }
        fs.readFile(`data/${queryData.id}`, 'utf8', function(err, data) {
        fs.readdir(`./data`, function(error, filelist){
        var title = queryData.id;
        var list = templateList(filelist);
        var template = templateHTML(title, list, `<h2>${title}</h2><p>${data}</p>`);
        response.end(template);
        response.writeHead(200);
        });
        });
        } else {
        response.end('Not founded');
        response.writeHead(404);
        }
        });

        이렇게 한줄로 줄일 수 있습니다. queryData.id를 강제로 WEB이라고 만들어주면 루트에 있는 페이지에 본문정보는 data디렉토리에서 빼올 수 있고 title 또한 WEB으로 변경됩니다. 즉, 루트페이지에 있는 내용을 수정할때, 로직을 변경할 필요가 없습니다.
      • 마아앙
        2021.02.01
      • hanel_
        21.2.2 완료
      • 임찬혁
        완료
      • 뭄수
        완료
      • ohhigo
        21/1/23 ★★★★★ 완료
      • ohhigo
        21/1/23 ★★★★
      • 2021.01.04 완료
      • 손민철
        20/12/29 완료
      • 생활둘기
        2020 12 25
      • kkn1125
        20.12.21 완료~!
      • 옹옹
        20201123
      • 2020.11.03.TUE.
      • ㅇㄹ
      • 콜라
        20201014 완료
      • Yong Hyun Lee
        완료 201002
      • 장원영
        그냥 클론코딩하듯 따라 가기 바쁘네요..ㅜㅜ 어렵당
      • 2020.09.09
      • 마준
        완료
      • 마준
        완료
      • Itsyng
        궁금한 점이 있는데요

        정의된 내용 변수에 순서에 따라
        매개변수 순서도 같게 해야하나요? 다르게 했더니 작동은되는데 조금씩 오류가 있네요

        예를들어
        정의된 내용에서
        ${title}이 먼저 나오고
        그다음 ${list} 등 인데요

        그러면 매개변수를 teamplateHTML(list, title 등)
        이런식으로 하면은 왜 안되는지 알려주실 수 있나요?
      • 김재원123
        타이핑이 틀리신것일 수도 있어요 ^^ 저도 타이핑이 틀릴 때가 많아서 코드 이해 다 끝나면 그냥 복붙하거든요.
        좌절하지마시고 화이팅하시길 바랍니다!
        대화보기
        • 누누
          2020.08.01. 완료
        • 동트다
          왜 똑같이 했는데 안되고 복붙하면 되는지 ㅠㅠ 속상합니다 ...모자른실력 ㅠ
        • 코딩하는렌즈쟁이
          2020-07-27 (월)
          완료
        • 영호팍
          좋은 정보 알아갑니다
        • Amousk
          좋은 강의 감사합니다.
        • Katherine Roh
          완료 :)
        • 사아
          역시 신기합니다!
        • 김보미
          완료
        • 김재익
          완료
        • 바다의왕자
          완료
        • Eunsung Shin
          완료
        • Phill
          위에 제공한 소스코드와 제코드를 비교했을 때 완전 똑같은데 브라우저 개발도구 console창에 favicon.ico를 가져올 수 없다고 뜨면서 브라우저 창에 하나도 안뜨네요ㅠ
          근데 위 소스코드를 복붙하니까 되고,, 왜 그러지 ㅋㅋㅋ
        • 준바이
          감사합니다
        • CarryKim
          오 멋있는 코드에요bb 감사합니다.
        • 03.10 완료
        • eddylee123456
          복습
        • eddylee123456
          완료
        • import.위드
          감사합니다 :]

          전체 코드를 하나하나 정리해보았습니다!

          이해가 어려우신분들께 도움이 되셨으면 좋겠네요 ㅎㅎ

          https://blog.naver.com......660
        • 스티븐잡숴
          완료
        • 임은정
          완료
        graphittie 자세히 보기