전체 글 (364) 썸네일형 리스트형 웹 애플리케이션의 프로토콜 : HTTP 브라우저-서버가 통신할 수 있도록 만들어주는 여러 프로토콜 가운데 한 종류. ** Protocol : 통신규약, 즉 약속이다. 손님이 주문을 받는 사람에게 대뜸 찾아가 외계어로 주문을 할 수 없듯이, 주문을 하기 위해서는 꼭 지켜야 하는 약속이 존재. ** 웹 애플리케이션 아키텍쳐에서는, 클라이언트와 서버가 서로 HTTP라는 프로토콜을 이용하여 대화를 나눈다. [ Client --> Server ] GET /americano HTTP/1.1 Host: starbucks.com [ Server --> Client ] HTTP/1.1 200 OK {"data": "americano"} HTTP를 이용해 주고.. fs.readFile 메소드 fs.readFile : 로컬에 존재하는 파일을 '비동기적'으로 읽어온다. fs.readFile(path[, options], callback) 1. path : | | | --> path에는 파일이름을 인자로 넘길 수 있다. 네 가지 종류의 타입을 넘길 수 있지만, 일반적으로 문자열()의 타입으로 넘긴다. filename or file descriptor ex: /etc/passwd라는 파일을 불러오는 예제 fs.readFile('/etc/passwd') 2. options : | 넣을 수도 있고, 넣지 않을 수도 있다. options는 객체형태 또는 문자열로 넘길 수 있다. 문자열로 전달할 경우, 인코딩을 넘긴다. fs.readFile('test.txt', 'utf8', (err, data) => {.. [JS/Node]비동기 - Node.js 모듈 사용법 Node.js의 정의 : 비동기 이벤트 기반 자바스크립트 런타임 * 모듈 : 어떤 기능을 조립할 수 있는 형태로 만든 부분. fs(file system)모듈 : PC의 파일을 읽거나 저장하는 등의 일을 할 수있게 도와준다. 1. Node.js 내장모듈을 사용하는 방법 파일을 읽을 때 : readFile 메소드 적합 파일을 저장할 때 : writeFile 메소드 적합 모든 모듈은 '모듈을 사용하기 위해 불러오는 과정'이 필요하다. [브라우저] 브라우저에서는 다른 파일을 불러올 때에는 [Node.js] 자바스크립트 코드 가장 상단에 require구문을 이용하여 다른 파일을 불러온다. const fs = require('fs') //파일 시스템 모듈을 불러온다. const dns = require('dns').. part3 1. 먼저 서버 실행시킨다. //package.json에 들어가보면 아래와 같이 나와있다. "scripts": { "server:part-3": "node part-3/__test__/app.js" } //즉, npm run server:part-3을 하게되면 node part-3/__test__/app.js가 실행되는 것 app.js가 서버로 실행된다. [app.js 파일] //HTTP 요청을 처리하고 응답을 보내 주는 프로그램을 웹 서버(Web Server). //node.js의 http 모듈을 이용해 웹 서버를 만듭니다. //express에서는 http모듈 사용 x. const express = require('express'); const cors = require('cors'); const ap.. fetch() API HTTP를 이용해서 서버에게 데이터를 요청해서 받아올 수 있는 방법으로 AJAX를 쓴다. AJAX : 비동기 자바스크립트와 XML 웹페이지를 동적으로 서버에게 데이터를 주고받을 수 있는 기술. 대표적인 예 : XHR이라고 하는 object. XMLHttpRequest 객체. 브라우저 API에서 제공하는 object 중 하나. 간단하게 서버에게 데이터를 요청하고 받아올 수 있다. 최근 XHR 대신 브라우저 API에 추가된 fetch API를 이용하면 간편하게 데이터를 주고받을 수 있다. XML : HTML과 같은 마크업 언어 중 하나. 태그들을 이용해서 나타낸다. HTML과 마찬가지로 데이터를 표현할 수 있는 방법. 하지만, 불필요한 태그들이 너무 많이 들어가서 파일의 사이즈도 커질 뿐만 아니라 가독성도 .. callback vs promise vs async & await const delay = (wait, callback) => { setTimeout(callback, wait); } const sleep = (wait) => { return new Promise((resolve) => { setTimeout(resolve, wait); }); } 1. callback함수 function runCallback() { resetTitle(); //1. 제목 초기화 playVideo(); //1. 비디오 재생 delay(1000, () => { pauseVideo(); //2. 1초 후, 비디오 멈춤 displayTitle(); //2. 비디오멈추고, 제목 표시 delay(500, () => { highlightTitle(); //3. 0.5초 후, 제목 강조 delay(.. 타이머 API ( setTimeout, setInterval, clearInterval) 1. setTimeout(callback, millisecond) - 일정 시간 후에 함수 실행 - arguments : 실행할 callback함수, callback함수 실행 전 기다려야 할 시간(밀리초) - return값 : 임의의 타이머 ID setTimeout(() => {console.log('1초 후 실행'}, 1000) //1초 후, 콘솔창에 '1초 후 실행' 뜬다. 2. setInterval(callback, millisecond) - 일정 시간을 가지고 함수를 반복적으로 실행 - arguments : 실행할 callback함수, 반복적으로 함수를 실행시키기 위한 시간간격(밀리초) - return값 : 임의의 타이머 ID setInterval(() => {console.log('1초마다 실행.. 비동기 함수의 순서를 제어하는 방법 3. async & await //Producer function gotoCodestates(){ return new Promise ((resolve, reject) => { setTimeout(() => {resolve('1. go to codestates')}, 100) }) } function sitAndCode(){ return new Promise ((resolve, reject) => { setTimeout(() => {resolve('2. sit and code')}, 100) }) } function eatLunch(){ return new Promise ((resolve, reject) => { setTimeout(() => {resolve('3. eat lunch')}, 100) }) } function goToBe.. 이전 1 ··· 41 42 43 44 45 46 다음