해결하고자 하는 문제

HTML
CSS
JavaScript 밑에있는 재목창이 각 패이지에 따라 바뀌어야되는대 바뀌지가 않고 모두 다 똑같은 undefined로 나옵니다.

코드 혹은 오류

   여기에 코드를 적어주세요. 
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.name;
    if(_url == '/'){
      title = 'Welcome'
    }
    if(_url == '/favicon.ico'){
      return response.writeHead(404);
    }
    response.writeHead(200);
    var template = `
    <!doctype html>
    <html>
    <head>
      <title>WEB1 - ${title}</title>
      <meta charset="utf-8">
    </head>
    <body>
      <h1><a href="/">WEB</h1>
      <ol>
        <li><a href="/?id = HTML">HTML</li>
        <li><a href="/?id = CSS">CSS</li>
        <li><a href="/?id = JavaScript">JavaScript</li>
      </ol>
      <h2>${title}</h2>
      <p><a href = "https://www.w3.org/TR/2011/WD-html5-20110405/"target="_blank" title="html5">
      Hypertext Markup Language (HTML)</a> is the standard markup
      language for <strong>creating <u>web</u> pages</strong> and web applications.
      Web browsers receive HTML documents from a web server or from local storage and
      render them into multimedia web pages. HTML describes the structure of a web page
       semantically and originally included cues for the appearance of the document.
      <img src="coding.jpg" width = "450">
      </p><p style="margin-top:45px;">
      HTML elements are the building blocks of HTML pages. With HTML constructs, imag
      es and other objects, such as interactive forms, may be embedded into the rende
      red page. It provides a means to create structured documents by denoting structu
      ral semantics for text such as headings, paragraphs, lists, links, quotes and ot
      her items. HTML elements are delineated by tags, written using angle brackets.
      </p>
    </body>
    </html>`;
    response.end(template);
});
app.listen(3000);

환경

사용중인 운영체제, 언어, 라이브러리의 버전을 적어주세요. chrome, node.js, atom

시도해본 방법

위의 코드에 두가지 문제가 있습니다.

var _url = request.url;
var queryData = url.parse(_url, true).query;
var title = queryData.name;

여기에 보면 name이라는 키의 값을 가져와 title 변수에 할당합니다. 하지만

<ol>
  <li><a href="/?id = HTML">HTML</li>
  <li><a href="/?id = CSS">CSS</li>
  <li><a href="/?id = JavaScript">JavaScript</li>
</ol>

링크에서는 id라는 키를 이용하여 링크를 생성합니다. 또한 "=" 앞 뒤에 공백문자가 존재합니다.

아래와 같이 링크에 id를 name으로 변경하고 등호 앞뒤에 공백을 제거해주시면 원하시는 결과를 얻으실 수 있을 것 같습니다.

<ol>
  <li><a href="/?name=HTML">HTML</li>
  <li><a href="/?name=CSS">CSS</li>
  <li><a href="/?name=JavaScript">JavaScript</li>
</ol>

codingeverybody / codingyahac

web2 node.js 11강 질문 #768

해결하고자 하는 문제

코드 혹은 오류

환경

시도해본 방법