SUBJECT TO REVISION: Creating a fully fledged blog

There are countless minimalist blogging engines out there. Here is one created with Soxer. A step by step tutorial on creating the engine, as well as a fully working package. Just redesign the CSS to your needs and start blogging.

Creating your application root directory and initial files.

We start with the usual directory structure for a Sinatra/Soxer application. Use your shell (windows users - your mileage may vary). We prommise to create a serious gem with all this functionality packed into scripts in the near future. For now... let's go manual...

# Create all needed directories
mkdir myblog myblog/lib myblog/public myblog/views myblog/content

# Download and untar the Soxer source.
cd myblog/lib
wget http://soxer.mutsu.org/downloads/latest.tar.bz2
tar xvjf latest.tar.bz2
rm latest.tar.bz2

# Create main application file and our index file for content.
cd ../
touch app.rb content/index.yaml

Create a basic Sinatra application in the app.rb file:
DO NOT BE SCARED. READ THE CODE COMMENTS, IT'S NOT COMPLICATED AT ALL.

# >> app.rb

# A standard set of requires by Soxer and Sinatra.        
require "rubygems"
require "sinatra"
require "lib/sinatra/soxer.rb"

# This is a simple instruction to Soxer to render a sitemap.xml file
# Using the 'sitemap' method provided by soxer.
get("/sitemap.xml") { sitemap }

# This makes urls like "/style/anything.css" map to a sass file
# '/views/anything.css'. This is a very standard Sinatra behavior.
get "/style/:sheet.css" do
  content_type "text/css", :charset => "utf-8"
  sass params[:sheet].to_sym 
end

# Any file with the ending like jpg,png,pdf,doc,xls,pdf served from the
# content directory is served "as is". Other files are simply ignored.
# (except .yaml files, which are interpreted...)
# This acts as a security measure. You can have a .psd file in the
# Directory, but it will not be served.
get '*.*' do
  file = File.join( settings.root, settings.origin, params[:splat].join('.') )
  case params[:splat][1]
    when /[jpg|png|pdf|doc|xls|pdf]/ then send_file(file, :disposition => nil)
  end
end

# This just serves the yaml files. Notice that we are sending a different
# content type if the filename contains '-atom' before the ending.
# This makes it simple for us to create a '/news' url with html content
# and '/news-atom' with atom feed. Very convenient....
# Also a default layout is replaced by a 'layout' field in your yaml file,
# which ads a possibility of creating atom feeds (that have no layout)
# and change layout at will (not a very clean idea, unless you are creating
# an insanely complex structure of the site.)
get '*/?' do
  content_type "text/html", :charset => "utf-8"
  content_type "application/atom+xml", :charset => "utf-8" if params[:splat][0] =~ /-atom$/

  page = get_page
  page['layout'] ||= 'layout'
  haml page['content'], :layout => page['layout'].to_sym, :locals => { :page => page }
end

Now we need to create our layout, or a HTML container if you will. This we will do in haml (check out the last bit of the code in the app.rb). This may be self explanatory as HAML is not a very complicated beast for those who know their HTML.

!!! 5
%html( lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" )
  %head
    %title= 'MyBlog: '+page['title']
    %meta(charset="utf-8")
    %link( href="/style/style.css" media="screen" rel="stylesheet" type="text/css" )
  %body{ :class => page['class'].join(' ') }
    #header
    #content
      #column1
      #column2
        = yield
    #footer

There a couple of things in this haml file that need special attention.
First and most important: the 'content' filed of your yaml file will go, where '= yield' is. This is the mother of all wisdom. Everything else around the yield is either static HTML or some sort of Soxer functionality thrown in.

blog comments powered by Disqus