Making GraphQL Codegen Work For You: GraphQL Integration with React and TypeScript

1. next-typescript-graphql-integration

   1 1 3 1.6 TypeScript

   Tutorial for integrating external GQL API with codegen and sending emails with Novu.co

   

   If you want to skip the writeup, you can go to GitHub directly and look at the code: https://github.com/ugglr/next-typescript-graphql-integration

2. Sevalla

   sevalla.com featured

   Deploy and host your apps and databases, now with $50 credit! Sevalla is the PaaS you have been looking for! Advanced deployment pipelines, usage-based pricing, preview apps, templates, human support by developers, and much more!

   

3. graphql-code-generator

   2 71 11,135 8.6 TypeScript

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

   

   Graphql Codegen is a code generation library for GraphQL that enables developers to generate custom code. It provides us developers with the ability to generate type definitions, query builders, documentation, and more by analyzing our GraphQL schemas. This makes it easier and faster to build GraphQL applications and reduces the time spent coding.

4. RickNMortyCompose

   3 15 26 0.0 Kotlin

   A Jetpack compose android app based on Rick and Morty Graphql

   

   import "@/styles/globals.css"; import type { AppProps } from "next/app"; import { ApolloClient, InMemoryCache, ApolloProvider } from "@apollo/client"; const client = new ApolloClient({ uri: "https://rickandmortyapi.com/graphql", cache: new InMemoryCache(), }); export default function App({ Component, pageProps }: AppProps) { return ( ApolloProvider> ); }

5. novu

   4 148 37,658 10.0 TypeScript

   The open-source notification Inbox infrastructure. E-mail, SMS, Push and Slack Integrations.

   

   In this guide, we’ll be showing you how to use GraphQL alongside React and GraphQL Codegen to create a simple page that can pull data from an API and send emails. We’ll be using Novu as an open source notification system for developers that can send our emails after being passed through a form created within React.

6. Next.js

   5 2,381 134,062 10.0 JavaScript

   The React Framework

   

   Next.js is a full-stack framework for React, and they make it easy for us to create full-stack apps. One of the most notable features is that we can create API endpoints on our server. These are then hidden from the client browser for extra security.

7. InfluxDB

   www.influxdata.com featured

   InfluxDB – Built for High-Performance Time Series Workloads. InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.

   

Suggest a related project