SaaSHub helps you find the best software and product alternatives Learn more →
Top 23 TypeScript GraphQL Projects
-
Strapi
🚀 Strapi is the leading open-source headless CMS. It’s 100% JavaScript/TypeScript, fully customizable and developer-first.
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
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.
-
Hasura
Blazing fast, instant realtime GraphQL APIs on your DB with fine grained access control, also trigger webhooks on database events.
-
Directus
The Modern Data Stack 🐰 — Directus is an instant REST+GraphQL API and intuitive no-code data collaboration app for any SQL database.
-
Refine
A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.
-
InfluxDB
Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
-
react-admin
A frontend Framework for building data-driven applications running on top of REST/GraphQL APIs, using TypeScript, React and Material Design
-
react-starter-kit
The web's most popular Jamstack front-end template (boilerplate) for building web applications with React
-
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.
-
apollo-client
:rocket: A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.
-
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.
-
amplication
🔥🔥🔥 Open-source backend development platform. Build production-ready services without wasting time on repetitive coding.
-
crystal
🔮 Graphile's Crystal Monorepo; home to Grafast, PostGraphile, pg-introspection, pg-sql2 and much more! (by graphile)
-
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.
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
I didn't really give much thought as to which backend I would use. I already had 2 projects in Supabase (BOXCUT & MineWork), but also a few projects in Firebase too. I was more concerned at the time at actually building the product.
Project mention: How to Build an AI FAQ System with Strapi, LangChain & OpenAI | dev.to | 2024-04-21Strapi provides a centralized data managing platform. This makes it easier to organize, update, and maintain the FAQ data. It also automatically generates a RESTful API for accessing the content stored in its database.
Project mention: Bypass CORS errors while testing your APIs using Hoppscotch 🔧 | dev.to | 2024-04-17How can Hoppscotch help you intercept the API calls? 👽
> 2. ORMs do not hide SQL nastiness.
This is certainly true!
I mean: ORMs are now well known to "make the easy queries slightly more easy, while making intermediate queries really hard and complex queries impossible".
I think the are of ORMs is over. It simply did not deliver.
If a book on SQL is --say-- 100 pages, a book on Hibernate is 400 pages. So much to learn just to make the easy queries slightly easier to type? Just not worth it.
I prefer jooq any day over ORMs. And dont get me started over what tools like Hasuna have to offer.
There are also some languages (forgot the names) that are SQL-done-right. Select in the back, more type safe, more logic, more in the same steps as the query gets executed. These need to be adopted by PG and MySQL and we're good to go. (IMHO)
https://www.jooq.org/
https://hasura.io/
Project mention: How to Deploy Directus as a Backend-as-a-Service (BaaS) on Koyeb | dev.to | 2024-04-25Directus is an open data platform built to serve as a headless CMS, API, or Backend-as-a-Service (BaaS) for other applications. It is designed to make data accessible to people of all technical levels and to make it easy to build data-centric applications. Directus is extensible and can be integrated with many different frontend technologies to create stable, well-structured development and user experiences.
Project mention: Ask HN: Does Anyone Use a "Closed Core" Software Model? | news.ycombinator.com | 2024-04-16> "Are there examples of companies adopting this model?"
Many examples across the industry:
- Autodesk AutoCAD (closed) + Plugins/Addons (many open)
- MS Windows (closed) + Many 3rd party programs (open)
- Github (closed) + Github Actions (open)
- Npm (closed) + Npm modules (mostly open)
> "What are the potential benefits or pitfalls?"
Benefits:
- Harder to replicate, the company gets to keep the "secret sauce" a secret
- Opening up a way to "extend" the platform means 3rd party developers add value to your system
- The core isn't open, so less effort is required to maintain compare to OpenSource
Pitfalls:
- Closed-source is hard to verify, company is essentially saying "trust me bro"
- Less innovation, as user's can't contribute to the core
> "How does it impact community engagement and software adoption?"
There's hardcore FOSS advocates that will hate anything not fully open. But a business has to make money and protect it's IP, having a "closed core" is one way to do that and ensure a sustainable business model.
Another approach is the opposite, open-core + closed-premium-addons. An example of this is "React Admin"
- Open Core -> https://github.com/marmelab/react-admin
- Premium Modules Offering -> https://react-admin-ee.marmelab.com/
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
Project mention: Ask HN: How Can I Make My Front End React to Database Changes in Real-Time? | news.ycombinator.com | 2024-04-17I'm interested in this problem also!
I think there is a large overlap with projects that market/focus on offline-first experiences.
AFAIK this problem can be solved by:
1) Considering a client-side copy of the database that gets synced with the remote DB. This is an approach [PowerSync](https://www.powersync.com/) and [ElectricSql](https://electric-sql.com/) and [rxdb](https://rxdb.info/) take!
Project mention: Understanding TTFB Latency in DJango - Seems absurdly slow after DB optimizations even locally | /r/django | 2023-12-08
Project mention: Best way to build a modern back end and admin UI. No black magic | news.ycombinator.com | 2024-04-21
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:
- https://github.com/apollographql/apollo-client/pull/11175
Frameworks are a theme with this month's Release Radar, so here's another. Redwood is a full-stack, JavaScript/TypeScript web application, designed to scale with you. It uses React frontend for the frontend and links to a custom GraphQL API for the backend. The latest version includes a bunch of breaking changes such as moving to Node 20.0, the Redwood Studio, and highly requested GraphQL features such as Realtime, Fragments, and Trusted Documents, the server file, new router hooks, and heaps more. If you've previously used Redwood, you'll probably want to upgrade to version 7.0. The team have put together a handy migration guide for you to follow.
Project mention: Learn Anything – Organize knowledge, explore connections, curate learning paths | news.ycombinator.com | 2024-04-19
Another interesting point is that executing fetches on the server can allow developers to more easily leverage caching. Next.js already handles caching out-of-the-box and I’m curious to see if the wider adoption of RSC reduces the need to combine React with solutions like Apollo Server and Apollo Client. While there are other benefits to these tools, RSC could provide similar caching behavior without the need to invest in a GraphQL solution.
Project mention: Amplication: Instantly generate production-ready Node.js back end apps | news.ycombinator.com | 2024-04-30
I had the opportunity to work on a github issue in an open source project to add a Github workflow that runs if some files where modified in the path packages/twenty-website and checks that the website is still building.
Project mention: Ask HN: What Underrated Open Source Project Deserves More Recognition? | news.ycombinator.com | 2024-03-07I didn't see a v5 tag in order to know, and I have no idea what "utils/graphile" does for the project, but one will want to ensure they are aware of its licensing scheme https://github.com/graphile/crystal/blob/db8894c74eb0ec3fe96...
Project mention: How do you navigate an api response where you don't know the exact structure? | /r/webdev | 2023-11-09I grab the response off of the network tab. Either make a structure manually or use something like QuickType
Project mention: Integrating GraphQL Codegen with Storyblok: Step-by-Step Guide | dev.to | 2024-01-15The @graphql-codegen library is a bridge between your GraphQL schema and the actual code you write. It automates the generation of boilerplate code, ensuring that your data fetching layer is always up to date with your content structure.
TypeScript GraphQL related posts
-
How to Deploy Directus as a Backend-as-a-Service (BaaS) on Koyeb
-
Best way to build a modern back end and admin UI. No black magic
-
Learn Anything – Organize knowledge, explore connections, curate learning paths
-
Setup XM Cloud Multi-site on Netlify
-
Bypass CORS errors while testing your APIs using Hoppscotch 🔧
-
Postman Has Acquired Orbit
-
Writing your first Github CI workflow
-
A note from our sponsor - SaaSHub
www.saashub.com | 7 May 2024
Index
What are some of the best open-source GraphQL projects in TypeScript? This list will help you:
Project | Stars | |
---|---|---|
1 | supabase | 66,167 |
2 | Strapi | 60,244 |
3 | Hoppscotch | 60,230 |
4 | TanStack Query | 39,775 |
5 | Hasura | 30,832 |
6 | Directus | 25,517 |
7 | Refine | 24,853 |
8 | react-admin | 24,059 |
9 | react-starter-kit | 22,512 |
10 | hey | 22,410 |
11 | RxDB | 20,712 |
12 | graphql-js | 19,926 |
13 | payload | 19,758 |
14 | apollo-client | 19,212 |
15 | redwood | 16,744 |
16 | learn-anything.xyz | 15,795 |
17 | graphiql | 15,688 |
18 | apollo-server | 13,670 |
19 | amplication | 13,387 |
20 | Twenty | 13,139 |
21 | crystal | 12,420 |
22 | quicktype | 11,529 |
23 | graphql-code-generator | 10,636 |
Sponsored