title: Project Structure for a CRA React Project with React Query
body: <p>We are starting with a new React Project using CRA. And, are planning to use React Query.</p>
  <p>Need help on the folder structure for the project. Any advantage of having feature based folder structure vs. file type based structure?</p>
  <p>Also, Any advantage of having service/API with only the axios/fetch call and creating useQuery/useMutation hook directly in component? vs. creating custom Hooks for each reactQuery?</p>
  <pre><code>// API call in a service file and using that API call in the component
  export const fetchPost = (key, postId) =&gt;
    axios.get(`/api/posts/${postId}`).then((res) =&gt; res.data)
  
  //Custom Hooks for each API call in a service 
  export default function usePost(postId) {
    return useQuery(postId &amp;&amp; ['post', postId], fetchPost)
  }
  </code></pre>