Currently, I'm utilizing nextJS for my frontend development along with Apollo and GraphQL. For fetching queries, I am using the getStaticProps() function. To enhance modularity and maintainability, I have segmented my queries into multiple parts.
The structure of my query folder is as follows:
src/queries getPost.js getMenu.js getProduct.js index.js
All queries are stored and exported in the index.js file. However, due to having multiple queries in the folder, I am restricted to fetching only one query at a time.
import { getPost } from '../src/queries';
This is how I currently fetch a query:
export const getStaticProps = async () => {
const { data } = await client.query({
query: getPost,
});
return {
props: {
data: {
post: data.post.edges
}
},
revalidate: 60,
};
};
I would like assistance on how to fetch multiple queries simultaneously, such as getPost and getProduct. Any guidance on achieving this would be greatly appreciated.