๋ฌธ์ ์ํฉ React context ์ฌ์ฉ ์ ๊ธฐ์กด ์ฝ๋ ๊ตฌ์ฑ์ด context ๋ด๋ถ ์์๊ฐ ๋์ด๋ ์๋ก ๋ณต์กํด์ ธ์ ๋ฆฌํฉํ ๋งํ๋ ค ํ๋ค. ๊ธฐ์กด ๊ตฌํ // ๊ตฌ์ฑ const UserContext = createContext({}); const SignInContext = createContextvoid>(()=>{}); export const UserContextProvider = ({ children }) => { const [user, setUser] = useState(); const signIn = () => {}; return ( {children} ); } export function useUserState() { const context = useContext(UserContext); return c..
React-query : fetch, cache, synchronize, update(for server state)์ ์ฌ์ฉ๋๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ค. ๊ณต์์ฌ์ดํธ React Query Hooks for fetching, caching and updating asynchronous data in React react-query.tanstack.com ๋ฐฐ๊ฒฝ server state ์ฌ์ฉ ์ ๋ฐ์ํ ์ ์๋ ๋ฌธ์ ์ ์ ๋ค์๊ณผ ๊ฐ๋ค. caching deduping(๋ฐ์ดํฐ ์ค๋ณต ์ ๊ฑฐ) update "out of date" data / know when is it reflecting updates data pagination optimization, lazy loading data memory management, garba..
๊ธฐ๋ณธ ์ฌ์ฉ const info = useQuery('unique_key', fetchData); // fetchData๋ promise ๋ฐํ uniqueํ key๋ก ์ ์ํ๋ฉฐ, key์ ๋ฌถ์ด๋ ๋ฐ์ดํฐ๋ ๋น๋๊ธฐ ๋ฐ์ดํฐ์ด๋ค. useQuery๊ฐ ๋ฐํํ๋ result๋ ๋น๋๊ธฐ ๋ฐ์ดํฐ์ ์ํ๋ฅผ ๋ด๊ณ ์๋ค. ์ํ loading isLoading์ด true๊ฐ ๋๋ค. error isError๊ฐ true๊ฐ ๋๋ฉฐ, error์ ์๋ฌ ์ ๋ณด๊ฐ ๋ด๊ธด๋ค. success isSuccess๊ฐ true๊ฐ ๋๋ฉฐ, data์ ์ ๋ณด๊ฐ ๋ด๊ธด๋ค. idle ์ฌ์ฉ ์์ const { isLoading, isError, data, error } = useQuery('key', fetchData); // const { status, data, erro..
Comment