1페이스북에서 개발하고 관리하는 사용자 인터페이스(UI)를 만들기 위한 JavaScript 라이브러리 .리액트는 선언적인 프로그래밍을 접목을 시켰다.예시) 청소하는 로봇에 절차적으로 하는게 아니라 정리된 방의 사진을 찍어서 로봇은 똑같은 모습으로 구현하기 위해서 과정을
🔑 key를 부여하는 이유 ❓순서가 일정하지 않을시 각 요소에 특별한 값으로 키를 사용해야 순서를 보장받을 수 있기 때문이다. react는 단순히 앞을 하나밀고 뒤에 하나 넣으면 되지만 간단한 규칙을 모른다. 그냥 키와 값이 모두 다르니 바뀌었다고 생각할 뿐이다.배열
부수효과(추가적인 액션) name을 값을 받아서 인풋하기에 함수는 그 name만을 다루는게 맞다. 하나의 동작을 가지고 있는 함수.그러나 외부에 있는 변수 count =0 이라는 함수와 관계없는count+1 실행이되면서 (외부에 있는 변수를 수정을 한다면) 부수효과 가
프로젝트를 하는 도중 백엔드쪽에서 긴텍스트를 한번에 보내주는 컴포넌트가 있었는데, "\n" 이 표시된 부분마다 짤라서 넣어주는 식을 생각해보게 되었다. 우선은 replace 메서드를 이용해서 \n를 으로 바꾸는건 어떨까라는 생각을 해보았다. 이런식으로 이 그냥 출력
html 파일에서는 label과 input을 연결해야할때는 label에서는 for값, input에서는 id 값을 통해서 둘이 같을 것을 표시하였다. 그러나 react에서는 for 대신 forName을 써야 한다고 한다.for는 for문을 의미하기에 htmlFor라고 변
route + ing : 경로를 찾아가는 행위즉! 라우팅이란, 다른 경로(url 주소)에 따라 다른 화면을 보여주는 것.React는 기본적으로 라우팅 시스템을 갖추고 있지 않으므로(라이브러리)react-router-dom 과 같은 부가적인 라이브러리를 설치.전체 아이템
확장성, 유지보수보다는 현재는 기능구현에 중점을 두고 있었다. 로그인기능 자체를 구현하는 것, 여러 기능을 구현하는데 익숙해졌지만, 좋은 개발자란 무작정 구현하는 것이아니라 기능구현을 좀더 확장성있고 편리하게 유지보수 할수 있는 기능구현을 하는 것이다.로직부분, 기능부
프로젝트 1차 기획을 배포하기전에 이용약관과 개인정보방침에 대한 생각을 준비하고 있었는데 사이트에서 가이드를 보면서 만들어 코드에 적용시키려고 보니 html 파일이어서 이를 react에 어떻게 적용시킬게 고민하던 중 찾게 된 방법이 dangerouslySetInnerH
리액트는 위에서 아래로 내려가면서 진행된다.앱 안아서 전역적으로 사용되는 데이터들을 여러 컴퍼넌트들이 쉽게 공유할수 있는 방법을 제공해준다.context를 이용하면 props로 데이터를 일일이 전달 해주지 않아도 해당 데이터를 갖고 있는 상이 컴포넌트가 이데이터를 필요
함수형 컴포넌트에서 useRef를 호출하면 오브젝트를 반환해준다. 우리가 인자로 넣어준 초기값은 ref 안에 있는 current에 저장이 된다.반환된 ref는 컴포넌트가 계속해서 렌더링이 되어도 컴포넌트가 언마운트 되기 전까지는 값을 그대로 유지할 수 있다.useRef
useCallback useCallback은 함수가 필요할 경우, 또 생성하는 것이 아니라 메모리에서 가져와서 재사용한다. 리액트는 함수형 컴포넌틑 함수컴포넌트 안에 매개 변수를 useCallback했을 경우 렌더링이 되더라도 초기화 되는 것을 막을 수 있다.
useReducer useState처럼 state를 생서하고, 관리할수 있게 해주는 도구이다. 여러개의 하위 값을 포함하는 복잡한 state를 다뤄야 할 경우 useState대신 useReducer를 사용한다면 더 깔끔하게 사용할 수 있다. 유지보수도 편리하다.
동일페이지를 실수로 나가는 경우를 막기위해서 이 구성요소를 사용하는데, 라우터 v6에서는 관련기능을 제외하고 릴리즈 되었다고 한다.💫 v5💫 v6v5Switch 내부에 등록함.경로에 맞는 컴포넌트 등록시 그 페이지를 넣어주거나 component 속성값을 사용.정확