📌 오늘 한일
프론트엔드 데브코스(Day49)
- core time 참석
- 데일리 스크럼
- React 강의 수강
개발자로서 고민
- 기업 탐색 및 테스트 종류 파악
📌 배운 것
강의
- 여러 종류의 컴포넌트 및 사용자 정의 Hook을 어떻게 만드는 지 배웠음
- 컴포넌트 => Input, Flux, Breadcrumb
- 사용자 정의 Hooks => useHover, useScroll
passive 속성
- 브라우저는 preventDefault 메소드를 check 하게 되는데
passive를 true로 설정하게 되면 check를 하지 않음 - scroll event가 발생될 때 passive를 true로 설정하는 것이 성능 향상의 방법 중 하나임
- passive를 true로 설정하게 되면 이벤트 발생 시 호출되는 메소드는 preventDefulat를 사용할 수 없음
element.addEventListener("scroll", handleScroll, {passive: true});스크롤 성능 향상
- 브라우저는 스크롤 시에 re-flow를 하는데 이 부분에 있어
requestAnimationFrame함수를 사용하게 되면 성능을 향상 시킬 수 있음
📌 어려웠던 점
오타를 조심
- Flux component 강의를 듣고 있는데 story book에 컴포넌트가 생성이 되지 않는 문제 발생
- compnent는 정상적으로 생성되었지만 Col component의 자식 component인 Box component가 rendering 되지 않는 문제 발생
- 코드를 자세히 읽어보니 Row component의 styled-component로 지정한 태그가 div가 아닌 row가 되어있어서 component 생성이 되지 않았음
- Box component가 rendering 되지 않는 문제는 style props의 배경색 속성명에 오타 문제
📌 내일 공부 하는 것들에 있어 이유
- 강의를 듣는 이유 =>
=> React 라이브러리를 잘 사용해야 UI 및 사용성이 좋은 웹 사이트를 제작할 수 있음
=> React의 Hook, component에 있어 강사님이무엇을 만들고, 어떻게 만들고, 왜 만드는지를 숙지함으로 내가 제작하고 싶은 웹사이트의 사용성 및 UI를 향상 시킬 수 있고 제작 전 고민의 깊이가 더 깊어질 수 있음 - 주간 발표를 하는 이유
=> 평소에 어떻게 사용하는지만 알고 있는 개념을 왜 사용하고 조금 더 디테일하게 알아야 내가 제작할 웹 사이트에 적용 시킬 수 있기 때문 => 그저 가져다 쓰기만 한다면 사용자가 원하는 좋은 웹사이트를 제작함에 있어 한계가 있음 - 기업을 찾는 이유 => 기업이 원하는 사람은 말 그대로 기업이 원하는 기술, 협업 방식, 지식 등을 갖추고 있는 사람 => 기업을 조사해야 그런 사람이 될 수 있음 => 그런 사람이 되지 못하면 취업을 할 수 없음
한줄평
오늘도 수고했어.
