일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- LG Aimers 4th
- GPT-4
- AI
- regression
- Machine Learning
- 회귀
- ChatGPT
- 오블완
- OpenAI
- 머신러닝
- LLM
- supervised learning
- 지도학습
- 티스토리챌린지
- 분류
- LG
- 해커톤
- 딥러닝
- deep learning
- gpt
- PCA
- LG Aimers
- Classification
Archives
- Today
- Total
SYDev
[Node.js] 3. 동적인 웹페이지 만들기 본문
해당 게시물은 유튜브 생활코딩 "Node.js" 강의 영상을 참고했습니다.
(https://www.youtube.com/watch?v=3RS_A87IAPA&list=PLuHgQVnccGMA9QQX5wqj6ThK7t2tsGxjm&index=1)
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;
console.log(queryData.id); //queryData에서 key값에 따른 value를 얻을 수 있음
if(_url == '/'){
title = 'Welcome';
}
if(_url == '/favicon.ico'){
response.writeHead(404);
response.end();
return;
}
response.writeHead(200);
var template = `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1> //WEB 버튼 눌렀을 때, if(_url = '/')의 조건문에 걸리도록
<ol>
<li><a href="/?id=HTML">HTML</a></li> //해당 페이지의 주소에서 queryData 부분 id의 value값을 바꿔줌
<li><a href="/?id=CSS">CSS</a></li> //해당 페이지의 주소에서 queryData 부분 id의 value값을 바꿔줌
<li><a href="/?id=JavaScript">JavaScript</a></li> //해당 페이지의 주소에서 queryData 부분 id의 value값을 바꿔줌
</ol>
<h2>${title}</h2>
<p><a href="https://www.w3.org/TR/html5/" target="_blank" title="html5 speicification">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="100%">
</p><p style="margin-top:45px;">HTML elements are the building blocks of HTML pages. With HTML constructs, images and other objects, such as interactive forms, may be embedded into the rendered page. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are delineated by tags, written using angle brackets.
</p>
</body>
</html>
`;
response.end(template);
});
app.listen(3000);
위에 주석으로 설명 달아놓은 거까지 웹페이지에 표시되는데, 이는 무시하자.
'대딩코딩 > 웹개발 스터디' 카테고리의 다른 글
[Node.js] 5. boolean -> 콘솔에서의 입력값 (1) | 2023.11.11 |
---|---|
[Node.js] 4. 파일을 이용해 본문 구현 (0) | 2023.11.11 |
[Node.js] 2. URL (0) | 2023.11.10 |
[Node.js] 1. Variable (0) | 2023.11.10 |
[Node.js] 0. Node.js 기초 (0) | 2023.11.10 |