mojavelinux.github.com/decks/awestruct-git
A static site-baking tool
Awestruct makes it easy to create non-trivial static websites
The cornerstone of the Open Web Platform
Static is the new dynamic
--distributed-even-if-your-workflow-isnt
From black box to open book
---
layout: base
title: About
---
## Who are we?
We are hackers.
## What do we like?
We like code we don't have to escape.
<xml>
<hell>Just frag it and use yaml</hell>
</xml>talk about page structure (front-matter, content)
!!!5
%html
%head
%title= site.title
%body
.container
~ content~ inserts special character to preserve whitespace)
title: My Site%title= site.titlecompiler is important to emphasize / expand on; leverages existing stuff
class MyExtension
def execute(site)
site.pages.each do |page|
...
end
end
endAn extension class only need implement a single method, execute(site). Each extension in the pipeline will be called, in-order, and passed the site object.
class MyTransformer
def transform(site, page, input)
...
end
endrequire 'my_extension'
require 'my_transformer'
Awestruct::Extensions::Pipeline.new do
extension MyExtension.new
transformer MyTransformer.new
...
endThe _ext/ directory is automatically added to the $LOAD_PATH so that site-supplied extensions may easily be loaded.
The extension pipeline runs immediately before the final URL assignment to pages and generating the final output pages.
$ gem install awestruct rb-inotify$ jgem install awestruct rb-inotify$ mkdir mysite
$ cd mysite
$ awestruct -i -f bootstrap$ rm -f .awestruct_ignore
$ awestruct -dHead over to http://localhost:4242 to see your progress!
Changes to files are picked up automatically.
$ awestruct -d --forcePurges _site directory
and blog like a hacker!
%a{:href=>post.url, :title=>'Go to post', :rel=>'tooltip'}= post.title$ ->
$('*[rel=tooltip]').tooltip placement: 'right'
$('h1.title a').hover (-> $(@).css fontStyle: 'italic'),
(-> $(@).css fontStyle: 'normal')Get dynamic by scraping the web
this.fetchNews = (url, loc, num = 10) ->
$.jGFeed url, ((feeds) -> $.each(feeds.entries,
(idx, entry) -> $(loc).append
"""<li><a href="\#{entry.link}">\#{entry.title}</li>""")), num%script{:type=>'text/javascript',
:src=>'//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.0.4/bootstrap.min.js'} <1>
%script{:type=>'text/javascript',
:src=>"#{site.base_url}/javascripts/jquery-jgfeed.js"}
%script{:type=>'text/javascript',
:src=>"#{site.base_url}/javascripts/site.js"} <2>
Note the use of a CDN to grab the bootstrap script
site.coffeescript has been compiled to site.js
:javascript
fetchNews('http://therichwebexperience.com/s/rss/rich.rss', '#news');$bootstrapUrl: "//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.1";
$iconSpritePath: url("#{$bootstrapUrl}/img/glyphicons-halflings.png");
$iconWhiteSpritePath: url("#{$bootstrapUrl}/img/glyphicons-halflings-white.png");
// NFJS colors
$navbarBackground: #303030;
$navbarBackgroundHighlight: #6771DB;
$navbarBrandColor: #FFCC66;
$navbarLinkColor: #D9E0FF;github pages autogenerator is just for a single page (markdown → html)
CDI is planned
Thank the browser for making this possible
