분류 전체보기 (269) 썸네일형 리스트형 [CSS] position의 display 수정 ▶ position의 display 수정 - position: absolute, position: fixed이 적용된 요소는 display 속성의 값이 대부분 block으로 수정됨. - cf. float 속성과 유사. float의 display 수정: developing-move.tistory.com/124 [CSS] float의 display 수정 ▶ CSS float 참조: developing-move.tistory.com/123 - float 속성이 추가된 요소는 display 속성의 값이 대부분의 경우 block으로 수정됨. - 의 전형적인 inline 속성. - 에 display: block; 적용 시 결과 화.. developing-move.tistory.com - position: stati.. [Node] Promise.race 사용해보기 promise.all과 문법이 유사 다른 점은 promise.all은 모든 promise가 완료될 때까지 기다리는 반면 promise.race는 가장 먼저 완료된(resolve)가 리턴 됨 예시 소스 'use strict' const promise1 = new Promise((resolve, reject) => { setTimeout(() => resolve(2000),2000) }) const promise2 = new Promise((resolve, reject) => { setTimeout(() => resolve('즉시'),0) }) Promise.race([promise1, promise2]).then(value => console.log(value)); [Node] promise.all 사용해보기 promise.all 이란? promise를 통해 비동기 처리할 때 다수의 promise가 완료될 때까지 모든 promise를 대기시키고 완료가 될 때 해당하는 값을 리턴 받을 수 있도록 하는 함수 배열 안에 있는 모든 promise가 완료될 때까지 기다렸다가 모두가 실행됐을 경우 값을 리턴 한가지 이상 혹은 다수의 비동기 promise에 대해서 모든 작업의 완료를 보장받을 수 있음 다양한 API를 호출하고 여러가지 데이터를 조합할 경우에 자주 쓰임 예시 const promise1 = new Promise((resolve, reject) => resolve('즉시 호출')); const promise2 = new Promise((resolve, reject) => { setTimeout(() => res.. [Node] File System 읽기와 쓰기(callback 방식과 async await 방식) callback 방식 'use strict' const fs = require('fs'); fs.readFile('test.txt', 'utf-8', (err, data) => { // 오류를 항상 먼저 핸들링 if(err) { console.log(err); return; } console.log(data); }); const content = 'something to write'; fs.writeFile('test.txt', content, err => { if(err) { console.log(err); return; } console.log('success'); }); callback 함수를 promise로 변경하여 파일을 읽고 쓰는 함수를 하나로 만듦 'use strict' const fs = .. [Node] node.js에서 DNS 주소 확인하기 DNS란? DNS 또는 Domain Name System은 사람이 읽을 수 있는 도메인 이름(예: www.amazon.com)을 머신이 읽을 수 있는 IP 주소(예: 192.0.2.44)로 변환 스마트폰이나 노트북부터 대규모 소매 웹 사이트의 콘텐츠를 서비스하는 서버에 이르기까지 인터넷상의 모든 컴퓨터는 숫자를 사용하여 서로를 찾고 통신합니다. 이러한 숫자를 IP 주소라고 합니다. 웹 브라우저를 열고 웹 사이트로 이동할 때는 긴 숫자를 기억해 입력할 필요가 없습니다. 그 대신 example.com과 같은 도메인 이름을 입력해도 원하는 웹 사이트로 갈 수 있습니다. 참조 : https://aws.amazon.com/ko/route53/what-is-dns/ DNS란 무엇입니까? – DNS 소개 - AWS .. [Node] EventEmitter EventEmitter란? 특정 이벤트가 발생했을 때 일괄적으로 로직을, 즉 특정 코드들을 실행할 수 있도록 구조적으로 코드를 작성하는 방법을 말한다. 해당 예시는 어떠한 사이트에 새로운 유저가 들어왔을 때 특정 이벤트가 실행된다고 가정한 것이다. 자세한 설명은 이미지의 주석을 확인 'use Strict' const EventEmitter = require('events'); class ChatManager extends EventEmitter { } const chatManager = new ChatManager(); chatManager.on("join", () => { console.log("new user joined"); }) chatManager.emit("join"); [Node] Promist Chainging, Promist.all Promise Chaining은 여러 개의 프로미스를 then으로 연결해주는 것이다. 테스트할 js 파일을 만들고 아래 소스를 추가한다. 아래 소스는 setTimeout을 사용하여 1초 후에 p1의 text를 찍고 3초 후에 p2의 텍스트를 찍는 소스다. 병렬적으로 실행 된다. (p1 실행 후 3초 뒤가 아닌 처음 실행 기준에서 3초) const p1 = new Promise((resolve, reject) => { setTimeout( () => { resolve({ p1_text : "p1의 텍스트"}); }, 1000); }); const p2 = new Promise((resolve, reject) => { setTimeout( () => { resolve({ p2_text : "p2의 텍스트"}.. [CSS] position과 요소의 쌓임 순서 ▶ position과 요소의 쌓임 순서 - stack order? 요소가 쌓여 있는 순서를 통해 어떤 요소가 사용자와 더 가깝게 있는지(더 위에 쌓이는지)를 결정. z축. - z축: 우리의 시선과 동일한 축을 가짐. 눈에 보이지는 않지만 무언가가 더 앞에 있거나 뒤에 있는 개념. [요소의 쌓임 순서] 1. static을 제외한 position 속성의 값이 있을 경우 위에 쌓임. 값은 무관. - relative, absolute, fixed, sticky 중 값에 상관 없이 특정 값이 있으면 일단 위에 쌓이는 것. 2. position이 모두 존재한다면 z-index 속성의 숫자 값이 높을수록 위에 쌓임. 3. position 속성의 값이 있고 z-index 속성의 숫자 값이 같다면 HTML의 마지막 코드.. 이전 1 ··· 13 14 15 16 17 18 19 ··· 34 다음
