프로그래밍⚡️/React 12

query data 비동기 에러

에러 상황 21번 줄 fetchBoard 데이터가 문제인 듯 하다. console.log로 data.fetchBoard를 찍어 봤더니 역시나 데이터에서 오류가 있는 것 같다. 에러가 뜨는 부분을 주석 했더니 에러는 사라지는 것을 확인할 수 있다. 이상한건 이 상태에서 주석을 풀면 화면이 표시 된다는 것 이건 비동기 실행 때문에 data를 받아오기도 전에 div가 표시되면서 발생하는 에러라고 한다. — 그래서 아래와 같이 조건문을 사용했다. and 연산자는 왼쪽이 ture면 오른쪽을 실행하는 조건문. 아래 코드를 풀이하자면 “&& 연산자 왼쪽의 data가 있을 때 오른쪽을 실행시켜달라”는 뜻 이런 방식으로도 동기실행 상태로 만들어 줄 수도 있다. 다양한 방법으로 변형할 수도 있다. ?를 사용해서 옵셔널 체..

리액트(React) 그게 뭔데?

리액트 리액트 말은 많이 들어봤다. 하지만 이것이 언어인지 프레임워크인지 감이 잘 오지 않았다. 이번에 리액트의 기초에 대해 공부하며 알게된 것들을 정리해보고자 한다. 리액트, 도대체 뭔데? 리액트는 컴포넌트를 만들고 사용하는 거라고 보면 된다. 어플을 보면 뒤로가는 백버튼은 모두 똑같이 생긴 것을 알 수 있다. 이런 경우 이 백버튼을 리액트 컴포넌트로 만들어두고 꺼내 쓰면 참 편리하다. 그렇기 때문에 중복되는 UI 요소는 리액트로 만든 후 불러와서 사용하면 된다. 이런 경우 버튼 디자인 수정이 필요할 때 컴포넌트만 수정하면 모든 버튼에 적용되기 때문에 유지보수에도 이점도 있다. vue, angula도 있는데 왜 다들 리액트를 할까? 리액트 외에도 vue나 angula 등 좋은 프레임워크가 많은데 대부분..