PB : Redux-Saga Handler Function > Api Request using 'useQuery' from 'apollo/client' > above Error Handler Function API CALL ❤ What is 'Invalid Hook Call' ? link : https://ko.reactjs.org/docs/hooks-rules.html Hooks Rule 1) Only call 'Hook' in React Function , Not in Normal Javascript Function Call Hook in React Function Component OR Call Hook in 'Custom Hook' Trial 1 : change 'ReqGetAllShips ' function into Custom Hook link

link : https://redux.js.org/recipes/structuring-reducers/normalizing-state-shape 많은 application들이 nested된 data 를 다룬다 > 🧡 Nested data ? for example ) reference type value in reference type value ex) object in object 위와 같은 구조의 data는 크게 3가지 문제점을 지닌다 > ❤ 1. 같은 구조의 코드가 중복된다 > ❤ 2. Nested 된, 중첩된 구조의 data가 너무 많다. 즉, 이전상태를 받아서, 다음 상태를 반환하는 , 즉, 순수함수여야 하는 reducer 함수의 입장에서는, 위의 data를 관리하기 위해, 그만큼 더 nested 된, 중첩된 구조로 reducer함수도 짜여져야 한다는 점이다 > ❤ 3. 설령 reducer함수를 중첩해서 잘 짜서, 위의 data를 immutable 하게 updat

1) Client > local login Email, password + Server post request > social login sdk > get userInfo , access_token from OAuth Server Server post request 2) Server > local login JWT > make 'AccessToken' , 'RefreshToken' DB Save Res to Client : RefreshToken , userInfo , accessToken > social login JWT > save 'AccessToken' from Client + make 'RefresshToken' DB Save Res to Client : RefreshToken , userInfo , accessToken > 3) Client Header : AccessToken Cookie :

1st Screen > After Refresh Solution : Modify Webpack Config ! add 'historyApiFallback' as 'true'