Transcript
Page 1: Build your website with awestruct and publish it on the cloud with git

Build your Websitewith Awestruct and

Publish it on the Cloudwith Git

Xavier Coulon, Red Hat @xcoulon

Page 2: Build your website with awestruct and publish it on the cloud with git

F*ck CMSDo you need a CMS to run your website ?

(hint: no)Push files to a Web Server

setup mod_phpCMS security patches

Database admin/backupsData migration hell

Page 3: Build your website with awestruct and publish it on the cloud with git
Page 4: Build your website with awestruct and publish it on the cloud with git

Part I. Let's Have Fun Againat Baking Websites

Page 5: Build your website with awestruct and publish it on the cloud with git

Content First !Write your Articles in

Markdown, Textile or AsciiDoc

Page 6: Build your website with awestruct and publish it on the cloud with git

Layout with HAML

Page 7: Build your website with awestruct and publish it on the cloud with git

Comparing HAML with HTMLHTML

HAML

<div> <strong>Hello, World!</strong></div>

%div %strong Hello, World!

Page 8: Build your website with awestruct and publish it on the cloud with git

Comparing HAML with HTMLHTML

HAML

<div id="wrapper" class="box"> <strong id="message" class="code">Hello, World!</strong></div>

%div{:id => "wrapper", :class => "box"} %strong{:id => "message", :class => "code"} Hello, World!

#wrapper.box %strong#message.code Hello, World!

Page 9: Build your website with awestruct and publish it on the cloud with git

Make it Sexy with CSS, SASS or LESS

Page 10: Build your website with awestruct and publish it on the cloud with git

Dynamise with JavaScript orCoffeeScript

Page 11: Build your website with awestruct and publish it on the cloud with git

Deploy on a Web Server with GitIt's just (text) files !

Page 12: Build your website with awestruct and publish it on the cloud with git

It's a Developer's Workflow !(think about it)

A developer codes and tests, then pushes to a remote git repo to share

An author writes and reviews, then pushes to a remote git repo to publish

and both can even have CI and Staging sites !

Page 13: Build your website with awestruct and publish it on the cloud with git

Part II. Let's Bake our Website

with Awestruct !

Page 14: Build your website with awestruct and publish it on the cloud with git

Getting Started gem install awestruct mkdir crazy-awesome-project-site awestruct --init --framework bootstrap|blueprint|960 awestruct -d

Page 15: Build your website with awestruct and publish it on the cloud with git

Awestruct Project Structure _config site.yml

_ext pipeline.rb

_layout base.html.haml

_site news 2013-01-19-some-article.md

index.html.haml

Page 16: Build your website with awestruct and publish it on the cloud with git

Properties/MetadataYAML

Engine context (_config/*.yml)Page context (front-matter)

Available within the pages and the extensions.

Page 17: Build your website with awestruct and publish it on the cloud with git

Managing Profiles_site/config.yml

specific "profiles" entry

... profiles: development: base_url: http://localhost:4242 disqus: super-crazy-project-dev disqus_developer: true production: base_url: http://xcoulon.github.com/sample-awestruct-site deploy: host: github_pages disqus: super-crazy-project google_analytics: UA-12345678-1

Page 18: Build your website with awestruct and publish it on the cloud with git

Awestruct Built-in Extensions andHelpers

IndexifierPostsTaggerAtomizerPaginatorDisqusGoogle Analyticsand more...

Page 19: Build your website with awestruct and publish it on the cloud with git

Site Deployment

Page 20: Build your website with awestruct and publish it on the cloud with git

GitHub Pages _config/site.yml

... profiles: ... production: base_url: http://xcoulon.github.com/sample-awestruct-site ... deploy: host: github_pages

git commit awestruct -P production --force awestruct -P production --deploy

Page 21: Build your website with awestruct and publish it on the cloud with git

OpenShift

Page 22: Build your website with awestruct and publish it on the cloud with git

Demo

Page 23: Build your website with awestruct and publish it on the cloud with git

fork the demo: github.com/xcoulon/sample-awestruct-site

Page 24: Build your website with awestruct and publish it on the cloud with git

BTW, this prezo was also baked withAwestruct ;-)

Page 26: Build your website with awestruct and publish it on the cloud with git

Thanks !

Page 27: Build your website with awestruct and publish it on the cloud with git

Q/A


Top Related