You'll need to install node.js if you don't have it. The installer is available at http://nodejs.org. You will also need Grunt, which can be installed with:
sudo npm install -g grunt-cli
You may want to configure RubyGems to not install the unneeded RDoc stuff for each gem. To do that, add a ~/.gemrc
file and insert the following lines:
install: --no-rdoc --no-ri
update: --no-rdoc --no-ri
You may want to configure Bundler to install gems in a location relative to the project instead of globally; in this case the /vendor
directory of the project.
mkdir ~/.bundle
touch ~/.bundle/config
echo 'BUNDLE_PATH: vendor/bundle' >> ~/.bundle/config
Then, in Terminal, run these commands to install everything you need:
sudo gem update --system
sudo gem install bundler
bundle install
sudo npm install
In Terminal, run the following command to have grunt start watching files, and start our Jekyll server:
grunt server
The server will exist as long as your command is running. By default you go to http://localhost:4000/ to see your Jekyll site. If will also concat all JavaScript, watch for .scss file changes and any changes within the _posts folder or in an .html file. Each one of these will trigger their respective tasks to run, the Jekyll static files to be rebuilt, and LiveReload to automaticaly reload the page.
We have .gitignore excluding the _site
directory that Jekyll creates because Github will take care of generating that folder when we push to gh-pages
branch.
JS is kept in the _js/
folder. This is ignored by Jekyll. Grunt builds the JavaScript (minimizes and concatenates it) and places the built files in the js/
folder, which Jekyll will include in the site build.
In the JS source folder, there is a folder /vendor
, which contains the minimized or unminimized versions of vendor script (e.g. jQuery and Ember), and sometimes both. We keep both in the case that the vendor provides an optimized version of their library that we can't reproduce using Grunt's minimize. For example, ember.min.js doesn't contain any assertions or debugging to reduce it's size even further than what you can achieve with a standard minimize.
The Grunt job cleans the js/dist
folder by removing it completely. It then recreates the folder and it's contents.
After finishing your work, run grunt build
to build production copies of the content, CSS, and JS.
Jekyll has a hard requirement for posts' file names. The required format is as follows: YYYY-MM-DD-post-slug.md
— but... we don't want to bother with a valid date for most types of pages. So we're using fake, hardcoded dates for most content. Exceptions:
- News should contain the actual publish date in
YYYY-MM-DD
format - Scheduled sessions use an unofficial, extended date format:
YYYY-MM-DD-HH-mm
, where HH is 24-hour clock andmm
is minutes. Although hour and minutes make no difference to Jekyll, it provides alphabetization of posts within its main loop, so that we can print them out in the correct order on the schedule.
News YYYY-MM-DD-post-slug.md
FAQs 0002-02-02-faq-title.md
Sessions YYYY-MM-DD-HH-mm-session-title.md
Workshops 0004-04-04-workshop-title.md
- Crash course in Liquid templates
- High-level overview of structured content in Jekyll
- Look in the
_layouts
folder to see all of our templates._includes
contains some templating stuff too.
In order to submit a change, fork the DrupalCamp repo and make changes on your personal fork, then use the Pull Request button on GitHub to submit the changes.
✨ 🐋 😄 Cute icons in front of commit messages are encouraged but not required