• NodeJS >= 10.16.3
• Contentful space (create an account and project here)

Run this command to install the project:

npm install

In order to run the project correctly you need to create an .env file with the contenful API keys. You can based on the .env.example file. Just replace the values of these two variables with your Contentful space credentials

CF_SPACE="YOUR_CONTENTFUL_SPACE_ID"
CF_ACCESS_TOKEN="YOUR_CONTENTFUL_SPACE_API_KEY"

To see instructions on how to get these values go to these links:

Find Contentful space ID

Create Contentful API keys

Run the dev server:

npm run dev

Open http://localhost:8080 using your browser to see the site.

Run this command to build the static site:

npm run build

This will output the site in a folder called build/site. Serve the index.html to see the site.

Inside you templates all entry fields are available by the Field ID as defined in your Content model. You can reference them directly in your template. For example:

<h3>{{caption}}</h3>

This will output the value of the entry's caption field. Note, that it's Field ID which is used here and not the field Name.

Stacy adds a few special helpers that you can use in your templates:

• module <reference field> - Include module entry referenced by the Reference type field. For example, given that you have a field with ID paragraphs and it is a list of references:

  {{#each paragraphs}}{{{module this}}}{{/each}}

• asset <asset field> - Include the referred asset, such an image. For example:

  {{asset picture}}

  Currently, only image assets are supported, for which an HTML <img> tag is rendered.

• assetSrc <asset field> - Get URL of the asset. For example:

  <img src="{{assetSrc picture}}">

• assetTitle <asset field> - Get title of the asset. For example:

  <img src="{{assetSrc picture}}" alt="{{assetTitle picture}}">

• markdown <long text field> - Render Markdown long text field. For example:

  {{{markdown description}}}

  Note the tripple-braces needed here because the helper generates HTML which needs not to be escaped.

• richText <rich text field> - Render rich text field. For example:

  {{{richText content}}}

  As with markdown, note the triple-braces.

• json <field> - Output internal Contentful JSON representation of the field. For example:

  <pre>{{json myField}}</pre>

  This helper may be useful for diagnosing problems.