ssjeu_

Emmet 이란? 강력한 자동완성 기능 등으로 HTML 작성 속도를 크게 향상시켜주는 플러그인 Emmet 문법 1. 요소(Elements) 생성 - 생성하려는 요소의 이름 입력 후 Tab을 누르면 태그가 자동 생성된다. html:5[tab] - Emmet에는 미리 정해진 태그 이름이 없기에 아무 이름으로나 태그를 생성 가능 helloworld[tab] 2. 구조화 하기 (Nesting operators) - 요소들의 구조를 간편히 생성 가능하다. 자식 요소: > 를 사용하여 생성 div>ul>li 형제 요소: + 를 사용하여 생성 div+p+bq 3.한 단계 올리기 - ^ 를 사용하여 한 단계 위에 요소 배치 div+div>p>span+em^bq 4. 반복하기 - * 를 사용하여 원하는 만큼 출력 ul>..

React에서 반응형 레이아웃을 구현하기 앞서 레이아웃을 어떻게 나눌 수 있는지 매번 고민이 있었다. 디자이너가 보통 정해주는데로 작업을 진행하겠지만, 다양한 크기의 디바이스에 따른 화면 구현이 이제는 필수적이기 때문에 해당 개념 정리가 필요하다고 생각한다. 이번 기회에 레이아웃의 종류가 어떻게 이루어져있는지와 리액트에서 반응형 레이아웃 구현에 대해 정리해보겠다. (해당 포스트는 레이아웃의 종류만 다룬다.) 1. 반응형 웹이란? (Responsive Web Sites) 반응형 웹이란 디바이스 종류에 따라 웹페이지의 크기가 자동적으로 재조정 되는 것을 말한다. 어떠한 환경에서도 그에 맞게 사이즈가 변화되어 사용자가 보기 편하며, 오직 하나의 HTML 소스 만으로 특정 장치에 최적화된 환경을 사용자에게 제공..