The latest articles on DEV Community by Mario Boss (@mario_boss). https://dev.to/mario_boss https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F355353%2Ff6f49cea-fa4e-4c6d-a430-fc16d4b1eaa3.png https://dev.to/mario_boss en Mario Boss Wed, 25 Mar 2020 15:45:18 +0000 https://dev.to/mario_boss/recommended-way-to-use-graphql-in-next-js-app-59b5 https://dev.to/mario_boss/recommended-way-to-use-graphql-in-next-js-app-59b5 <div class="ltag__stackexchange--container"> <div class="ltag__stackexchange--title-container"> <div class="ltag__stackexchange--title"> <h1> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--pTF_nE4a--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/stackoverflow-logo-b42691ae545e4810b105ee957979a853a696085e67e43ee14c5699cf3e890fb4.svg" alt=""> <a href="https://stackoverflow.com/questions/60852061/recommended-way-to-use-graphql-in-next-js-app" rel="noopener noreferrer"> Recommended way to use GraphQL in Next.js app </a> </h1> <div class="ltag__stackexchange--post-metadata"> <span>Mar 25 '20</span> <span>Comments: 2</span> <span>Answers: 2</span> </div> </div> <a class="ltag__stackexchange--score-container" href="https://stackoverflow.com/questions/60852061/recommended-way-to-use-graphql-in-next-js-app" rel="noopener noreferrer"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--5MiFESHx--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/stackexchange-arrow-up-eff2e2849e67d156181d258e38802c0b57fa011f74164a7f97675ca3b6ab756b.svg" alt=""> <div class="ltag__stackexchange--score-number"> 8 </div> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Rk_a5QFN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/stackexchange-arrow-down-4349fac0dd932d284fab7e4dd9846f19a3710558efde0d2dfd05897f3eeb9aba.svg" alt=""> </a> </div> <div class="ltag__stackexchange--body"> <p>In my apps, I am using following <strong>NPM modules</strong> to play with <a href="https://strapi.io/" rel="noreferrer">Strapi</a>, <a href="https://graphql.org/" rel="noreferrer">GraphQL</a> and <a href="https://nextjs.org/" rel="noreferrer">Next.js</a>:</p> <ul> <li><a href="https://www.npmjs.com/package/react-apollo" rel="noreferrer">react-apollo</a></li> <li><a href="https://www.npmjs.com/package/next-apollo" rel="noreferrer">next-apollo</a></li> <li><a href="https://www.npmjs.com/package/graphql" rel="noreferrer">graphql</a></li> <li> <a href="https://www.npmjs.com/package/gql" rel="noreferrer">gql</a> </li> <li><a href="https://www.npmjs.com/package/recompose" rel="noreferrer">recompose</a></li> </ul> <p>In the next step, I am creating Apollo config file, example below:</p> <pre><code>import { HttpLink } from "apollo-link-http"; import { withData } from "next-apollo"; const config =</code></pre>… </div> <div class="ltag__stackexchange--btn--container"> <a href="https://stackoverflow.com/questions/60852061/recommended-way-to-use-graphql-in-next-js-app" rel="noopener noreferrer">Open Full Question</a> </div> </div> graphql nextjs apollo javascript