updated tutorial to discuss removing defaults

app/templates/example.html

@@ -39,9 +39,15 @@ <h1>Contents</h1>
 <section>
   <h2 id="overview">Overview</h2>
 
-  <p>Backbone Boilerplate is the product of much research and frustration. While existing boilerplates for Backbone exist, they will often modify the Backbone core, don't have an integrated build system, or impose too much on your application's structure. This boilerplate attempts to improve that.
+  <p>Backbone Boilerplate is the product of much research and frustration. While
+  existing boilerplates for Backbone exist, they will often modify the Backbone
+  core, don't have an integrated build system, or impose too much on your
+  application's structure. This boilerplate attempts to improve that.
 
-Organize your application in a logical filesystem, and develop Models, Collections, Views, and Routers inside modules. Build your application knowing you have efficient, compact code. Backbone Boilerplate extends on the versatile Backbone core, and helps developers manage their application.</p>
+  Organize your application in a logical filesystem, and develop Models,
+  Collections, Views, and Routers inside modules. Build your application knowing
+  you have efficient, compact code. Backbone Boilerplate extends on the
+  versatile Backbone core, and helps developers manage their application.</p>
 
   <h3 id="core-features">Core Features</h3>
   <ul>
@@ -59,32 +65,119 @@ <h3 id="core-features">Core Features</h3>
 <section>
   <h2 id="getting-help">Getting help</h2>
 
-<p>If you're encountering an issue, need assistance, or have a question that hasn't been answered in this
-  tutorial, or <a href="https://github.com/tbranyen/backbone-boilerplate">the GitHub project page</a>
-  you can find help in the #documentcloud</p>
+  <p>If you're encountering issues, need assistance, or have a question that hasn't been answered in this
+  tutorial or <a target="blank" href="https://github.com/tbranyen/backbone-boilerplate">the GitHub project page</a>
+  you may find help in one of these places:</p>
 
-  Problem?
+  <ul>
+    <li>IRC - #documentcloud on irc.freenode.net
+    <li><a target="blank" href="http://github.com/tbranyen/backbone-boilerplate/issues">GitHub Issues</a> - Please report if you've found an issue,
+    bug, or controversial request.
+  </ul>
 
-  Avenues for support?
-
-  When to file an issue?
+  <p>I want this project to be the best it possibly can and represent the interests of the community, <b>please</b>
+  submit issues with features you find useful and anything that you question.</p>
 </section>
 
 <section>
   <h2 id="writing-app">Writing your application</h2>
-  <p></p>
+  <p>Your application may be made up of third-party libraries, plugins, application code, templates, and lots of logic.  All of this will need
+  to be well structured to keep it maintainable and it also needs to be compiled if deployed into production.  Before you can get started you
+  will need to clean out all the existing defaults that are in the boilerplate are necessary to display this tutorial.
+  </p>
 
   <h3 id="cleaning">Cleaning out default files and code</h3>
-  <p>Placeholder</p>
+  <p>There are several places where customization may be required.</p>
+
+  <ul>
+    <li><h4>Removing the Git history</h4>
+      <p>If you cloned the Backbone Boilerplate with Git, you should delete the git directory and then initialize your own Git history:
+
+      <pre><code>
+    $ rm -rf .git
+    $ git init
+      </code></pre>
+      </p>
+
+    <li><h4>Removing the test directory</h4>
+      <p>If you are not planning on testing your application with QUnit you should delete this directory.</p>
+
+    <li><h4>Removing the build process</h4>
+      <p>If you are not planning on using the provided build tool, delete the <code>build</code> folder.  It contains a lot of unnecessary code and
+      Node.js modules that you will not need.  You should also clear out the commented out script tags inside of <code>index.html</code>:
+
+      <pre><code>
+    &lt;!--
+         If using the build tool you can uncomment the following lines and use
+         these instead.  They will toggle based on if you are using debug or
+         release.
+    --&gt;
+
+    &lt;!--
+    &lt;script src=&quot;/assets/js/libs.js&quot;&gt;&lt;/script&gt;
+    &lt;script src=&quot;/assets/js/templates.js&quot;&gt;&lt;/script&gt;
+    &lt;script src=&quot;/assets/js/app.js&quot;&gt;&lt;/script&gt;
+    --&gt;
+      </code></pre>
+      </p>
+
+    <li><h4>Changing the Favicon</h4>
+      <p>At the root level of the project simply change the <code>favicon.ico</code> file to point to your own branded icon.</p>
+
+    <li><h4>Removing default application code</h4>
+      <p>This tutorial is rendered in the <code>app/modules/example.js</code> file and written in <code>app/modules/templates/example.html</code>
+      both of these files are safe to remove.</p>
+
+    <li><h4>Removing the default routes</h4>
+      <p>Routes are defined in the <code>app/index.js</code> file.  Familiarize yourself with it's contents.  You'll notice the default router has two existing rotues and callback defined, reset it to:
+
+      <pre><code>
+    // Defining the application router, you can attach sub routers here.
+    var Router = Backbone.Router.extend({
+      routes: {
+        "": "index",
+      },
+
+      index: function() {
+        // Put your homepage route logic here
+      }
+    });
+      </code></pre>
+      </p>
+
+
+      <p>Above the Router definition you'll see a reference to the example module,
+      this is safe to delete as well.
+
+      <pre><code>
+    // Include the example module
+    var Example = namespace.module("example");
+      </code></pre>
+      </p>
+
+    <li><h4>Removing default assets</h4>
+      <p>The default styles for this tutorial are stored in <code>assets/css/style.css</code>.  You will probably want to remove these since they only make sense for this specific page.  They start on line 209.  With the following H5BP header:
+
+      <pre><code>
+    /* ==|== primary styles =====================================================
+       Author: Backbone Boilerplate <Change to your Name>
+       ========================================================================== */
+     </code></pre>
+     </p>
+
+     <p>You may also want to change the name to yours, if you're planning on putting your custom CSS here as well.</p>
+
+     <p>You should delete the <code>assets/img/backbone.png</code> file if you are not planning on using it in your app.</p>
+  </ul>
 
   <h3 id="namespace">Setting your namespace</h3>
   <p>
     <pre><code>
-    mynamespace = {
-      a: function() {
-        
-      }
-    };
+  mynamespace = {
+    a: function() {
+
+    }
+  };
     </code></pre>
   </p>
 
@@ -99,7 +192,7 @@ <h3 id="plugins">Working with libraries and plugins</h3>
 </section>
 
 <section>
-  <h2 id="custom-build">Customizing the build tool</h2>
+  <h2 id="custom-build">Using the build tool</h2>
   <p>Placeholder</p>
 
   <h3 id="running">Running with the defaults</h3>

assets/css/style.css

@@ -212,14 +212,14 @@ td { vertical-align: top; }
 }
 
 #main pre {
-  border: 2px solid #FE57A1;
   min-width: 320px;
   border-radius: 10px;
-  color: #888;
-  font-weight: bold;
-  font-size: 14px;
+  color: #333;
+  font-weight: normal;
+  font-size: 12px;
   display: inline-block;
   padding-right: 40px;
+  background: #F8FAFC;
 }
 
 #main a {

build/server.js

@@ -14,6 +14,9 @@ dir && site.use("/assets/css", express.static(dir + "/css"));
 site.use("/app", express.static("./app"));
 site.use("/assets", express.static("./assets"));
 
+// Serve favicon.ico
+site.use(express.favicon("./favicon.ico"));
+
 // Ensure all routes go home, client side app..
 site.get("*", function(req, res) {
   fs.createReadStream("./index.html").pipe(res);