https://github.com/graphile/gatsby-source-pg
PostgreSQL source for Gatsby, powered by PostGraphile
https://github.com/graphile/gatsby-source-pg
Last synced: 6 months ago
JSON representation
PostgreSQL source for Gatsby, powered by PostGraphile
- Host: GitHub
- URL: https://github.com/graphile/gatsby-source-pg
- Owner: graphile
- Created: 2018-11-01T12:35:34.000Z (over 7 years ago)
- Default Branch: main
- Last Pushed: 2024-11-18T22:42:13.000Z (over 1 year ago)
- Last Synced: 2025-03-31T04:05:45.525Z (11 months ago)
- Language: JavaScript
- Size: 509 KB
- Stars: 35
- Watchers: 3
- Forks: 15
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
Awesome Lists containing this project
- awesome-list - gatsby-source-pg
README
gatsby-source-pg
This module helps you pull your PostgreSQL database into Gatsby with minimal
effort.
## Crowd-funded open-source software
To help us develop this software sustainably, we ask all individuals and
businesses that use it to help support its ongoing maintenance and development
via sponsorship.
### [Click here to find out more about sponsors and sponsorship.](https://www.graphile.org/sponsor/)
And please give some love to our featured sponsors 🤩:
\* Sponsors the entire Graphile suite
## Usage
To install:
```
yarn add gatsby-source-pg
```
(or `npm install --save gatsby-source-pg`)
Then add the config to your `gatsby-config.js`:
```js
module.exports = {
/* ... */
plugins: [
/* ... */
{
resolve: "gatsby-source-pg",
options: {
connectionString: "postgres://user:pass@host/dbname",
schema: "public",
refetchInterval: 60, // Refetch data every 60 seconds
},
},
],
};
```
The `connectionString` can be any valid PostgreSQL connection string, a full
connection string might look like:
`postgres://pg_user:pg_pass@pg_host:pg_port/pg_db?ssl=1`
## How to query
```graphql
{
postgres {
allPostsList {
id
authorId
userByAuthorId {
id
username
}
title
}
}
}
```
## Example
For a working example of `gatsby-source-pg`, see
[gatsby-source-pg-example](https://github.com/graphile/gatsby-source-pg-example).
## Thanks
This plugin uses
[`gatsby-source-graphql`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-graphql#readme)
to merge the PostGraphile GraphQL schema into Gatsby's.
## Customising
This plugin is powered by PostGraphile, which is built on the highly flexible
and customisable Graphile Engine.
You can add to `options` most of the
[PostGraphile schema-only options](https://www.graphile.org/postgraphile/usage-schema/#api-createpostgraphileschemapgconfig-schemaname-options)
In addition, we accept the `typeName` and `fieldName` options from
`gatsby-source-graphql` which affect how the schema is namespaced, and the
`refetchInterval` setting to trigger refetching data every X seconds.
A common thing you might want to do is to shorten the names that PostGraphile
uses by default, you can do this using a plugin such as
`@graphile-contrib/pg-simplify-inflector`:
```js
// gatsby-config.js
module.exports = {
/* ... */
plugins: [
/* ... */
{
resolve: "gatsby-source-pg",
options: {
connectionString: "postgres:///mydb",
schema: "public",
/* 👇 */
appendPlugins: [require("@graphile-contrib/pg-simplify-inflector")],
/* 👆 */
},
},
],
};
```
## Getting help
Pop into the Graphile Discord:
[http://discord.gg/graphile](http://discord.gg/graphile)
## Helpful links
- [Gatsby documentation](https://www.gatsbyjs.org/)
- [gatsby-source-pg-example](https://github.com/graphile/gatsby-source-pg-example/)
- [PostGraphile documentation](https://www.graphile.org/postgraphile/)
