Basics에 해당하는 글 68

  1. 노드의 정의, 특성 2021.08.31

    Node의 정의 Node.js는 크롬의 V8(자바스크립트 엔진)로 빌드된 자바스크립트 런타임. 런타임? → 특정 언어로 만든 프로그램들을 실행할 수 있게 해 주는 가상 머신의 상태 = 실행기라고 생각하면 됨 노드는 서버가 아니다. 다만, 노드는 서버의 역할을 수행할 수는 있음. 자바스크립트로 서버의 기능을 수행하는 코드를 짜고 노드로 실행시켜 주면 그 역할을 할 수 있다. 자바스크립트는 브라우저에서 html 에서 스크립트 태크 안에 넣어 주면 브라우저가 html을 읽으면서 스크립트를 함께 읽어주는 방식으로 실행할 수 있었음. → html이 없으면 스크립트를 읽을 수 없었다. 종속되어 있는 느낌. node로 인해 브라우저와 html에 종속되어 사용되어야 할 필요성을 탈출할 수 있게 되었음. Node의 특성..


  2. Hash 2021.08.17

    어떤 페이지에 접근할 때는 URL을 통해 접근할 수 있다. 단, 페이지 안에서 어떤 특정한 부분으로 접근하고 싶을 때는? 예를 들어, 3개의 문단으로 구성된 글이 어떤 페이지(hash.html)내에 있고, 어떤 URL을 통해 그 페이지에 접근했을 때 3번째 문단을 기준으로 접근하고 싶다고 하자. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type s..


  3. fetch API 2021.08.16

    Asynchronous Javascript And Xml : AJAX, 에이작스 비동기 방식의 Javascript와 Xml을 가리킨다. 데이터를 가져올 때 불필요한 정보까지 끌어내는 전체 페이지 리로드 없이 Ajax를 이용해서 필요한 정보만 가져 올 수 있다. → 데이터를 절약할 수 있고 + 싱글 페이지 애플리케이션을 구현할 수 있다. 싱글 페이지 애플리케이션 = 하나의 페이지로 여러 정보를 표현할 수 있는 애플리케이션. ajax를 구현하려면? → fetch API를 사용할 것이다 fetch API의 요청과 응답 클라이언트와 서버가 서로 통신을 할 때 클라이언트가 우선 요청. fetch함수는 첫번째 인자로 전달된 데이터를 서버에게 요청해 준다. fetch('javascript') : 웹브라우저에게 jav..


  4. *REST API 연습, RESTful?? 2021.08.09

    # 1. 학교와 학생, 성적 정보를 저장하려고 합니다. 데이터베이스를 설계해 보세요. - 학생은 반드시 하나의 학교에만 소속되어 있습니다. - 성적은 반드시 학생에게 소속되어 있으며, 한 학생에게 여러개 존재할 수 있습니다. - 매우 간단하게, 아래의 항목과 관계성만 포함하면 됩니다. - 학교 : 이름 / 학생 : 이름, 소속학교 / 성적 : 과목명, 점수, 누구의 성적인지 # 2. REST API 규칙에 따라, 아래 API의 HTTP Method와 url을 만들어 보세요. (예) 학교 상세 조회 GET /schools/1 - 학교 목록 조회 GET /schools - 학교 생성 POST /schools { "id" : 1 , { "name" : "herewego" } - id가 1인 학교 수정 PATC..


  5. REST API, URL과 URI 2021.08.05

    참고자료 및 연습문서 링크 기계가 웹을 통해서 통신할 때 정해진 규칙이 있다. REST API는 기계와 기계가 규격화된 방식으로 인터넷/웹을 통신할 수 있는 통신규약인 http를 이용한다. 이를 이용해서 통신할 때 http에게 가장 이로운 방식대로 해라~ 하고 권고하는 내용을 뜻함. 웹 서버-웹 서버, 웹 서버-웹 브라우저, 웹 서버-모바일 앱이 통신할 때 REST API를 이용할 수 있음. 기계와 기계가 http를 이용해서 통신할 때... 하나하나의 데이터를 모아 놓은 것을 Resource라고 한다. → REST API에서는 URI를 통해 표현됨 이런 데이터 전체 또는 여러 개를 식별할 수 있고, 이러한 URI를 Collection 이라고 한다. 그 중에서 한 건 한건의 데이터를 Element 라고 한..


  6. Response 2021.08.03

    Response Message의 형식 이미지 출처 : https://jsstudygroup.github.io/jsStudyBlog/posts/Http/ 이미지 출처 : https://ducmanhphan.github.io/2019-02-05-HTTP-protocol/ HTTP/1.1 200 OK → 버전. HTTP 1.1 이라는 포맷을 사용하고 있다. → HTTP status code. - 200번대는 성공했다는 뜻을 가지고 있다. 참고링크 → 좀 더 이해하기 편한 문구로 설명해 주는 부분 Content-Type 웹 서버가 응답할 때 텍스트인지 이미지인지 뭔지, 그 중에서도 어떤 타입인지 알려준다. 웹 브라우저는 이를 보고 해당 방식으로 해석해서 보여주게 된다. Content-Length 응답하는 이 컨..


  7. Request 2021.08.03

    Request Message의 형식 이미지 출처 : https://ducmanhphan.github.io/2019-02-05-HTTP-protocol/ 첫 번째 행에는 Request Line이 들어오며, 그 아래는 Request Headers라고 부른다. 그리고 그 전체를 합쳐 Request Message Header라고 부른다. 서버 쪽으로 전송해야 할 정보가 있다면 그 정보(실제 내용)를 payload라고도 하고, body라고도 하는데, 이 body는 header와 blank line으로 구분한다. 즉, Header는 요청 또는 응답에 대한 정보를 가지는 부분. body는 주고 받는 실제 데이터를 가지는 부분! * 쿠키는 부가적인 정보이므로 헤더에 저장된다. GET /doc/test.html HTTP..


  8. HTTP? 2021.07.18

    HTTP가 무엇인가? (HyperText Transfer Protocol) 참고링크 클라이언트(=웹에서는 웹 브라우저)와 서버(=웹 서버)가 있다. 클라이언트는 가게에서 물건을 사려는 손님, 서버는 그 가게의 점원이라고 생각해보자. 클라이언트가 서버에게 HTML이라는 물건을 달라고 한다면 그것이 Request, 그리고 클라이언트가 원하는 물건을 서버가 건네주는 것이 Response라고 할 수 있다. 이 때 HTML, CSS, JavaScript, 이미지와 같은 파일들은 서로가 주고 받는 컨텐츠라면, 그 컨텐츠를 주고 받기 위해서는 클라이언트와 서버가 서로 알아들을 수 있는 공통의 약속인 Message가 필요하다. 그 Message가 HTTP 이고, HTTP는 크게 request를 위한 메시지와 respo..


  9. [Express] 보안과 express generator 2021.07.17

    보안 관리 참고 1. 최신 버전의 Express를 유지할 것 2. TLS를 사용할 것 = https → 웹브라우저와 웹서버가 서로 통신을 할 때 상호간의 암호화가 체결이 되기 때문에 중간에 누가 데이터를 가로채가도 그 데이터의 실제 내용이 무엇인지 알 수 없게 할 수 있다. 인증서를 통해 웹사이트의 도메인과 같은 것을 변주해서 피싱하려 할 때 경고도 띄워준다. 3. 헬멧을 사용할 것 → 헬멧 = 보안과 관련해서 일어날 수 있는 여러 가지 보안 이슈들을 자동으로 해결해 주는 모듈들을 모아 놓은 것 4. 쿠키를 올바르게 사용할 것 → 어떤 웹사이트에 사용자들이 방문할 때 누가 방문했는지 확인하기 위해 방문자 하나하나를 식별할 필요가 있다. 이 때 사용되는 주요한 매커니즘, 인증에서 핵심적인 역할을 하는 것 ..


  10. [Express] 라우터 - 파일로 분리 2021.07.17

    소프트웨어가 커짐에 따라 그 복잡도를 잘 정리정돈/관리하지 않으면 소프트웨어의 확장에 한계가 있다. https://expressjs.com/ko/guide/routing.html 넘 어렵다... const express = require("express"); const app = express(); const port = 3000; var fs = require("fs"); var template = require("./lib/template.js"); var path = require("path"); var sanitizeHtml = require("sanitize-html"); var qs = require("querystring"); var bodyParser = require("body-parse..