diff --git a/README.md b/README.md index d9ea44c..5721e7b 100644 --- a/README.md +++ b/README.md @@ -2,13 +2,15 @@ > Node.js library that generates [React Query (also called TanStack Query)](https://tanstack.com/query) hooks based on an OpenAPI specification file. +[![npm version](https://badge.fury.io/js/%407nohe%2Fopenapi-react-query-codegen.svg)](https://badge.fury.io/js/%407nohe%2Fopenapi-react-query-codegen) + ## Features -- Supports generation of custom react hooks that use React Query's `useQuery` and `useMutation` hooks -- Supports generation of query keys for query caching -- Supports the option to use pure TypeScript clients generated by [@hey-api/openapi-ts](https://github.com/hey-api/openapi-ts) +- Generates custom react hooks that use React Query's `useQuery`, `useSuspenseQuery` and `useMutation` hooks +- Generates query keys and functions for query caching +- Generates pure TypeScript clients generated by [@hey-api/openapi-ts](https://github.com/hey-api/openapi-ts) -## Install +## Installation ``` $ npm install -D @7nohe/openapi-react-query-codegen @@ -58,15 +60,15 @@ Options: -h, --help display help for command ``` -## Example Usage +### Example Usage -### Command +#### Command ``` $ openapi-rq -i ./petstore.yaml ``` -### Output directory structure +#### Output directory structure ``` - openapi @@ -81,9 +83,9 @@ $ openapi-rq -i ./petstore.yaml - [Prefetching docs](https://tanstack.com/query/latest/docs/framework/react/guides/advanced-ssr#prefetching-and-dehydrating-data) -### In your app +#### In your app -#### Using the generated hooks +##### Using the generated hooks ```tsx // App.tsx @@ -102,7 +104,7 @@ function App() { export default App; ``` -#### Using the generated typescript client +##### Using the generated typescript client ```tsx import { useQuery } from "@tanstack/react-query"; @@ -125,7 +127,7 @@ function App() { export default App; ``` -#### Using Suspense Hooks +##### Using Suspense Hooks ```tsx // App.tsx @@ -158,7 +160,7 @@ function App() { export default App; ``` -#### Runtime Configuration +##### Runtime Configuration You can modify the default values used by the generated service calls by modifying the OpenAPI configuration singleton object.