https://github.com/juffalow/react-relay-example
Example project how to use React, Relay and TypeScript
https://github.com/juffalow/react-relay-example
example-project graphql react react-bootstrap react-helmet react-router relay typescript
Last synced: 29 days ago
JSON representation
Example project how to use React, Relay and TypeScript
- Host: GitHub
- URL: https://github.com/juffalow/react-relay-example
- Owner: juffalow
- License: mit
- Created: 2019-05-23T19:46:00.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2025-01-10T11:30:14.000Z (5 months ago)
- Last Synced: 2025-03-30T20:03:17.244Z (about 2 months ago)
- Topics: example-project, graphql, react, react-bootstrap, react-helmet, react-router, relay, typescript
- Language: TypeScript
- Homepage: https://quotes.juffalow.com/
- Size: 2.6 MB
- Stars: 33
- Watchers: 3
- Forks: 9
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React + Relay Example
List of Quotes with Authors implemented in React + Relay.
*You can use either [PHP](https://github.com/juffalow/slim-graphql-eloquent-example) or [Node](https://github.com/juffalow/express-graphql-example) as a backend.*
## How to run the project
#### Installation
```shell
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:
```js
export default {
graphql: 'http://localhost:3013/graphql',
};
```
#### Download GraphQL schema
For this, you need to have [graphql-cli](https://github.com/graphql-cli/graphql-cli) installed.
```shell
graphql get-schema --project quotes -e default
```
Build / transform components which are using graphql / relay
```shell
yarn run relay
```
#### Start the project
```shell
yarn start
```
## Old version
This version is using older Relay version `10.0.1`:
* [1.2.3](https://github.com/juffalow/react-relay-example/tree/1.2.3)
Working version of React + Relay application written in JavaScript:
* [1.0.0](https://github.com/juffalow/react-relay-example/tree/1.0.0)
## License
[MIT license](./LICENSE)