Skip to content

An in-browser IDE for exploring GraphQL.

License

Notifications You must be signed in to change notification settings

Stitch-Money/graphiql

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

GraphQL IDE Monorepo

Build Status Discord

Overview

GraphiQL is the reference implementation of this monorepo, GraphQL IDE, an official project under the GraphQL Foundation. The code uses the permissive MIT license.

Whether you want a simple GraphiQL IDE instance for your server, or a more advanced web or desktop GraphQL IDE experience for your framework or plugin, or you want to build an IDE extension or plugin, you've come to the right place!

The purpose of this monorepo is to give the GraphQL Community:

  • a solid, to-specification official language service,
  • a codemirror mode
  • an example of how to use this ecosystem with GraphiQL.
  • examples of how to implement or extend GraphiQL

NPM CDNJS

/ˈɡrafək(ə)l/ A graphical interactive in-browser GraphQL IDE. Try the live demo. We also have a demo using our latest netlify build for the master branch.

The GraphiQL IDE, implemented in React, currently using GraphQL mode for CodeMirror & GraphQL Language Service.

How To Setup/Implement GraphiQL

Edit graphiql-example

(works with create-react-app without requiring additional configuration)

The GraphiQL Readme explains some of the ways to implement GraphiQL, and we also have the examples directory as well!

NPM

Provides CodeMirror with a parser mode for GraphQL along with a live linter and typeahead hinter powered by your GraphQL Schema

NPM

Provides an interface for building GraphQL language services for IDEs.

NPM

Server process backing the GraphQL Language Service.

NPM

Runtime agnostic Language Service used by GraphQL mode for CodeMirror and GraphQL Language Service Server

NPM

An online immutable parser for GraphQL, designed to be used as part of syntax-highlighting and code intelligence tools such as for the GraphQL Language Service and codemirror-graphql.

NPM

Flow and Typescript type definitions for the GraphQL Language Service.

NPM

Utilities to support the GraphQL Language Service.

Contributing

This is an open source project, and we welcome contributions. Please see CONTRIBUTING.md for details on how to contribute.

Developing/Contributing

We welcome contributions and assistance! If you want to know where to start, check out our Github Projects. If you want to add a new feature, note that GraphiQL is eventually going to support its own extension system, and we are rarely adding new features, so make sure you submit feature requests with that in mind.

This repo is a yarn workspaces monorepo that also uses lerna for some convenience. It requires node 11 and the latest stable version of yarn. Running these commands with npm will cause you problems.

As of December 2019 we are officially supporting Windows OS for development tooling. If you encounter any bugs when using these or other package.json scripts, please report them!

Getting Started

  1. yarn - install and link all packages
  2. yarn build - cleans first, then builds everything but webpack bundles - tsc --build, babel etc
  3. yarn build-bundles - builds webpack bundles that are used for releases
  4. yarn build-demo - builds demo projects for netlify; we run this on CI to make sure webpack can consume our project in a standalone project.
  5. yarn test - runs all of the above alongside linting and checks, jest mocha Cypress etc.
  6. yarn format - autoformats with eslint --fix and prettier
  7. yarn lint - checks for linting issues
  8. yarn e2e - runs cypress headlessly against the minified bundle and a local schema server, like in CI.
  9. yarn jest - runs global jest commands across the entire monorepo; try yarn jest --watch or yarn jest DocExplorer for example :D

Learn more in CONTRIBUTING.md documentation.

Initiatives

Lots of activity lately! These things are in progress currently:

  • making web and IDE services 100% LSP specification complete
  • a monaco editor mode
  • extensions and themes to make GraphiQL a multipurpose tool for building GraphQL IDEs

Fielding Proposals!

The door is open for proposals for the new GraphiQL Plugin API, and other ideas on how to make the rest of the IDE ecosystem more performant, scaleable, interoperable and extensible. Feel free to open a PR to create a document in the /proposals/ directory. Eventually we hope to move these to a repo that serves this purpose.

Community

  • Discord - Most discussion outside of github happens on our Discord Server
  • Twitter - @GraphiQL and #GraphiQL
  • GitHub - Create feature requests and start discussions above

About

An in-browser IDE for exploring GraphQL.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 70.5%
  • TypeScript 22.6%
  • CSS 6.1%
  • Other 0.8%