Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/prismicio/react-graphql-pagination-example

Example React website with GraphQL, Previews, & Pagination
https://github.com/prismicio/react-graphql-pagination-example

Last synced: 2 months ago
JSON representation

Example React website with GraphQL, Previews, & Pagination

Awesome Lists containing this project

README

        

# Prismic GraphQL Pagination & Preview Example
This project is an implementation of the Prismic blog site demo using ReactJS with GraphQL. It includes fully working Preview functionality as well as four different examples of working with the GraphQL Pagination system.

Check out the live demo of this project [here](https://prismic-graphql-pagination.netlify.app/all-posts).

## Pagination examples
The 4 implementations using the GraphQL pagination demonstrated in this project are:
- Recursively querying all documents of a type (more than the 20 item limit)
- An infinite loader button
- Next & Previous results buttons
- A full pagination example

## Getting started
Here is how to get this example project up and running.

### Install dependencies
After downloading the project files. Open your terminal to the root of the project and run the following command.

```
npm install
```

### Run the app in the dev mode
Run the following command and open your browser to http://localhost:3000 to view the project in development mode.

```
npm start
```

### Build the app for production
Run the following command to generate the `build` folder to use for your production deployment.

```
npm run build
```

## Deployment
This project is ready for deployment using [Netlify](https://www.netlify.com). If you're interested in deploying to other platforms review the suggested [solutions](https://facebook.github.io/create-react-app/docs/deployment).

## Get started with Prismic
You can find out how to get started with Prismic from [our React documentation](https://prismic.io/docs/reactjs/getting-started/getting-started-from-scratch).

## Licence
This software is licensed under the Apache 2 license, quoted below.

Copyright 2020 Prismic (https://prismic.io).

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this project except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.