<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Rohit Ravikoti</title>
    <description>The latest articles on DEV Community by Rohit Ravikoti (@rovvum).</description>
    <link>https://dev.to/rovvum</link>
    <image>
      <url>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%2F162607%2F6286131b-bf66-490f-822d-c2948a6b7f0b.png</url>
      <title>DEV Community: Rohit Ravikoti</title>
      <link>https://dev.to/rovvum</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/rovvum"/>
    <language>en</language>
    <item>
      <title>GraphQL Code-First and SDL-First, the Current Landscape in Mid-2019</title>
      <dc:creator>Rohit Ravikoti</dc:creator>
      <pubDate>Fri, 12 Jul 2019 15:39:35 +0000</pubDate>
      <link>https://dev.to/novvum/graphql-code-first-and-sdl-first-the-current-landscape-in-mid-2019-547h</link>
      <guid>https://dev.to/novvum/graphql-code-first-and-sdl-first-the-current-landscape-in-mid-2019-547h</guid>
      <description>&lt;p&gt;There has been a lot of buzz in the GraphQL community around code-first or SDL-first schema development as of late. The purpose of this blog is to shed some light on the current state of the ecosystem and help teams make a decision on which approach would be best for them.&lt;/p&gt;

&lt;p&gt;To understand where we are today, it helps to take a look at how we got here.&lt;/p&gt;

&lt;h2&gt;
  
  
  Code-first: the original way to build a graphql schema
&lt;/h2&gt;

&lt;p&gt;Facebook originally released &lt;a href="https://github.com/graphql/graphql-js" rel="noopener noreferrer"&gt;graphql-js&lt;/a&gt; as a reference implementation for the GraphQL specification. The schema is defined as a plain javascript object:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const { GraphQLSchema, GraphQLObjectType, GraphQLString } = require('graphql')

const schema = new GraphQLSchema({  
  query: new GraphQLObjectType({  
    name: 'Query',  
    fields: {  
      hello: {  
        type: GraphQLString,  
        args: {  
          name: { type: GraphQLString },  
        },  
        resolve: (_, args) =&amp;amp;gt; `Hello ${args.name || 'World!'}`,  
      },  
    },  
  }),  
})  
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Many people in the community felt that writing a schema in this way was very verbose, and it was challenging to have a mental model of the schema while implementing it.&lt;/p&gt;

&lt;h2&gt;
  
  
  Enter SDL
&lt;/h2&gt;

&lt;p&gt;The Apollo team released graphql-tools, which popularized the Schema Definition Language (SDL). Here is what the same schema from above looks like defined in SDL:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;type Query {  
  hello(name: String): String  
}  
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It was much easier to understand the structure of the schema with SDL and, ultimately made the schema design process much more intuitive. The Apollo team also came up with &lt;a href="https://www.apollographql.com/docs/graphql-tools/schema-directives/" rel="noopener noreferrer"&gt;schema directives&lt;/a&gt; to accompany the SDL.&lt;/p&gt;

&lt;p&gt;One significant tradeoff for the SDL-first approach is that resolvers need to be implemented separately from the schema definition. Consequently, &lt;a href="https://www.prisma.io/blog/the-problems-of-schema-first-graphql-development-x1mn4cb0tyl3#analyzing-the-problems-of-sdl-first-development" rel="noopener noreferrer"&gt;various new challenges&lt;/a&gt; came about. Directives are also &lt;a href="https://github.com/graphql/graphql-js/issues/1343" rel="noopener noreferrer"&gt;not&lt;/a&gt; a part of the core GraphQL specification.&lt;/p&gt;

&lt;h2&gt;
  
  
  The pendulum swings back to code-first
&lt;/h2&gt;

&lt;p&gt;Tools like &lt;a href="http://typegraphql.ml/" rel="noopener noreferrer"&gt;TypeGraphQL&lt;/a&gt; and &lt;a href="https://nexus.js.org/" rel="noopener noreferrer"&gt;GraphQL Nexus&lt;/a&gt; were released to reduce the verbosity of graphql-js and provide a much simpler way to develop schemas than the SDL approach. These tools are built with graphql-js at their core, so they do not have support for schema directives — here are issues requesting support for them in &lt;a href="https://github.com/19majkel94/type-graphql/issues/77" rel="noopener noreferrer"&gt;TypeGraphQL&lt;/a&gt; and &lt;a href="https://github.com/prisma/nexus/issues/53" rel="noopener noreferrer"&gt;GraphQL Nexus&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Federated schemas…
&lt;/h2&gt;

&lt;p&gt;The Apollo team recently introduced the &lt;a href="https://blog.apollographql.com/apollo-federation-f260cf525d21" rel="noopener noreferrer"&gt;Schema Federation&lt;/a&gt; specification for building distributed graphs. It significantly improved on a lot of the pitfalls of schema stitching and enabled a truly distributed architecture. The specification utilizes schema directives, so individual schemas can provide hints to the gateway server on how they are related to one another.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmiro.medium.com%2Fmax%2F700%2F1%2AtKMI6wsfV4IGdBudipOK7g.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmiro.medium.com%2Fmax%2F700%2F1%2AtKMI6wsfV4IGdBudipOK7g.png" alt="apollofederation"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The major problem here is that the code-first libraries are unable to support schema federation because they do not support directives. There have been issues submitted for &lt;a href="https://github.com/19majkel94/type-graphql/issues/351" rel="noopener noreferrer"&gt;TypeGraphQL&lt;/a&gt; and &lt;a href="https://github.com/prisma/nexus/issues/148" rel="noopener noreferrer"&gt;GraphQL Nexus&lt;/a&gt; requesting support, but there hasn’t been much progress as of yet.&lt;/p&gt;

&lt;h2&gt;
  
  
  So, code-first or SDL-first?
&lt;/h2&gt;

&lt;p&gt;Innovation will come with its fair share of disruption, and the GraphQL ecosystem is no exception. There are risks and tradeoffs when selecting any toolset, and teams must carefully look at their circumstances to understand which approach suits their needs.&lt;/p&gt;

&lt;h3&gt;
  
  
  Here are a couple of suggestions:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;If your team needs schema federation or directives, then it is best to go with the SDL-first approach until the ecosystem catches up.&lt;/li&gt;
&lt;li&gt;If your team doesn’t need schema federation or directives, then it is best to go with code-first — especially if you have a large schema. It will help your team keep your codebases organized and moving quickly.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  What if you made the wrong choice?
&lt;/h3&gt;

&lt;p&gt;The silver lining here is that you are not necessarily stuck with the decision your team makes now. Because both approaches are fundamentally the same (you define a schema and resolvers), it is not difficult to reuse most if not all of the business logic when switching from one approach to the other. One thing to note is that it is currently much easier to start with code-first and then switch to SDL-first because of the lack of schema directive support in code-first.&lt;/p&gt;

&lt;p&gt;I hope this proved helpful for teams struggling to stay on top of everything that is happening in the GraphQL ecosystem. You can always reach out to us at &lt;a href="https://www.novvum.io/contact-us" rel="noopener noreferrer"&gt;Novvum&lt;/a&gt; for help!&lt;/p&gt;

&lt;h6&gt;
  
  
  about us: &lt;a href="https://novvum.io" rel="noopener noreferrer"&gt;Novvum&lt;/a&gt; is a modern software development agency specializing in engineering, strategy, &amp;amp; design.
&lt;/h6&gt;

</description>
      <category>graphql</category>
      <category>discuss</category>
      <category>coding</category>
      <category>development</category>
    </item>
  </channel>
</rss>
