All Projects → juffalow → react-relay-example

juffalow / react-relay-example

Licence: MIT license
Example project how to use React, Relay and TypeScript

Programming Languages

typescript
32286 projects
HTML
75241 projects
CSS
56736 projects
shell
77523 projects

Projects that are alternatives of or similar to react-relay-example

git-space
A web application to view Github's user profile.
Stars: ✭ 14 (-48.15%)
Mutual labels:  react-router, react-bootstrap
react-ssr
从零搭建一个react-ssr框架 解决页面js事件 样式同构 服务器客户端路由 数据注水脱水等问题
Stars: ✭ 42 (+55.56%)
Mutual labels:  react-router, react-helmet
material-ui-Link-within-MenuItem
Example for how to use `react-router/Link` within `material-ui/MenuItem`
Stars: ✭ 19 (-29.63%)
Mutual labels:  react-router, example-project
Pro Mern Stack
Code Listing for the book Pro MERN Stack
Stars: ✭ 290 (+974.07%)
Mutual labels:  react-router, react-bootstrap
React Dashboard
🔥React Dashboard - isomorphic admin dashboard template (React.js, Bootstrap, Node.js, GraphQL, React Router, Babel, Webpack, Browsersync) 🔥
Stars: ✭ 1,268 (+4596.3%)
Mutual labels:  react-router, react-bootstrap
Ecommerce Reactjs
Full stack ecommerce online store application
Stars: ✭ 164 (+507.41%)
Mutual labels:  react-router, react-bootstrap
vaktija.ba
Web Site
Stars: ✭ 19 (-29.63%)
Mutual labels:  react-router, react-helmet
Serverless Stack Com
An open source guide for building and deploying full-stack apps using Serverless and React on AWS.
Stars: ✭ 3,617 (+13296.3%)
Mutual labels:  react-router, react-bootstrap
Light Bootstrap Dashboard React
React version of Light Bootstrap Dashboard
Stars: ✭ 561 (+1977.78%)
Mutual labels:  react-router, react-bootstrap
React Bootstrap Webpack Starter
ReactJS 16.4 + new React Context API +react Router 4 + webpack 4 + babel 7+ hot Reload + Bootstrap 4 + styled-components
Stars: ✭ 103 (+281.48%)
Mutual labels:  react-router, react-bootstrap
Isomorphic Relay Router
Adds server side rendering support to react-router-relay
Stars: ✭ 141 (+422.22%)
Mutual labels:  relay, react-router
bartzalewski.com-v2
My 2nd portfolio website
Stars: ✭ 31 (+14.81%)
Mutual labels:  react-helmet
gatsby-starter-redux-saas
An Gatsby starter for Saas products. Uses redux and apollo and a graphql token auth backend.
Stars: ✭ 18 (-33.33%)
Mutual labels:  react-helmet
sustainatives
Mobile App
Stars: ✭ 14 (-48.15%)
Mutual labels:  react-router
listen-music
使用React全家桶开发的音乐WebApp,用来学习React。数据来源于QQ音乐的API,UI同样参考QQ音乐。仅供学习使用。
Stars: ✭ 38 (+40.74%)
Mutual labels:  react-router
react-learning-resources
A curated list of resources to learn React and related web technologies as fast as possible.
Stars: ✭ 65 (+140.74%)
Mutual labels:  react-router
EuNet
Peer to peer network solution for multiplayer games.
Stars: ✭ 109 (+303.7%)
Mutual labels:  relay
use-route-as-state
Use React Router route and query string as component state
Stars: ✭ 37 (+37.04%)
Mutual labels:  react-router
xstate-react-router
XState connector to React Router.
Stars: ✭ 23 (-14.81%)
Mutual labels:  react-router
Isomorphic Relay
Adds server side rendering support to React Relay
Stars: ✭ 247 (+814.81%)
Mutual labels:  relay

React + Relay Example

List of Quotes with Authors implemented in React + Relay.

You can use either PHP or Node as a backend.

How to run the project

Installation

yarn install

# or if you use npm

npm install

Configuration

Create src/config.ts or rename src/config.example.ts and make sure it contains your server's graphql endpoint url:

export default {
  graphql: 'http://localhost:3013/graphql',
};

Download GraphQL schema

For this, you need to have graphql-cli installed.

graphql get-schema --project quotes -e default

Build / transform components which are using graphql / relay

yarn run relay

Start the project

yarn start

Old version

This version is using older Relay version 10.0.1:

Working version of React + Relay application written in JavaScript:

License

MIT license

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].