Ramblings Of a Madman

Yeah, like i would know a good description…

Posts for Tag: blogging

Fast blogging setup

## Static vs Dynamic

I've maintained my own website/blog for as long as i can remember. Ever since the days of static HTML pages, simple PHP scripts, [Wordpress](http://wordpress.org) installations, [Joomla](http://www.joomla.org), [Drupal](https://www.drupal.org), [Postnuke](http://www.postnuke.com), [PHPNuke](https://www.phpnuke.org), you name it, i've tried it.

So one day i found out about static site generators. The basic idea is that, instead of having some kind of storage for the content (database), it lives in plain files. The webpages are generated by an engine and can then be served as plain HTML which is - obviously - much faster than any interpreted system (like PHP, Rails, ).

Here's an example of dynamic page generation like - for instance - a Wordpress installation, or a Ruby on Rails website:

The biggest problem with this is speed. Since there are so many steps, it can never be as efficient as static HTML pages. Of course you can always cache the requests and make it a bit faster, but i tend to like the path of least resistance :)

Here's the static generation approach:

The website pages are generated once and served statically, which is much faster.

Before i proceed to explain how i've implemented it, let me just say that there are many advantages for a full fledged dynamic website (e-commerce, storing user information, registrations, etc, etc.). But if your only concern is to publish content on the web and allowing readers to comment on it you can easily pull it off with this system, integrating it with something like [Disqus](https://disqus.com/websites/), for comments.

## Practical example

To implement this system we need:

