UrbanInstitute / nccs

NCCS data platform powered by Jekyll
https://urbaninstitute.github.io/nccs/
6 stars 8 forks source link

NCCS

Contents

Development

To install the site locally:

Command-line instructions

  1. Clone the repo with git clone future-address-here
  2. cd (navigate) into the repo
  3. bundle install to load gems
  4. bundle exec jekyll serve to spin the site up locally

Alternatively after you've set up the project, you can use the command shortcuts in the Rakefile to save yourself some typing:

Command Description
rake dev Starts Jekyll locally
rake build Run the Jekyll build process locally

Development Principles

Installation Troubleshooting

This project assumes that:

Other Troubleshooting

Fields

Content Type Fields

Each content type (Datasets, Resources, Stories) has it's own readme.md file documenting the fields accepted for each type. Many of the fields are shared across all three, and any unique fields have been called out.

Author and Citation

The author and citation fields have been built to follow the Quarto Citation formats.

The simplest version of the citation is to set it as:

citation: true

Which will cause all default fields to be used. But for customization, refer to the following fields:

Quarto

This project makes affordance for using Quarto to develop content. Currently the use of Quarto is only supported in _stories collection.

To use Quarto:

  1. Open the repository root in RStudio
  2. Navigate to or open files in the _stories directory
  3. Make any edits to a .qmd file needed
  4. Hit 'Render' in Rstudio
  5. Commit all changes to git and push up to the project.

The project settings will take care of the rest!

(Note: Github Pages will be set to pull from a specific branch. Make sure to either change the branch it's looking at to the one you're pushing changes to.)

What happens when you edit a Quarto document:

  1. The _quarto.yml in the repo root sets YAML defaults and is recognized by RStudio
  2. With the defaults, Quarto renders to markdown to the same directory as the .qmd file and preserves all YAML headers
  3. Jekyll, which is set to ignore .qmd files, recognizes the .md file in _stories and renders it to HTML, using all the appropriate templates (header, footer, etc)
  4. Jekyll during the build phase copies over all local folders inside _stories, including generated diagrams, etc.
  5. The extract-media field in _quarto.yml prepends any direct links to look for the copied assets from step 4.
  6. Live content!

Content Transformation Diagram

Here's another view of what's going on:

flowchart TD
    A[REPO] --> B(Quarto) --> |Rstudio Render + _quarto.yml| C(Markdown)
    Q[_quarto.yml] --> B
    A --> D(Liquid) --> G(Jekyll)
    A --> E(SCSS) --> G
    A --> C(Markdown) --> G
    A --> F(Templates/Partials) --> G
    G --> H(HTML, CSS, JS) --> |git| I([Github Pages])

Editing Tips

Previewing Quarto content

The best way to preview the content is to have Jekyll running in development mode (See Development).

With the dev server up and a browser window open to the dev url (something like http://http://127.0.0.1:4000/nccs/) navigate to stories and find your new entry.

Once you're on that URL, anytime you hit 'Render' from Rstudio, Jekyll will recompile the .md and show updates. (It should automatically refresh, if not you can manually refresh to show the changes.)