react-apollo - :recycle: React higher-order component for Apollo Client

  •        39

React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to server side render.React Apollo unlike many other tools in the React ecosystem requires no complex build setup to get up and running. As long as you have a GraphQL server you can get started building out your application with React immediately. React Apollo works out of the box with both create-react-app and React Native with a single install and with no extra hassle configuring Babel or other JavaScript tools.

http://dev.apollodata.com/
https://github.com/apollographql/react-apollo

Dependencies:

apollo-link : ^1.0.0
hoist-non-react-statics : ^2.2.0
invariant : ^2.2.1
lodash.flowright : ^3.5.0
lodash.pick : ^4.4.0
prop-types : ^15.5.8

Tags
Implementation
License
Platform

   




Related Projects

graphql-anywhere - :icecream: Run a GraphQL query anywhere, against any data, with no schema.

  •    TypeScript

Run a GraphQL query anywhere, without a GraphQL server or a schema. Just pass in one resolver. Use it together with graphql-tag.I think there are a lot of potentially exciting use cases for a completely standalone and schema-less GraphQL execution engine. We use it in Apollo Client to read data from a Redux store with GraphQL.

apollo-universal-starter-kit - Apollo 2 Universal Starter Kit — GraphQL React JavaScript app boilerplate for Mobile, Server and Web where code for all platforms built with Webpack to enable max code reuse, stack: Apollo, GraphQL, React 16, React Native, Expo, Express, Knex, SQLite, Twitter Bootstrap, Babel, Webpack

  •    Javascript

Apollo Universal Starter Kit is a SEO friendly boilerplate for Universal Mobile and Web app development built on top of Apollo, GraphQL, React 16, React Native, Expo, Redux, Express with SQL storage support, for styling Twitter Bootstrap, NativeBase and Ant Design integration. Hot Code Reload of back end & front end using Webpack and Hot Module Replacement to reflect your changes instantly and help you stay productive. This starter kit adds full React Native integration, with Webpack as a packager and Expo. No native code compilation tools are needed in order to develop native mobile applications with this kit. You are able to run both web and mobile versions of your app at the same time connected to the same backend.

reactql - Universal React+GraphQL starter kit: React 16, Apollo 2, Webpack 4, Styled Components 4, React Router 4, PostCSS, SSR

  •    TypeScript

Universal front-end React + GraphQL starter kit, written in Typescript. Hot code reloading. Make a change anywhere in your code base (outside of the Webpack config), and changes will be pushed down the browser automatically - without page reloads. This happens for React, Styled Components, SASS - pretty much anything.

react-fullstack-graphql - Starter projects for fullstack applications based on React & GraphQL.

  •    Javascript

For a fully-fledged React & Apollo tutorial, visit How to GraphQL. You can more learn about the idea behind GraphQL boilerplates here. All projects are based on graphql-yoga & Apollo Client.


apollo-client - :rocket: A fully-featured, production ready caching GraphQL client for every server or UI framework

  •    TypeScript

Apollo Client is a fully-featured caching GraphQL client with integrations for React, Angular, and more. It allows you to easily build UI components that fetch data via GraphQL. To get the most value out of apollo-client, you should use it with one of its view layer integrations.To get started with the React integration, go to our React Apollo documentation website.

language-babel - ES2017, flow, React JSX and GraphQL grammar and transpilation for ATOM

  •    CoffeeScript

Language grammar for all versions of JavaScript including ES2016 and ESNext, JSX syntax as used by Facebook React, Atom's etch and others, as well as optional typed JavaScript using Facebook flow. This package also supports highlighting of GraphQL language constructs when inside certain JavaScript template strings. For .graphql and .gql file support please see language-graphql . The colour of syntax is determined by the theme in use. By default the language-babel package will detect file types .js,.babel,.jsx, .es, .es6, .mjs and .flow. Use the standard ATOM interface to enable it for other file types. This provides a grammar that scopes the file in order to colour the text in a meaningful way. If other JavaScript grammars are enabled these may take precedence over language-babel. Look at the bottom right status bar indicator to determine the language grammar of a file being edited. language-babel will be shown as either Babel or Babel ES6 JavaScript. Clicking the name will allow the grammar for a file to be changed.

