# useNetwork

4개의 포스트
post-thumbnail

Hook 사용예제: useFadeIn, useNetwork

useRef훅을 이용하여 element를 참조하고 fade와 delay기능을 구현하였다.opacity와 delay가 각각 (1,2) (5,10)로 적용된 것을 알 수 있다.

2021년 9월 19일
·
0개의 댓글

[React] React 중급 - 실무에서 활용할 수 있는 hooks 애니메이션 / 네트워크 상태감지 함수 구현하기 (*useEffect 활용)

요소가 화면에서 서서히 나타나도록 하는 함수 (style opacity를 이용)tag 내부의 style option에 opacity를 넣어 투명도를 조절할 수 있다.CSS이므로 이중괄호({{}})를 넣어야 구현할 수 있다.투명도는 낮을 수록 투명하고, 높을 수록 불투명

2021년 8월 24일
·
0개의 댓글

[React] React 중급 - 실무에서 활용할 수 있는 경고/확인창 함수 구현하기 2 (*useEffect 활용)

마우스 커서가 특정 탭, 범위를 벗어났을 때 메시지를 전달하는 함수화면이 rendering 되었을 때 Window에 mouse가 페이지 범위를 벗어났을 떄의 이벤트를 add하고, 해당 이벤트가 발생하면 log를 출력하는 함수를 먼저 구현한다.useEffect를 사용한다

2021년 8월 24일
·
0개의 댓글
post-thumbnail

React Hooks (8) - useScroll

useScroll 스크롤을 해서 무언갈 지나쳤을때 색상을 바꾸거나 어떤 행동을 하는 것입니다.위의 코드에서 우선 App을 보면y라는 변수가 useScroll이라는 함수를 가지고 있고 페이지의 높이는 1000px, 페이지의 글자는 y가 200보다 작으면 빨간색, 그보다

2020년 8월 12일
·
0개의 댓글