JavaScript

Module import export 키워드로 내보내진 변수, 함수 등등을 불러올 수 있는 키워드 import를 사용하면 스크립트 의존성을 훨씬 간편하게 관리할 수 있다 module-name 내에 export default로 내보내진 것을 가져온다 import defaultExport from "module-name"; module-name 내에서 export된 모든 것을 모두 가져오고 as 이후 이름은 중복되지만 않으면 자유롭게 정할 수 있다 import * as allItems from "module-name"; module-name 내에서 export된 것 중에 특정 값만 가져온다 import { loadItem } from "module-name"; module-name 내에서 export된 것 ..

컴포넌트 방식으로 생각하기 컴포넌트 만들기 - TodoList UI를 선언적으로 표현하기 위해 다음과 같이 추상화를 할 수 있다 App ㄴ Header ㄴ TodoForm ㄴ TodoList 여기서 Header, TodoForm, TodoList는 서로 독립적인 하나의 단위로 구현되는데 이를 컴포넌트라고 한다. 각각의 컴포넌트는 동작이 독립적으로 돌아가고 사용하는데 다른 곳에 영향을 주지 않는다 컴포넌트화가 되어 있으면 컴포넌트 부분만 코드를 수정하면 되어서 재사용이 쉽고 유지보수하기 좋다 Client 사이드 데이터 저장하기 Cookie 쿠키는 브라우저에 저장되는 작은 문자열로, RFC 6265 명세에서 정의한 HTTP 프로토콜의 일부 다른 저장 방법에 비해 가장 오래된 방식 Cookie 추가하기 : 이..

명령형 프로그래밍 컴퓨터가 수행할 명령들을 순서대로 써 놓은 것 "어떻게 구현하는가(어떤 방법으로 하는가)"를 디테일하게 기술하는 것에 관점이 가있다 선언형 프로그래밍 "무엇을 나타내야 하는가"에 관점이 가있다 명령형 프로그래밍 vs 선언형 프로그래밍 예시 1 //명령형 function double(arr) { //array의 값을 어떻게 가공할 것인가 let results = []; for(let i = 0; i < arr.length; i++) { // 어떻게 처리하는지에 대한 묘사 if (typeof arr[i] === 'number'){ results.push(arr[i] * 2); } } return results; } //선언형 function double(arr) { // map으로 어떠한 ..

HTML(Hyper Text Markup Language) HTML5 영상과 음성을 처리하기 위한 멀티미디어 요소가 추가되었다 (audio, video, canvas) 구조적인 요소 추가 (header, nav, article, section, aside, footer) 표현을 담당하던 태그가 삭제되고 의미를 담은 태그가 추가되었다 s -> del b -> string 등 CSS CSS3 태그 적용 inline 이용 외부 파일을 만들어 link 태그를 통해 불러옴 DOM(Document Object Model) 문서 객체 모델 Model : 현실에 있는 것을 특정 관점에서 바라보아 객체로 만드는 것 DOM은 왜탄생했을까? javascript가 탄생하면서 같이 등장 HTML 문서와 상호작용이 가능하게 되었..