├── .gitattributes ├── .gitignore ├── 01 - installation ├── .gitignore └── app │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.final.js │ ├── App.js │ ├── App.test.js │ ├── Untitled.code-workspace │ ├── index.css │ ├── index.js │ ├── logo.svg │ ├── serviceWorker.js │ └── setupTests.js │ └── yarn.lock ├── 02 - basic queries ├── .gitignore └── app │ ├── .gitignore │ ├── .prettierrc │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.final.js │ ├── App.js │ ├── App.test.js │ ├── index.css │ ├── index.js │ ├── logo.svg │ ├── serviceWorker.js │ └── setupTests.js │ └── yarn.lock ├── 03 - query loading state └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 04 - query error state └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 05 - react query devtools └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 06 - automatically refetch a query on window focus └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 07 - query refetching indicators └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 08 - configure query staleTime └── app │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 09 - configure query cacheTime └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 10 - query keys and caching └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 11 - using a custom hook to consume the same query multiple times └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 12 - parallel queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 13 - using props or state in queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 14 - disabling queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 15 - multi-part query keys └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 16 - automatic query retries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 17 - query cancellation └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 18 - dependent queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 19 - supplying a query with initial data └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 20 - marking initial query data as stale └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 21 - querying related resource lists and their individual resources └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 22 - seeding query data from other queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 23 - using query data to seed future queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 24 - query side-effects └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 25 - scroll restoration └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 26 - query polling with refetchInterval └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── time.js │ │ └── index.js │ └── yarn.lock ├── 27 - invalidating queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── random.js │ │ └── index.js │ └── yarn.lock ├── 28 - invalidating but not refetching active queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── random.js │ │ └── index.js │ └── yarn.lock ├── 29 - invalidating & refetching inactive queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── random.js │ │ └── index.js │ └── yarn.lock ├── 30 - invalidating multiple queries with shared query keys └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── random.js │ │ └── index.js │ └── yarn.lock ├── 31 - basic query prefetching └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── next.config.js │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── index.css │ └── pages │ │ ├── _app.js │ │ ├── api │ │ └── random.js │ │ └── index.js │ └── yarn.lock ├── 32 - hover-based prefetching └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 33 - prefetching with staleTime └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 34 - forced prefetching └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitignore │ ├── .prettierrc │ ├── .rescriptsrc.js │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── package.json │ ├── public │ ├── favicon.ico │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ └── robots.txt │ ├── src │ ├── App.js │ ├── existingUser.js │ ├── index.css │ └── index.js │ └── yarn.lock ├── 35 - mutation basics └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ ├── usePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 37 - mutation side-effects └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ ├── usePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 38 - updating query data with mutation responses └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 39 - optimistic updates from mutations for multi-entity queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 43 - paginated queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 44 - prefetching paginated queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 45 - infinite queries └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ ├── api │ │ └── posts │ │ │ ├── [postId].js │ │ │ └── index.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── 46 - SSR with nextjs 1 └── app │ ├── .babelrc │ ├── .eslintrc │ ├── .gitattributes │ ├── .gitignore │ ├── .prettierrc │ ├── .vscode │ └── settings.json │ ├── README.md │ ├── components │ ├── PostForm.js │ ├── Sidebar.js │ └── styled.js │ ├── db │ └── index.js │ ├── hooks │ ├── useDeletePost.js │ └── useSavePost.js │ ├── next.config.js │ ├── package.json │ ├── pages │ ├── 404.js │ ├── [postId].js │ ├── _app.js │ ├── _document.js │ └── index.js │ ├── public │ ├── favicon.ico │ └── zeit.svg │ ├── store.json │ ├── utils.js │ └── yarn.lock ├── README.md └── media └── react-query-essentials.sketch /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | # See https://help.github.com/ignore-files/ for more about ignoring files. 3 | 4 | # dependencies 5 | node_modules 6 | 7 | # builds 8 | build 9 | dist 10 | artifacts 11 | .rpt2_cache 12 | coverage 13 | 14 | # misc 15 | .DS_Store 16 | .env 17 | .env.local 18 | .env.development.local 19 | .env.test.local 20 | .env.production.local 21 | .next 22 | 23 | npm-debug.log* 24 | yarn-debug.log* 25 | yarn-error.log* 26 | .history 27 | size-plugin.json 28 | stats.html 29 | .vscode/settings.json 30 | 31 | *.mp4 32 | *.screenflow 33 | -------------------------------------------------------------------------------- /01 - installation/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /01 - installation/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/01 - installation/app/public/favicon.ico -------------------------------------------------------------------------------- /01 - installation/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/01 - installation/app/public/logo192.png -------------------------------------------------------------------------------- /01 - installation/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/01 - installation/app/public/logo512.png -------------------------------------------------------------------------------- /01 - installation/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /01 - installation/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /01 - installation/app/src/App.final.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | import { useQuery } from 'react-query' 4 | 5 | console.log(useQuery) 6 | 7 | export default function App() { 8 | return
Hello React Query!
9 | } 10 | -------------------------------------------------------------------------------- /01 - installation/app/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | import { useQuery } from 'react-query' 4 | 5 | export default function App() { 6 | console.log(useQuery) 7 | return
Hello React Query!
8 | } 9 | -------------------------------------------------------------------------------- /01 - installation/app/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { render } from '@testing-library/react'; 3 | import App from './App'; 4 | 5 | test('renders learn react link', () => { 6 | const { getByText } = render(); 7 | const linkElement = getByText(/learn react/i); 8 | expect(linkElement).toBeInTheDocument(); 9 | }); 10 | -------------------------------------------------------------------------------- /01 - installation/app/src/Untitled.code-workspace: -------------------------------------------------------------------------------- 1 | { 2 | "folders": [] 3 | } 4 | -------------------------------------------------------------------------------- /01 - installation/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 50px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 6 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 7 | sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | * { 18 | font-size: 20px; 19 | } 20 | 21 | body { 22 | padding: 0.5rem; 23 | } 24 | -------------------------------------------------------------------------------- /01 - installation/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | import * as serviceWorker from './serviceWorker' 6 | 7 | ReactDOM.render( 8 | 9 | 10 | , 11 | document.getElementById('root') 12 | ) 13 | 14 | // If you want your app to work offline and load faster, you can change 15 | // unregister() to register() below. Note this comes with some pitfalls. 16 | // Learn more about service workers: https://bit.ly/CRA-PWA 17 | serviceWorker.unregister() 18 | -------------------------------------------------------------------------------- /01 - installation/app/src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom/extend-expect'; 6 | -------------------------------------------------------------------------------- /02 - basic queries/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /02 - basic queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | 2 | # See https://help.github.com/ignore-files/ for more about ignoring files. 3 | 4 | # dependencies 5 | node_modules 6 | 7 | # builds 8 | build 9 | dist 10 | artifacts 11 | .rpt2_cache 12 | coverage 13 | 14 | # misc 15 | .DS_Store 16 | .env 17 | .env.local 18 | .env.development.local 19 | .env.test.local 20 | .env.production.local 21 | .next 22 | 23 | npm-debug.log* 24 | yarn-debug.log* 25 | yarn-error.log* 26 | .history 27 | size-plugin.json 28 | stats.html 29 | .vscode/settings.json 30 | -------------------------------------------------------------------------------- /02 - basic queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /02 - basic queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/02 - basic queries/app/public/favicon.ico -------------------------------------------------------------------------------- /02 - basic queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/02 - basic queries/app/public/logo192.png -------------------------------------------------------------------------------- /02 - basic queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/02 - basic queries/app/public/logo512.png -------------------------------------------------------------------------------- /02 - basic queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /02 - basic queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/App.final.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useQuery } from 'react-query' 3 | 4 | export default function App() { 5 | const queryInfo = useQuery('pokemon', () => 6 | fetch('https://pokeapi.co/api/v2/pokemon').then(res => res.json()) 7 | ) 8 | 9 | return ( 10 |
11 | {queryInfo.data?.results.map(result => { 12 | return
{result.name}
13 | })} 14 |
15 | ) 16 | } 17 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useQuery } from 'react-query' 3 | import axios from 'axios' 4 | 5 | export default function App() { 6 | const queryInfo = useQuery('pokemon', () => 7 | axios 8 | .get('https://pokeapi.co/api/v2/pokemon') 9 | .then(res => res.data.results) 10 | ) 11 | 12 | return ( 13 |
14 | {queryInfo.data?.map(result => { 15 | return
{result.name}
16 | })} 17 |
18 | ) 19 | } 20 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { render } from '@testing-library/react'; 3 | import App from './App'; 4 | 5 | test('renders learn react link', () => { 6 | const { getByText } = render(); 7 | const linkElement = getByText(/learn react/i); 8 | expect(linkElement).toBeInTheDocument(); 9 | }); 10 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 50px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 6 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 7 | sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | * { 18 | font-size: 20px; 19 | } 20 | 21 | body { 22 | padding: 0.5rem; 23 | } 24 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | import * as serviceWorker from './serviceWorker' 6 | 7 | ReactDOM.render( 8 | 9 | 10 | , 11 | document.getElementById('root') 12 | ) 13 | 14 | // If you want your app to work offline and load faster, you can change 15 | // unregister() to register() below. Note this comes with some pitfalls. 16 | // Learn more about service workers: https://bit.ly/CRA-PWA 17 | serviceWorker.unregister() 18 | -------------------------------------------------------------------------------- /02 - basic queries/app/src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom/extend-expect'; 6 | -------------------------------------------------------------------------------- /03 - query loading state/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /03 - query loading state/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /03 - query loading state/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/03 - query loading state/app/public/favicon.ico -------------------------------------------------------------------------------- /03 - query loading state/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/03 - query loading state/app/public/logo192.png -------------------------------------------------------------------------------- /03 - query loading state/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/03 - query loading state/app/public/logo512.png -------------------------------------------------------------------------------- /03 - query loading state/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /03 - query loading state/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /03 - query loading state/app/src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useQuery } from 'react-query' 3 | import axios from 'axios' 4 | 5 | export default function App() { 6 | const queryInfo = useQuery('pokemon', async () => { 7 | await new Promise(resolve => setTimeout(resolve, 1000)) 8 | return axios 9 | .get('https://pokeapi.co/api/v2/pokemon') 10 | .then(res => res.data.results) 11 | }) 12 | 13 | return queryInfo.isLoading ? ( 14 | 'Loading...' 15 | ) : ( 16 |
17 | {queryInfo.data.map(result => { 18 | return
{result.name}
19 | })} 20 |
21 | ) 22 | } 23 | -------------------------------------------------------------------------------- /03 - query loading state/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 50px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 6 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 7 | sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | * { 18 | font-size: 20px; 19 | } 20 | 21 | body { 22 | padding: 0.5rem; 23 | } 24 | -------------------------------------------------------------------------------- /03 - query loading state/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /04 - query error state/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /04 - query error state/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /04 - query error state/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/04 - query error state/app/public/favicon.ico -------------------------------------------------------------------------------- /04 - query error state/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/04 - query error state/app/public/logo192.png -------------------------------------------------------------------------------- /04 - query error state/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/04 - query error state/app/public/logo512.png -------------------------------------------------------------------------------- /04 - query error state/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /04 - query error state/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /04 - query error state/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 50px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 6 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 7 | sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | * { 18 | font-size: 20px; 19 | } 20 | 21 | body { 22 | padding: 0.5rem; 23 | } 24 | -------------------------------------------------------------------------------- /04 - query error state/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /05 - react query devtools/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /05 - react query devtools/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /05 - react query devtools/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/05 - react query devtools/app/public/favicon.ico -------------------------------------------------------------------------------- /05 - react query devtools/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/05 - react query devtools/app/public/logo192.png -------------------------------------------------------------------------------- /05 - react query devtools/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/05 - react query devtools/app/public/logo512.png -------------------------------------------------------------------------------- /05 - react query devtools/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /05 - react query devtools/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /05 - react query devtools/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /05 - react query devtools/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/06 - automatically refetch a query on window focus/app/public/favicon.ico -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/06 - automatically refetch a query on window focus/app/public/logo192.png -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/06 - automatically refetch a query on window focus/app/public/logo512.png -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /06 - automatically refetch a query on window focus/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/07 - query refetching indicators/app/public/favicon.ico -------------------------------------------------------------------------------- /07 - query refetching indicators/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/07 - query refetching indicators/app/public/logo192.png -------------------------------------------------------------------------------- /07 - query refetching indicators/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/07 - query refetching indicators/app/public/logo512.png -------------------------------------------------------------------------------- /07 - query refetching indicators/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /07 - query refetching indicators/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/08 - configure query staleTime/app/public/favicon.ico -------------------------------------------------------------------------------- /08 - configure query staleTime/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/08 - configure query staleTime/app/public/logo192.png -------------------------------------------------------------------------------- /08 - configure query staleTime/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/08 - configure query staleTime/app/public/logo512.png -------------------------------------------------------------------------------- /08 - configure query staleTime/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /08 - configure query staleTime/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/09 - configure query cacheTime/app/public/favicon.ico -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/09 - configure query cacheTime/app/public/logo192.png -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/09 - configure query cacheTime/app/public/logo512.png -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /09 - configure query cacheTime/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/10 - query keys and caching/app/public/favicon.ico -------------------------------------------------------------------------------- /10 - query keys and caching/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/10 - query keys and caching/app/public/logo192.png -------------------------------------------------------------------------------- /10 - query keys and caching/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/10 - query keys and caching/app/public/logo512.png -------------------------------------------------------------------------------- /10 - query keys and caching/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /10 - query keys and caching/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/11 - using a custom hook to consume the same query multiple times/app/public/favicon.ico -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/11 - using a custom hook to consume the same query multiple times/app/public/logo192.png -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/11 - using a custom hook to consume the same query multiple times/app/public/logo512.png -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /11 - using a custom hook to consume the same query multiple times/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /12 - parallel queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /12 - parallel queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /12 - parallel queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /12 - parallel queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /12 - parallel queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/12 - parallel queries/app/public/favicon.ico -------------------------------------------------------------------------------- /12 - parallel queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/12 - parallel queries/app/public/logo192.png -------------------------------------------------------------------------------- /12 - parallel queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/12 - parallel queries/app/public/logo512.png -------------------------------------------------------------------------------- /12 - parallel queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /12 - parallel queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /12 - parallel queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /12 - parallel queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/13 - using props or state in queries/app/public/favicon.ico -------------------------------------------------------------------------------- /13 - using props or state in queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/13 - using props or state in queries/app/public/logo192.png -------------------------------------------------------------------------------- /13 - using props or state in queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/13 - using props or state in queries/app/public/logo512.png -------------------------------------------------------------------------------- /13 - using props or state in queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-size: 16px; 5 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 6 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 7 | 'Helvetica Neue', sans-serif; 8 | -webkit-font-smoothing: antialiased; 9 | -moz-osx-font-smoothing: grayscale; 10 | } 11 | 12 | code { 13 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 14 | monospace; 15 | } 16 | 17 | body { 18 | padding: 0.5rem; 19 | } 20 | -------------------------------------------------------------------------------- /13 - using props or state in queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /14 - disabling queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /14 - disabling queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /14 - disabling queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /14 - disabling queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /14 - disabling queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/14 - disabling queries/app/public/favicon.ico -------------------------------------------------------------------------------- /14 - disabling queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/14 - disabling queries/app/public/logo192.png -------------------------------------------------------------------------------- /14 - disabling queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/14 - disabling queries/app/public/logo512.png -------------------------------------------------------------------------------- /14 - disabling queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /14 - disabling queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /14 - disabling queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /14 - disabling queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/15 - multi-part query keys/app/public/favicon.ico -------------------------------------------------------------------------------- /15 - multi-part query keys/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/15 - multi-part query keys/app/public/logo192.png -------------------------------------------------------------------------------- /15 - multi-part query keys/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/15 - multi-part query keys/app/public/logo512.png -------------------------------------------------------------------------------- /15 - multi-part query keys/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /15 - multi-part query keys/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/16 - automatic query retries/app/public/favicon.ico -------------------------------------------------------------------------------- /16 - automatic query retries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/16 - automatic query retries/app/public/logo192.png -------------------------------------------------------------------------------- /16 - automatic query retries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/16 - automatic query retries/app/public/logo512.png -------------------------------------------------------------------------------- /16 - automatic query retries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /16 - automatic query retries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /17 - query cancellation/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /17 - query cancellation/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /17 - query cancellation/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /17 - query cancellation/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /17 - query cancellation/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/17 - query cancellation/app/public/favicon.ico -------------------------------------------------------------------------------- /17 - query cancellation/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/17 - query cancellation/app/public/logo192.png -------------------------------------------------------------------------------- /17 - query cancellation/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/17 - query cancellation/app/public/logo512.png -------------------------------------------------------------------------------- /17 - query cancellation/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /17 - query cancellation/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /17 - query cancellation/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /17 - query cancellation/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /18 - dependent queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /18 - dependent queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /18 - dependent queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /18 - dependent queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /18 - dependent queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/18 - dependent queries/app/public/favicon.ico -------------------------------------------------------------------------------- /18 - dependent queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/18 - dependent queries/app/public/logo192.png -------------------------------------------------------------------------------- /18 - dependent queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/18 - dependent queries/app/public/logo512.png -------------------------------------------------------------------------------- /18 - dependent queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /18 - dependent queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /18 - dependent queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /18 - dependent queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/19 - supplying a query with initial data/app/public/favicon.ico -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/19 - supplying a query with initial data/app/public/logo192.png -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/19 - supplying a query with initial data/app/public/logo512.png -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | address: { 7 | street: 'Kulas Light', 8 | suite: 'Apt. 556', 9 | city: 'Gwenborough', 10 | zipcode: '92998-3874', 11 | geo: { 12 | lat: '-37.3159', 13 | lng: '81.1496', 14 | }, 15 | }, 16 | phone: '1-770-736-8031 x56442', 17 | website: 'hildegard.org', 18 | company: { 19 | name: 'Romaguera-Crona', 20 | catchPhrase: 'Multi-layered client-server neural-net', 21 | bs: 'harness real-time e-markets', 22 | }, 23 | } 24 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /19 - supplying a query with initial data/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/20 - marking initial query data as stale/app/public/favicon.ico -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/20 - marking initial query data as stale/app/public/logo192.png -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/20 - marking initial query data as stale/app/public/logo512.png -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /20 - marking initial query data as stale/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/21 - querying related resource lists and their individual resources/app/public/favicon.ico -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/21 - querying related resource lists and their individual resources/app/public/logo192.png -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/21 - querying related resource lists and their individual resources/app/public/logo512.png -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /21 - querying related resource lists and their individual resources/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/22 - seeding query data from other queries/app/public/favicon.ico -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/22 - seeding query data from other queries/app/public/logo192.png -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/22 - seeding query data from other queries/app/public/logo512.png -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /22 - seeding query data from other queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/23 - using query data to seed future queries/app/public/favicon.ico -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/23 - using query data to seed future queries/app/public/logo192.png -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/23 - using query data to seed future queries/app/public/logo512.png -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /23 - using query data to seed future queries/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /24 - query side-effects/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /24 - query side-effects/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /24 - query side-effects/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /24 - query side-effects/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /24 - query side-effects/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/24 - query side-effects/app/public/favicon.ico -------------------------------------------------------------------------------- /24 - query side-effects/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/24 - query side-effects/app/public/logo192.png -------------------------------------------------------------------------------- /24 - query side-effects/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/24 - query side-effects/app/public/logo512.png -------------------------------------------------------------------------------- /24 - query side-effects/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /24 - query side-effects/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /24 - query side-effects/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /24 - query side-effects/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /24 - query side-effects/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/25 - scroll restoration/app/public/favicon.ico -------------------------------------------------------------------------------- /25 - scroll restoration/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/25 - scroll restoration/app/public/logo192.png -------------------------------------------------------------------------------- /25 - scroll restoration/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/25 - scroll restoration/app/public/logo512.png -------------------------------------------------------------------------------- /25 - scroll restoration/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /25 - scroll restoration/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/26 - query polling with refetchInterval/app/public/favicon.ico -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/26 - query polling with refetchInterval/app/public/logo192.png -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/26 - query polling with refetchInterval/app/public/logo512.png -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /26 - query polling with refetchInterval/app/src/pages/api/time.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 500)) 4 | res.json({ 5 | time: Date.now(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/27 - invalidating queries/app/public/favicon.ico -------------------------------------------------------------------------------- /27 - invalidating queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/27 - invalidating queries/app/public/logo192.png -------------------------------------------------------------------------------- /27 - invalidating queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/27 - invalidating queries/app/public/logo512.png -------------------------------------------------------------------------------- /27 - invalidating queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /27 - invalidating queries/app/src/pages/api/random.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 500)) 4 | res.json({ 5 | random: Math.random(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/28 - invalidating but not refetching active queries/app/public/favicon.ico -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/28 - invalidating but not refetching active queries/app/public/logo192.png -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/28 - invalidating but not refetching active queries/app/public/logo512.png -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /28 - invalidating but not refetching active queries/app/src/pages/api/random.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 500)) 4 | res.json({ 5 | random: Math.random(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/29 - invalidating & refetching inactive queries/app/public/favicon.ico -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/29 - invalidating & refetching inactive queries/app/public/logo192.png -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/29 - invalidating & refetching inactive queries/app/public/logo512.png -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /29 - invalidating & refetching inactive queries/app/src/pages/api/random.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 500)) 4 | res.json({ 5 | random: Math.random(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/30 - invalidating multiple queries with shared query keys/app/public/favicon.ico -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/30 - invalidating multiple queries with shared query keys/app/public/logo192.png -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/30 - invalidating multiple queries with shared query keys/app/public/logo512.png -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /30 - invalidating multiple queries with shared query keys/app/src/pages/api/random.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 200)) 4 | res.json({ 5 | random: Math.random(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/31 - basic query prefetching/app/public/favicon.ico -------------------------------------------------------------------------------- /31 - basic query prefetching/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/31 - basic query prefetching/app/public/logo192.png -------------------------------------------------------------------------------- /31 - basic query prefetching/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/31 - basic query prefetching/app/public/logo512.png -------------------------------------------------------------------------------- /31 - basic query prefetching/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/src/pages/_app.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ReactQueryDevtools } from 'react-query-devtools' 3 | 4 | export default function App({ Component, pageProps }) { 5 | return ( 6 | <> 7 | 8 | 9 | 10 | ) 11 | } 12 | -------------------------------------------------------------------------------- /31 - basic query prefetching/app/src/pages/api/random.js: -------------------------------------------------------------------------------- 1 | export default async (req, res) => { 2 | if (req.method === 'GET') { 3 | await new Promise(r => setTimeout(r, 200)) 4 | res.json({ 5 | random: Math.random(), 6 | }) 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/32 - hover-based prefetching/app/public/favicon.ico -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/32 - hover-based prefetching/app/public/logo192.png -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/32 - hover-based prefetching/app/public/logo512.png -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /32 - hover-based prefetching/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/33 - prefetching with staleTime/app/public/favicon.ico -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/33 - prefetching with staleTime/app/public/logo192.png -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/33 - prefetching with staleTime/app/public/logo512.png -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /33 - prefetching with staleTime/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["react-app", "prettier"], 3 | "rules": {} 4 | } 5 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 75, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": false, 6 | "singleQuote": true, 7 | "trailingComma": "es5", 8 | "bracketSpacing": true, 9 | "jsxBracketSameLine": false, 10 | "arrowParens": "avoid", 11 | "endOfLine": "auto" 12 | } 13 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/34 - forced prefetching/app/public/favicon.ico -------------------------------------------------------------------------------- /34 - forced prefetching/app/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/34 - forced prefetching/app/public/logo192.png -------------------------------------------------------------------------------- /34 - forced prefetching/app/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/34 - forced prefetching/app/public/logo512.png -------------------------------------------------------------------------------- /34 - forced prefetching/app/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/src/existingUser.js: -------------------------------------------------------------------------------- 1 | export default { 2 | id: 1, 3 | name: 'Leanne Graham', 4 | username: 'Bret', 5 | email: 'Sincere@april.biz', 6 | } 7 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/src/index.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 5 | 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 6 | 'Helvetica Neue', sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | body, 12 | input, 13 | button { 14 | font-size: 24px; 15 | } 16 | 17 | code { 18 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 19 | monospace; 20 | } 21 | 22 | body { 23 | padding: 0.5rem; 24 | } 25 | -------------------------------------------------------------------------------- /34 - forced prefetching/app/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import './index.css' 4 | import App from './App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | , 10 | document.getElementById('root') 11 | ) 12 | -------------------------------------------------------------------------------- /35 - mutation basics/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /35 - mutation basics/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /35 - mutation basics/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /35 - mutation basics/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /35 - mutation basics/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /35 - mutation basics/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /35 - mutation basics/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /35 - mutation basics/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /35 - mutation basics/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /35 - mutation basics/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /35 - mutation basics/app/hooks/usePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useQuery, queryCache } from 'react-query' 3 | 4 | export const fetchPost = (_, postId) => 5 | axios.get(`/api/posts/${postId}`).then((res) => res.data) 6 | 7 | export default function usePost(postId) { 8 | return useQuery(['posts', postId], fetchPost, { 9 | initialData: () => 10 | queryCache.getQueryData('posts')?.find((d) => d.id == postId), 11 | initialStale: true, 12 | }) 13 | } 14 | -------------------------------------------------------------------------------- /35 - mutation basics/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /35 - mutation basics/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/35 - mutation basics/app/public/favicon.ico -------------------------------------------------------------------------------- /35 - mutation basics/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/hooks/usePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useQuery, queryCache } from 'react-query' 3 | 4 | export const fetchPost = (_, postId) => 5 | axios.get(`/api/posts/${postId}`).then((res) => res.data) 6 | 7 | export default function usePost(postId) { 8 | return useQuery(['posts', postId], fetchPost, { 9 | initialData: () => 10 | queryCache.getQueryData('posts')?.find((d) => d.id == postId), 11 | initialStale: true, 12 | }) 13 | } 14 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /37 - mutation side-effects/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/37 - mutation side-effects/app/public/favicon.ico -------------------------------------------------------------------------------- /37 - mutation side-effects/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/38 - updating query data with mutation responses/app/public/favicon.ico -------------------------------------------------------------------------------- /38 - updating query data with mutation responses/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/39 - optimistic updates from mutations for multi-entity queries/app/public/favicon.ico -------------------------------------------------------------------------------- /39 - optimistic updates from mutations for multi-entity queries/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /43 - paginated queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /43 - paginated queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /43 - paginated queries/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /43 - paginated queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /43 - paginated queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /43 - paginated queries/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /43 - paginated queries/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /43 - paginated queries/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /43 - paginated queries/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /43 - paginated queries/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /43 - paginated queries/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /43 - paginated queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/43 - paginated queries/app/public/favicon.ico -------------------------------------------------------------------------------- /43 - paginated queries/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/44 - prefetching paginated queries/app/public/favicon.ico -------------------------------------------------------------------------------- /44 - prefetching paginated queries/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /45 - infinite queries/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /45 - infinite queries/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /45 - infinite queries/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /45 - infinite queries/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /45 - infinite queries/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /45 - infinite queries/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /45 - infinite queries/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /45 - infinite queries/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /45 - infinite queries/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /45 - infinite queries/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /45 - infinite queries/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /45 - infinite queries/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/45 - infinite queries/app/public/favicon.ico -------------------------------------------------------------------------------- /45 - infinite queries/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": ["styled-components"] 4 | } 5 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "extends": ["react-app", "prettier"], 4 | "env": { 5 | "es6": true 6 | }, 7 | "parserOptions": { 8 | "sourceType": "module" 9 | }, 10 | "rules": { 11 | "jsx-a11y/anchor-is-valid": 0, 12 | "eqeqeq": 0 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | 21 | # debug 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | 26 | # local env files 27 | .env.local 28 | .env.development.local 29 | .env.test.local 30 | .env.production.local 31 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true 4 | } 5 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/README.md: -------------------------------------------------------------------------------- 1 | - Run `yarn` and then `yarn dev` locally. 2 | - The Next.js API server is an in-memory local server, so the data is not actually persisted to disk. The posts that are stored or altered will be reset when the server restarts or when a file is saved and the server is recompiled. 3 | - Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. 4 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/components/Sidebar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Link from 'next/link' 3 | 4 | import { SidebarStyles } from './styled' 5 | 6 | export default function Sidebar() { 7 | return ( 8 | 9 |
    10 |
  • 11 | 12 | Home 13 | 14 |
    • 15 |
16 | 17 | ) 18 | } 19 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/components/styled.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Wrapper = styled.div` 4 | display: flex; 5 | height: 96vh; 6 | ` 7 | 8 | export const SidebarStyles = styled.div` 9 | width: 175px; 10 | border-right: 1px solid black; 11 | padding: 1rem; 12 | ` 13 | 14 | export const Main = styled.div` 15 | flex: 1; 16 | padding: 1rem; 17 | ` 18 | 19 | export const PostStyles = styled.div` 20 | display: inline-block; 21 | border: solid 1px gray; 22 | padding: 1rem; 23 | color: inherit; 24 | 25 | :hover { 26 | text-decoration: none; 27 | h3 { 28 | text-decoration: underline; 29 | } 30 | } 31 | ` 32 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/db/index.js: -------------------------------------------------------------------------------- 1 | import fs from 'fs-extra' 2 | import path from 'path' 3 | 4 | const storeLocation = path.resolve(process.cwd(), 'store.json') 5 | 6 | export default { 7 | set, 8 | get, 9 | } 10 | 11 | async function set(updater) { 12 | const file = await fs.readJSON(storeLocation) 13 | const newFile = updater(file) 14 | await fs.writeJSON(storeLocation, newFile) 15 | } 16 | 17 | function get() { 18 | return fs.readJSON(storeLocation) 19 | } 20 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/hooks/useDeletePost.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | import { useMutation, queryCache } from 'react-query' 3 | 4 | export default function useDeletePost() { 5 | return useMutation( 6 | (postId) => axios.delete(`/api/posts/${postId}`).then((res) => res.data), 7 | { 8 | onSuccess: (data, variables) => { 9 | queryCache.invalidateQueries('posts') 10 | }, 11 | } 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/pages/404.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 |
9 |

15 | 404 16 |

17 |

22 | Page not found 23 |

24 |
25 | ) 26 | -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/46 - SSR with nextjs 1/app/public/favicon.ico -------------------------------------------------------------------------------- /46 - SSR with nextjs 1/app/utils.js: -------------------------------------------------------------------------------- 1 | export function sleep(time) { 2 | return new Promise((resolve) => setTimeout(resolve, time)) 3 | } 4 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React Query Essentials 2 | 3 | This repo contains all of the source code used to create the [React Query Essentials course](https://learn.tanstack.com/p/react-query-essentials)! 4 | 5 | Enjoy! 6 | -------------------------------------------------------------------------------- /media/react-query-essentials.sketch: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tannerlinsley/react-query-essentials/99bf506a569ae4f84b2444073a111bac8ff7168b/media/react-query-essentials.sketch --------------------------------------------------------------------------------