# HoF

38개의 포스트
post-thumbnail

24일차) [REACT/JS] hoF/ useApolloClient

24일차 배운 내용들(HoF,useApolloClient / react-hook-from,yup)을 나눠서 작성HoF(Higher order Function)useApolloClient react-hook-formyupHOC와 거의 비슷하지만 리턴 컴포넌트를 하면 Ho

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

로그인 프로세스 (Front-End)

위와 같은 이미지, 많이 익숙하신가요? 우리가 사용하고 있는 웹 페이지들에서 흔히들 볼 수 있는 로그인 페이지입니다. 로그인은, 웹 사이트에 회원가입 등으로 저장되어 있는 사용자 정보로 접속하려고 하는 요청을 검증하고 ( 아이디 또는 이메일, 비밀번호 체크 ) 검증이 완료되면 해당 사용자의 정보 데이터를 가지고 오는 과정입니다. 프론트엔드에서...

2022년 7월 6일
·
0개의 댓글
·
post-thumbnail

[기술면접] HOC, HOF

고차 컴포넌트 = Higher Order Components(HOC) 한마디로 말하면 HOC는 다른 컴포넌트를 감싸는 리액트 컴포넌트다.

2022년 7월 1일
·
0개의 댓글
·
post-thumbnail

React HOC vs HOF

HOC는 상위에 있는 컴포넌트로 다른 컴포넌트보다 먼저 실행되는 컴포넌트라고 생각하면 된다.다른 컴포넌트보다 먼저 실행되게 하려면 어떻게 해야할까?권한 분기에서 사용자에 따라 다른 페이지를 보여주고 싶다 했을 때 예를 들어 로그인을 한 유저와 하지 않은 유저가 있을 때

2022년 6월 13일
·
0개의 댓글
·

HOC, HOF

High ordered Component, High ordered Function상위 권한을 갖고있는 컴포넌트, 함수 이다.컴포넌트를 가져와 컴포넌트를 반환하는 함수이다.컴포넌트는 props를 UI로 변환하는 반면, 고차 컴포넌트는 새로운 컴포넌트를 반환한다. 수업시간

2022년 6월 11일
·
0개의 댓글
·
post-thumbnail

고차 함수(Higher Order Function)에 대하여

함수형 프로그래밍(functional programming)의 첫걸음

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

코드캠프 FE 23일차 - TIL(Diffing/ Hydration,Closure,HOC/HOF)

next.js 렌더링? >> Diffing/ Hydration자바스크립트에도 이런것이? >> Closure먼저 실행해줘! >> HOC/HOF로그인 토큰 유지시키기권한분기를 어떻게 전환시키는지브라우저의 로컬 스토리지에 넣어놓을거임\\로컬스토리지에 넣으면 새로고침 해도 사

2022년 6월 9일
·
0개의 댓글
·
post-thumbnail

React HOC vs HOF

HOF (Higher-Older Function) HOC는 리액트에서 만들어낸 새로운 기술이라기 보다는 함수형 프로그램에서 사용하는 개념인 HOF와 유사하다. HOF는 함수를 인자로 받아 새로운 함수를 반환하는 함수이다. fx를 인자로 받아 fy를 반환하는 함수로 하수가 일급객체인 언어에서 자주 사용되는 패턴이다. 자바스크립트도 마찬가지다. Loda...

2022년 6월 9일
·
0개의 댓글
·

30) React HOC vs HOF

useEffect를 이용하여 권한분기 설정해주기는 간단하게 적용할 수 있다.하지만 필요한 모든 페이지 마다 따라 붙여야 한다.그렇기 때문에 수정할 때 모두 다 바꿔줘야하는 어려움이 생긴다.그래서 로그인확인을 적용해주는 공통 컴포넌트를 만들고, 원하는 페이지가 실행되기

2022년 6월 9일
·
0개의 댓글
·
post-thumbnail

Day-23,26 권한분기(Diffing, Hydration, HOC vs HOF)

