mirror of
https://github.com/hasura/graphql-engine.git
synced 2024-12-15 01:12:56 +03:00
add gatsby-postgres-hasura boilerplate (#499)
This commit is contained in:
parent
8f6b19d6f1
commit
33accea81c
62
community/boilerplates/gatsby-postgres-graphql/.gitignore
vendored
Normal file
62
community/boilerplates/gatsby-postgres-graphql/.gitignore
vendored
Normal file
@ -0,0 +1,62 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Typescript v1 declaration files
|
||||
typings/
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variables file
|
||||
.env
|
||||
|
||||
.cache/
|
||||
public
|
||||
yarn-error.log
|
49
community/boilerplates/gatsby-postgres-graphql/README.md
Normal file
49
community/boilerplates/gatsby-postgres-graphql/README.md
Normal file
@ -0,0 +1,49 @@
|
||||
# gatsby-postgres-graphql
|
||||
|
||||
Boilerplate to get started with Gatsby, Hasura GraphQL engine as CMS and postgres as database using the awesome plugin [wyze/gatsby-source-graphql](https://github.com/wyze/gatsby-source-graphql).
|
||||
|
||||
# Running the app yourself
|
||||
|
||||
- Deploy Postgres and GraphQL Engine on Heroku:
|
||||
|
||||
[![Deploy to
|
||||
heroku](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/hasura/graphql-engine-heroku)
|
||||
- Get the Heroku app URL (say `my-app.herokuapp.com`)
|
||||
- Clone this repo:
|
||||
```bash
|
||||
git clone https://github.com/hasura/graphql-engine
|
||||
cd graphql-engine/community/boilerplates/gatsby-postgres-graphql
|
||||
```
|
||||
|
||||
- Create `author` table:
|
||||
|
||||
Open Hasura console: visit https://my-app.herokuapp.com on a browser
|
||||
Navigate to `Data` section in the top nav bar and create a table as follows:
|
||||
|
||||
![Create author table](./assets/add_table.jpg)
|
||||
|
||||
- Insert sample data into `author` table:
|
||||
|
||||
![Insert data into author table](./assets/insert_data.jpg)
|
||||
|
||||
Verify if the row is inserted successfully
|
||||
|
||||
![Insert data into author table](./assets/browse_rows.jpg)
|
||||
|
||||
- Install npm modules:
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
- Run the app:
|
||||
```bash
|
||||
HASURA_GRAPHQL_URL=https://my-app.herokuapp.com/v1alpha1/graphql npm run develop
|
||||
```
|
||||
- Test the app
|
||||
Visit [http://localhost:8000](http://localhost:8000) to view the app
|
||||
|
||||
![Demo app](./assets/test_app.jpg)
|
||||
|
||||
# Contributing
|
||||
|
||||
Checkout the [contributing guide](../../../CONTRIBUTING.md#community-content) for more details.
|
Binary file not shown.
After Width: | Height: | Size: 81 KiB |
Binary file not shown.
After Width: | Height: | Size: 76 KiB |
Binary file not shown.
After Width: | Height: | Size: 57 KiB |
Binary file not shown.
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
After Width: | Height: | Size: 50 KiB |
@ -0,0 +1 @@
|
||||
endpoint: https://hasura-graphql-2.herokuapp.com
|
@ -0,0 +1,19 @@
|
||||
module.exports = {
|
||||
// ...
|
||||
plugins: [
|
||||
{
|
||||
resolve: 'gatsby-source-filesystem',
|
||||
options: {
|
||||
name: 'queries',
|
||||
path: `${__dirname}/src/queries/`,
|
||||
},
|
||||
},
|
||||
{
|
||||
resolve: '@wyze/gatsby-source-graphql',
|
||||
options: {
|
||||
headers: {},
|
||||
url: `${ process.env.HASURA_GRAPHQL_URL }`,
|
||||
},
|
||||
},
|
||||
]
|
||||
};
|
@ -0,0 +1,3 @@
|
||||
- args:
|
||||
sql: DROP TABLE public."author"
|
||||
type: run_sql
|
@ -0,0 +1,8 @@
|
||||
- args:
|
||||
sql: CREATE TABLE public."author"("id" serial NOT NULL, "name" text NOT NULL,
|
||||
PRIMARY KEY ("id") );
|
||||
type: run_sql
|
||||
- args:
|
||||
name: author
|
||||
schema: public
|
||||
type: add_existing_table_or_view
|
@ -0,0 +1 @@
|
||||
[]
|
@ -0,0 +1,7 @@
|
||||
- args:
|
||||
cascade: false
|
||||
sql: |-
|
||||
INSERT INTO author (name) values ('J.R.R Tolkien');
|
||||
INSERT INTO author (name) values ('J.K Rowling');
|
||||
INSERT INTO author (name) values ('Stephen King');
|
||||
type: run_sql
|
12273
community/boilerplates/gatsby-postgres-graphql/package-lock.json
generated
Normal file
12273
community/boilerplates/gatsby-postgres-graphql/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
16
community/boilerplates/gatsby-postgres-graphql/package.json
Normal file
16
community/boilerplates/gatsby-postgres-graphql/package.json
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
"name": "gatsby-postgres-graphql",
|
||||
"description": "Gatsby simple source hasura graphql cms",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"develop": "gatsby develop",
|
||||
"build": "gatsby build",
|
||||
"serve": "gatsby serve"
|
||||
},
|
||||
"dependencies": {
|
||||
"@wyze/gatsby-source-graphql": "^1.2.0",
|
||||
"gatsby": "^1.9.277",
|
||||
"gatsby-link": "^1.6.46",
|
||||
"gatsby-source-filesystem": "^1.5.39"
|
||||
}
|
||||
}
|
@ -0,0 +1,13 @@
|
||||
import React from "react"
|
||||
|
||||
const AuthorList = ({ authors }) => (
|
||||
<div>
|
||||
{authors.map((a, i) => (
|
||||
<div key={i}>
|
||||
<h2>{a.name}</h2>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
|
||||
export default AuthorList;
|
@ -0,0 +1,22 @@
|
||||
import React from "react"
|
||||
import AuthorList from "../components/AuthorList"
|
||||
|
||||
const Index = ({ data }) => (
|
||||
<div>
|
||||
<h1>My Authors </h1>
|
||||
<AuthorList authors={data.hasuraGraphQl.author} />
|
||||
</div>
|
||||
)
|
||||
|
||||
export default Index;
|
||||
|
||||
export const query = graphql`
|
||||
query AuthorQuery {
|
||||
hasuraGraphQl {
|
||||
author {
|
||||
id
|
||||
name
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
@ -0,0 +1,6 @@
|
||||
{
|
||||
author {
|
||||
id
|
||||
name
|
||||
}
|
||||
}
|
8202
community/boilerplates/gatsby-postgres-graphql/yarn.lock
Normal file
8202
community/boilerplates/gatsby-postgres-graphql/yarn.lock
Normal file
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user