hpr-knowledge-base/hpr_transcripts/hpr1370.txt

Episode: 1370
Title: HPR1370: Blogging With Octopress
Source: https://hub.hackerpublicradio.org/ccdn.php?filename=/eps/hpr1370/hpr1370.mp3
Transcribed: 2025-10-18 00:22:02

---

You
Hi, my name is Tony Palais and this is my first contribution to Hacker Public Radio.
Today I want to talk to you about Octopress and advocate the use of static site generators
to help you create websites and build the HTML necessary to do anything from build your
blog to create a product catalog or portfolio website.
I, for a long time, have run a small blog called I Learn Things.com where I post a, where
I have posted a series of tutorial screencasts with hopes of teaching people valuable business
skills, specifically how to use free and open-source software such as Libra Office, Open Office,
those type of things.
Because in my work, I have found that a lot of people really lack some of these very basic
word processing and office software type skills and the beauty is that there's a, there
are a number of free programs out there and free educational material, which you as a
prospective employee can learn in order to empower yourself, be able to get a good or
higher paying job and improve your situation in life.
So it's something I've been very passionate about in providing this free education and
I had built my web blog on one of the most common platforms, which is WordPress and for
a long time I was very satisfied with the results.
But maybe a year ago or so, I received a notice from Google saying that my site had been
de-listed for possible malicious activity and this kind of sent me into panic because
I don't have the resources or anything to continually monitor my website to make sure
everything's running fine.
And I was panicking because I thought someone had hacked it, maybe taken over my website
and then who knows what.
So I began the process of investigation.
I took the site offline.
I compared the actual code that was on the site with backups that I had had through a
series of dips to try to figure out what had changed and what had caused Google to de-list
my site and market as malicious.
In the end, I couldn't really ever figure out what the issue was.
The closest explanation I had was that there was a link or an image link, which I had posted
from the SoCal Linux Expo advertising my attendance at scale and that image had been taken
down from their website so it was pointing to a blank image and I think that might have
been what caused Google to de-list my site or market as malicious.
But I have no confirmation of that and when you're investigating these things, there's
no sure way or I find it can be incredibly difficult to determine exactly what the issue
may be because there are just so many variables.
In the end, I was able to get Google to list my site again and it seemed that I resolved
all the issues but really, I was kind of disappointed in WordPress itself because I know WordPress
is vulnerable to a lot of issues.
You have to continuously ensure that you maintain this website or not the website but the
content management system WordPress itself as a system.
You have to constantly update it because it is a big target to be exploited.
Now, web has benefited greatly from dynamic languages such as PHP, Pearl, Ruby and Python
to create websites that are rich and engaging and allow us to have conversations online.
When the web first came out, I remember back to those days, it was very much a one-way
conversation.
It was a way for us to just post information online and kind of didact and expel what was
on our mind and have other people read it but it was very uncommon for these other people,
these millions of people online to actually interact with these web pages.
That's really what the big revolution of what's called 2.0 brought is this sort of interactivity.
This emphasis on conversation and interaction and where our users are invested in the content
itself that is created on these websites.
These sorts of websites would not have been possible without these dynamic languages but
at the same time these languages brought in a lot of security issues that you now have
to worry about if you're building a website in PHP or Ruby or Pearl or any of those other
languages because it allows potentially or malicious people to potentially alter the contents
of your website to make it your website do things that you don't want them to do.
One way to eliminate many of these risks is to make your website static in other words make
it so nothing can change on the website and though you're still vulnerable to exploits
in the security of the underlying operating system or the security of your web server itself
that serving up these pages, you do eliminate a lot of the potential avenues of attack by
providing only static HTML pages.
Now of course you're saying well aren't we just returning to a time when we're just
posting information online and we're not allowing our users or our viewers or web page viewers
to interact with the content that we have listed on the website and yeah I mean to a large
extent yes you know we are but we're doing that on purpose and for a great number of websites
it's really all that is needed you know blogs the purpose of blog is many times for us
to express ourselves ideas document what we've been through document things that we have
learned and that takes primacy over the actual interaction with our viewers and that's
not to say that interactions is completely eliminated if we resort to static websites
because most modern web browsers do allow JavaScript and you can simulate a degree of interactivity
using JavaScript as a tool.
So when I made the decision to change my WordPress blog to a static website my biggest concern
was this would my users be able to interact they feel vested in the actual website and
the content that I was providing and you know normally this is done through allowing users
or viewers to enter comments and interact with you in that format but I found that there
was a service software as a service called discuss which you could embed into your website
which would allow you to provide comments even though your website itself was static and
unchanging and it did that by by allowing you to embed a piece of JavaScript which would
communicate to a third party server and of course these comments would then be stored in this
third party server so the disadvantage was that I didn't manage these comments and they weren't
really mine they were on this third party server but the advantage was that it's one less thing
that I had to worry about in terms of managing my site so then I set out once I figured out okay
well this this problem is solved I don't have to worry about not being able to provide comments
or some form of interaction with my users I said about trying to find what would be the best way
to generate a static HTML website and there are a number of static HTML site generators out there
pretty much any programming language you can think of has one and probably the most common the
most popular one is one called jekyll which was pioneered by github github of course is an online
community centered around github and project and development they offer open source projects the
ability to host their code for free and they use jekyll to create their what they call github pages
which are basically project pages or websites that are hosted on github that can be specific to a
single user or project itself I looked at that and jekyll is great but it's very bare bones
it it basically all it does is give you a series of scripts that help you automate it but you're
still building a website essentially from scratch and though there's a lot of power in jekyll
there is a little bit of a time commitment necessary in order to get it up and running
and design the way that you want the second project that I look at looked at was the jekyll
bootstrap which which basically took jekyll and added some scripts to configure some of the very
basic stuff that you would need out of the box such as themes and basic deploying scripts and
those kind of things but jekyll bootstrap fell out of favor or didn't fall out of favor but
but it was the the originator of that project moved on to other projects and so it's kind of
fallen by the wayside and replaced by other more currently maintained projects I also took a
look at pelican which was a python version essentially of jekyll and I like that one a lot because
a python comes by default in a lot of linux operating systems and I use linux as my own operating
system so I didn't have to really install too many other dependencies but still I found better
options and then there was a hpr episode number one two zero three on templer which is pearl based
another good example of a static site generator but again I'm not I'm not an expert on pearl I do
I do know ruby quite well and I know a little bit of python so I felt a lot more comfortable in
those languages and the nice thing about a static site generator if you know these languages you
can really customize it to your needs so you can really take it and run with it and and the idea
of these site static site generators is that you write code to basically create these sites for you
and really simplify the process of in my case of creating my blog creating new blog posts updating
the rss feed embedding the videos the pictures and so on and so forth so finally the one I
settled on was a tool called octopress and it's available at octopress.org and the reason I settled
on this particular one is that one it's it's based on jekyll which is again one of the most
popular static site generators and but on top of that it it adds a number of really useful tools
that I really enjoyed it was based on ruby and ruby's a language that I'm very comfortable in and
if you're not familiar with ruby or never programmed in ruby it's something I highly recommend
getting into it's a very expressive programming language it's available pretty much in any
operating system and it's very easy to read and you know the the adage basically goes that ruby
was designed for programmer happiness so if you're a programmer and you like or even if you're not
a programmer if you do any programming and you like to be happy why not give ruby a try now
it's kind of cliche to say that but in truth that that has been my experience I'm not really a
professional programmer but I do enjoy programming and solving problems using programming tools such as
the ruby language so ruby as the programming language for octopress and really allows for very
expressive scripts and very easy to modify templating system octopress also uses sass which stands for
syntactically awesome style sheets which is essentially I guess it's a pre-processor for CSS in other
words it lets you write code that looks very similar to CSS code but gives you a few additional
options which are not available in CSS including the use of variables so if you have for example colors
that you wanted to find for your particular website you can define variables for these colors
and if you ever down the line need to change the colors instead of changing every instance where
particular color appears in your CSS file you just change the instance where you declare the variable
and what sass does is compile these files into regular CSS so this sass if you've never used it
to build websites it's really a tremendous tool octopress comes with sass and uses it by default
if it's not something you've used it for it it might take a little use getting used to to actually
harness the power of sass but the nice thing about sass is if you don't know sass or you don't know
the sass syntax you can just write CSS and it will still work hey there's nothing more that you have
to learn in order to use it but if you do spend the time to learn sass you will be rewarded it
also uses twitter bootstrap as the basic template of the system and twitter bootstrap is a HTML 5 template
essentially used quite commonly in modern websites and what it offers is a very modern very beautiful
very simple design that is scalable across a wide wide variety of different screen resolutions and
the reason that's important is because as devices we we kind of have huge variety of different
resolutions we have cell phones and we have monitors we have write data displays or high resolution
monitors so you never know what what the devices are that they're going to be viewing your website on
and what what twitter bootstrap one of the things I really like about it in addition to that it looks
very appealing is that it really works well across a multitude of different screen sizes so
I can look at my website on my mobile phone or I can look at my desktop and I will still have a good
experience browsing my website. octopus also came with an HTML 5 video plugin which meant it was very
easy to integrate HTML 5 video and I ended up customizing this part for my particular needs but
but because I my blog was a screen casting blog where I posted videos it was this is one thing
that was very important to me. I ended up by default the octopus video plugin uses just MP4
x264 files basically and if your browser is not compatible in playing these it'll display a
flash video and I wanted a few more options so I ended up changing the code for mine and to also
enable aug videos and web m videos in the HTML 5 format so if you visit the site depending on the
browser that you have it'll go through and try to find one version of the video that will play
correctly in your web browser so that where I didn't have to rely on flash or a youtube or
anything like that to have my videos displayed and then finally one of the big selling points for
me in using octopus was that deployment scripts that it comes with it's so incredibly easy to
write your blog post and it's just a two letter command in the terminal to deploy it and make it
live all right so now that you have an idea of of really the beauty of a static site generator
I'm gonna give you some of the requirements I'm not gonna list all the or read the code out loud
because it can get very boring but I will have a list of commands in the show notes that you can
then follow to get your blog or website published using octopus in order to set up your environment
you're gonna have to have a few tools installed on your computer your octopus depends on get
and get is the version control system used quite extensively in the open source community because
of its flexibility and the nice thing about using get to distribute octopus is that really it's
compatible in almost any environment so all you're doing when you're installing octopus on your
computer is really cloning the repository of octopus and it creates a folder that you can then use
to change the files to publish your own website it also requires Ruby like I said before
now I know in the open source Linux community Ruby is not quite as common as some other similar
programming language such as Python but if you've never given Ruby a try I would highly recommend it
to learn the very basics it shouldn't take too long I will try to include some resources in the
show notes that you can use to get your feet wet with Ruby but even if you don't feel like spending
the time learning Ruby you can still use octopus because really what you're using when you're using
octopus is just its text editor and a few commands on the command line so you need Ruby installed
now installing Ruby can have its own problems particularly because octopus requires Ruby 1.9.3
and a lot of systems including the Ubuntu LTS 12.04 I don't believe come with a version that's
1.9.3 or later so in order to get around these issues there are a number of tools in the Ruby
community that were developed that allow you to install localized versions of Ruby and quickly
switch between the system one and the local one or have several versions of in a local system so
you can have different projects each with which a different version of Ruby and the one that I
recommend is RBM also there there's another one that's quite popular called RBM and you can use
tools to download any version of Ruby that you want locally compiled on your computer and it
essentially saves it on your home folder so that you can then use that version instead of the
system installed one now Ruby is a requirement only on your local computer you don't have to worry
about having Ruby installed in your web server or wherever you're going to deploy this website
eventually because it is just a static HTML website all you really need is a web server but in order
to generate these static HTML pages you do need Ruby installed on your local computer or whatever
computer you're going to use to create your blog posts and use octopress so once you have Ruby installed
and you have get installed you'll also need a tech center now there's a million tech centers out
there you know the two big ones of course being VIM and EMAX and really it doesn't matter which
one or which tech center you use as long as it can edit plain text files so pretty much anything
can do that you know I personally use EMAX because I've grown to love it and I have my whole
configuration set up but really it doesn't matter all you need is basic tech center you don't need
to learn a Dreamweaver or front page or any of those silly tools and that's one thing that I really
like about octopress is that if you have any knowledge on HTML you can still use it you don't
really have to learn a whole new system other than a few commands on the command line everything
that you know about HTML still applies if you know a little bit of Ruby you can really take full
advantage of octopress by creating your own scripts by customizing what's available but really
with a little basic HTML knowledge and a knowledge of few commands on the command line that's all
you really need to get started so the commands on the command line are very simple the ones that
you're going to need to create a new blog post are a one called rake new underscore post that'll
create the blog post for you and the blog posts are just basically text files and you would type in
the markdown format so you don't even have to type HTML into your blog post you would just type
plain text as you would do any any document and it will integrate that when the site gets generated
into the HTML so in order to generate this HTML you would type into the command line rake
generate and it would take all the source files and generate the static HTML for you then you can
just take these static HTML pages and upload them into your server but to make that even easier
octopress comes with a command called rake deploy which will take your default configuration
or the default configuration is through our sync and sync them up with your server
the nice thing about octopress too is that it integrates with github pages so if you're looking for
a web host provider and would like to try out something free maybe you want to test octopress to see
if it is the solution for you you can create a github account or associate it with a repository
that you have on github and use octopress to publish your website to the github repository there is
a setup script that will let you walk you through the process of doing this and there are two
commands that you need to know one is rake set underscore root underscore deer which will set your
root directory for your website now of course normally it is the root directory that is the root
of your website but but in order to deploy it as a you'd have project page you need to set a new
root directory that's not the root of your website then the next step would be to type in rake
space setup underscore github underscore pages which will walk you through the process
of setting up your github page and then deploy it automatically and for free those are the basics
of using octopress and I know there's a lot more detail which you can find out in the documentation
hopefully you understand why it's been important to me to use a static site generator to generate
my blog and really the workflow is so simple that once you try this you'll never want to use anything
else really all right so that's it for me if you have any feedback please feel free to contact me
i can be reached on google plus with the username tony polias that's t-o-n-y-p-e-l-a-e-z
or by email at tony at polias.me
you have been listening to hiker public radio and hiker public radio does already
we are a community podcast network that releases shows every weekday Monday through Friday
today's show like all our shows was contributed by a hbr listener like yourself
if you ever consider recording a podcast then visit our website to find out how easy it really is
hiker public radio was founded by the digital dog pound and the economic and the computer club
hbr is funded by the binary revolution at binref.com all binref projects are crowd-responsive
by linear pages from shared hosting to custom private clouds go to lunar pages.com for all your
hosting needs unless otherwise stasis today's show is released under a creative commons
attribution share a life free does our lives