profile
좋아하는 것을 하나하나 채워가면 행복해질꺼야

React-LifeCycle

리액트는 컴포넌트 기반의 View를 중심으로한 라이브러리입니다. 그러다보니 각각의 컴포넌트에는 라이프 사이클 즉, 컴포넌트의 생명주기가 존재합니다.컴포넌트의 수명은 보통 페이지에서 렌더링이 되기 전인 준비과정에서 시작하여 페이지가 사라질때 끝이 납니다.1.contruc

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

useReducer

useReducer useState처럼 state를 생서하고, 관리할수 있게 해주는 도구이다. 여러개의 하위 값을 포함하는 복잡한 state를 다뤄야 할 경우 useState대신 useReducer를 사용한다면 더 깔끔하게 사용할 수 있다. 유지보수도 편리하다.

2022년 8월 25일
·
0개의 댓글
·
post-thumbnail

useCallback

useCallback useCallback은 함수가 필요할 경우, 또 생성하는 것이 아니라 메모리에서 가져와서 재사용한다. 리액트는 함수형 컴포넌틑 함수컴포넌트 안에 매개 변수를 useCallback했을 경우 렌더링이 되더라도 초기화 되는 것을 막을 수 있다.

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

useRef - 변수 관리

함수형 컴포넌트에서 useRef를 호출하면 오브젝트를 반환해준다. 우리가 인자로 넣어준 초기값은 ref 안에 있는 current에 저장이 된다.반환된 ref는 컴포넌트가 계속해서 렌더링이 되어도 컴포넌트가 언마운트 되기 전까지는 값을 그대로 유지할 수 있다.useRef

2022년 8월 19일
·
0개의 댓글
·
post-thumbnail

useContext

리액트는 위에서 아래로 내려가면서 진행된다.앱 안아서 전역적으로 사용되는 데이터들을 여러 컴퍼넌트들이 쉽게 공유할수 있는 방법을 제공해준다.context를 이용하면 props로 데이터를 일일이 전달 해주지 않아도 해당 데이터를 갖고 있는 상이 컴포넌트가 이데이터를 필요

2022년 8월 18일
·
0개의 댓글
·
post-thumbnail

dangerouslySetInnerHTML

프로젝트 1차 기획을 배포하기전에 이용약관과 개인정보방침에 대한 생각을 준비하고 있었는데 사이트에서 가이드를 보면서 만들어 코드에 적용시키려고 보니 html 파일이어서 이를 react에 어떻게 적용시킬게 고민하던 중 찾게 된 방법이 dangerouslySetInnerH

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

관심사의 분리

확장성, 유지보수보다는 현재는 기능구현에 중점을 두고 있었다. 로그인기능 자체를 구현하는 것, 여러 기능을 구현하는데 익숙해졌지만, 좋은 개발자란 무작정 구현하는 것이아니라 기능구현을 좀더 확장성있고 편리하게 유지보수 할수 있는 기능구현을 하는 것이다.로직부분, 기능부

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

htmlFor & 별 구현

html 파일에서는 label과 input을 연결해야할때는 label에서는 for값, input에서는 id 값을 통해서 둘이 같을 것을 표시하였다. 그러나 react에서는 for 대신 forName을 써야 한다고 한다.for는 for문을 의미하기에 htmlFor라고 변

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

\n 텍스트 줄 바꾸기

프로젝트를 하는 도중 백엔드쪽에서 긴텍스트를 한번에 보내주는 컴포넌트가 있었는데, "\n" 이 표시된 부분마다 짤라서 넣어주는 식을 생각해보게 되었다. 우선은 replace 메서드를 이용해서 \n를 으로 바꾸는건 어떨까라는 생각을 해보았다. 이런식으로 이 그냥 출력

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

useEffect

부수효과(추가적인 액션) name을 값을 받아서 인풋하기에 함수는 그 name만을 다루는게 맞다. 하나의 동작을 가지고 있는 함수.그러나 외부에 있는 변수 count =0 이라는 함수와 관계없는count+1 실행이되면서 (외부에 있는 변수를 수정을 한다면) 부수효과 가

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

map 함수 적용시 key props를 부여하는 이유

🔑 key를 부여하는 이유 ❓순서가 일정하지 않을시 각 요소에 특별한 값으로 키를 사용해야 순서를 보장받을 수 있기 때문이다. react는 단순히 앞을 하나밀고 뒤에 하나 넣으면 되지만 간단한 규칙을 모른다. 그냥 키와 값이 모두 다르니 바뀌었다고 생각할 뿐이다.배열

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

git conflict

난 메인을 하고 있고 팀원은 리스트를 작업하고 있는데 내가 push하기 전에 github feature/main을 만들고 add하고 commit하고 작업하는 중에 다른 사람이 내가 push하기 전에 자기가 작업하는 내용을 올려서 merge가 되어 병합을 시켰다. 같은

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

React

1페이스북에서 개발하고 관리하는 사용자 인터페이스(UI)를 만들기 위한 JavaScript 라이브러리 .리액트는 선언적인 프로그래밍을 접목을 시켰다.예시) 청소하는 로봇에 절차적으로 하는게 아니라 정리된 방의 사진을 찍어서 로봇은 똑같은 모습으로 구현하기 위해서 과정을

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