본문 바로가기

분류 전체보기95

Npm Yarn CLI 단축 명령어 Npm (Node Package Manager) 노드 패키지 매니저 자바스크립트 프로그래밍을 위한 패키지 관리자 자바스크립트 런타임 환경 node.js의 기본 패키지 관리자 Yarn 의 장점 다운로드한 패키지 캐시 운영 병렬화 리소스 활용 극대화 설치 시간 단축 코드 실행전 설치된 패키지 무결성 확인 이전에 패키지 설치한 경우 오프라인으로 재설치 npm & yarn npm yarn 의미 npm init yarn init 초기화 npm install yarn 또는 yarn install package.json의 패키지 설치 npm install --save [package name] yarn add [package name] 의존성으로 추가 npm install --save-dev [package name.. 2020. 9. 21.
JS Pattern IIFE: Immediately Invoked Function Expression Self-Executing Anonymous Function 으로 알려진 디자인 패턴 즉시 실행 함수 표현: 정의되자마자 즉시 실행되는 Javascript Function ;(function() { statements })() 괄호((), Grouping Operator)로 둘러싸인 익명함수(Anonymous Function) 전역 스코프에 불필요한 변수를 추가해서 오염시키는 것을 방지, IIFE 내부안으로 다른 변수들이 접근하는 것을 막을 수 있는 방법이다. 즉시 실행 함수를 생성하는 괄호() 자바스크립트 엔진은 함수를 즉시 해석해서 실행한다. // 표현 내부의 변수는 외부로부터의 접근이 불가능하다. ;(function(.. 2020. 9. 21.
currentTarget Target 차이 currentTarget Target 차이 Difference Property Click the inner square Click outside of the inner square currentTarget Outer square Outer square target Inner square Outer square currentTarget 이벤트가 바인딩 된 요소 the element that the event was bound to. It never changes. In the sample code above, e.currentTarget is the element. target 사용자가 클릭 한 요소 사용자가 정확히 클릭하는 위치에 따라 원래 요소 또는 하위 요소가 될 수 있다. the element us.. 2020. 9. 21.
CSS variables How to use Custom properties CSS variables var() Custom properties (--*): CSS variables 사용자 지정 속성, 또는 "CSS 변수"의 값을 다른 속성의 값으로 지정할 때 사용 와 --같이 접두사가 붙은 속성 이름 은 함수를 사용하는 다른 선언에서 사용할 수있는 값을 포함하는 사용자 지정 속성 을 --example-name나타낸다. :root { --main-color: #488cff; --second-color: #ffff8c; } #firstParagraph { background-color: var(--first-color); color: var(--second-color); } 정의 : 사용자 지정 속성은 전용 표기법을 사용해 정의 .. 2020. 9. 21.
JS Map, Filter, Reduce How to properly use Javascript Map, Filter, and Reduce 자바스크립트 고차함수 map, filter, reduce 사용하기 Sample Player list Array const players = [ { id: 10, name: "Jan Vertonghen", status: "Goal keeper", totalMatch: 400, retired: true, }, { id: 2, name: "Paulo Wanchope", status: "Attacker", totalMatch: 200, retired: false, }, { id: 41, name: "Ronny Johnsen", status: "Goal keeper", totalMatch: 300, retired: .. 2020. 9. 21.

티스토리툴바