- **A static website generator**. I chose [Middleman](http://middlemanapp.com/). Others include [Jekyll](http://jekyllrb.com/), [Hugo](http://hugo.spf13.com/, [Pelican](http://blog.getpelican.com/), [Hexo](http://hexo.io/) and [DocPad](http://docpad.org/). - **Some way to transfer the generated files to your server**. [Rsync](http://en.wikipedia.org/wiki/Rsync) is my choice, but you can pull it off in a gazillion ways, including [Dropbox](https://www.dropbox.com) synchronization, for example, or just FTP. - **A web host running a webserver**. In my case i have a [Linode](http://www.linode.com/) with an [Ubuntu](http://www.ubuntu.com) installation that has [Nginx](http://www.nginx.org/) running. Other solutions might include a combination of [Apache](http://httpd.apache.org/), [Dreamhost](http://www.dreamhost.com/), [HTTP Explorer](http://http-explorer.sourceforge.net/), [Bluehost](http://www.bluehost.com/), [LightHTTPD](http://www.lighttpd.net/) and [A Small Orange](http://www.asmallorange.com/)

### Step 1 : Install Middleman

There are plenty of guides on how to install this out there, so i'll just point you to the [getting started guide](http://middlemanapp.com/basics/getting-started/).

### Step 2 : Create your pages

Middleman has a bunch of templates that you can use as a starting point, so check out their fantastic documentation and make it happen. In alternative you can proceed with the example template you should have ended up with if you followed their tutorial.

### Step 3 : Middleman commands to know

Here are the commands you are most likely to use with middleman, and their explanation:

**Start the development server**, so you can test your site at `http://localhost:4567`:


**Generate a new blog post**, assuming you installed and set up the [middleman-blog plugin](http://middlemanapp.com/basics/blogging/):

middleman article "title of your new post"

**Build the static pages for deployment**:

middleman build

**Deploy your pages using middleman**:

middleman deploy

### Step 4 : Deploy

You don't necessarily need to use the `middleman deploy` command if you don't want to. After you do `middleman build` all your generated content can be found inside the `build` folder on your project root. Deploying it is simply a matter of getting those files into your webserver. And for that you can use any method you prefer.

I like to let my server do all the work of building and deploying by using the following workflow:

- I write a post or modify a page - I call a script on my local computer that does the following:

#!/bin/sh rsync -h -r --delete /data/static-blog/source/* void@blog:/home/void/static-blog/source ssh void@blog "touch /home/void/static-blog/.build"

First, it copies all of my site's sources into the working folder on the server (this is the step where you could use dropbox, btw). Then it creates a file on that folder (`.build`) that instructs the server to build and deploy the website automatically.

- The server has a cron job running every X minutes that executes a script:

*/5 * * * * /home/void/bin/build_blog.sh

And the contents of that script are:

#!/bin/bash if [ -e "/home/void/static-blog/.build" ] then logger -s "Blog: Starting build..." logger -s "Blog: Sourcing RVM..." source /home/void/.rvm/environments/ruby-2.0.0-p0 logger -s "Blog: Removing order file..." rm /home/void/static-blog/.build logger -s "Blog: Getting into folder..." cd /home/void/static-blog logger -s "Blog: Executing bundle install..." /home/void/.rvm/gems/ruby-2.0.0-p0/bin/bundle install logger -s "Blog: Building files..." /home/void/.rvm/gems/ruby-2.0.0-p0/bin/middleman build logger -s "Blog: Copying files into place..." rsync -h -r --delete build/* /data/static-blog/live/ logger -s "Blog: Build done." fi

Simply put, the script checks for the existence of the `.build` file inside the working folder and - if so - sets up the environment for bundle, generates the website, and moves the generated files in the `build` folder into the nginx folder i have setup in `/data`. It also removes the trigger `.build` file so the process isn't restarted on the next cron execution.

## Conclusion and future work

I think this is an overall nice setup. Things i would like to improve include not having to trigger the build process. Ideally any change to the blog folder on my laptop should automatically build and deploy the website. Reasons why i haven't been able to do it:

- Dropbox doesn't seem to trigger file changes for [incron](http://inotify.aiken.cz/?section=incron&page=about&lang=en) (a file system watch service), which sucks. - [inotify](http://inotify.aiken.cz) is an alternative to incron, but unfortunately i've ran into another problem: Changes in files inside the working folder trigger multiple alarms (sometimes more than one per changed file). This means i have no way of knowing if the file syncronization has ended (either by dropbox or rsync) and wether i can start the build process or not. Otherwise i risk building with only half the files in place and that might break the site.

If you have any ideas on how to make the process more efficient [please share](http://twitter.com/nocivus); i would love to hear all about it.

'Way too many websites'

I don't know about you but - over the years - i've amassed way too many different blog and social services' accounts. [Posterous](http://posterous.com) (now closed), [Blogger](http://blogger.com), [Tumblr](http://tumblr.com), [Wordpress](http://wordpress.com), this self hosted blog, [Facebook](http://facebook.com/nocivus), [Twitter](http://twitter.com/nocivus), [Pinterest](http://pinterest.com), [Instagram](http://instagram.com), [Flickr](http://flickr.com), [Picasa](http://picasaweb.com), [Foursquare](http://foursquare.com), Gowalla (now closed), the list is endless.

Since we all know there is a limit to the amount of information that can be both broadcasted and consumed i finally decided to give into the urge to close a bunch of those extra accounts, starting with Tumblr.

Hopefully i will dedicate more time to my main blog, maybe even give it a proper name :)

SecuritySpy Control

Yesterday i made my first attempt at selling an Android application on the Play Store. Knowing both the Apple Store and the Play Store, i can't help thinking that the latter was a much more pleasant experience than Apple's. Maybe because of the underlying web technology, or the fact that the pages loaded faster, or simply because the number of steps was lower and their explanation was much more trivial, i have to admit that i prefer Google's experience.

In any case, this is purely from a merchant developer's perspective, it has nothing to do with the stores' experiences to the customers. In that regard both Apple and Google did a fantastic job. Google even went the extra mile allowing you to purchase stuff on the web store and "telling" your device to install it automagically. I, for one, love that feature.

That's it. This was mostly a comparison post and, at the same time, an experiment for my new multisite blog installation with both English and my native language, Portuguese. If you click the flag on the left sidebar you should be transported to the same post in a different language. Fingers crossed ;)

Idea - HTML WYSIWYG editor with Flickr upload support

The biggest problem with this, is that WP's interface to create posts is, again, awesome. You can find plugins for pretty much anything, especially to do tasks that are otherwise plain boring, like uploading pictures to your flickr account and instantly have them available in your post for inclusion. I've been trying to find something like that for those nice HTML editors out there (like tinyMCE and CKEditor), but so far have had no luck.

Anyone out there knows if something like that exists yet and where can i find it?

HTML WYSIWYG editor with Flickr upload support?

Lately i've been tinkering around with the idea of recreating my blog in a more handcrafted way (ruby on rails) as opposed to the current implementation using Wordpress. Don't get me wrong Wordpress is awesome. It has many years and millions of websites as a testament of it's awesomeness behind it. But i guess my hacker's vein popups up every now and then to whisper the reasons why i should have something custom made :) The biggest problem with this, is that WP's interface to create posts is, again, awesome. You can find plugins for pretty much anything, especially to do tasks that are otherwise plain boring, like uploading pictures to your flickr account and instantly have them available in your post for inclusion. I've been trying to find something like that for those nice HTML editors out there (like tinyMCE and CKEditor), but so far have had no luck. Anyone out there knows if something like that exists yet and where can i find it?

New blog layout

It was bound to happen; I get easily bored with website layouts and i saw that cluttered old design going away for some time now.

This new theme, a much more clean version, is an adaptation of Fiver, by Stinkyinkshop. I think it works really well, wouldn't you say? :)

Browser and visitor statistics

Was just now looking at google analytics for my blog and got some surprises, especially when it comes to the browser people use to access it. Seems that Chrome is leading and Internet Explorer is dead. Long live Internet Explorer :D

[caption id="attachment_1427" align="alignnone" width="300" caption="Browser usage"][/caption]

Also, very interesting is the fact that i'm Portuguese and Portugal is not on the top visitors' countries list. Special thanks to my followers in India, you know who you are :)

