Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/glweems/gatsby-source-behance-images
https://github.com/glweems/gatsby-source-behance-images
behance behance-api gatsby gatsby-plugin gatsby-source
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/glweems/gatsby-source-behance-images
- Owner: glweems
- License: mit
- Created: 2019-07-27T01:53:47.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T06:00:32.000Z (about 2 years ago)
- Last Synced: 2024-11-09T04:05:25.765Z (2 months ago)
- Topics: behance, behance-api, gatsby, gatsby-plugin, gatsby-source
- Language: TypeScript
- Size: 3.87 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 36
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# gatsby-source-behance-images
A Gatsby source plugin for sourcing data into your Gatsby application from behance's api and downloading the images to use with gatsby-image
## Install
`npm install --save gatsby-source-behance-images`
or
`yarn add gatsby-source-behance-images`
## How to use:
```javascript
// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-source-behance-images`,
options: {
// Visit your profile and grab the name after behance.net/<< username >>
username: 'glweems',
// You can get your API Key here: https://www.behance.net/dev/register
apiKey: ''
// OPTIONAL
// Set custom directory for downloaded images
directory: 'public'
}
}
];
```
Query all projects
```graphql
query AllBehanceProjects {
allBehanceProjects {
nodes {
slug
name
modified_on
description
created_on
copyright {
description
}
}
}
}
```
Query user information
```graphql
query BehanceUserQuery {
behanceUser {
tags
company
avatar
place {
city
country
location
state
}
stats {
appreciations
comments
followers
following
team_members
views
}
url
website
names {
lastName
displayName
firstName
username
}
}
}
```
Query data for gatsby-image
```graphql
query FluidBehanceImages {
allFile(filter: { sourceInstanceName: { eq: "behanceProject" } }) {
edges {
node {
childImageSharp {
fixed(width: 400) {
...GatsbyImageSharpFixed
}
}
}
}
}
}
```
# Query project covers
```graphql
query BehanceProjectCovers {
allFile(filter: { name: { eq: "cover" }, relativeDirectory: { regex: "/gatsby-source-behance-images/" } }) {
edges {
node {
name
sourceInstanceName
relativePath
relativeDirectory
}
}
}
}
```