entria / Reactnavigationrelaymodern
React Navigation integration with Relay
Stars: ✭ 170
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Reactnavigationrelaymodern
Yaba Social
Yet Another Boilerplate App showing off react-navigation and the excellent new tools from Apollo
Stars: ✭ 133 (-21.76%)
Mutual labels: react-navigation
Sonoff wifi switch
Прошивка для ESP8266 (Умный дом)-Firmware for ESP8266 (Smart Home)
Stars: ✭ 156 (-8.24%)
Mutual labels: relay
Typescript React Native Starter
A highly scalable foundation with a focus on best pratices and simplicity to start your React Native project in seconds.
Stars: ✭ 141 (-17.06%)
Mutual labels: react-navigation
Laravel Graphql
Facebook GraphQL for Laravel 5. It supports Relay, eloquent models, validation and GraphiQL.
Stars: ✭ 1,793 (+954.71%)
Mutual labels: relay
Frontend
🌏 The front-end application code for https://buildkite.com
Stars: ✭ 132 (-22.35%)
Mutual labels: relay
Relay Visual Learners
An interactive diagram of Relay Classic.
Stars: ✭ 164 (-3.53%)
Mutual labels: relay
Isomorphic Relay Router
Adds server side rendering support to react-router-relay
Stars: ✭ 141 (-17.06%)
Mutual labels: relay
Reactconfbr
Public infos and issues about React Conf Brasil organization
Stars: ✭ 156 (-8.24%)
Mutual labels: relay
Wora
Write Once, Render Anywhere. typescript libraries: cache-persist, apollo-offline, relay-offline, offline-first, apollo-cache, relay-store, netinfo, detect-network
Stars: ✭ 138 (-18.82%)
Mutual labels: relay
Relay Rails Blog
A graphql, relay and standard rails application powered demo weblog. We are using Graphql server and relay for our react component data needs.
Stars: ✭ 140 (-17.65%)
Mutual labels: relay
Redux React Navigation Demos
React-Native + Redux + Redux-Persist + React Navigation ( Authentication Flow with Redux demos)
Stars: ✭ 151 (-11.18%)
Mutual labels: react-navigation
React Native Boilerplate
A React Native boilerplate with Expo, Redux, React Navigation, Styled Components and some 💕 included.
Stars: ✭ 135 (-20.59%)
Mutual labels: react-navigation
React Native Navigation Animation
Transition navigation component for React Native
Stars: ✭ 133 (-21.76%)
Mutual labels: react-navigation
React Native Screens
Native navigation primitives for your React Native app.
Stars: ✭ 2,148 (+1163.53%)
Mutual labels: react-navigation
React Relay Offline
TypeScript library files for Relay Modern Offline
Stars: ✭ 169 (-0.59%)
Mutual labels: relay
Protostar Relay
Open-source iteration of the official Relay devtool.
Stars: ✭ 161 (-5.29%)
Mutual labels: relay
Relay Authentication
An example app demonstrating role based authentication and file upload with Relay and GraphQL.
Stars: ✭ 153 (-10%)
Mutual labels: relay
React Native + React-Navigation + Relay Modern
This is a sample repository that shows how to integrate React Native with ReactNavigation and Relay Modern.
For the Relay-Classic Version see this branch
It is connecting to this boilerplate code graphql-dataloader-boilerplate
Description
-
data/
contains schema(.json/.graphql) of your GraphQL server. It will be used by Relay to compile your graphql queries to code -
yarn relay
oryarn relay:watch
are used to convert graphql literals into generated files. The second command watch changes whendata/
files are updated
.babelrc
for Relay Modern
{
"plugins": [
["relay", {"schema": "data/schema.json"}]
],
}
Relay Environment
The file src/createRelayEnvironment.js creates a Relay Environment and a Network instance that configures Relay with a function to fetch queries from the remote server
ReactNavigation + Relay Modern
- You should use a Relay Container such as FragmentContainer, PaginationContainer or others in any component that will be
pushed
into aStackNavigation
- For instance, check UserList#createPaginationContainer
-
Pushing a route that uses Relay and depends on a parameter UserList#navigate
-
Define that your route will need a parameter from react-navigation like these UserDetail#query
-
You also need to define it inside
variables
UserDetail#variables
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].