__typename
이 필요하다.__typename
속성에 type이름을 작성해야한다.lib/apollo/initalCacheState
에 접근하여 각 view의 cacheState
를 추가한다.@client
키워드를 작성해야한다.compose
, graphql
혹은 react-hooks useQuery
을 통해 가져올 수 있다.lib/apollo/resolvers
에서 추가할 수 있다.@client
키워드를 추가한다.필요한 query
를 받아와서 그려줄 수 있다.const {
data: { meal }
} = useQuery(MealQueries.MEAL);
😺 로컬 상태 관리 initialCacheState.js 위와 같이 초기 상태를 작성했으면, 이 내용을 아폴로 client를 생성하는 생성자 옵션에 추가한다. lib/apollo/initialCacheState에 접근하여 각 view의 cacheState 를 추가한다. queries.js queries.js에서 query, mu...
🐤 1. 먼저 버튼 UI에 필요한 constants.js 파일을 만들어준다. 이슈 - 처음에 버튼을 클릭했을 때, true / false 조건을 걸어 true 일때, active를 줌. 그랬더니 모든 버튼에 적용되서 1번 버튼을 누르면 true가 되고 2번 버튼을 누르면 false가 되서 버튼을 2번씩 클릭해야 원하는 UI가 그려짐. - 그래서 ...
로컬 상태 관리 1. 상태로 만들어줘야 할 부분 - input - 변하는 부분 전부! (쇼핑몰을 예로들면 갯수나 가격, 옵션) - 유저의 입력정보 2. 상태 초기화 - cacheState.js 파일을 만들어 상태로 만들어줄 초기값을 설정한다. - 반드시 typename이 필요하다. - apollo cache의 모든 상태는 graphql의 type 시스템...
✔️ webpack 🐾 WHY HTML에서 script /로 자바스크립트 파일을 실행할 수 있다. 하지만 많은 자바스크립트 파일을 실행할 경우 웹앱에 병목현상이 생기게 된다. 이러한 현상을 해결하기 위해 하나의 큰 자바스크립트 파일이 필요하다. 하지만 한 파일에 모든 자바스크립트 코드를 넣게되면 흐름을 이해하기도 힘들고, 복잡도가 올라가 유지보수하...
✨ 왜 nextjs + React + apollo-client 조합으로 SSR 구현을 하게되었다. 물론 98% 짜여진 코드에 2% 치명적인 코드를 수정해야하는 작업이었지만, 클라이언트에도, 서버에도 매우 치명적인 오류였기때문에 반드시 고쳐야만했다. 🔧🔨react-apollo는 이 프로젝트를 통해 처음 접하는 라이브러리였고, 아직 레퍼런스도 부족해서 영알...