17일차
오늘부터는 다시 집중해서 기본기부터 탄탄하게 만들 수 있을 것 같다. 과제를 하며 부족하다고 생각했던 개념들과 잘 정리가 되지 않았던 ES6 문법과 SCSS, 번들러에 대해서도 차근차근 공부를 해나가볼 예정이다.
오늘 공부할 목록
- Class문법
- 스타벅스 홈페이지 SCSS을 이용해 컴포넌트 형식으로 만들어보기 ing
새로 배운 내용 짧게라도 정리를 해보기컴포넌트 나누는 방법과 전역변수관리▶ 컴포넌트Axios를 이용한 News API 통신▶데이터 가져오기 실습(axios이용)무한 스크롤(Infinite Scroll)을 사용해 페이지네이션 기능을 구현▶Intersection Observer APIProxy와 옵저버 패턴을 이용한 전역관리
typescript
새로 배운 내용
- ▶ 웹앱? 하이브리드앱? 네이티브 앱?이란
- ▶transition, transform, animation 정리
img태그의 경우inline요소로 기본적인baseline을 가지기 때문에 아래 여백이 생길 수 있습니다. 이를 제거하기 위해display: block과 같이 display 속성을 변경한 후 배치를 하는 것이 좋습니다.- script태그가 HTML구조 분석 후 동작하도록 만드는 세가지 방법(1번권장)
<head>안에 있는<script>에 defer 속성을 추가해서 브라우저가 JS를 HTML 구조를 분석한 이후에 동작하도록 설정<script>를 HTML 구조가 끝나는 위치</body>앞에 직접 작성해서 브라우저가 JS를 HTML 구조를 분석한 이후에 동작하도록 설정- HTML 구조를 분석한 이후의 JS 이벤트(load) 핸들러로 JS를 작성하는 방법
<script>에async속성을 사용해도 비슷하게 동작할 수는 있지만, 이 속성은 HTML 구조를 분석하는 중(병렬 실행)에 JS가 동작하며, HTML 구조를 중간에 이해하지 못할 수 있으니, 이 문제를 해결하는 방법으로는 권장하지 않음
공부가 필요한 부분
- polyfill 공부하기
- CORS란?
- cubic-bezier란?
- 애니메이션 보충 공부 필요
- ES6문법과 웹팩
하루를 마무리하며
오늘 강의 중 가장 와닿았던 부분이 어떤 부분을 구현해보려고 하면, 그 전에 깔려있는 바탕배경들을 습득하는데 더 많은 시간이 걸린다는 부분이었다. 최근 하나씩 하나씩 강의 커리큘럼이 아니라 개발지식들을 습득하며 얻는 정보들이 많게 되고 있는데 그만큼 배경지식이 잘 다져지고 성장해나갈 수 있기를 기대해본다.😍
0seo