-
Notifications
You must be signed in to change notification settings - Fork 15
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 7123b04
Showing
18 changed files
with
747 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
# This file is for unifying the coding style for different editors and IDEs | ||
# editorconfig.org | ||
|
||
root = true | ||
|
||
[*] | ||
end_of_line = lf | ||
charset = utf-8 | ||
insert_final_newline = true | ||
trim_trailing_whitespace = true | ||
indent_style = space | ||
indent_size = 2 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
node_modules | ||
.DS_Store | ||
.env | ||
.nyc_output |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
test | ||
contributing.md | ||
.editorconfig | ||
.travis.yml | ||
.nyc_output |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
language: node_js | ||
sudo: false | ||
node_js: | ||
- 6 | ||
after_script: | ||
- npm run coveralls |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
# Contributing to spike-contentful | ||
|
||
Hello there! First of all, thanks for being interested in spike-contentful and helping out. We all think you are awesome, and by contributing to open source projects, you are making the world a better place. That being said, there are a few ways to make the process of contributing code to spike-contentful smoother, detailed below: | ||
|
||
### Filing Issues | ||
|
||
If you are opening an issue about a bug, make sure that you include clear steps for how we can reproduce the problem. _If we can't reproduce it, we can't fix it_. If you are suggesting a feature, make sure your explanation is clear and detailed. | ||
|
||
### Getting Set Up | ||
|
||
- Clone the project down | ||
- Make sure [nodejs](http://nodejs.org) has been installed and is above version `6.x` | ||
- Run `npm install` | ||
- Put in work | ||
|
||
### Testing | ||
|
||
This project is constantly evolving, and to ensure that things are secure and working for everyone, we need to have tests. If you are adding a new feature, please make sure to add a test for it. The test suite for this project uses [ava](https://github.com/sindresorhus/ava). | ||
|
||
To run the test suite just use `npm test` or install ava globally and use the `ava` command to run the tests. | ||
|
||
### Code Style | ||
|
||
This project uses ES6 directly through node.js. To keep a consistent coding style in the project, we are using [standard js](http://standardjs.com/). In order for tests to pass, all code must pass standard js linting. This project also uses an [editorconfig](http://editorconfig.org/). It will make life much easier if you have the [editorconfig plugin](http://editorconfig.org/#download) for your text editor. For any inline documentation in the code, we're using [JSDoc](http://usejsdoc.org/). | ||
|
||
### Commit Cleanliness | ||
|
||
It's ok if you start out with a bunch of experimentation and your commit log isn't totally clean, but before any pull requests are accepted, we like to have a nice clean commit log. That means [well-written and clear commit messages](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html) and commits that each do something significant, rather than being typo or bug fixes. | ||
|
||
If you submit a pull request that doesn't have a clean commit log, we will ask you to clean it up before we accept. This means being familiar with rebasing - if you are not, [this guide](https://help.github.com/articles/interactive-rebase) by github should help you to get started. And if you are still confused, feel free to ask! |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
License (MIT) | ||
------------- | ||
|
||
Copyright (c) 2016 Tom Milewski, Carrot Creative | ||
|
||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: | ||
|
||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. | ||
|
||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,191 @@ | ||
# Spike Contentful Plugin | ||
|
||
[![npm](http://img.shields.io/npm/v/spike-contentful.svg?style=flat)](https://badge.fury.io/js/spike-contentful) [![tests](http://img.shields.io/travis/static-dev/spike-contentful/master.svg?style=flat)](https://travis-ci.org/static-dev/spike-contentful) [![dependencies](http://img.shields.io/david/static-dev/spike-contentful.svg?style=flat)](https://david-dm.org/static-dev/spike-contentful) | ||
[![coverage](http://img.shields.io/coveralls/static-dev/spike-contentful.svg?style=flat)](https://coveralls.io/github/static-dev/spike-contentful) | ||
|
||
[Contentful CMS](https://www.contentful.com/) plugin for [spike](https://github.com/static-dev/spike) | ||
|
||
> **Note:** This project is in early development, and versioning is a little different. [Read this](http://markup.im/#q4_cRZ1Q) for more details. | ||
### Why should you care? | ||
|
||
If you're using [Contentful](https://www.contentful.com/) and would like to pull your data for compilation into a [spike](https://github.com/static-dev/spike) static site, this will help you out. | ||
|
||
### Installation | ||
|
||
`npm install spike-contentful -S` | ||
|
||
### Usage | ||
|
||
This is a standard [webpack](https://webpack.github.io/) plugin, but is built for and intended to be used with [spike](https://github.com/static-dev/spike). You can include it in your spike project as such: | ||
|
||
```js | ||
// app.js | ||
const Contentful = require('spike-contentful') | ||
const jade = require('posthtml-jade') | ||
const locals = {} | ||
|
||
module.exports = { | ||
plugins: [ | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx', | ||
contentTypes: [ | ||
{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx', | ||
}, | ||
{ | ||
name: 'authors', | ||
id: '223gTahLaxxxxxxxxx', | ||
} | ||
] | ||
}) | ||
], | ||
posthtml: { defaults: jade(locals) } | ||
} | ||
``` | ||
|
||
At a minimum, the `spike-contentful` plugin requires both `name` and `id` for `contentTypes`. The `name` corresponds with how you'd like to access it in your templates. The `id` is found listed under "Identifier" by logging into Contentful and clicking "APIs" then "Content model explorer". | ||
|
||
Since Spike uses `posthtml`, you can use a variety of different plugins to expose local variables to your html. We are using [jade](https://github.com/posthtml/posthtml-jade) here because it's the plugin provided in spike's default template, and also is currently the only plugin that provides the ability to run complex loops through objects. | ||
|
||
In order to pass the data correctly, you must pass `spike-contentful` an object, which it will load the data onto when the compile begins under a `contentful` key. If you also pass the same object to whatever `posthtml` plugin you are using in whatever manner it requires to make the data available in your html templates, the data will be present on that object before they start compiling. This is a slightly unconventional pattern for Javascript libraries, but in this situation it allows for maximum flexibility and convenience. | ||
|
||
Once included, it will expose a `contentful` local to your jade files, which you can use to iterate through your content types. Based on the example above, the `posts` content type will be accessible through `contentful.posts`, as such: | ||
|
||
|
||
```jade | ||
//- a jade file | ||
ul | ||
for post in contentful.posts | ||
li= JSON.stringify(post) | ||
``` | ||
|
||
### Filters | ||
|
||
#### Limit | ||
|
||
To limit the number of results for a given content type: | ||
|
||
```js | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx', | ||
contentTypes: [ | ||
{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx', | ||
filters: { | ||
limit: 10 | ||
} | ||
} | ||
] | ||
}) | ||
``` | ||
|
||
### Transforms | ||
|
||
Contentful returns a lot of associated data and, as a result, we clean that up by default. You also have the ability to pass your own custom `transform` option to each content type allowing you to transform the data however you like before it's sent to your views. | ||
|
||
```js | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx', | ||
contentTypes: [ | ||
{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx', | ||
transform: (post) => { | ||
// do your transformation here... | ||
return post | ||
} | ||
} | ||
] | ||
}) | ||
``` | ||
|
||
You also have the ability to disable the default `transform` and receive the raw JSON data. | ||
|
||
```js | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx', | ||
contentTypes: [ | ||
{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx', | ||
transform: false | ||
} | ||
] | ||
}) | ||
``` | ||
|
||
### Templates | ||
|
||
Using the template option allows you to write objects returned from Contentful to single page templates. For example, if you are trying to render a blog as static, you might want each post returned from the API to be rendered as a single page by itself. | ||
|
||
The `template` option is an object with `path` and `output` keys. The `path` is an absolute or relative path to a template to be used to render each item, and output is a function with the currently iterated item as a parameter, which should return a string representing a path relative to the project root where the single view should be rendered. For example: | ||
|
||
```js | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx' | ||
contentTypes: [{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx', | ||
template: : { | ||
path: 'templates/post.html', | ||
output: (post) => { return `posts/${post.id}.html` } | ||
} | ||
}] | ||
}) | ||
``` | ||
|
||
Your template must use the `item` variable as seen below. Note: you also will need to prevent Spike from attempting to render your template file normally by adding your templates to Spike's `ignore` option, or adding an underscore to the file name. | ||
|
||
```html | ||
<p>{item.title}</p> | ||
``` | ||
|
||
### JSON Output | ||
|
||
Finally, if you'd like to have the output written locally to a JSON file so that it's cached locally, you can pass the name of the file, resolved relative to your project's output, as a `json` option to the plugin. For example: | ||
|
||
```js | ||
new Contentful({ | ||
addDataTo: locals, | ||
accessToken: 'xxx', | ||
spaceId: 'xxx' | ||
contentTypes: [{ | ||
name: 'posts', | ||
id: '633fTeiMaxxxxxxxxx' | ||
}], | ||
json: 'data.json' | ||
}) | ||
``` | ||
|
||
If you'd like to use our default transform outside of the library, this is also available as an export. For example, you could include it and use it with client-side JS responses. | ||
|
||
```js | ||
const Contentful = require('spike-contentful') | ||
console.log(Contentful.transform) | ||
``` | ||
|
||
### Testing | ||
|
||
To run the tests locally, you'll need to add a `test/.env` with your name and token values: | ||
|
||
- `cp test/.env.sample test/.env` | ||
- `accessToken` is derived from "APIs" > "Content Delivery API Keys" in the Contentful admin section. | ||
- `spaceId` is also derived from "APIs" > "Content Delivery API Keys" in the Contentful admin section. | ||
|
||
### License & Contributing | ||
|
||
- Details on the license [can be found here](LICENSE.md) | ||
- Details on running tests and contributing [can be found here](CONTRIBUTING.md) |
Oops, something went wrong.