WEB 32

[Node.js] 6. fs 모듈 (파일 읽기, 쓰기, 편집, 제거)

fs모듈 fs는 FileSystem의 약자로, fs 모듈은 Node.js에서 파일 입출력 처리를 할 때 사용한다. fs 모듈을 불러오기 위해 다음 코드를 작성한다. // 1. CommonJS Modules const fs = require("fs"); // 2. ES Modules import fs from "fs"; 지난번에 Node.js를 공부하면서 (링크) 모듈을 불러오는 방법으로 require 함수를 배워서 글을 작성했는데, ES6(ES2015) 부터는 import / export 라는 방식으로 모듈을 불러올 수 있다. import/export는 require 와는 다르게 모듈의 특정 부분만 불러올 수 있다는 장점이 있다. 다만, ES모듈을 사용하는 경우에만 import / export를 사용할 ..

WEB/🌳 Node.js 2022.07.29

[Node.js] 5. 서버 실행하기

Node.js에서 서버 실행하기 const http = require('http'); const port = 3000; const hostname = '127.0.0.1'; const server = http.createServer(function (request, response) { response.writeHead(200); response.end('Hello, Node.js!\n'); }) server.listen(port, hostname, () => { console.log(`Server running at http://${hostname}:${port}/`); }); app.js 파일에 위 소스코드를 입력하고 터미널에서 'node app.js'를 입력해서 실행시킨 뒤, http://local..

WEB/🌳 Node.js 2022.07.28

[Node.js] 4. 동기 / 비동기

