yarn create react-app [파일명]
$ yarn add json-server
$ yarn add react-router-dom
$ yarn add axios
$ yarn add react-query
{
"superheroes": [
{
"id": 1,
"name": "Batman",
"alterEgo": "Bruce Wayne"
},
{
"id": 2,
"name": "Superman",
"alterEgo": "Clark Kent"
},
{
"id": 3,
"name": "Wonder Woman",
"alterEgo": "Princess Diana"
}
]
}
http://localhost:3001/todos
$yarn json-server --watch db.json --port 3001
$yarn start
React-query 를 사용하기 위해,
root component 를 QueryClientProvider 로 감싸주고,
QueryClient 를 새롭게 만들어 변수 선언한다음,
QueryClientProvider 의 prop 으로 QueryClient 를 주입한다.
import { QueryClientProvider, QueryClient } from "react-query";
const queryClient = new QueryClient();
function App() {
return (
<QueryClientProvider client={queryClient}>
<Router>
<div>
</div>
</Router>
</QueryClientProvider>
);
}
export default App;
React Query Tutorial 참고하며 공부한 내용입니다.