Installing Jekyll and first use.

Installing Jekyll was a breeze for me. All the prerequisites were in place so installing went without an hitch. The install procedure is documented here.
A tip: before you install Jekyll, first update the existing (Ruby) gems with:

$ sudo gem update

Of course you will need to do this in a terminal window.

Then you can install Jekyll:

$ sudo gem install jekyll

And that was all. Ready to create our first Jekyll project.

Make sure that the command prompt is in a directory where the project directory must be created. However keep in mind that this is the development directory, so don't create it in the place where the website will be placed.

Type the following:

$ jekyll new MyGreatSite 

Then cd to the new directory:

$ cd  MyGreatSite 

Again, that is all you need. Next we start the Jekyll build-in server with:

$ jekyll serve 

Now point your browser of choice to: http://localhost:4000.

You should be rewarded with a website with the looks of the default Jekyll template.

Jekyll Templates

Now, at this point you may want to start hunting for nice looking templates or theme's. But I would suggest that you don't. Downloading templates at this early a stage will complicate things before you are ready for it. At least it did so for me, I almost gave up on Jekyll. Luckily I knew I went too far and I backtracked to just the plain Jekyll install.

Instead I suggest you take the time to learn each of the tools used by Jekyll.

First become familiar with HTML and CSS. It is not necessary imo to go in depth, but you do need a working knowledge. As a free resource http://w3schools.com is hard to beat imo. Note that we will be building a site with HTML and CSS so having a good grip on them will be mandatory. However just to start out a rudimentary knowledge should suffice.

Assuming you are somewhat familiar with HTML and CSS, learn SASS in the SCSS flavour. Read through the documentation at: http://sass-lang.com/documentation/file.SASS_REFERENCE.html. Again, just become familiar with the concept, you will learn the true depths as you go along.

Then take a look at Kramdown, the online resource is at: http://kramdown.gettalong.org/documentation.html. Same rule here, just the skinny of it.

I saved the best for last: Liquid. If you are a programmer, a quick scan of the documentation at https://docs.shopify.com/themes/liquid-documentation/basics will suffice. If you are not a programmer, hmm, then make sure you become familiar with it as it is the real power behind Jekyll. This is what you really need to create your own site template (theme).

With this under your belt it is time to attack the default site head on. Study the workings of it, add a post, add a page. Then start changing the theme itself and implement your own design. That is a lot of work, but you will know exactly how the site works and how the tools interact. Which imo is invaluable.

You could now start looking for a theme (for example at http://jekyllthemes.org). Personally I did not find a suitable theme, and besides I really like the challenge of creating my own.

Besides, there are additional questions that needs to be answered before creating a design or adopting one: which market do you want to reach? Do you need to support as many browsers as possible? or is it acceptable to write for the most recent versions? Can you use javascript or do you want to avoid it? Must it be RWD?

The site I will be creating will be made with HTML5 and CSS3. I will try to avoid Javascript.

More about that design in the next post.