1. 동기(Synchronous)와 비동기(Asynchronous) Node.js의 특징은 비동기 처리를 고려해서 만들어졌다는 점이다. 그렇다면 동기는 뭐고 비동기란 무엇일까? - 동기(Synchronous) 동기는 한번에 한가지 작업을 하는 것으로, 앞의 작업이 끝나야 다음 작업으로 넘어가는 방식이다. 자세히 설명하면 요청을 보낸 후, 요청에 대한 응답을 받아야 다음 작업을 실행하는 것이다. 일반적인 많은 프로그램이 이와같은 방법으로 실행된다. - 비동기(Asynchronous) 비동기는 요청을 보낸 후, 응답에 상관 없이 다음 동작을 실행하는 것이다. 즉, 다음 동작을 실행하고 있을 때, 앞의 동작이 끝나지 않았으면 앞의 동작과 함께 다음 동작이 실행된다. 비동기 작업의 효율성을 알기 위해 A(실행시..

WEB/🌳 Node.js 2022.07.28

[Node.js] 3. 모듈 만들기, 불러오기 (export, require)

모듈이란? Node.js으로 앱을 개발하기 위해서는 모듈 시스템을 사용한다. 이때, 모듈이란 ‘미리 만들어둔 함수들의 집합’이라고 할 수 있다. Node.js에서의 모듈은 2가지(코어 모듈, 파일 모듈)로 분류할 수 있다. 1. 코어 모듈 (Core module) 코어 모듈은 Node.js에서 기본적으로 제공하는 모듈이다. http, fs 등의 모듈이 기본적으로 제공되는 코어 모듈에 속한다. 2. 파일 모듈 (File Modules, Local Module) 코어 모듈을 제외한 모듈은 파일 모듈이라고 부른다. 직접 모듈을 생성하는 경우도 당연히 파일 모듈에 속한다. 모듈을 직접 생성하기 위해서는 exports 객체를 사용하고, 모듈을 불러오기 위해서는 require() 함수를 이용한다. 이해를 돕기 위해..

WEB/🌳 Node.js 2022.07.27

[Javascript] 역따옴표(백틱)을 이용한 템플릿 리터럴(template literal)

자바스크립트의 문자열 자바스크립트에서 문자열을 감싸는 따옴표로 '작은따옴표' , "큰따옴표" , `역따옴표(백틱)` 을 사용할수있다. let A = '작은따옴표'; let B = "큰따옴표"; let C = `역따옴표`; console.log(A); // 작은따옴표 console.log(B); // 큰따옴표 console.log(C); // 역따옴표 이중에서 작은따옴표와 큰따옴표는 차이가 없고, 역따옴표는 Javascript ES6에서 추가된 템플릿 리터럴에 쓰인다. 템플릿 리터럴(template literal) 템플릿 리터럴은 역따옴표(`)로 감싼 문자열 중간에 ${…}로 감싼 표현식을 표현하는 기능이다. 우선 기존의 문자열로 표현식을 표현하는 방법을 확인해보자. let A = 1 let B = 2 c..

WEB/💡 Javascript 2022.07.27

[Javascript] '=='와 '==='의 차이점

자바스크립트를 처음 공부했을 때 가장 생소했던 것 중 하나는 비교 연산자 '==='였다. 일반적으로 다른 언어에서 비교연산자로 '=='만 쓰는 것과는 달리, 자바스크립트는 비교연산자로 '=='(동등 연산자)와 '==='(일치 연산자)를 구분해서 사용한다. 쉽게 두 연산자의 차이를 설명하면 '==' 는 값만 비교하지만, '===' 는 값과 자료형을 함께 비교한다. 값만 비교한다는 것이 잘 이해가 안 될 수 있는데, 이는 자바스크립트의 특성 때문이다. 예를 들어, 자바스크립트에서는 1 == "1" 의 결과는 true이다. 자바스크립트에서 '=='의 경우 알아서 비교하는 내용의 형식을 변환해서(형변환 비교) 비교한다. 그렇기 때문에, 자바스크립트는 문자열 "1"을 숫자 1로 변환해서 비교해버린다. 따라서, 다..

WEB/💡 Javascript 2022.07.27

[Node.js] 2. Query String의 개념과 사용방법

Query String의 개념과 구조 1. Query String 이란? 개념을 간단하게 설명하면, 쿼리스트링은 사용자가 입력 데이터를 전달하는 방법 중의 하나로, url 주소에 미리 협의된 데이터를 파라미터를 통해 넘기는 것을 말한다. http://~~~/path?querystring 위와 같이 쿼리 스트링은 URL에서 ? 다음에 오는 내용이다. 이름을 해석하면 간단한데 Query(질문) String(문자열) 즉, ? 뒤에 나오는 문자열이라는 뜻. 2. Query String의 구조 (예시) http://~~~/path?키1=값1&키2=값2&키3=값3 위와 같이 쿼리스트링은 key=value 형식으로 구성되어있고, 여러 개를 사용하려면 '&'을 사용하면 된다. 위의 예시는 3개의 쿼리스트링을 보내고 있..

WEB/🌳 Node.js 2022.07.27

[Node.js] 1. 소개 및 설치방법

Node.js란? 크롬 V8 엔진 (오픈 소스 JavaScript 엔진)을 이용해 브라우저 밖에서 JavaScript로 서버 구축 등의 작업을 가능하게 하는 소프트웨어 플랫폼이다. Web Browser의 기능을 HTML문법으로 불러와 Web Application을 만드는 것처럼, Node.js runtime의 기능을 Javascript 문법으로 불러와 Node.js Application을 만든다. ( * runtime : 프로그래밍 언어가 구동되는 환경 ) Node.js 설치 방법 (for Windows) 1. 설치 링크 https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 Ja..

WEB/🌳 Node.js 2022.07.26

[Javascript] 아코디언 메뉴 만들기 (접기/펼치기 기능 구현)

, 태그를 이용해서 편하게 내용을 접고 펼치는 기능을 구현할 수 있지만,좀 더 다양한 기능 (특정 조건에서 펼치기, 하나만 펼쳐지게 하기 등)이 필요해서 자바스크립트를 이용해서 구현하는 방법을 찾았다. 기초적인 내용은 아래 링크를 통해 구현했다.https://www.w3schools.com/howto/howto_js_collapsible.asp How To Create a CollapsibleW3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java,..

WEB/💡 Javascript 2022.07.20

[Javascript] getElementsByClassName과 querySelectorAll의 차이 (HTMLCollection과 NodeList의 차이)

객체를 불러오기 위해 사용하는 getElementsByClassName과 querySelectorAll의 차이를 간단히 요약하면, 1. getElementsByClassName(그리고, getElementsByTagName)은 HTMLCollection을 반환하고, 2. querySelectorAll은 NodeList를 반환한다. 3. 일반적으로, getElementsByClassName이 더 빠르다고 한다. 우선 자바스크립트에서 객체에 접근하는 방법을 알아보자. 1. getElementById("id") → id 값이 "id"인 첫번째 객체를 리턴한다. 2. getElementsByTagName("div") → 태그 이름이 "div"인 모든 DOM 객체들을 찾아 컬렉션 리턴한다. 3. getElemen..

WEB/💡 Javascript 2022.07.14