오늘의 CODE

MDN의 공식문서에 따르면 REST는 효율적, 안정적이며 확장 가능한 분산 시스템을 구현하는 소프트웨어 아키텍처 설계 제약의 모음을 나타낸다고 하며, 그 제약들을 준수했을 때 그 시스템은 RESTful하다고 일컬어진다고 한다. REST에 대한 설명 글은 많이 있지만, 사실 딱하니 머리속에 박히지 않았다. 알것도 같고 모를 것도 같고... 그러다 찾은 설명으로 REST는 HTTP URI를 통해 자원(resource)를 명시하고 HTTP Method(POST, GET.. etc)를 통해 해당 자원에 대한 CRUD operation을 적용하는 것으로 REST의 중심에 자원(resource)이 있고 HTTP Method를 통해 자원을 처리하도록 설계된 아키텍처를 의미한다고 했다. 웹에 존재하는 모든 자원(이미지..

JavaScript 객체의 분류 1) 표준 빌트인 객체 (standard built-in objects/native objects/global objects) ECMAScript 사양에 정의된 객체로 전역의 공통 기능을 제공한다. 표준 빌트인 객체(표준 내장 객체)는 전역 객체의 프로퍼티로 제공되며 별도의 선언없이 전역 변수처럼 언제나 참조할 수 있다. 2) 호스트 객체 (host objects) 자바스크립트 환경(브라우저 or Node.js 환경)에서 추가로 제공하는 객체를 말한다. 브라우저 환경에서는 클라이언트 사이트 Web API를 호스트 객체로 제공한다. (Web API 예시 - DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SV..

github page를 만들기 위해 Ruby 버전을 확인한 후 Ruby의 패키지 매니저인 gem을 사용해 jekyll을 설치한다. # 버전 확인 ruby -v # ruby 2.6.8p205 (2021-07-07 revision 67951) [universal.x86_64-darwin21]와 같은 형태로 버전이 출력됨 # jekyll 설치 gem install jekyll bundler 🚨 Error 1. 에러가 발생했다. ERROR: While executing gem ... (Gem::FilePermissionError) You don't have write permissions for the /Library/Ruby/Gems/2.6.0 directory. macOS는 기본적으로 system Ruby가..

◇ SVG란? SVG(Scalable Vector Graphics)는 2차원 벡터 그래픽을 서술하는 XML 기반의 마크업 언어로 CSS, DOM, JavaScript 등 다른 웹 표준과도 잘 동작하도록 설계되었다. JEPG, PNG 등 고전적인 비트맵 이미지 형식과 비교했을 때 SVG 형식의 벡터 이미지는 손실이나 품질 저하 없이 모든 크기에서 렌더링이 가능하며 그래픽 편집툴 없이도 파일 내의 텍스트를 수정해서 쉽게 수정할 수 있다. 참고. SVG 요소 referencce - https://developer.mozilla.org/ko/docs/Web/SVG/Element SVG Attribute reference - https://developer.mozilla.org/ko/docs/Web/SVG/Att..

Promise의 3가지 상태 (states) Pending(대기) - 비동기 처리 로직이 아직 완료되지 않은 상태 Fullfilled(이행) - 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태 Rejected(실패) - 비동기 처리가 실패하거나 오류가 발생한 상태 대기(Pending) 중인 promise는 값과 함께 이행할 수도, 어떤 이유(error)로 인해 거부 될 수도 있다. 이런 경우, promise의 then 메서드에 의해 대기열(큐)에 연결된 관련 이벤트가 호출된다. 해당 핸들러가 연결될 때 promise가 이미 이행됬거나 거부된 경우, 핸들러가 호출되므로 비동기 작업 완료와 연결 중인 핸들러 사이에 경합 조건은 없다. Promise.prototype.then() 및 Promise...

*비동기 처리 - 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행함. Promise 객체는 ES6에 도입된 기능으로 비동기 작업에 대한 결과(실패, 성공)를 나타내는 객체이다. 기본적으로 Promise는 함수에 콜백을 전달하는 대신 콜백을 첨부하는 방식의 객체이다. const myPromise = new Promise((resolve, reject) => { // code here }) [예시1] 비동기로 음성파일을 생성해주는 createAudioAsync(음성 설정 정보, 음성파일 생성 시 콜백함수, 음성파일 생성 실패 시 콜백함수)라는 함수가 있다고 가정해보자. // createAudioAsync() - 비동기로 음성 파일을 생성해주는 함수 // audioSetting(음성 설..

ES6 부터 등장한 Spread Operator는 점 3개가 연달아 붙어 있는 표시로 mdn에서는 전개구문으로 검색 시 결과를 확인할 수 있으며, 배열, 함수, 객체 등을 다루는 데 있어서 새로운 기능을 제공한다. 기본 문법 스프레드 연산자를 사용하면 배열, 문자열, 객체 등 반복 가능한 객체(Iterable Object)를 개별요소로 분리할 수 있다. // Number const arr1 = [1, 2, 3, 4, 5]; const arr2 = [...arr1, 6, 7, 8, 9]; console.log(arr2); // [1, 2, 3, 4, 5, 6, 7, 8, 9] // String const str1 = "bitter sweet"; const str2 = [...str1]; console.lo..

Instruction. Write an algorithm that takes an array and moves all of the zeros to the end, preserving the order of the other elements. 배열 요소 중 0을 제외한 나머지 요소의 순서를 유지하면서, 배열에 포함된 0을 모두 마지막으로 이동 시키는 알고리즘을 완성하라. Example. moveZeros([false, 1, 0, 1, 2, 0, 1, 3, "a"]) // returns [false, 1, 1, 2, 1, 3, "a", 0, 0] Solution. function moveZeros(arr) { return arr.filter(function(x) {return x !== 0}) .concat..

디파이(De-fi) 탈중앙화 금융(Decentralized-Finance)를 일컫는다. 중앙화된 금융시스템을 탈피하는 것을 목적으로 만들어졌다. 덱스(DEX) 탈중앙화거래소(Decentralized-Exchange)의 준말. 디파이에서 거래하는 기능을 말한다. 요즘엔 디파이와 덱스를 같은 뜻으로 혼용해서 쓰기도 한다. 반대말은 CEX(중앙화 거래소) 스마트 컨트랙트 사전에 협의된 내용으로 미리 프로그래밍 하여 전자 계약서 문서 안에 넣어두고, 계약 조건이 모두 충족되면 자동으로 계약 내용이 실행되도록 하는 시스템이다. 가스(Gas) 네트워크에서 거래를 실행하는데 필요한 수수료의 단위. 가스 가격은 gwei로 표시된다. 이더리움에서 1 gwei는 0.000000001 이더이다. 이더리움은 거래가 많아지면서..

Instructions. The main idea is to count all the occurring characters in a string. If you have a string like aba, then the result should be {'a': 2, 'b': 1}. What if the string is empty? Then the result should be empty object literal, {} 중요한 것은 모든 숫자열의 숫자를 세는 것이다. 예를들어 aba 라는 문자열이 있을 경우, {'a': 2, 'b':1} 이라는 산출물을 가지게 될 것이다. 빈 문자열의 경우 빈 객체 리터럴을 반환해야 한다. Solution. function count(string) { const arr ..