cool symbol up top

content/dependencies.md

@@ -0,0 +1,12 @@
+## II. Dependencies
+### Explicit dependency declaration and isolation
+
+Most programming languages offer a packaging system for distributing support libraries, such as [CPAN](http://www.cpan.org/) for Perl or [Rubygems](http://rubygems.org/) for Ruby.  Libraries installed through a packaging system can typically be installed system-wide (known as "site packages") or only into the directory containing the app (known as "vendoring" or "bundling").
+
+A twelve-factor app *never* relies on implicit existence of system-wide packages.  It declares all dependencies, completely and exactly, via a *dependency declaration* tool.  Furthermore, it uses *dependency isolation* tool during execution to ensure that no implicit dependencies "leak in" from the surrounding system.
+
+For example, [Gem Bundler](http://gembundler.com/) for Ruby offers the `Gemfile` format for declaration and `bundle exec` for dependency isolation.  In, Python there are two separate tools for these steps - [Pip](http://www.pip-installer.org/en/latest/) is used for dependency declaration and [Virtualenv](http://www.virtualenv.org/en/latest/) for dependency isolation.  Regardless of tools, dependency declaration and isolation must be used together - only one or the other is not sufficient for the twelve-factor app.
+
+A key benefit of explicit dependency declaration is setup for new developers on the project.  The new developer can check out the app's sourcecode onto a machine with only the language runtime and packager installed.  They will be able to set up everything needed to run the app in a single, deterministic command - such as `bundle install` for Ruby/Bundler or `lein deps` for Clojure/Leiningen.  In apps where dependencies are not explicit, the developer may have to pick through the documentation or readme to find out what dependency packages need to be installe dmanually.
+
+In a related point, twelve-factor apps also do not rely on the implicit existence of any system tools.  Examples include shelling out to ImageMagick or Curl.  While these tools may exist on some systems, there is no guarantee that they will exist on all systems where the app may run in the future, or whether the version found on a future system will be compatible with the app.  If the app needs to shell out to a system tool, that tool must be vendored into the app.

content/repo.md

@@ -1,5 +1,5 @@
-Repo | One code repo, many deploys
-==================================
+## I. Repo
+### One code repo, many deploys
 
 A twelve-factor app is always tracked in a version control system, with the tracked code history known as a *code reposistory*, often shortened to *code repo* or just *repo*.
 

content/toc.md

@@ -4,7 +4,7 @@ The Twelve Factors
 ## [I. Repo](/repo)
 ### One code repo, many deploys
 
-## II. Dependencies
+## [II. Dependencies](/dependencies)
 ### Explicit dependency declaration and isolation
 
 ## III. Config

public/style.css

@@ -3,6 +3,7 @@ body {
   padding: 0;
   font-family: Georgia, sans-serif;
   line-height: 1.5em;
+  font-size: 14pt;
 }
 
 h1, h2, h3 {
@@ -12,7 +13,8 @@ h1, h2, h3 {
 
 header {
   margin: 0;
-  padding: 26pt;
+  padding-top: 12pt;
+  padding-bottom: 26pt;
   border: 1px solid black;
   color: #fff;
   background: #000;
@@ -32,12 +34,20 @@ section {
 }
 section h1 {
   font-size: 18pt;
-  border-bottom: 2px solid #aaa;
 }
 
 article {
+  text-align: justify;
   width: 60em;
 }
+article p a {
+  text-decoration: none;
+  border-bottom: 1px dashed #444;
+  color: #000;
+}
+article p a:hover {
+  color: #337;
+}
 
 section#toc {
   background: #ccc;
@@ -47,8 +57,8 @@ section#toc {
 }
 section#toc h1 {
   font-size: 32pt;
-  border: 0;
-  margin-bottom: 24pt;
+  margin-bottom: 30pt;
+  text-decoration: underline;
 }
 section#toc h2 {
   margin-top: 12pt;
@@ -61,9 +71,21 @@ section#toc h2 a:hover {
   color: #337;
 }
 section#toc h3 {
+  color: #555;
   font-weight: normal;
 }
 
+section#factor h2 {
+  font-size: 32pt;
+  margin-bottom: 12pt;
+}
+section#factor h3 {
+  font-size: 20pt;
+  font-weight: normal;
+  color: #999;
+  margin-bottom: 16pt;
+}
+
 footer {
   color: #444;
   font-size: 12pt;

views/factor.erb

@@ -1,4 +1,4 @@
-<section>
+<section id="factor">
   <article>
     <%= render_markdown(@factor) %>
   </article>

views/layout.erb

@@ -16,6 +16,7 @@
 </head>
 <body>
   <header>
+    <img src="/symbol.png" />
     <h1><a href="/">The Twelve-Factor App</a></h1>
   </header>
 

web.rb

@@ -14,5 +14,11 @@ helpers do
   def render_markdown(file)
     markdown = File.read("content/#{file}.md")
     Maruku.new(markdown).to_html
+  rescue Errno::ENOENT
+    halt 404
   end
 end
+
+not_found do
+  "Page not found"
+end