It all started while i was trying to write a perfect theme for my wordpress powered blog. I was looking for best paractices to start a wordpress theme development so that it caters to all devices, i heard a lot about html5 elements and its capabilities to make websites responsive so i started looking at various articles to learn more about html5 then i noticed HTML5 Boilerplate.
HTML5 Boilerplate is a professional front-end template for building fast, robust, and adaptable web apps or sites.
HTML5 Boilerplate is currently maintained by
I follow the works of all these awesome people who contribute to H5BP but lot of my web development ideas are influenced by Paul Irish and Divya Manian as they are the two people who caught my eye when i first visited H5BP website.
I visited Divya Manian’s blog and liked it so i asked her on twitter about how her website was developed …
The tweet is not available !
With this tweet conversation i was introduced to Octopress.
What is great about octopress?
- It is static and so fast
- No need to worry about database as everything is stored in files which you can deploy wherever you want.
- I liked the tag line i.e “A blooging framework for hackers”
- I liked the huge learning curve which introduced me to lot of programming techniques and practices.
- Introduced me to lot of cool developers.
Pre requisites to use Octopress
- Comfortable running shellcommands
- Familiar with basics of Git
- Enthusiastic about learning
- I love Linux especially Ubuntu so running shell commands not a daunting task for me.
- I did here about Git before but never used it so i went and learned about its usage at git documentation.
- I am willing to learn.
$ apt-get install git
There two ways you can install Ruby :
cd git clone git://github.com/sstephenson/rbenv.git .rbenv echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile echo 'eval "$(rbenv init -)"' >> ~/.bash_profile git clone git://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build source ~/.bash_profile
First install RVM curl -L https://get.rvm.io | bash -s stable --ruby Install Ruby 1.9.3 (latest Ruby version at the time writing this article) rvm install 1.9.3 rvm use 1.9.3 rvm rubygems latest
ruby --version doesn’t give Ruby 1.9.3 as out put check your steps once again or seek help.
$ git clone git://github.com/imathis/octopress.git octopress $ cd octopress # If you use RVM, You'll be asked if you trust the .rvmrc file (say yes). $ ruby --version # Should report Ruby 1.9.3
octopress$ gem install bundler octopress$ rbenv rehash # If you use rbenv, rehash to be able to run the bundle command octopress$ bundle install
Now once the octopress is setupand all the dependecies are installed we need to install theme for the blog.
octopress$ rake install
… this installs default octopress theme which is beautiful and has lot of goodies to start blogging.
Now you have octopress on your system. Next you need to deploy the generated blog in some place which is publicly accessible over the internet. octopress can be deployed with some of the following ways.
- Github Pages
- Amazon s3
I used Github pages.
Hosting your blog in Github pages is free and it allows custom domains. The blog can be multi authored by pull requests.
Signup for Github account and create a repository with username.github.com or organization.github.com.(i used username.github.com)
Github pages for users and oganizations use master branch as public directory to which we push the generated blog content and in source we have the source that generates this blog i.e Octopress related.
This commiting and pushing of generated content to master and source to source can be done by setting up Octopress using its configuration rake task.
octopress$ rake setup_github_pages
- Ask you for your Github Pages repository url.
- Rename the remote pointing to imathis/octopress from ‘origin’ to ‘octopress’
- Add your Github Pages repository as the default origin remote.
- Switch the active branch from master to source.
- Configure your blog’s url according to your repository.
- Setup a master branch in the _deploy directory for deployment.
Now you can start blogging
octopress$ rake new_post['new_post']
Write some content and save.
Generate static content
octopress$ rake generate
Preview the website at localhost:4000 by executing following command
octopress$ rake preview
You can configure custom domains with github
echo 'your-domain.com' >> source/CNAME
Now visit your domain registrar or DNS host and add a record for your domain name. For a sub-domain like www.example.com you would simply create a CNAME record pointing at username.github.com. If you are using a top-level domain like example.com, you must use an A record pointing to 184.108.40.206.
Create README.md file echo ‘My personel blog’ >> source/README.md
Commit and push all changes to source in github
octopress$ git add . octopress$ git commit -am 'First commit' octopress$ git push origin source
Deploy site to Github master branch
octopress$ rake deploy
Contributing to an existing Octopress blog from another system
$ git clone email@example.com:username/username.github.com.git $ cd username.github.com username.github.com$ git checkout source username.github.com$ mkdir _deploy username.github.com$ cd _deploy username.github.com/_deploy$ git init username.github.com/_deploy$ git remote add origin firstname.lastname@example.org:username/username.github.com.git username.github.com/_deploy$ git pull origin master username.github.com/_deploy$ cd .. username.github.com$