Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature] example with Nuxt.js #19

Open
frankspin89 opened this issue Jul 21, 2017 · 15 comments
Open

[Feature] example with Nuxt.js #19

frankspin89 opened this issue Jul 21, 2017 · 15 comments

Comments

@frankspin89
Copy link

Would be awesome to see an example to use Graph.cool with Nuxt.js.

I"m curious to see how to implement GraphQL with Server Side rendering

@dohomi
Copy link

dohomi commented Jul 24, 2017

Hi @frankspin89 there are couple of discussions about apollo and vue/nuxt. You might need to wait untill Nuxt 1.x is finalized with an working example of vue-apollo. You can find the discussion here:
nuxt/nuxt#504
I am using the vanilla javascript approach of Pier and it works very neat. If you are using vuex in your app give it a shot: https://github.com/PierBover/vuex-apollo-example-project You can use that approach right away because it almost no dependencies and works without an issue already on Nuxt 0.10.7

@frankspin89
Copy link
Author

@dohomi thanks! I started to implement the approach of Pier. The basics are working fine for me. Had to disable subscriptions on the server side.

@dohomi
Copy link

dohomi commented Jul 24, 2017

@frankspin89 yes I am using subscriptions only on the client side: nuxt/nuxt#984 I also couldn't require ws on the server side

@frankspin89
Copy link
Author

@dohomi Do you also have to use fetchPolicy: 'network-only' to load new data correctly?

@dohomi
Copy link

dohomi commented Jul 24, 2017

@frankspin89 no that I only had to use on vue-apollo, but I removed that from my project. With vanilla apollo I do:

  const ssr = process.SERVER_BUILD
  return new ApolloClient({
    networkInterface: networkConf,
    dataIdFromObject: r => r.id,
    ...(ssr ? {
      ssrMode: true
    } : {
      connectToDevTools: process.env.NODE_ENV !== 'production'
    })
  })

@vuchl
Copy link

vuchl commented Jul 26, 2017

thee is this nuxt/nuxt#1160 and this nuxt/nuxt#1161 now

@marktani
Copy link
Contributor

That's awesome, thanks @vuchl!

@dohomi
Copy link

dohomi commented Jul 27, 2017

an official example came out now for rc2: https://github.com/nuxt/nuxt.js/tree/dev/examples/vue-apollo

@vuchl
Copy link

vuchl commented Jul 28, 2017

yes the newly release [vue-apollo](https://github.com/nuxt/nuxt.js/tree/dev/examples/vue-apollo) is much smarter: there is now a nuxt module nuxt-community/apollo-module that is responsible to provide the apollo client in the nuxt environment. and you only need to specify the graphql endpoint in your nuxt.config.js. Really well architected.

@frankspin89
Copy link
Author

Maybe i'm missing something but the new release seems far from complete? Don't see a option to authenticate requests with a bearer token? And it's lacking a implementation to use subscriptions?

@vuchl
Copy link

vuchl commented Jul 28, 2017

it's just a simple example of how to integrate the vue-apollo plugin as a module in nuxt. Detailed Auth examples and mutations are not yet in.

@marktani
Copy link
Contributor

Here's a great Nuxt example: https://www.graph.cool/forum/t/nuxt-js-apollo-website-for-sharing-codes/545?u=nilan :) Thanks to @Samuell1 for working on that! 🎉

@sebastianmacias
Copy link

Any update on this?

Tnx

@dohomi
Copy link

dohomi commented Oct 30, 2017

I'd recommend to use https://github.com/nuxt-community/apollo-module

@Lahori-Jawan
Copy link

@sebastianmacias @dohomi @frankspin89 Although pretty late but I had built a blog using node+nuxt+graphQL(apollo)+sequelize here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants