TypeScript GraphQL

Open-source TypeScript projects categorized as GraphQL

Top 23 TypeScript GraphQL Projects

  • react-query

    ⚛️ Hooks for fetching, caching and updating asynchronous data in React

    Latest mention: Using a React Table with Client-Side Pagination | dev.to | 2021-01-27

    To make the call to the API, I used useQuery hook from the react-query package (https://github.com/tannerlinsley/react-query). This hook will manage the fetch for us and return an object with data, isLoading, error, and more. Thus, we avoid the need to maintain the different states of the fetch process. Also, it provides other advantages like caching, updating out-of-date data in the background, performance optimizations, and many more. If you want to know more about react-query visit its documentation https://react-query.tanstack.com/overview.

  • apollo-client

    :rocket: A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server

    Latest mention: Apollo Client 3 - Pagination | reddit.com/r/graphql | 2021-01-11

    for example using one of this helper functions in the "new InMemoryCache" instance: helper functions

  • RxDB

    🔄 A realtime Database for JavaScript Applications

  • Bit

    Build, distribute, and collaborate on components.

    Latest mention: What do people use to build websites for documentation for their framework/library? | reddit.com/r/Frontend | 2020-12-21

    Bit is great for component-sharing / documentation, but if you want to use it for free for private projects, you'll need to host the server yourself.

  • graphiql

    GraphiQL & the GraphQL LSP Reference Ecosystem for building browser & IDE tools.

    Latest mention: GraphQL via HTTP in five ways: cURL, Python, JavaScript, Ruby and PHP | dev.to | 2021-01-14

    Before we can get started, we need a query and an API endpoint to hit. Getting both of those items via Contentful is a breeze. For the API endpoint, we can use Contentful's API Base URL https://graphql.contentful.com, taken from the GraphQL docs. To find a query we can use GraphiQL, an in-browser GraphQL IDE. Open up https://graphql.contentful.com/content/v1/spaces/{SPACE_ID}/explore?access_token={accessToken}, replacing the spaceID and accessToken with your own.

  • apollo-server

    🌍 GraphQL server for Express, Connect, Hapi, Koa and more

    Latest mention: Is Apollo Team Plan worth it? | reddit.com/r/graphql | 2021-01-23

    If you're using hot chocolate (or any other GraphQL server that isn't apollo server) and want to use apollo studio for metrics, field usage data and schema validation (plus more), you'll need to follow the docs to send metrics from your GraphQL server to our trace ingestion endpoint in the documented format. I've seen it done and it's not that bad. You can view the apollo server plugin implementation to see how it's done as an example.

  • postgraphile

    Execute one command (or mount one Node.js middleware) and get an instant high-performance GraphQL API for your PostgreSQL database!

    Latest mention: v4.11.0-rc.0 | reddit.com/r/PostGraphile | 2021-01-22
  • graphql-playground

    🎮 GraphQL IDE for better development workflows (GraphQL Subscriptions, interactive docs & collaboration)

    Latest mention: Getting started with GraphQL and Node.js | dev.to | 2020-11-25

    GraphQL Playground is a graphical, interactive, in-browser GraphQL IDE, created by Prisma and based on GraphiQL. - Apollo docs

  • API Platform

    Create REST and GraphQL APIs, scaffold Jamstack webapps, stream changes in real-time.

  • graphql-yoga

    🧘 Fully-featured GraphQL Server with focus on easy setup, performance & great developer experience

    Latest mention: What's the best stack for quickly hacking together prototypes and experiments? | reddit.com/r/reactjs | 2020-12-30

    GraphQL Yoga - Good convo to have a quick GQL service.

  • graphql-code-generator

    A tool for generating code based on a GraphQL schema and GraphQL operations (query/mutation/subscription), with flexible support for custom plugins.

    Latest mention: Create a sample app with TypeScript, React, typeorm, type-graphql. graphql-code-generator while reading "Learning GraphQL" | dev.to | 2021-01-23

    Used graphql-code-generator to generate the types for TypeScript from the GraphQL schema that the back-end generated.

  • quicktype

    Generate types and converters from JSON, Schema, and GraphQL

    Latest mention: Schema first JSON API with MSON and JSON Schema | dev.to | 2021-01-01

    This is a container packaging quicktype to generate Type classes from Json Schema. Purpose of this pacakge is to provide convenience of avoiding installing all tools and requirements to use quicktype to generate type classes from json schema

  • TypeGraphQL

    Create GraphQL schema and resolvers with TypeScript, using classes and decorators!

    Latest mention: Create a sample app with TypeScript, React, typeorm, type-graphql. graphql-code-generator while reading "Learning GraphQL" | dev.to | 2021-01-23

    Used typeorm and type-graphql to define the GraphQL schema and DB schema conveniently. type-graphql automatically generates the schema file :) It might be better o try Nest.js...?

  • express-graphql

    Create a GraphQL HTTP server with Express.

    Latest mention: GraphQL the Simple Way, or: Don't Use Apollo | dev.to | 2020-09-02

    That leaves the final step, which is easily handled with express-graphql: a simple Express middleware, with just 4 dependencies that handle content negotiation & body parsing. That works for Express or Connect, and there's similar tiny packages available for most other servers.

  • webiny-js

    Platform for building serverless applications and APIs (Node.js, React, GraphQL)

    Latest mention: Webiny - Opensource platform for building serverless applications and APIs. | dev.to | 2020-10-12

    Check their github : https://github.com/webiny/webiny-js

  • searchkit

    GraphQL API & React UI components for Elasticsearch. The easiest way to build a great search experience

  • graphql-request

    Minimal GraphQL client supporting Node and browsers for scripts or simple apps

    Latest mention: How to handle pagination with Fauna | dev.to | 2021-01-27

    To display the data we'll be using the react-table library. We would like to use the pagination query to get only the number of documents to be displayed on one page. To perform the API calls to fauna graphql endpoint, I'll use a react-query library with graphql-request.

  • taskcafe

    An open source project management tool with Kanban boards

    Latest mention: Taskcafe 0.3.1 - an open source project management tool | reddit.com/r/selfhosted | 2020-12-25

    I still find it weird that Import from Trello is not even on the roadmap. I do understand that the developer and an average user has different views on what is an important feature, but i still think this a pretty important feature.

  • prisma-examples

    🚀 Ready-to-run Prisma example projects

    Latest mention: What do you think about ORMs? | reddit.com/r/node | 2021-01-18

    I'd love to hear what you think of Prisma if you ever get a chance to try it out! The best ways for exploring it are by following the Quickstart or running an example (e.g. for REST, GraphQL, gRPC, ...).

  • vendure

    A headless GraphQL ecommerce framework for the modern web

    Latest mention: Best headless CMS to sell art with Next? | reddit.com/r/webdev | 2021-01-14

    Hi! You might be interested to check out my project, Vendure (https://github.com/vendure-ecommerce/vendure). It's a headless graphql e-commerce framework written in TypeScript.

  • Coral

    A better commenting experience from Vox Media

  • graphql-subscriptions

    :newspaper: A small module that implements GraphQL subscriptions for Node.js

    Latest mention: GraphQL the Simple Way, or: Don't Use Apollo | dev.to | 2020-09-02

    To add this, I can just expand the basic setup above. To do so, I do actually use a couple of small Apollo modules! Most can be picked and configured independently. For this case, graphql-subscriptions provides a little bit of pubsub logic that works within resolvers, and subscriptions-transport-ws integrates that into Express to handle the websockets themselves. Super helpful

  • porn-vault

    💋 Manage your ever-growing porn collection. Using Vue & GraphQL

    Latest mention: Media organizer for TBs of videos | reddit.com/r/DataHoarder | 2020-12-29

    Porn Vault: Full disclosure, while I do consider myself relatively technologically literate, I am by no means a coder, software developer, or anything of the like. I struggled to even install Porn Vault at first because I didn't conceptualize that it was browser-based at first. A lot of my issues with Porn Vault are centered around my own ignorance of some of the program's basic workings, so I don't know that I can give a comprehensive review that someone who knows how to 'pop the hood' on the program might.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2021-01-27.

Index

What are some of the best open-source GraphQL projects in TypeScript? This list will help you:

Project Stars
1 react-query 17,030
2 apollo-client 15,488
3 RxDB 15,036
4 Bit 12,805
5 graphiql 11,653
6 apollo-server 10,932
7 postgraphile 9,796
8 graphql-playground 6,833
9 API Platform 6,431
10 graphql-yoga 6,255
11 graphql-code-generator 6,161
12 quicktype 5,900
13 TypeGraphQL 5,822
14 express-graphql 5,731
15 webiny-js 4,118
16 searchkit 4,065
17 graphql-request 3,248
18 taskcafe 2,168
19 prisma-examples 1,917
20 vendure 1,781
21 Coral 1,565
22 graphql-subscriptions 1,367
23 porn-vault 1,364