[caption id="attachment_1426" align="alignnone" width="300" caption="Language"][/caption]

UPDATE: As requested by a friend of mine, here are some more statistics: Top sources and keywords.

[caption id="attachment_1431" align="alignnone" width="300" caption="Top sources chart"][/caption]

[caption id="attachment_1430" align="alignnone" width="300" caption="Top sources list"][/caption]

[caption id="attachment_1429" align="alignnone" width="300" caption="Top keywords"][/caption]

Peace out ;)

How to lose half your page visits in 1 month (and how to recover from it)

A while back i changed my blog domain name from diffract.me to pedroassuncao.com. However, i was dumb enough not to redirect the traffic to the new name - in a transition period. The result? A drop from 100+ visits per day to less than 20.

I have to admit that it kind of bummed me out a little. Being a Buddhist-light i tried my best not to let it get to me and told myself that it would eventually recover just as long as i kept writing stuff that can help some people - combined with nicely chosen post titles and search engine keywords.

Turns out i was right: a couple of months later the visits are slowly recovering - as you can see from the screenshot of my analytics account.

That is all very neat but where is the "helping people" part, you might ask. Here it is: I thought i might share some of the techniques i currently employ to attract people to look at what i write. They are no different from what others have blogged about before, but it's always good to share this information around with prospective new bloggers:

Write about stuff that you think will help other people. This may mean writing about solutions to problems you yourself encountered, or just writing about interesting stuff you did/saw/ate/whatever that other humans will possibly find interesting :) Read a lot of news/blogs/stories about stuff that you have interest in. And *write insightful* comments on them. Most comments systems will allow you to enter your URL and/or twitter name and will show those in the comments you write. This is a great way to drive the curious people back to your site; For every helpful post you write, submit the link to the major news sites (think digg, reddit, hacker news, etc). This will make sure that search engines will have more interest in your site, since you will be linked back when they crawl those. It will also make some more people aware of what you are writing, which leads me to the following point... ...Write catchy post titles. And by catchy i don't mean cheesy or sensationalist. Create a habit of getting to the point in your titles while - at the same time - being original to entice curiosity. Writing titles is a form of art in itself, believe me; Link whenever you are referencing something that can be linked to. Again, search engines will use this information to your advantage in page rankings. And other bloggers will appreciate the traffic, so it's a win-win situation :)

That's it. Happy blogging, and feel free to drop me a line ;)

Dropbox plus Mercurial -driven development. Anyone tried that?

One of the biggest pains of any developer is maintaing the source code. Especially if you - like me - have a gazillion pet projects that need to be updated whenever you come up with "cool idea #20000" for one of them.

Version control systems like Mercurial are awesome, but they are only part of the equation; there's still the time consuming process of deploying the changes to "production". So i wonder if it would be a good idea to have a Mercurial repository sitting on a dropbox account and develop directly there. This way any changes to the source code would be instantly reflected on production.

I am aware that this is unthinkable for serious projects (the kind you get paid to do), but it can probably work for fun pet projects.

Do you have any experience with something like that? Share your thoughts, if you have any :)

Idea for a better customer satisfaction/feedback service

Recently i had to fill one of those client/customer satisfaction surveys. Endless pages of "how well do you grade feature X" questions that frustrate you beyond the point of killing yourself and your colleagues.

And that got me thinking: how about a simple form that asks "Are you happy? Yes/No"? If you answer "yes", case closed. And some people are just plainly happy with the service/product/job so this is definitely a time saver. If you answer "no", you are presented with a text field where you can start typing what you are not happy about and, as you do, it queries for responses from other people to suggest you with stuff that might be a problem to you. If you find one that applies to what you are trying to complain about, you choose it and another text field presents itself to complain about something else. If you don't find one previous reply, yours is added. Repeat until done.

How's that for simplicity?

And while we're are it, why not make it an online survey service and make tons of cash?

Who's your friend? Now start coding! ;)