Ingest, store, & analyze all types of time series data in a fully-managed, purpose-built database. Keep data forever with low-cost storage and superior data compression. Learn more →
Top 23 JavaScript GraphQL Projects
-
Project mention: Can't build Gatsby project because of Wordpress post image. ERROR #85928. WpConnectionType.nodes expected | reddit.com/r/gatsbyjs | 2023-03-19
{ "name": "gatsby-starter-default", "private": true, "description": "A simple starter to get up and developing quickly with Gatsby", "version": "0.1.0", "author": "Kyle Mathews ", "dependencies": { "babel-plugin-styled-components": "^2.0.7", "gatsby": "^5.7.0", "gatsby-image": "^3.11.0", "gatsby-plugin-google-fonts-with-attributes": "^1.0.8", "gatsby-plugin-google-gtag": "^5.7.0", "gatsby-plugin-image": "^3.7.0", "gatsby-plugin-manifest": "^5.7.0", "gatsby-plugin-robots-txt": "^1.8.0", "gatsby-plugin-sharp": "^5.7.0", "gatsby-plugin-sitemap": "^6.7.0", "gatsby-plugin-styled-components": "^6.7.0", "gatsby-source-filesystem": "^5.5.0", "gatsby-source-wordpress": "^7.7.0", "gatsby-transformer-sharp": "^5.5.0", "react": "^18.2.0", "react-dom": "^18.2.0", "styled-components": "^5.3.6", "universal-cookie": "^4.0.4" }, "devDependencies": { "prettier": "^2.8.3" }, "keywords": [ "gatsby" ], "license": "0BSD", "scripts": { "build": "gatsby build", "develop": "gatsby develop", "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md,css}\"", "start": "gatsby develop", "serve": "gatsby serve", "clean": "gatsby clean", "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1", "deploy": "gatsby clean && gatsy build && gatsby prepend && node deploy" }, "repository": { "type": "git", "url": "https://github.com/gatsbyjs/gatsby-starter-default" }, "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" } }
-
Strapi
🚀 Strapi is the leading open-source headless CMS. It’s 100% JavaScript, fully customizable and developer-first.
You can easily keep blog posts in markdown which are VERY easy to render in React, but when it comes to CMS I can recommend https://strapi.io/ which is open source and free if you host it on your own serwer There is also https://www.contentful.com/ which has free tier :)
-
Appwrite
Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
-
Project mention: Destructuring syntax: Which way would you write it? | reddit.com/r/webdev | 2023-03-24
second one especially if you're using https://prettier.io which will enforce newlines for nested destructured variables
-
Rest Client We will need a REST client to test our API calls. I will be using Insomnia, but you can use any other client as well. Postman is also popular among them. Download Link- Insomnia Download Link- Postman
-
-
dataloader
DataLoader is a generic utility to be used as part of your application's data fetching layer to provide a consistent API over various backends and reduce requests to those backends via batching and caching.
Project mention: We Ditched REST and Went with GraphQL: Here’s Why | news.ycombinator.com | 2023-03-18Also, have a look at Facebook's Dataloader[0].
-
Reaction Commerce
Mailchimp Open Commerce is an API-first, headless commerce platform built using Node.js, React, GraphQL. Deployed via Docker and Kubernetes.
-
InfluxDB
Access the most powerful time series database as a service. Ingest, store, & analyze all types of time series data in a fully-managed, purpose-built database. Keep data forever with low-cost storage and superior data compression.
-
Gridsome — Jamstack SSG tool for Vue developers
-
This app is itself is a Next.js app that relies on Vulcan.js, a full-stack JavaScript framework that I originally created for Meteor, and that Eric Burel later ported to Next.js. But we will likely phase out the Vulcan.js part eventually to make it a more standard codebase.
-
-
react-firebase-starter
Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay
Let's look at React Starter Kit, which bills itself as an isomorphic web project boilerplate. Additionally, the React Starter Kit is described as, “very opinionated” on the webpage. This implies that it has already chosen our tech stack for us, which consists of Node.js, Express and GraphQL.
-
graphqurl
curl for GraphQL with autocomplete, subscriptions and GraphiQL. Also a dead-simple universal javascript GraphQL client.
Don't forget about xmlstarlet for xpath, https://github.com/hasura/graphqurl for graphql and httpie for a more syntax friendly http client.
-
Project mention: Ask HN: Nested Resources in REST/HTTP API URLs? | news.ycombinator.com | 2022-08-18
REST is not a strict specification and it's not a single implementation, you can just start doing it.
That said, I wouldn't recommend going the allow everything flexible resolver way like GraphQL: it's terrible for performance (eg. most APIs use N+1 queries unless you have something like https://github.com/join-monster/join-monster), the complexity of the codebase skyrockets and having to specify all the fields you want is not exactly ergonomic in most situations.
-
It's a vague question but my goto is to create a basic site with create-eth-app (similar to create-react-app, but for ethereum) https://www.npmjs.com/package/create-eth-app
-
In this post I will show you how to implement NestJS😻 with GraphQL in code first mode, using Mercurius and the "platform" to Fastify.
-
-
-
Project mention: My first portfolio template with pure CSS | reddit.com/r/learnprogramming | 2022-07-10
Here the link to the original template: https://github.com/cobiwave/gatsby-simplefolio
-
react-dashboard
🔥React Dashboard - isomorphic admin dashboard template (React.js, Bootstrap, Node.js, GraphQL, React Router, Babel, Webpack, Browsersync) 🔥
-
apollo-upload-client
A terminating Apollo Link for Apollo Client that fetches a GraphQL multipart request if the GraphQL variables contain files (by default FileList, File, Blob, or ReactNativeFile instances), or else fetches a regular GraphQL POST or GET request (depending on the config and GraphQL operation).
Project mention: How to troubleshoot GraphQL file upload issue with Nest.js application on Google Cloud Run? | reddit.com/r/graphql | 2022-11-13 -
graphql-upload
Middleware and an Upload scalar to add support for GraphQL multipart requests (file uploads via queries and mutations) to various Node.js GraphQL servers.
-
Damn-Vulnerable-GraphQL-Application
Damn Vulnerable GraphQL Application is an intentionally vulnerable implementation of Facebook's GraphQL technology, to learn and practice GraphQL Security.
-
The source code lives here https://github.com/hasura/learn-graphql/tree/master/tutorials/frontend/nextjs/app-final
-
Sonar
Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
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 2023-03-24.
JavaScript GraphQL related posts
- We Ditched REST and Went with GraphQL: Here’s Why
- Is there a Nuxt API Resource approach?
- help me learn NEXTJS and GRAPHQL.
- Build a Task Manager CRUD App with React and Hygraph
- Need advice on developping a Desktop Client for Elasticsearch
- Documenting a Go API with OpenAPI 3 Standard: A Practical Guide
- What's the best portfolio website you've ever seen?
-
A note from our sponsor - InfluxDB
www.influxdata.com | 25 Mar 2023
Index
What are some of the best open-source GraphQL projects in JavaScript? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | Gatsby | 54,270 |
| 2 | Strapi | 52,588 |
| 3 | prettier | 45,123 |
| 4 | insomnia | 27,247 |
| 5 | parse-server | 20,146 |
| 6 | dataloader | 12,081 |
| 7 | Reaction Commerce | 11,946 |
| 8 | Gridsome | 8,441 |
| 9 | Telescope | 8,019 |
| 10 | apollo | 5,813 |
| 11 | react-firebase-starter | 4,447 |
| 12 | graphqurl | 3,225 |
| 13 | join-monster | 2,561 |
| 14 | create-eth-app | 2,528 |
| 15 | mercurius | 2,085 |
| 16 | graphpack | 1,995 |
| 17 | json-graphql-server | 1,835 |
| 18 | gatsby-simplefolio | 1,603 |
| 19 | react-dashboard | 1,482 |
| 20 | apollo-upload-client | 1,446 |
| 21 | graphql-upload | 1,372 |
| 22 | Damn-Vulnerable-GraphQL-Application | 1,235 |
| 23 | learn-graphql | 1,087 |
Write Clean JavaScript Code. Always.
Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
www.sonarsource.com