C-log

보호되어 있는 글입니다.

이번에는 form에서 부터 response까지 사용자가 입력한 값을 받아서 사용자에게 응답을 전달하는 모든 과정들을 살펴 볼 것이다. 비록 실제 data를 처리하는 sql이 아니지만 이를 통해서 대략적인 흐름과 맥락을 어느정도 가늠 해볼 수 있을 것이다.form아래와 같이 html을 작성해보고 실행을 해보고 URI의 결과를 살펴보자. URIhttp://localhost:3000/process_create?title=test&description=test+des* 참고로 위와 같은 결과를 얻기 위해서는 로컬 서버를 돌려야 한다. 본인은 live server를 사용했다.결과를 살펴보면 form으로 전송된 input값으로 URI queryStrin..

우리가 Nodejs를 잘 이해하기 위해서는 동기와 비동기를 알아야 한다. 지금까지 내가 알고 있는 동기와 비동기는 이와 같다. 동기는 순차적으로 일을 처리한다. 비동기는 각 개인들이 일을 시작 할 수 있는 시간 개념을 가지고 있어서 동시 다발적으로 일을 처리한다. 그래서 우리는 비동기를 await과 같은 명령어로 제어한다. 강의를 토대로 첨삭을 한다면 "동기는 직렬로 구성이 되어 있어서 일을 처리함에 있어서 시간 소요가 많이 든다. 하지만 비동기는 병렬로 구성이 되어 있어서 일을 처리함에 있어서 효율 적이다. Nodejs는 비동기적 처리를 하기 위한 좋은 기능을 가지고 있다." 이 수업을 통해서 우리는 조금 더 진보적이고 Nodejs의 근간이되는 Nodejs를 공부 해 볼 것이다.readFileSync(..

이번 포스팅에서는 로더에 관해서 다룰 것이다. 웹팩은 모든 파일들을 모듈로 바라본다. 따라서 import 구문을 사용하면 자바스크립트 코드 안으로 가져올 수 있다. 즉, import 구문을 사용해서 자바스크립트 코드롤 사용할 수 있는 이유는 바로 로더 때문이다. 로더는 타입스크립트와 같은 다른 언어를 자바스크립트 문법으로 변환해 주거나 이미지를 data URL 형식의 문자열로 변환한다. 뿐만아니라 CSS 파일을 자바스크립에서 직접 로딩할 수  있도록 해준다.로더의 동작 원리우선 아래와 같이 로더를 관리하는 js 함수형 파일을 하나 만들어야 한다.// my-webpack-loader.jsmodule.exports = function myWebpackLoader(content) { console.log('..

지난 포스팅에서는 모듈이 모든 브라우저에서 적용되는 것이 아니라 했다. 그래서 이를 해결 하기 위해서 웹팩이 존재한다는 것에 대해서 다루어 보았다.Webpack웹팩은 모듈로 연결(의존)된 모든 파이들을 하나로 합쳐주는 역할을 한다. 그렇게 합쳐진 파일을 번들이라고 한다. 웹팩이 번들을 만드는 번들러 역할을 한다. 따라서 웹팩을 번들러라고도 한다. 따라서 웹팩을 설치하는 lic를 설치할 것이다.:: CMD::npmnpm install webpack webpack-cli --devnpm install -D webpack webpack-cli::yarnyarn add webpack webpack-cli --devyarn add -D webpack webpack-cli설치가 완료가 되면 package.json에..

보호되어 있는 글입니다.

이번 시간에는 지난 포스팅에서 말했던 코드를 분석하는 시간을 가져 볼 것이다. 우리가 분석할 코드는 아래와 같다. section26부분을 중심으로 둘러 보려고 했으나 함수를 분리하기 전 section24에 있는 main.js 코드를 중심으로 분석 할 예정이다. 분석 대상이 될 코드는 아래 더보기를 참조 하면 되겠다.더보기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..

이번 수업에서는 우리가 이전에 제작했던 코드들을 함수화해서 리팩토링을 하는 과정을 가질 것이다. 우선 가장 크게 중복이 되고 있는 부분은 바로 html 부분이다. 그 다음으론 파일을 리스트화 하는 list 부분이다. 해당 부분들을 함수로 만든 코드는 다음 아래와 같다.function templateHTML(title, list, body) {  return `            WEB    ${list}    ${body}      `;}function templateList(filelist) {  var list = '';  var i = 0;  while (i filelist.length) {    list = list + `${filelist[i]}">${filelist[i]}`;    i = ..