> Note: Unpkg is a CDN for javascript modules, and it let's you point to semantic versions of files using prefix characters (so backwards-compatible bug fixes will loaded as soon as they're made available).
Netlify CMS works with the concept of collections of documents that a user can edit.
Collections basically comes in three forms:
1. A `folder`. Set the `folder` attribute on the collection. Each document will be a
file in this folder. Each document will have the same format, fields and meta fields.
2. A list of `files`. Set the `files` attribute on the collection. You can set fields that
all files in the folder shares directly on the collection, and set specific fields for
each file. This is great when you have files with a different structure.
3. A `file`. **Warning, not implemented yet**. This is a collection stored in a single file.
Typically a YAML file or a CSV with an array of items.
Each collection has a list of fields (or files with their individual fields). Each field has a `label`, a `name` and a `widget`.
Setting up the right collections is the main part of integrating netlify CMS with your site. It's where you decide exactly what content editors can work with, and what widgets should be used to edit each field of your various files or content types.
### GitHub as a Backend
The default Github-based authenticator integrates with Netlify's [Authentication Provider feature](https://www.netlify.com/docs/authentication-providers) and the repository
backend integrates directly with Github's API.
To get everything hooked up, setup continuous deployment from Github to Netlify
and then follow [the documentation](https://www.netlify.com/docs/authentication-providers)
to setup Github as an authentication provider.
That's it, now you should be able to go to the `/admin` section of your site and
log in.
### Media folder and Public folder
Most static file generators, except from Jekyll, don't keep the files that'll be
copied into the build folder when generating in their root folder.
This can create a problem for image and file paths when uploaded through the CMS.
Use the `public_folder` setting in `config.yml` to tell the CMS where the public
folder is located in the sources. A typical Middleman setup would look like this:
```yml
media_folder: "source/uploads" # Media files will be stored in the repo under source/uploads
public_folder: "source" # CMS now knows 'source' is the public folder and will strip this from the path
```
### Widgets
Actual content editing happens with a side by side view where each `widget` has
a control for editing and a preview to give the content editor an idea of how the
content will look in the context of the published site.
Currently these widgets are built-in:
* **string** A basic text input
* **markdown** A markdown editor
* **datetime** A date and time input
* **image** An uploaded image
## Extending Netlify CMS
The Netlify CMS exposes an `window.CMS` global object that you can use to register custom widgets, previews and editor plugins. The available methods are:
* **registerPreviewStyle** Register a custom stylesheet to use on the preview pane.
* **regsiterPreviewTemplate** Registers a template for a collection.
* **registerWidget** lets you register a custom widget.
**Writing React Components inline**
Both regsiterPreviewTemplate and registerWidget requires you to provide a React component. If you have a build process in place for your project, it is possible to integrate webpack and Babel for a complete React build flow.
Although possible, it may be cumbersome or even impractical to add a React build phase. For this reason, Netlify CMS exposes two React constructs globally to allow you to create components inline: ‘createClass’ and ‘h’ (alias for React.createElement).
### `registerPreviewStyle`
Register a custom stylesheet to use on the preview pane.