로그인을 하고 새로고침을 하는 순간 정보가 사라지는 이유는 결론부터 말하면 토큰을 변수에 담아놨기 때문에 새로고침을 하는 순간 초기화가 되면서 프론트엔드에서 html, css, js까지 전부 처음부터 받아와지기 때문에 토큰도 사라지게 된다.

2022년 6월 9일
·
0개의 댓글
·
post-thumbnail

23) 목요일

Algorithm Self Study, HoC, HoF, closure, diffing, hydration, Algorithm Class

2022년 6월 9일
·
0개의 댓글
·

React Currying

커링 기법은 인자가 여러개인 함수의 일부 인자를 고정시키는 새로운 함수를 만드는 기법이다.이를 이해하기 위해서는 HOC, HOF가 뭔지 알고 있어야한다.HOC, HOF에 관한 글다음 코드를 보자word와 name이라는 두 개의 인자를 받아 출력하는 함수이다.이 함수에

2022년 4월 17일
·
0개의 댓글
·
post-thumbnail

React HOC vs HOF

HOC는 Higher Order Component,HOF는 Higher Order Function으로두 개념은 클로저로부터 확장된 개념이다.클로저에 관한 글HOC는 대표적으로 페이지의 권한을 처리할 때 사용한다.다음과 같이 useEffect 로 토큰을 검사하여 페이지의

2022년 4월 17일
·
2개의 댓글
·
post-thumbnail

React Currying

커링은 HOF 중에서 요소가 여러 개인 함수의 요소 중 일부를 고정시켜 새로운 함수를 만드는 방법이다.hello, cat 두개의 요소를 사용하는 HOF를 만들었다.그 다음 hello를 "안녕하세요"로 고정시켜주는 sayHello함수를 만들었다.그러면 이렇게 hello는

2022년 4월 17일
·
0개의 댓글
·

HOC vs. HOF

HOC: Higher Order Component페이지의 권한을 처리할 때 사용한다.ex) 회원 공개 페이지UserPage가 실행되기 전, withAuth라는 상위 컴포넌트가 먼저 실행된다.HOC 컴포넌트(아래그림)HOF: Higher Order Function컴포넌트

2022년 4월 17일
·
0개의 댓글
·

JS Closure && HOC vs HOF

퍼어어엉션 안에서 또다른 function을 실행시켜 리턴되는 함수!aaa 라는 펑션 안에는 apple=10이 변수로 되어 있고 역시 bbb라는 함수에도 banana 변수가 선언되어 있습니다. 실생하게되면 apple -> banana 순서대로 확인되어집니다.여기서 그냥

2022년 4월 17일
·
0개의 댓글
·

권한 분기

사이트를 운영하면서 사용자에게 서비스를 제공할 때시스템의 정상적인 운영을 위해사용자의 권한별로 다른 서비스를 제공하거나, 접근을 제한해야 될 때가 있다.만약 사용자가 관리자라면 관리자 페이지에 접근이 가능해야하고,반대로 관리자가 아니라면 접근이 제한되어야한다.또한 사이

2022년 4월 16일
·
0개의 댓글
·
post-thumbnail

HOC/HOF

Aaa 컴포넌트에 Bbb 컴포넌트를 import 시키고있다. Bbb 컴포넌트에서는 props로 "철수"를 내려받고 있다.함수형으로 이름을 바꾸고 props 또한 변수 이름이기 때문에 어떤 걸로 바뀌어도 상관없다.Closure에 의해 Bbb 컴포넌트가 실행되기 전에 Ho

2022년 4월 15일
·
0개의 댓글
·
post-thumbnail

권한분기 / HOC / HOF

HOC HOC는 Higher Order Component의 줄임말로 리액트 컴포넌트를 인자로 받아서 새로운 리액트 컴포넌트를 리턴하는 함수이다. HOF

2022년 4월 14일
·
0개의 댓글
·

[Javascript] 함수형 프로그래밍 (HOF)

함수형 프로그래밍 (HOF)에 대해 알아보도록 하자.

2022년 4월 14일
·
0개의 댓글
·