Static websites are nothing new, neither are the generators that can be used to quickly deploy a site. Here, I explore Jekyll and Github Pages hosting.
According to StaticGen the most popular (stars and forks) ststic generator is Jekyll - Here a mix of Markdown and Liquid languages are compiled to create a website that can be quickly deployed to GitHub Pages.
Thats the basic approach for all static generators; write in simple plain text, run it through a generator engine, and voila, you have yourself some lovely HTML which you can distribute anywhere.
Firstly I like to keep source code on Github… And I was manually transferring code to my server via FTP (Cyberduck).
Unfortunately, I never managed to setup automated deployment or a webhook to do the transfer, and honestly I get a bit lost when trying to figure that out. However, I do know my way round my server and I like to have full control of where things go.
Jekyll provides me with templating features, this cuts down on the lines of code I need to write, that means I can spend more time on content.
Github Pages provides free, fast hosting and eliminates the manual FTP step in my previous worflow. - All the code is version controlled and can be tracked in Git.
So, using Jekyll to simplfy the deployment of my site, coupled with the built-in hosting that Github Pages provides has radically improved my deployment workflow.
This part is super easy, creating a repository named username.github.io, where username is your Github username is pretty much all that is required - The content inside the
master branch of my repository matthewelsom.github.io will automaticaly be displayed at the matthewelsom.github.io URL.
Every commit to the master will be reflected pretty much instantly on the site.
Goodbye FTP. Hello
Of course I wanted to retain my matthewelsom.com domain name, so I added a
CNAME file to the repository and added an
Alias record to the domain via my DNS provider.
This handles traffic redirects and makes your site accessible from your custom URL. There is a good tutorial here.
My repository is now being published at my custom domain.
This is an ever expanding topic, so I will aim to post more about this in the future.
Jekyll is Ruby and Node JS based. I have found that it is very easy for Mac users to pick up and run with, for Window-ers, installation can be a little more hazardous, the documentation here provides a very good step-by-step installation guide.
How to style Gantt charts with Google and CSS.
Using MatchHeight.js to dynamically set the height of selected page elements exactly.
A lot of gret styleguide methods are available, but I wanted to try something that was easy, fast and static!