Setting up a free website using Jekyll and GitHub pages
Recently I was able to cut down on some of my site hosting costs by moving to GitHub Pages, a free way to host public websites of static content. It won’t work for something like WordPress where you need to run something server side, but it works great for plain .HTML pages for instance. Also, by using Jekyll you can dynamically generate static .HTML pages for your site, allowing you to do some cool stuff like generate blog posts from easy-to-write markdown files.
Here’s how you can get started with your own GitHub site, summarized below:
- Install the latest version of ruby.
- Open the command prompt and run
gem install bundler
to install Bundler, a ruby package manager. - Save this file as “Gemfile” (no file extension) in the folder where you want to build your GitHub site (note: if the gist link doesn’t work, check here for instructions on making that file.
- Open a command prompt from within the folder for the previous step and type
bundle install
. This should install Jekyll and any needed dependencies. - Execute
bundle exec jekyll new . --force
into the command prompt inside your site folder. This will create a simple base template to build your site off of. - Lastly, execute
bundle exec jekyll serve
into the same command prompt and your site should be dynamically generated and available for viewing athttp://localhost:4000
.
Now, whenever you want to start working on your site, just start Jekyll by typing bundle exec jekyll serve
and then
begin editing! By default Jekyll will watch your site folder for changes and automatically recreate site content as you
save your files.
To upload your site to GitHub, do the following (summarized below):
- Create a new repository called
username.github.io
, whereusername
is replaced by your GitHub username. - Init a new Git repository by typing
git init .
in a command window in your site’s root directory. - Type
git remote add origin [email protected]:username/username.github.io.git
, replacingusername
with your GitHub username as needed. - Type
git push -u origin master
to push your site to GitHub
Your site should then appear on GitHub at http://username.github.io
after a short time (maybe 10-15 minutes for it
to be generated for the first time).
To learn more about using Jekyll itself, check out the official Jekyll site, and especially the subpage on writing posts.