하위 페이지에 있는 버튼의 onClick에 index 값을 넘겨줌\---->> onClick={() => openModal(index)}인덱스를 설정하여 원하는 곳의 데이터 값만 바꾸기 위해 state를 하나 더 만들어줌\---->> const targetIdx, se
https://velog.io/@syj9484/React-String%ED%98%95%ED%83%9C%EC%9D%98-html-%EB%A0%8C%EB%8D%94%EB%A7%81%ED%95%98%EA%B8%B0와 같이 태그를 단일태그로 바꾼 후, dangerou
src 안에 있는 index.js 파일에를 넣는다.즉,\--기존--\--코드 넣음--상위폴더에 .env 파일을 만들어서코드를 입력하고package.json 파일에는 scripts 영역에를 추가하기끄읏-
React에서 서비스를 개발하는 데 있어 독립적인 단위로 쪼개어 구현가상적인 표현을 메모리에 저장하고 ReactDOM과 같은 라이브러리에 의해 실제 DOM과 동기화 하는 프로그래밍 개념JavaScript 내에서 UI를 작성하기 위해 개발자에게 익숙한 환경을 제공, HT
React 프로젝트를 손쉽게 생성할 수 있도록 도와주는 '보일러플레이트(Boierplate)'수많은 React용 보일러플레이트가 있지만 메타(이전의 페이스북)에서 직접 만들어서 관리하는 Create React App이 가장 많이 쓰임프로젝트 생성에 필요한 다양한 기능을
함수 호출과 객체 생성을 위한 문법적 편의를 제공하는 JavaScript의 확장HTML과 비슷하게 생겼으나 JavaScript이고 HTML과 다른 부분이 엄연히 있음Babel에 의해서 Tracnscompile 된다.위의 코드처럼 리액트가 js로 변환되어 있는 코드보다
React에서 페이지를 구성하는 최소단위Component의 이름은 대문자로 시작Class Component/Function Component로 나뉨Controlled Component/Uncontrolled Component위와 같이 Component를 만들고 아래의
기본적으로 Component에 원하는 값을 넘겨줄 때 사용하며 넘겨줄 수 있는 값은 변수, 함수, 객체, 배열 등 Javascript 요소라면 제한이 따로 없다.주로 Component의 재사용을 위해 사용한다.Props의 값을 임의로 변경해서 사용하는 것을 지양한다.\
State란 Component 내에서 유동적으로 변할 수 있는 값을 저장한다. 개발자가 의도한 동작에 의해 변할 수도 있고 사용자의 입력에 따라 새로운 값으로 변경될 수도 있다. State 값이 변경되고 재렌더링이 필요한 경우에 React가 자동으로 계산하여 변경된 부
대표적인 React의 Hook으로는 useState,useEffect,useCallback,useRef, useMemo 등이 있다.기존에는 컴포넌트 내에서 State와 생명주기를 관리하기 위해 반드시 클래스 컴포넌트(Class Componenet)를 사용해야 했지만 개