Is it possible to convert an express project to graphql-yoga?

[yourtallness]

Given an express project (e.g. I have a generated nuxt project with an express server) can I add the same dependencies as graphql-yoga and convert it to a graphql-yoga project?

TIA

[johnsonjo4531]

Disclaimer: I am not a maintainer of this repo I'm just trying to be helpful.

@yourtallness GraphQL is used for APIs, so technically anywhere you can use multiple API routes in express you can replace them with (or just use them alongside) a single route using a GraphQL server. Notice I said API routes, because although GraphQL is great for APIs it isn't meant for sending HTML to Webpages like Express and Nuxt do, so what I'm saying is Nuxt, Express, and GraphQL are all complimentary and each have their own benefits. I honestly have barely even touched Nuxt (I think it is very well designed I'm just using React at the moment, though Vue is very well designed as well), so I'm not quite sure the relationship between Nuxt and Express, so you'll hopefully already know that or can figure it out.

You can use Express and/or Nuxt to render your webpages on certain routes, and the GraphQL server can be used from the front and/or Express/Nuxt backend to grab your data. I might suggest you make a seperate business logic layer that grabs the data needed to render your initial routes or use something like Apollo Vue as your client possibly with Server Side Rendering SSR. Any of that technology should be compatible with Nuxt, Express, and GraphQL servers.

If you want to do this with GraphQL yoga I assume (since app implements the middleware interface) you can use your top level express app like so (copied and modified from quickstart):

// Declare your app add middleware like normal etc... 

import { GraphQLServer } from 'graphql-yoga'
// ... or using `require()`
// const { GraphQLServer } = require('graphql-yoga')

const typeDefs = `
  type Query {
    hello(name: String): String!
  }
`

const resolvers = {
  Query: {
    hello: (_, { name }) => `Hello ${name || 'World'}`,
  },
}

const server = new GraphQLServer({ typeDefs, resolvers })

// Notice this line here:
server.express.use(app)

server.start(() => console.log('Server is running on localhost:4000'))

If you want to do this with Apollo Server according to the docs it accepts a top level express app like so (my comments were added):

// You need to create app somewhere up here and use express like you normally would
// ...
const { ApolloServer, gql } = require('apollo-server-express');
const { typeDefs, resolvers } = require('./schema');

// this is the GraphQL server you create from your schema.
const server = new ApolloServer({
  typeDefs,
  resolvers,
});

// notice `app` here is your top level express app
server.applyMiddleware({ app });

// Notice this is the default express app.listen, since you applied your graphql server middleware
// to your express app express can handle serving your graphql routes and forwarding those
// routes to your graphql server.
app.listen({ port: 4000 }, () =>
  console.log(`🚀 Server ready at http://localhost:4000${server.graphqlPath}`)
)

Also note, GraphQL Yoga might not fit your use case, but you can always try to look at the FAQ. Also feel free to close If I sufficiently answered your question.

[saihaj]

Hey @yourtallness @johnsonjo4531 we @the-guild-org are the new maintainers for this project. We are actively developing v2. The new yoga server is framework agnostic, so you can bring framework of your choice! Checkout our express server integration https://www.graphql-yoga.com/docs/integrations/integration-with-express would love to get your feedback on this!

[johnsonjo4531]

@saihaj Wow!!! That's incredible, it even works with Deno!

[saihaj]

@saihaj Wow!!! That's incredible, it even works with Deno!

Yes the agontic core package allows us to support any platform that supports fetch API’s Request and Response objects. Tested it while back as POC it worked, there are some things around dependency resolution and possibly some things in graphql. We are working on them and part of stable release is to add more tests in CI for deno :) so we don’t break anything