fullstack-apollo-react-express-boilerplate-project - 💥A sophisticated Apollo in React and Express boilerplate project

  •    Javascript

A full-fledged Apollo Server 2 with Apollo Client 2 starter project with React, Express and PostgreSQL. Since this boilerplate project is using PostgreSQL, you have to install it for your machine and get a database up and running. You find everything for the set up over here: Setup PostgreSQL with Sequelize in Express Tutorial. After you have created a database and a database user, you can fill out the environment variables in the server/.env file.

ran - :zap: RAN! React

  •    Javascript

:zap: RAN! React . GraphQL . Next.js Toolkit :zap: - SEO-Ready, Production-Ready, SSR, Hot-Reload, CSS-in-JS, Caching, CLI commands and more...

crate - 👕👖📦 A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL

  •    Javascript

👕👖📦 A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL. Very basic replica of stitchfix.com / krate.in (allows users to get monthly subscription of trendy clothes and accessories).

fraql - GraphQL fragments made simple ⚡️

  •    Javascript

Putting data next to your component is a good practice. It is built-in Relay and Lee Byron explains the advantages into his talk about the IDEA architecture. I tried to do it by myself, but relying on fragment names is not an easy task. FraQL solves this issue by bringing isolation, fragments do not rely on their names.

GitHunt-React - :arrows_clockwise: An example app frontend built with Apollo Client and React

  •    Javascript

An example of a client-side app built with React 16 and Apollo Client 2.0.See the application running live at http://www.githunt.com.

react-universal - React, redux, react-router, graphql, postgres, koa, universal starter-kit

  •    Javascript

A react starter kit that handles universal rendering as well as a bunch of another neat things. This is sort of a living spec for how I build web applications. react-relay, though the tools are included to get started with Relay, including the graphql backend, I've decided to not include the start of a Relay based front end until server-side rendering hooks are exposed [facebook/relay#136].

graphql-up - Get a ready-to-use GraphQL API for your schema

  •    Javascript

graphql-up is the fastest way to get a free & ready to use GraphQL API. It works out of the box with Apollo & Relay and supports GraphQL subscriptions.You only need to provide the schema, graphql-up will create a GraphQL API for you. The actual magic happens on the servers sponsored by Graphcool.

graphql-up - Get a ready-to-use GraphQL API for your schema

  •    Javascript

graphql-up is the fastest way to get a free & ready to use GraphQL API. It works out of the box with Apollo & Relay and supports GraphQL subscriptions. You only need to provide the schema, graphql-up will create a GraphQL API for you. The actual magic happens on the servers sponsored by Graphcool.

ReactStateMuseum - A whirlwind tour of React state management systems by example

  •    Javascript

Every app is meant to be small, simple, and the same as each other. The only difference should be the state management decisions of each. The repeated React and ReactNative app is a Packing List, with the name based on the state technology.

apollo-server - :earth_africa: GraphQL server for Express, Connect, Hapi and Koa

  •    TypeScript

Apollo Server is a community-maintained open-source GraphQL server. It works with pretty much all Node.js HTTP server frameworks, and we're happy to take PRs for more! It works with any GraphQL schema built with the graphql-js reference implementation.Apollo Server is super easy to set up. Just npm install apollo-server-<variant>, write a GraphQL schema, and then use one of the following snippets to get started. For more info, read the Apollo Server docs.

react-starter-kit - React Starter Kit — isomorphic web app boilerplate (Node

  •    Javascript

React Starter Kit is an opinionated boilerplate for web development built on top of Node.js, Express, GraphQL and React, containing modern web development tools such as Webpack, Babel and Browsersync. Helping you to stay productive following the best practices. A solid starting point for both professionals and newcomers to the industry.

adrenaline - Simple Relay alternative

  •    Javascript

This library provides a subset of Relay's behaviour with a cleaner API. Relay is a great framework with exciting ideas behind it. The downside is that in order to get all the cool features, you need to deal with a complex API. Relay provides you a lot of tricky optimizations which probably are more suitable for huge projects. In small, medium and even large ones you would prefer to have better developer experience while working with a simple, minimalistic set of APIs.