잡부생활/프로그래밍 (4) 썸네일형 리스트형 CSS flex, grid 정리 주로 사용하는 엘리먼트 div: 개행 처리(display: block) section: 개행 처리(display: block) a: 개행 X(display: inline) span: 개행 X(display: inline) display block은 크기 조절이 가능 inline은 크기 조절이 불가능 inline-block은 인라인과 블록 속성을 동시 display: flex flex는 container에 적용 flex-direction: row(기본), column flex-wrap: wrap(브라우저 스크롤에 따라 정렬) justify-content: flex-start(기본), flex-end, center, space-between, space-around (row 정렬) align-items: s.. ES6, 7, 8 정리 [1] Variables 1. Var - var는 더이상 쓰지마라. - const를 써라. 대신 const의 하위 오브젝트 제어는 가능. - let도 지양 하지만 오브젝트를 변경해야 할 일이 있을 변수에는 사용. 그래도 웬만하면 const. 2. Hoisting / Block Scope - 지겨운 호이스팅 - const, let 사용 시 호이스팅에 트랩에서 빠져 나올 수 있음 3. Block Scope - f a{ f b{}} a에서 b의 object로 접근할 수 없고, b에서 a는 가능 - 당연히 if, for 등 {} 버블 내에서는 모두 적용 4. 정리 - const, let, hoisting, block scope를 기억해라. [2] Functions 1. Arrow Functions const n.. Babel 6/7 후아 이틀 삽질한 내용.... 1. Error: only one instance of babel-polyfill is allowed babel을 전역변수로 단 한 번의 정의만 가능하므로, 어딘가에 너는 babel-polyfill을 import 하고 있을 것이야.. 2. ReferenceError: regeneratorRuntime is not defined async function myFunc(){} -> const myFunc = async function(){} 3. Runtime Error 문제(.babelrc) @babel/transform-runtime 플러그인 추가 { "presets": [["@babel/preset-env"]], "plugins": [["@babel/transform-ru.. Node Callback / Promise / async&await Callback 문제 예시 const posts = [{ title: "Post One" }, { title: "Post Two" }]; function getPosts() { setTimeout(() => { let output = ""; posts.forEach((post, index) => { output += post.title + "\n"; }); console.log(output); }, 1000); } function createPost(post) { setTimeout(() => { posts.push(post); }, 2000); } getPosts(); createPost({ title: "Post Three" }); Callback 해결 const posts = [{ title: "P.. 이전 1 다음
