목록분류 전체보기 (69)

기억하기 위한 기록

ErrorBoundary

리액트는 렌더링시 오류가 발생할 경우 오류가 발생했떤 일부 컴포넌트만 렌더링을 하지않는 것이 아니라 전체 화면 모두를 아예 렌더링하지 않는다. 잘못된 화면을 사용자에게 보여주는 것 보다는 아예 보여주지 않는것이 더 나은 사용자 경험이라는 판단에서이다. 오류를 만나면 흰화면을 보여주는 것이 그 떄문이다. 예기치 못한 오류가 발생할 경우에 대한 대비책으로서 적어도 흰화면보다는 준비도니 시스템 장애화면을 보여주는 것이 조금더 나은 UX임에는 분명하다. 이렇게 시스템 장애 화면을 따로 정의하여 보여주고자 한다면, 아래 ErrorBoundary 컴포넌트를 이용할 수 있다. ErrorBoundary는 클래스 컴포넌트의 componentDidCatch 생명주기 함수를 이용하여 아래와 같이 작성할 수 있다. 나는 먼저..
Front-end/react 2021. 11. 18. 13:17
git clone시 오류

오류 및 에러 2021. 11. 10. 22:16
react/portfolio

ityped 사용하여 타이핑효과 주기 npm install ityped https://www.npmjs.com/package/ityped ityped Dead simple animated typing, with no dependencies. www.npmjs.com
Front-end/react 2021. 10. 16. 03:09
Netflix / Featured

1. home 에 있던 이미지를 Feaured 컴포넌트의 div안으로 이동시키고, home에서 지운다. 2. info 생성 3. info 의 위치를 absolute로 변경하여 메인이미지 위로 얹는다. https://developer.mozilla.org/ko/docs/Web/CSS/position position - absolute 요소를 일반적인 문서 흐름에서 제거하고, 페이지 레이아웃에 공간도 배정하지 않습니다. 대신 가장 가까운 위치 지정 부모 요소에 대해 상대적으로 배치합니다. 단 부모중 위치 지정 요소가 없다면, 초기 컨테이닝 블록을 기준으로 삼습니다. 최종위치는 top, right, bottom, left 값이 지정합니다. z-index의 값이 auto가 아니라면 새로운 쌓임 맥락을 생성합니다..
Front-end/react 2021. 10. 13. 01:30
이전 Prev 1 ··· 3 4 5 6 7 8 9 ··· 18 Next 다음