This blog was created using Jekyll, which is a static site generator built in Ruby.
First, install Bundler: gem install bundler
and then do rbenv rehash
(to finalize the installation).
Then, from this repo's root folder, run bundle install
. This will install all of the gems listed in the Gemfile.
Then open up the _config.yml and edit the values for:
- title
- blurb
- description
- repository
The value for repository
should be for your whatever.github.io repo on GitHub.
That should be all of the installation needed!
From this project's root folder, run bundle exec jekyll serve
. This will run a local server with the site Jekyll builds at http://localhost:4000.
You should be able to run that command right now and visit http://localhost:4000.
This folder contains HTML snippets that are meant to be re-used across your website. It's a nice place for putting chunks of code that you don't edit very often, since it keeps them out of the way in files that you do edit often.
A layout wraps each page's content. Have you found that every HTML page in your website begins and ends with the same code--that only the stuff in the middle changes? Layouts solve that repetition.
Puts the begins-with and ends-with code in the layout, and use {{ content }}
to indicate where each page's content should be injected. Problem solved.
Posts are chronologically relevant content. This is in contrast to, for example, your 'About' page. It is not chronologically relevant--it doesn't matter on what date you made the 'About' page.
Posts are chronologically relevant, because it does matter when you wrote each post. Your collection of posts (tutorials, essays, etc) is essentially a journal, where the date you wrote each entry is useful information.
Posts are meant to be written in Markdown--hence the .md
file extension. You can write them as HTML, but it's faster to write them as Markdown (and Jekyll will convert them to HTML for you). Get in the habit of writing Markdown, as it's widely used for technical writing. Here is a good reference for Markdown.
Note: You can also mix Markdown and HTML inside the same file, but make sure the file extension is .md
. If you give the file a .html
extension, mixing won't work.
Regardless of whether you write them in HTML or Markdown, you must include "front matter" at the top of the file.
This is what front matter looks like:
---
title: "Lorem Ipsum"
---
Front matter defines information about the post. For now, title
is the only information you need to define, but later on you can use front matter to store other information.
Regardless of whether you use the .html
or .md
file extension, the file name must match this pattern exactly:
yyyy-mm-dd-title-separated-by-dashes
Some examples:
Good | Bad |
---|---|
2016-11-23-my-birthday.md 2017-02-24-snow-day-party.md 2013-12-31-learning-java-on-nye.md 2013-12-31-learning-java-on-nye.html |
2016-11-23-mybirthday.md 2017-2-24-snow-day-party.md 13-12-31-learning-java-on-nye.md 2013 12 31 learning java on nye.html |
If you have a kind-of long post title, you can shorten it in the filename. E.g. if your post title is "Learning Java on New Years Eve", the filename could be 2013-12-31-learning-java.md
or 2013-12-31-java-nye.md
or something like that. You have some flexibility there.
These are your website's pages. They are automatically wrapped with the layout defined in _layouts/default.html. Besides that, they're pretty standard HTML pages.
Pages are not chronologically relevant. That's why there's no indication of a date in their filename.
Even thought pages don't have a date, they do have front matter. All content in a Jekyll site needs front matter so that Jekyll knows how to generate the actual HTML files.
Place your CSS, JavaScript, fonts, images, and other assets in this folder. You can access them in your HTML code directly--e.g. <img src="/assets/myPhoto.jpg" />
.
Ignore _site, .gitignore, Gemfile, and any other files/folders that have not been explained.