Creating Your Own Blog From Boilerplate is Sadism
Before the beautiful godly creation that is Jekyll came onto the world there used to be this super ugly thing called wordpress and it even had a nasty brother called blogger, together they formed an evil cabal of death onto the blogosphere.
When I started to make my own site. I thought I was a self respecting developer who could code his own blog.
But then I got halfway into it and was ready to rip my hair out from managing posts, comments, updates, pages, sorting the posts, filtering posts, call to action forms….blah blah blah. I was just reinventing the wheel! and it was not a pretty wheel at that.
So I was lost in a sea of pain and broken code of my own creation.
And then I discovered Jekyll
And guess what, it really doesn’t have to be a big hassle to put up a site.
In fact, you can make a sparkling portfolio in less than 10 minutes. Just don’t tell anyone when they ask you how you made it during your interview.
And I’ll show you how to use this site in just a second, but first…
Why Do I Need A Portfolio Blog Anyway?
There’s nothing worse then when I see a resume in front of me that has one of the following:
- no portfolio to showcase any work
- a wordpress portfolio
As a potential employer you want to see that the dev in question put in the work and can code at least enough to make and host their own site. Here’s a few more reasons to have your own web presence:
- Automated prospecting for job leads
- Show you are an expert in your language by blogging consistently
- It’s your resume, but so much better because it demonstrates real world skill
- Sets you apart from everyone who doesn’t have one
- Gets your name ranking on the web (for when your tinder date googles your name)
There is a site where all the work has already been done for you.
So…are you ready to build with Jekyll? Lets do it!
How to Build Your Own Jekyll Site
You Will Need
- Basic knowledge of git flow
- Ruby installed (here’s a good tutorial)
- A github account
- Jekyll installed (here’s how)
Step 1: Pick A Theme
- Go To JekyllThemes.org and pick out a theme you like, once in the theme click on the “Homepage” icon to be taken to the projects repo.
- Fork the repo and clone the repository to your local.
Step 2: Local Testing
- Run ‘bundle install’ on the command line to install the dependencies and then run ‘jekyll serve’ to see your site locally,
- If it works you should see your beautiful site running on http://127.0.0.1:4000/. After you have seen your site working, edit the page to your heart’s desire by setting variables in the config file
Step 3: Host On Github Pages
1) Create a git branch called gh-pages
2) Push to gh-pages (run git push –set-upstream origin gh-pages)
Step 4: Visit Your Newly Hosted Site
- Go to <yourgithubusername>.github.io/<reponame>
- Change to anytime you want by pushing more changes to github
If you cant get the url quite right you can also go into settings on your github repo, scroll down to the green highlighted url that shows where your site is being hosted.
404 On Loading of Resources On Your Hosted Site
- The urls dont match up: this can happen alot with jekyll sites that aren’t wired for github pages, though they should be as that was jekylls <link> original design. How to fix? If you go to your site and you see in the dev tools that you are getting 404s on resources then you need to add a site.baseurl to the file…then import it into your liquid templates. So when you finish your code it should like the red highlighted line here…
- If 404 dependency bullshit hell happens you can also delete the repo and download a new theme, there’s over a hundred out there so you should be able to find something that works out of the box 🙂
Wrong Ruby Version
Download a ruby update manager (I use rbenv) and install the correct version
A portfolio site is incredibly important for your career as a developer and it doesn’t have to be a pain to setup a fully coded site.
The inbound job leads you get for full-time and freelance work are worth the minimal effort to setup. And the baked in blog gives you the ability to write about your niche and become an expert in your language.
Remember, the best jobs are the ones you get in your inbox…not the ones you ask about on LinkedIn.
Best of luck, I’m sure you’ll go all googly eyed for Jekyll in short time. Drop a comment if you have any issues with the tutorial. Here is the video version of this post for the more visually minded.