FrontEnd

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.화살표 함수간략하게 함수를 선언시킨다.(x, y) => { ... } 방식으로 선언     🎈참고자료https://poiemaweb.com/es6-arrow-function

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.템플릿 한번에 여러줄의 문자열을 입력받을수있다. ` 를 사용한다.

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.letvar키워드를 통한 함수레벨 스코프를 가지는것 대신 let 키워드를 사용하여다른 언어처럼 블록레벨 스코프를  지원할수있다.    2.const상수를 위해 사용(재할당 불가능 = 선언과동시에 할당)블록레벨 스코프를 갖는다하지만 const의 타입이 객체일때 객체의 프로퍼티는 변경가능하다.const me={age:20};me.age=10;document.write(me.age+"")    🎈참고자료https://poiemaweb.com/es6-block-scope

1.수평정렬 1 2 3 inline요소 1 2 3 블록요소 1 2 3 flex 1 2 3   1 2 3 inline요소 1 2 3 블록요소 1 2 3 flex 1 2 3 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스     2.수직정렬 ..

1.flexdisplay: flex; justify-content: space-around;로 요소를 동적으로 변화할때 유연한 레이아웃을 구현할수있다. 1 2 3 4 1 2 3 4 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스      2.Flexbox  속성2-1.flex-direction row(기본값) 1 2 3 4 row-reverse 1 2 3 4 column 1 2..

1.반응형 레이아웃layout을 방문자의 화면 해상도를 고려해서 만드는것    2.viewport웹페이지의 가시영역을 의미 디바이스의 특성과 디바이스의 화면 크기 등을 고려하게한다.       3.@media서로 다른 미디어 타입에 style을 지정할수있게한다.@media 미디어_타입 and (조건) { /* 조건이 만족될 때 적용될 CSS 스타일 */} 3-1.미디어 타입all : 모든것print :인쇄secreen : 화면기반장치(컴퓨터,태블릿,스마트폰) 3-2.조건width / height: viewport의 너비와 높이min-width / max-width: 최소/최대 너비min-height / max-height: 최소/최대 높이orientation: 화면의 방향 (portrait 또는 l..

1.Header, Navigation Bar 메뉴1 메뉴2 메뉴3 메뉴4 Aside 부가정보1 부가정보2 부가정보3 부가정보4 ..

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1. SPA (Single Page Application)단일 페이지에서 페이지를 갱신하여 View를 바꿔 사용자에게 여러 페이지를 보는것같은 경험을 하게한다.  2. Routing사용자가 태스크를 수행하기 위해 어떤 화면에서 다른 화면으로 화면을 전환하는 내비게이션을 관리하기 위한 기능(URL이동, 태그 이동, 뒤로가기,앞으로가기)      🎈참고자료https://poiemaweb.com/js-spa