React

리액트 블로그 글 목록을 만드려고 한다 . 리스트의 제목을 넣기 위해 변수에 데이터를 저장하고 하단에 데이터를 바인딩을 했다. 하지만 데이터를 변수 말고 저장할 수 있는 또 하나의 방법을 공부 해보았다. 데이터를 보관 시 state 를 만들어서 데이터를 추가하여 나타내

좋아요 버튼을 클릭 하면 카운트가 1씩 늘어나도록 ui , 기능을 추가할 것이다.

https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/리엑트 라이프 사이클 매우 잘 나와있는 사이트를 우연히 찾게 되었다.Render 단계메서드를 바인딩 하거나 state를 초기 할당함 (없다면 구현하지

구조를 짜는동안 component 안에 component 들이 수없이 많아지면서 props로 일일히 받아야 되는 상황이 되었다.수많은 props들 !먼저 전역 변수로 createContext 를 사용한다useContext import 추가 해주고전역에 변수로 선언해준다

redux store에 있던 state를 꺼내쓰려면state를 props화 해주는 함수 어쩌구를 파일밑에 첨부해야 했다.하지만 코드가 길어져서 짜증난다.그럴 땐 useSelector Hook을 쓰는 방법이 있다.하단 export 부분은 기존대로useSelector, u

기존에 경우에 따라서 html을 보여줄 때 아래와 같은 삼항 연산자 표현방식으로 보여주었다.리액트에서는 자바스크립트 오브젝트자료형 으로 보여줄 수 있는 방법이 있다.전역에 먼저 보여줄 값을 변수에 오브젝트 형식으로 담고함수 안에서 사용할 변수를 생성해서 오브젝트 키값을

자바스크립트는 위에서부터 한줄씩 읽어가는데 component 를 모두 로드 시켜놓고 실행이 된다. 하지만 많아지면 스크립트에도 무리가 가고 느려질 것이다.그래서 컴포넌트가 필요해질 시점에 원하는 컴포넌트를 import 시켜 로딩을 원하는 타이밍에 맞게 할 수 있다.그래

실제로 div를 확인하려고 하면 쉽지가 않아서 디버깅을 하는데 어려움이 있다. 그래서 리액트 확장프로그램을 통하여 좀 더 쉽게 디버깅이 가능하다.구글에 react dev tools 로 검색하면 크롬에서 확장프로그램을 설치 할수 있는 화면이 나온다.설치 후 검사를 누르면