# useEffect

49개의 포스트
post-thumbnail

Netlify 배포오류

...?? 우선 기존코드를 다시 확인해 봐야겠다.useEffect부분에 deps가 비어 있어서 여러가지 문제가 나타났다. 😌

7일 전
·
0개의 댓글
post-thumbnail

[React] Material-UI로 구현한 가격필터 슬라이더 성능 개선하기

에어비앤비 숙소 리스트 페이지의 가격 필터를 구현했는데, 슬라이더가 유난히 느리게 반응하는 것이 신경쓰였다. 슬라이더를 material-ui 라이브러리를 활용해서 내 앱이 무거워진건 줄 알았는데 정말 비효율적인 코드를 짰다는 것을 나중에야 알게 됐다.

2021년 1월 4일
·
1개의 댓글

React Hooks에 대해

useStateuseState 는 가장 기본적인 Hook 으로서, 함수형 컴포넌트에서도 가변적인 상태를 지니고 있을 수 있게 해줍니다. 만약에 함수형 컴포넌트에서 상태를 관리해야 되는 일이 발생한다면 이 Hook 을 사용하시면 됩니다.1.1 useState 를 여러번

2021년 1월 3일
·
0개의 댓글
post-thumbnail

[Mini Project] Monster - Funtion

✅ 간단한 레이아웃 생각해보기 ✅ usehistory ✅ useEffect , deps✅ useParams API GETSearchBox onChange data state 관리Data && SearchData Filtering Props전달Card들을 맵핑해

2021년 1월 3일
·
0개의 댓글
post-thumbnail

[React] useEffect 무한루프 탈출하는 방법

기존에 클래스형 컴포넌트 방식으로 짠 코드를 함수형 컴포넌트로 변환을 했는데, 특정 컴포넌트만 클릭하면 미친듯이 렌더가 일어나 브라우저가 다운되는 현상을 겪었다. 알고 보니 componentDidMount를 대체하는 함수인 useEffect 에서 무한루프가 일어난 것이

2021년 1월 3일
·
0개의 댓글
post-thumbnail

useState & useEffect

\>✅ Function 형으로 변환 ✅ useState 사용 ✅ UseEffect 사용 ✅ UseHistroy 사용컴포넌트 사이에서 상태와 관련된 로직을 재사용하기 어렵습니다. (HOC, render props)복잡한 컴포넌트들은 이해하기 어렵습니다. (관심

2020년 12월 28일
·
0개의 댓글
post-thumbnail

[Next] useEffect로 받은 데이터는 SSR될까? ( getInitialProps 사용 )

React useEffect를 사용했을 경우에 SSR이 될까? ☀️ 답 : useEffect안에서 동작하는 데이터는 SSR되지 않는다. useEffect(() => {}, []) 는 마운트 되었을 때, useEffect는 실행된다. 그렇기 때문에 SSR로 받은 htm

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

useEffect

컴포넌트가 렌더링될 때마다 수행할 작업을 설정하는 Hook이다. ComponentDidMount와 ComponentdidUpdate를 합친 형태이다 react lifecyle라이프 사이클을 참고componentDidMount컴포넌트가 마운트된 직후에 호출됨외부에서 데이

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

[리액트] useRef, useEffect

리액트에 내장된 Hook에 대해 더 알아보자.특정 DOM을 가리킬 때 사용하는 Hook 함수.Ex. 포커스 설정, 특정 엘리먼트의 크기/색상 변경 등..: ref는 JS의 getElementById()처럼, component의 어떤 부분을 선택할 수 있게 해주는 방법이

2020년 11월 23일
·
0개의 댓글
post-thumbnail

[ react : hooks ]

react에는 기본적으로 내장하고 있는 Hooks가 있다.컴포넌트 사이에서 상태와 관련된 로직을 재사용하기 어렵기 때문 (HOC, render props)에 등장한 것이 바로 hooks이다.React에 존재하는 component 종류 Class component st

2020년 11월 8일
·
0개의 댓글
post-thumbnail

[JS] filter() 사용하여 조건 검색 만들기

filter() 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환하는 메서드입니다.테스트를 통과하는 모든 배열 요소(함수로 제공됨)로 채워진 배열을 생성합니다.값이 없는 배열 요소에 대해 함수를 실행하지 않고, 원래 배열을 변경하지 않습니다.call

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

에러노트 1)

warning: firebase snapshot can't perform a react state update on an unmounted component.글을 작성하는 Post 컴포넌트에서 새로운 글을 작성하고 업로드 했을 때, Home 컴포넌트에서 발생한 에러로,

2020년 11월 4일
·
0개의 댓글
post-thumbnail

[React] 8. react-hooks(useState, useEffect, useRef)

Hooks 는 React 16.8 에서 추가 되었습니다.기존에는 함수형 컴포넌트에서 상태를 관리하기 위해서는 클래스 컴포넌트 다시 작성해야 했던 반면에, Hooks가 나오면서 함수형 컴포넌트에서도 상태를 가질 수 있게 되었습니다. Hooks는 이것 외에도 다양한 기능들

2020년 10월 20일
·
0개의 댓글
post-thumbnail

React - Effect Hook ( Clean-up )

이전 블로그에서 간단하게 짚고 넘어갔던 내용 중 Clean-up 함수라는 개념이 있다.Clean-up함수란,useEffect()에서 parameter로 넣은 함수의 return 함수이다.Component의 unmount이전 / update직전에 어떠한 작업을 수행하고

2020년 10월 10일
·
0개의 댓글
post-thumbnail

[React] Hooks (useEffect)

React 함수형 컴포넌트(functional component)에서 useEffect를 사용하면, side effect를 수행할 수 있다.side effect: React Component가 화면에 render된 후에, 비동기로 처리되어야하는 효과들useEffect(

2020년 10월 10일
·
1개의 댓글
post-thumbnail

TIL 2020.05.15

2020년 10월 4일
·
0개의 댓글
post-thumbnail

TIL 62 | 클래스형 컴포넌트인 로그인 페이지를 함수형 컴포넌트로 바꿔보자 ( Hooks & styled-component)

아직 익숙하지 않은 훅스 개념을 직접 코드로 쳐보면서 익혀보자. 3주 전에 만들었던 Instagram 로그인페이지를 Hooks를 사용해서 functional 컴포넌트로 바꿔보고 styled-component를 적용해서 새로 작성해보았다.

2020년 10월 4일
·
2개의 댓글
post-thumbnail

React - Effect Hook

React Functional Component에서 Effect Hook을 사용하면, Side effect를 수행할 수 있게된다.Side effect란,React Component가 화면에 render된 이후에, 비동기로 처리되어야하는 효과들을 말한다.useEffect

2020년 10월 3일
·
0개의 댓글
post-thumbnail

[JavaScript] React - useEffect 를 사용한 마운트, 언마운트 업데이트 시의 작업

React useEffect > useEffect를 사용하여 마운트, 언마운트 업데이트 시의 작업을 설정해 보도록 하겠습니다. 이전 블로그에서 작성했던 코드에서 추가로 작성하여 useEffect를 사용하여 어떻게 동작하는지 확인해봅시다. useEffect(() =>

2020년 10월 3일
·
0개의 댓글
post-thumbnail

React - velopert html 정리(2)

(본 글은 Velopert님의 https://react.vlpt.us/ 를 정리한 내용입니다.): class형 컴포넌트에서 componentDidMount, componentDidUpdate와 같은    lifeCycle을 hooks에서는 useEffect로

2020년 10월 2일
·
0개의 댓글