리셋 되지 말자

응답 200 과 응답 404 response.writeHead(200); // 200을 전송하면, 파일을 잘 전송했다고 하는 약속 response.end(template); ip주소 오른쪽에 '/'이후로 파일 경로를 지정한다. 이때 파일이 존재하여 클라이언트에 잘 전송했다면 잘 전송했다는 의미로 200을 전송한다.(웹상의 약속이라고 한다.) 반대로 존재하지 않는 파일을 요청하면 404오류를 전송하여 클라이언트에게 알리도록 한다. 소스 코드 var http = require('http'); var fs = require('fs'); var url = require('url') // url 모듈을 사용한다 var app = http.createServer(function (request, response) ..

fileRead를 이용해서 동적으로 본문 병경 data 디렉토리를 새로 생성하고, 1.html 2.html 3.html의 본문 내용만 따로 data디렉토리 안에 HTML, CSS, JavaScript라는 이름으로 저장 전체 소스 코드 var http = require('http'); var fs = require('fs'); var url = require('url') // url 모듈을 사용한다 var app = http.createServer(function (request, response) { var _url = request.url; var queryData = url.parse(request.url, true).query; var title = queryData.id; console.log(q..

파일 읽기 nodejs 디렉토리 생성 후, 그 안에 fileread.js와 sample.txt 작성(sapmle.txt의 내용은 아무거나 작성) fileread.js var fs = require('fs'); fs.readFile('.\\nodejs\\sample.txt', (err, data) => { if (err) throw err; console.log(data.toString()); }); fs.readFile('.\\nodejs\\sample.txt', function(err, data){ if(err) throw err; console.log(data.toString()); }); 둘 다 같은 함수이지만, 첫 번째는 js의 최신 문법이고, 아래(두 번째)는 기본적인 문법이다. 실행 결과 [R..

템플릿을 이용한 웹페이지 생성 1.html의 내용을 카피하여 var template = ` `; 의 ` ` 안에 넣는다. 그리고 qeuryData에 따라 달라지는 부분을 ${queryData}로 변경하여 웹페이지를 요철할 때마다 query string의 id 값에 따라 내용이 변경되도록 한다. 전체 소스코드 var http = require('http'); var fs = require('fs'); var url = require('url') // url 모듈을 사용한다 var app = http.createServer(function(request,response){ var _url = request.url; var queryData = url.parse(request.url, true).query; ..

URL 형식 http://tistory.com:3030/main?id=HTML&page=12 통신규칙 : // host(ip주소) : 포트번호 / 파일 ? 쿼리 스트링(query string) URL 을 통해서 입력된 값 사용하기 main.js var http = require('http'); var fs = require('fs'); var app = http.createServer(function(request,response){ var url = request.url; console.log(url); // url 값 확인 if(url == '/'){ url = '\\index.html'; } if(url == '/favicon.ico'){ response.writeHead(404); response..

main.js var http = require('http'); var fs = require('fs'); var app = http.createServer(function(request,response){ var url = request.url; if(request.url == '/'){ url = '\\index.html'; } if(request.url == '/favicon.ico'){ response.writeHead(404); response.end(); return; } response.writeHead(200); console.log(__dirname + url); response.end(fs.readFileSync(__dirname + url)); }); app.listen(80); 접속..

프런트엔드 자바스크립트 AJAX AJAX(Asynchronous Javascript And XML)는 비동기적 웹 서비스를 개발하기 위한 기법이다. 이름에 XML이 들어가 있지만, 꼭 XML을 사용해야 하는 것은 아니다. 요즘에는 JSON을 많이 사용한다. 쉽게 말해 페이지 이동 없이 서버에 요청을 보내고 응답을 받는 기술이다. (요청과 응답은 4.1절에 설명) 웹 사이트 중 페이지 전환 없이 새로운 데이터를 불러오는 사이트는 대부분 AJAX 기술을 사용하고 있다고 보면 된다. 보통 AJAX 요청은 jQuery나 axios 같은 라이브러를 이용해서 보낸다. 결과로 '{}'를 받는다. 먼저 XMLHttpRequest 생성자로 xhr 객체를 생성한다. xhr.open 메서드에 요청 메서드와 요청 주소를 넣고..

ES2015+ var 대신 const, let if(true){ var x = 3; } console.log(x); //3 if (true){ const y = 3; } console.log(y); //Uncaught ReferenceError: y is no defined var은 함수 scope이고, const와 let은 블록 scope이다. 블록 scope인 y에는 블록 밖에서 접근을 할 수가 없으므로 에러 const와 let은 block scope, var은 function scope const와 let의 차이 const const는 타 언어와 비슷하게 한번 값을 초기화하면 다른 값을 대입할 수 없다. 또한 선언할 때, 값으로 초기화 해주어야 한다. let let은 다른 값을 대입할 수 있다. 선..