2022.04.28

● 계획

다양한 CSS 셀렉터 규칙을 이해할 수 있다

레이아웃을 위한 HTML을 만들 수 있다

다음의 속성들에 대한 이해를 바탕으로 Flexbox를 이용해 레이아웃을 만들 수 있다

방향 : flex-direction

얼마나 늘릴 것인가? : flex-grow

얼마만큼의 크기를 갖는가? : flex-basis

수평 정렬 : justify-content

수직 정렬 : align-items

만들고 싶은 앱의 와이어프레임을 그려볼 수 있다.

와이어프레임만 보고 HTML로 코딩할 수 있다.

div 태그 또는 section, header 등의 시맨틱 태그로 영역을 구분하는 이유를 이해할 수 있다.

HTML 문서에서 언제 id 혹은 class를 사용해야 하는지 이해할 수 있다.

오늘 배웠던 것들은 전부 처음 보는 것들이었다

CSS 셀렉터 규칙이 그렇게 많은 줄 몰랐고

레이아웃, 특히 flexbox를 이용한 다양한 활용법이 있는 것도 새로웠다

와이어 프레임을 이용해서 대략적으로 구현하고 싶은 도안을 그려내보았는데

설계하는 것 같아서 재밌었다

와이어 프레임을 보면 HTML로 어떻게 구성해야 하는지 대략적으로 연습을 해봤지만

바로 바로 작성해나가기에는 연습이 부족한 것 같았다

시맨틱 태그로 영역을 구분하는 이유도 와이어프레임과 박스 구조를 보면서 깨달았다

id와 class에 관해선 동기분들과도 엄청 열심히 이야기를 했었는데

결국 아직 안 배운 영역에서 결정적인 이유가 드러난다 라는 것이 결론이었다