Built by Interdiscipline (Grant Blakeman)
Yassss is a Jekyll app that builds CDN-ready static content with proper asset cache-busting. It assumes deployment to Amazon S3 via CircleCI. In addition to the base Jekyll install, it adds support for a content
section/tag that is parsed with Markdown. It has some opinionated structure to the javascript, sass/css, and the accompanying linting, but that can be easily changed/removed.
The goal of Yassss is simple and unambitious: provide a quick, easy way to spin up a new, production-ready static site, using Jekyll, without much tinkering. It has opinions and maybe you agree with them and will also find it useful.
Use this repo as a template—no need to clone it or fork it unless you’re planning to contribute.
Be sure to copy _config.example.yml
and name it _config.yml
. If you are planning on deploying with CircleCI, leave the .example
version in place and set your environment variables. Yasss uses specific versions of Ruby and Node. If you’re new to managing multiple ruby/node versions, you may want to check the Detailed Install instructions.
Install everything with:
yarn install
The bundle install
command will be run first. You can always run it separately as well.
Connect your repo to a CircleCI account.
Make sure the following environment variables are set:
AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY
Tweak the .circleci/config.yml
file to observe the branch(es) you wish to deploy on. By default it deploys to Production when commits are made to production
and to Staging when commits are made to either staging
or main
.
All builds run HTML Proofer in addition to js/sass linting. You may need to disable it (comment it out in .circleci/config.yml
) on your first deploy(s) until the site is up and running publicly because it will check internal links on your site in addition to links to external sites.
If you are new to static hosting on AWS, Dustin Curtis has a great guide that should get you pretty far.
Any Markdown files added to the _content
directory can be called via the content
tag and will be parsed through the Markdown parser.
{% content about.md %}
Yassss uses the jekyll-assets
plugin to manage assets. Place all assets within the _assets
directory and use the asset
tag to call them.
{% asset yassss.scss %}
{% asset yassss.js %}
body {
background-image: asset_url("test.png");
}
In a markdown file:
![Cliff]({% asset cliff.jpg @path %})
The default Sass setup takes advantage of Bourbon and Normalize. If you do not wish to use them, remove their references in the core yassss.scss
file and remove their files from the _assets/css/vendor
directory.
Both jekyll-sitemap
and jekyll-feed
are included in the basic config and enabled by default. Either or both can be easily disabled/removed based on your needs.