Add Auth, Databases, Functions, and Storage to your product and build any application at any scale while using your preferred coding languages and tools. Learn more →
Top 23 TypeScript GraphQL Projects
-
If you do now have your Supabase project create the new one. Just follow the instructions on https://supabase.com/ and start new project. From your Project Settings dashboard API details copy SUPABASE_URL and SUPABASE_ANON_KEY which are to be used in a front end of your application.
-
Strapi
🚀 Strapi is the leading open-source headless CMS. It’s 100% JavaScript/TypeScript, fully customizable and developer-first.
https://strapi.io/ https://prismic.io/ https://bubble.io/ https://hygraph.com/ https://www.sanity.io/
-
Appwrite
Appwrite - The open-source backend cloud platform. Add Auth, Databases, Functions, and Storage to your product and build any application at any scale while using your preferred coding languages and tools.
-
We began as a web-based API client at hoppscotch.io, where anyone can easily initiate API testing. Ever since then the Hoppscotch Desktop app has been a highly requested product by our community. We've been listening and are excited to announce that the day has finally arrived - today marks the launch of the public alpha version of the Hoppscotch Desktop App for macOS, Windows, and Linux!
-
TanStack Query
🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query.
"I’m building SQLSync because I want to make client-side applications easier to build without us having to reinvent the wheel each time."
Kinda ironic no?
Anyway, since the article is also about React, I can't recommend enough React Query [1] if you don't want to worry about caching data to reduce calls to the database and managing/refreshing stale data. It simplified so much my job.
-
Hasura
Blazing fast, instant realtime GraphQL APIs on your DB with fine grained access control, also trigger webhooks on database events.
7. Hasura
-
Directus
The Modern Data Stack 🐰 — Directus is an instant REST+GraphQL API and intuitive no-code data collaboration app for any SQL database.
Project mention: Looking for a (primarily) WYSIWYG platform to build a MySQL interface. | /r/webdev | 2023-11-12Have you looked at Directus? I’m not sure exactly what your needs are (sorry if I’ve misunderstood). I used it for my most recent project as the backend for data entry/queries/administration. It supports MySQL, but admins don’t need to know anything about SQL to do complex queries/filters/CSV exports from the Directus UI.
-
react-admin
A frontend Framework for building data-driven applications running on top of REST/GraphQL APIs, using TypeScript, React and Material Design
We’ve developed a business based on an open-source platform called react-admin. Embracing the open-source spirit, we’re sharing the key performance indicators of this business. We hope it will help other open-source developers build their own business.
-
InfluxDB
Collect and Analyze Billions of Data Points in Real Time. Manage all types of time series data in a single, purpose-built database. Run at any scale in any environment in the cloud, on-premises, or at the edge.
-
react-starter-kit
The web's most popular Jamstack front-end template (boilerplate) for building web applications with React
Project mention: Major Update to React Starter Kit: Welcome Joy UI and Jotai! | /r/reactjs | 2023-12-04Your Feedback Matters Your feedback is crucial for the continuous improvement of the React Starter Kit. Please try out the new version and share your thoughts and experiences. If you encounter any issues or have suggestions, feel free to open an issue on GitHub or join our community chat on Discord. We're excited to see the amazing applications you'll build with these new features! Happy coding! https://github.com/kriasoft/react-starter-kit
-
Project mention: Lenster a decentralized and permissionless social media app | news.ycombinator.com | 2023-05-25
-
About a year ago, I discovered a cool offline-first framework called RxDB. Initially, I thought that on the frontend side, this was exactly what I had been searching for over the past years. After tinkering around and even using it in production for some time, I realized that it wasn't well-suited for my intended use. RxDB was initially created as an RxJS layer for PouchDB with a server replication interface. Over time, other storage types besides PouchDB were introduced (e.g., IndexedDB, SQLite) and the replication interface became more sophisticated. The replication interface is really cool and exactly what I wanted. The biggest problem I have with RxDB is that it is so tightly coupled with RxJS. While RxJS is technically very powerful, it offers a dreadful developer experience. It's really hard to understand at first and integrating it into an existing codebase, which isn't using RxJS, is tedious.
-
To begin, I'm going to start with GraphQL. This repo is a JS-specific implementation for GraphQL, for which projects written in JS/TS can utilize to build an API for their web app. The reason why I chose this project is because I've always been intrigued by how GraphQl challenges the standard way of building an API, a.k.a REST APIs. I have very little knowledge about this project since I've never used it before at work or for my personal projects. I only have theoretical knowledge about it which I gained from watching YouTube videos. It also uses TypeScript which is fascinating because type safety is very important when building software considering it cleans out a lot of bugs early on before the software is shipped.
-
apollo-client
:rocket: A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.
Project mention: Things I wish I knew before moving 50K lines of code to React Server Components | news.ycombinator.com | 2023-09-01Actually, it's worse than that. Next has started throwing errors if it statically detects you even _importing_ hooks inside of a React Server Component environment:
- https://github.com/apollographql/apollo-client/issues/10974
- https://github.com/apollographql/apollo-client/issues/11167
To the point that Lenz Weber( a maintainer of Apollo Client, and my co-maintainer on Redux Toolkit), is considering resorting to a package that wraps and re-exports all of React's public API just to avoid that static analysis:
-
refine
A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.
Refine: https://github.com/refinedev/refine
-
Web development frameworks in JavaScript, such as NextJS and RedwoodJS, have gained popularity among developers. Choosing the right framework, library, or tool for a project is crucial for efficient development. Developers often seek the best tools to save time and avoid reinventing the wheel.
-
> FYI, GraphiQL is deprecated, GraphQL Playground is a good alternative.
You have this backwards.
https://github.com/graphql/graphql-playground/issues/1366#is...
-
payload
The best way to build a modern backend + admin UI. No black magic, all TypeScript, and fully open-source, Payload is both an app framework and a headless CMS.
James, the co-founder of Payload, a headless CMS with MongoDB support, shared his insights on the drawbacks and limitations of using a headless CMS in the context of web development. He challenged the promises often made about headless CMS, such as separation of concerns and ease of content migration, revealing that these claims often don't align with the reality faced by developers and clients. James is considering integrating Payload directly with Next.js to overcome these limitations and offer a better developer experience, including out-of-the-box features and simpler deployments. Should Payload move to Next.js?
-
apollo-server
🌍 Spec-compliant and production ready JavaScript GraphQL server that lets you develop in a schema-first way. Built for Express, Connect, Hapi, Koa, and more.
Project mention: Launch HN: Serra (YC S23) – Open-source, Python-based dbt alternative | news.ycombinator.com | 2023-08-14As I mentioned, their main GraphQL server package is[1], so that's where the confusion came from. Thanks.
[1] https://github.com/apollographql/apollo-server/blob/9817bc47...
-
amplication
🇮🇱 Stand with Israel 🇮🇱 Open-source backend development platform. Build production-ready services without wasting time on repetitive coding.
Project mention: Auth0 and Amplication: Simplifying Authentication in Your Applications | dev.to | 2023-11-24Setting up Auth0 authentication in your Amplication application is easy. You can use the Auth0 plugin to add the required dependencies and configuration files to your application. The steps are as follows:
-
crystal
🔮 Graphile's Crystal Monorepo; home to Grafast, PostGraphile, pg-introspection, pg-sql2 and much more! (by graphile)
-
Project mention: How do you navigate an api response where you don't know the exact structure? | /r/webdev | 2023-11-09
I grab the response off of the network tab. Either make a structure manually or use something like QuickType
-
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.
In typescript and typescript-resolvers plugin v4.0.1, we have reverted the default ID Scalar input type to string. Read the pull request for more details.
-
devhub
TweetDeck for GitHub - Filter Issues, Activities & Notifications - Web, Mobile & Desktop with 99% code sharing between them (by devhubapp)
-
-
Onboard AI
Learn any GitHub repo in 59 seconds. Onboard AI learns any GitHub repo in minutes and lets you chat with it to locate functionality, understand different parts, and generate new code. Use it for free at www.getonboard.dev.
TypeScript GraphQL related posts
- Major Update to React Starter Kit: Welcome Joy UI and Jotai!
- You do need a technical co-founder
- Node library for easily implementing Relay cursor pagination with Knex queries
- 🤩 20 Awesome Tools For Your Web Dev Toolkit 🛠️
- Unlocking the Power of GraphQL for Beginners: A Step-by-Step Guide to Integrating GraphQL into Your Existing Project
- Node library for easily implementing Relay cursor pagination with Knex queries
- Node library for easily implementing Relay cursor pagination with Knex queries
-
A note from our sponsor - Appwrite
appwrite.io | 5 Dec 2023
Index
What are some of the best open-source GraphQL projects in TypeScript? This list will help you:
Project | Stars | |
---|---|---|
1 | supabase | 59,935 |
2 | Strapi | 57,501 |
3 | Postwoman | 56,804 |
4 | TanStack Query | 37,296 |
5 | Hasura | 30,498 |
6 | Directus | 23,884 |
7 | react-admin | 23,202 |
8 | react-starter-kit | 22,290 |
9 | hey | 21,472 |
10 | RxDB | 19,931 |
11 | graphql-js | 19,779 |
12 | apollo-client | 19,038 |
13 | refine | 16,878 |
14 | redwood | 16,494 |
15 | graphiql | 15,391 |
16 | payload | 14,910 |
17 | apollo-server | 13,545 |
18 | amplication | 12,810 |
19 | crystal | 12,262 |
20 | quicktype | 10,858 |
21 | graphql-code-generator | 10,414 |
22 | devhub | 9,279 |
23 | howtographql | 8,610 |