diff options
26 files changed, 841 insertions, 399 deletions
diff --git a/_layouts/default.html b/_layouts/default.html index 5148bf1..8017ea5 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,11 +71,28 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> {{ content }} </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_layouts/post.html b/_layouts/post.html index d10eee3..f7b8e18 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -1,30 +1,42 @@ --- layout: default --- + +<div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + <div id="post"> {{ content }} </div> + </div> -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> - -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -37,3 +49,4 @@ layout: default (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> diff --git a/_site/2011-12-12-cross-domain-backbone-apps.html b/_site/2011-12-12-cross-domain-backbone-apps.html index a18b86d..766fb16 100644 --- a/_site/2011-12-12-cross-domain-backbone-apps.html +++ b/_site/2011-12-12-cross-domain-backbone-apps.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h2>Cross Browser problems when consuming your own <span class="caps">API</span></h2> <p>This tutorial aims to help those who have separated their front-end completely from their back-end by building a restful interface as the mediator between the two.</p> <p>Consuming your own public api has great benefits and sites such as foursquare have <a href="http://engineering.foursquare.com/2011/12/08/web-sites-are-clients-too/">recently</a> converted.</p> @@ -405,27 +426,31 @@ We should setup any useful containers that might be used by our Backbone views.< <li><a href="https://github.com/dzejkej">Jakub Kozisek</a> (created modular-backbone-updated containing updated libs with <span class="caps">AMD</span> support)</li> </ul> </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> + </div> - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -438,9 +463,12 @@ We should setup any useful containers that might be used by our Backbone views.< (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/about.html b/_site/about.html index e1a06c8..c41ee1a 100644 --- a/_site/about.html +++ b/_site/about.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,7 +71,22 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <h2>About Backbone Tutorials</h2> <p>As single page apps and large scale javascript applications become more prominent on the web, useful resources for those developers who are jumping the ship are crucial.</p> @@ -80,7 +94,9 @@ <p>You can contact the original owner of this site through <a href="https://github.com/thomasdavis">github</a> or via twitter(<a href="http://twitter.com/neutralthoughts">@neutralthoughts</a>). You can also find me at #cdnjs on freenode.net.</p> <p>thomasalwyndavis@gmail.com</p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/atom.xml b/_site/atom.xml index b45231e..992caaf 100644 --- a/_site/atom.xml +++ b/_site/atom.xml @@ -4,7 +4,7 @@ <title>Backbone Tutorials</title> <link href="http://backbonetutorials.com/atom.xml" rel="self"/> <link href="http://backbonetutorials.com/"/> - <updated>2013-08-14T16:56:48+10:00</updated> + <updated>2013-08-14T17:30:36+10:00</updated> <id>http://backbonetutorials.com/</id> <author> <name>Thomas Davis</name> diff --git a/_site/chat.html b/_site/chat.html index 94c2eca..6ae8d62 100644 --- a/_site/chat.html +++ b/_site/chat.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,13 +71,30 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <p> <p>#cdnjs on irc.freenode.net, don’t forget to follow me on <a href="http://twitter.com/neutralthoughts" target="_blank">twitter</a>.</p><br /> <iframe src="http://webchat.freenode.net/?channels=cdnjs" width="100%" height="500px"></iframe></p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/contact.html b/_site/contact.html index 4048905..fc12822 100644 --- a/_site/contact.html +++ b/_site/contact.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,12 +71,29 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <h2>Contact</h2> <p>You can contact the original owner of this site through <a href="https://github.com/thomasdavis">github</a> or via twitter(<a href="http://twitter.com/neutralthoughts">@neutralthoughts</a>).</p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/contribute.html b/_site/contribute.html index 15cc2e4..3d52c04 100644 --- a/_site/contribute.html +++ b/_site/contribute.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,13 +71,30 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <h2>Contribute</h2> <p>The main goal behind BackboneTutorials.com is to build a comprehensive guide for developers of all levels of experience. Discussion and debate are encouraged and will hopefully breed innovation for javascript applications.</p> <p>All contributions will be well acknowledged on the site.</p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/cross-domain-sessions/index.html b/_site/cross-domain-sessions/index.html index 897745e..05d11dc 100644 --- a/_site/cross-domain-sessions/index.html +++ b/_site/cross-domain-sessions/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>Cross-domain Backbone.js with sessions using CORS</h1> <p><strong> This tutorial is a proof of concept and needs to be checked for security flaws </strong></p> @@ -448,27 +469,31 @@ </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -481,9 +506,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/css/style.css b/_site/css/style.css index e69de29..8397263 100644 --- a/_site/css/style.css +++ b/_site/css/style.css @@ -0,0 +1,9 @@ +#post h1 { + font-size: 32px !important; +} +#post h2 { + font-size: 26px !important; +} +#post h3 { + font-size: 20px !important; +} diff --git a/_site/examples.html b/_site/examples.html index 5931ad2..a945389 100644 --- a/_site/examples.html +++ b/_site/examples.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,7 +71,22 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <h2>Examples of sites using Backbone.js</h2> <h3><a href="http://app.protosal.com">Protosal.com</a></h3> @@ -81,7 +95,9 @@ <h3><a href="http://getflow.com">GetFlow.com</a></h3> <p>Flow is a task management app that makes working with your team a breeze. You can see the internals under window.Flow.</p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/index.html b/_site/index.html index 37fae50..471b96b 100644 --- a/_site/index.html +++ b/_site/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,7 @@ <div style=""></div> <div class="container"> - - <div class="container"> - <div class="row"> +<div class="row"> <div class="col-lg-4"> <div class="panel panel-primary"> <div class="panel-heading"> @@ -85,18 +82,13 @@ </div> </div> <div class="col-lg-8"> - <div class="panel "> - <div class="panel-heading"> - <h3 class="panel-title">Backbone.js Beginner Video Tutorial</h3> - </div> + <h3 >Backbone.js Beginner Video Tutorial</h3> <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> - </div> </div> </div> - - -<div class="row" > + <div class="container"> + <div class="row" > <div class="col-lg-4"> <div class="panel panel-success"> <div class="panel-heading"> @@ -207,6 +199,7 @@ <div class="list-group"> <a class="list-group-item" href="http://backboneboilerplate.com">Backbone Boilerplate - Using require.js with build system</a> + <a class="list-group-item" href="http://antoviaque.org/docs/tutorials/backbone-relational-tutorial/">Backbone-relational Tutorial - Nested Models With Backbone.js</a> <a class="list-group-item" target="_blank" href="http://thomasdavis.github.com/2011/02/01/backbone-introduction.html">Backbone.js Tutorial – by noob for noobs</a> </div> </div> @@ -217,12 +210,11 @@ <h3 class="panel-title">Example Apps</h3> </div> <div class="list-group"> - <a class="list-group-item" href="http://www.earbits.com">Earbits.com - Music streaming website built with Backbone.js - Great for programmers who listen to music when coding</a> - <a class="list-group-item" href="http://kaleistyleguide.com/">Kalei - A living CSS styleguide - Built with Backbone.js using these principles</a> - <a class="list-group-item" href="http://apiengine.io">ApiEngine.io (Beta) - Collaborativly build RESTful API's with automated testing and client mocking.</a> - <a class="list-group-item" href="https://github.com/alessioalex/ClientManager" alt="Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.">ClientManager - Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.</a> - <a class="list-group-item" href="http://antoviaque.org/docs/tutorials/backbone-relational-tutorial/">Backbone-relational Tutorial - Nested Models With Backbone.js</a> - <a class="list-group-item" href="http://www.clevertim.com">Clevertim CRM - A real life example of implementing a simple CRM with backbone.js (check the Quick Demo)</a> + <a class="list-group-item" href="http://www.earbits.com">Earbits.com - Music streaming website</a> + <a class="list-group-item" href="http://kaleistyleguide.com/">Kalei - A living CSS styleguide</a> + <a class="list-group-item" href="http://apiengine.io">ApiEngine.io - Collaborativly build RESTful API's.</a> + <a class="list-group-item" href="https://github.com/alessioalex/ClientManager" alt="Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.">ClientManager - Sample application</a> + <a class="list-group-item" href="http://www.clevertim.com">Clevertim CRM - A simple CRM</a> </div> </div> </div> @@ -246,7 +238,9 @@ </ul> --> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/infinite-scrolling/index.html b/_site/infinite-scrolling/index.html index 1f7c763..1ac32bb 100644 --- a/_site/infinite-scrolling/index.html +++ b/_site/infinite-scrolling/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>Lightweight Infinite Scrolling using Twitter API</h1> <h2>Getting started</h2> @@ -209,27 +230,31 @@ <p><a href="https://github.com/thomasdavis/backbonetutorials/tree/gh-pages/examples/infinite-scroll">Example Source</a></p> </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -242,9 +267,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/lessons.html b/_site/lessons.html index 11e7a5a..6d65fa3 100644 --- a/_site/lessons.html +++ b/_site/lessons.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,12 +71,29 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <p>If you and your team are looking to learn Backbone.js and other front end development skills, I am available to fly in and coach onsite.</p> <p>If you would like to discuss team training with me, send an email directly to thomasalwyndavis@gmail.com</p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/nodejs-restify-mongodb-mongoose/index.html b/_site/nodejs-restify-mongodb-mongoose/index.html index 336eba6..617660a 100644 --- a/_site/nodejs-restify-mongodb-mongoose/index.html +++ b/_site/nodejs-restify-mongodb-mongoose/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>Simple example - Node.js, Restify, MongoDb and Mongoose</h1> <p>Before I start, the Backbone.js parts of this tutorial will be using techniques described in "Organizing your application using <a href="http://backbonetutorials.com/organizing-backbone-using-modules/">Modules</a> to construct a simple guestbook.</p> @@ -355,27 +376,31 @@ <p><a href="http://weblog.bocoup.com/organizing-your-backbone-js-application-with-modules">Organizing Your Backbone.js Application With Modules</a></p> </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -388,9 +413,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/organizing-backbone-using-modules/index.html b/_site/organizing-backbone-using-modules/index.html index d9e42bc..7cfa3c6 100644 --- a/_site/organizing-backbone-using-modules/index.html +++ b/_site/organizing-backbone-using-modules/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>Organizing your application using Modules (require.js)</h1> <p>Unfortunately Backbone.js does not tell you how to organize your code, leaving many developers in the dark regarding how to load scripts and lay out their development environments.</p> @@ -468,27 +489,31 @@ We should setup any useful containers that might be used by our Backbone views.< </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -501,9 +526,12 @@ We should setup any useful containers that might be used by our Backbone views.< (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/rss.xml b/_site/rss.xml index 5aa2a44..86580be 100644 --- a/_site/rss.xml +++ b/_site/rss.xml @@ -4,7 +4,7 @@ <title>Backbone Tutorials</title> <link href="http://backbonetutorials.com/atom.xml" rel="self"/> <link href="http://backbonetutorials.com/"/> - <updated>2013-08-14T16:56:48+10:00</updated> + <updated>2013-08-14T17:30:36+10:00</updated> <id>http://backbonetutorials.com/</id> <author> <name>Thomas Davis</name> diff --git a/_site/seo-for-single-page-apps/index.html b/_site/seo-for-single-page-apps/index.html index b2d5482..5396f91 100644 --- a/_site/seo-for-single-page-apps/index.html +++ b/_site/seo-for-single-page-apps/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>SEO for single page apps</h1> <p>This tutorial will show you how to index your application on search engines. As the author I believe that servers should be completely independent of the client in the age of API's. Which speeds up development for the ever increasing array of clients. It is on the shoulders of the search engines to conform and they should not dictate how the web is stored and accessed.</p> @@ -215,27 +236,31 @@ using <code>#!</code> URLs in our links.</p> </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -248,9 +273,12 @@ using <code>#!</code> URLs in our links.</p> (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/videos.html b/_site/videos.html index ee44942..b6a77c5 100644 --- a/_site/videos.html +++ b/_site/videos.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,11 +71,28 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> <p><iframe src="https://gumroad.com/l/yYwC" style="overflow: hidden; border: 0; width: 100%; height: 600px;"></iframe></p> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/what-is-a-collection/index.html b/_site/what-is-a-collection/index.html index aa5d253..3a7b0d4 100644 --- a/_site/what-is-a-collection/index.html +++ b/_site/what-is-a-collection/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>What is a collection?</h1> <p>Backbone collections are simply an ordered set of <a href="/what-is-a-model">models</a>. Such that it can be used in situations such as;</p> @@ -139,27 +160,31 @@ </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -172,9 +197,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/what-is-a-model/index.html b/_site/what-is-a-model/index.html index c12a340..d972e87 100644 --- a/_site/what-is-a-model/index.html +++ b/_site/what-is-a-model/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>What is a model?</h1> <p>Across the internet the definition of <a href="http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller">MVC</a> is so diluted that it's hard to tell what exactly your model should be doing. The authors of backbone.js have quite a clear definition of what they believe the model represents in backbone.js.</p> @@ -380,27 +401,31 @@ We will use the <code>save</code> api call which is intelligent and will send a </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -413,9 +438,12 @@ We will use the <code>save</code> api call which is intelligent and will send a (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/what-is-a-router/index.html b/_site/what-is-a-router/index.html index 3f25f20..cb2ee0f 100644 --- a/_site/what-is-a-router/index.html +++ b/_site/what-is-a-router/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>What is a router?</h1> <p>Backbone routers are used for routing your applications URL's when using hash tags(#). In the traditional MVC sense they don't necessarily fit the semantics and if you have read "<a href="http://backbonetutorials.com/what-is-a-view">What is a view?</a>" it will elaborate on this point. Though a Backbone "router" is still very useful for any application/feature that needs URL routing/history capabilities.</p> @@ -196,27 +217,31 @@ </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -229,9 +254,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/what-is-a-view/index.html b/_site/what-is-a-view/index.html index 9d9e390..06275d4 100644 --- a/_site/what-is-a-view/index.html +++ b/_site/what-is-a-view/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>What is a view?</h1> <p>Backbone views are used to reflect what your applications' data models look like. They are also used to listen to events and react accordingly. This tutorial will not be addressing how to bind models and collections to views but will focus on view functionality and how to use views with a JavaScript templating library, specifically <a href="http://documentcloud.github.com/underscore/#template">Underscore.js's _.template</a>.</p> @@ -244,27 +265,31 @@ </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -277,9 +302,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/_site/why-would-you-use-backbone/index.html b/_site/why-would-you-use-backbone/index.html index 1d9bca5..22c93be 100644 --- a/_site/why-would-you-use-backbone/index.html +++ b/_site/why-would-you-use-backbone/index.html @@ -49,16 +49,15 @@ <span class="icon-bar"></span> <span class="icon-bar"></span> </button> - <a class="navbar-brand" href="#">Backbone Tutorials</a> + <a class="navbar-brand" href="/">Backbone Tutorials</a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> - <li class="active"><a href="#">Home</a></li> - <li><a href="#">Link</a></li> + <li class="active"><a href="/">Home</a></li> </ul> <ul class="nav navbar-nav pull-right"> - <li><a href="#">Subscribe</a></li> - <li><a href="#">Download eBook (.pdf, .MOBI, .ePub)</a></li> + <li><a href="http://feeds.feedburner.com/BackboneTutorials">Subscribe</a></li> + <li><a href="https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CC4QFjAA&url=https%3A%2F%2Fleanpub.com%2Fbackbonetutorials&ei=dC8LUvm0O-LtiwLWroDwDA&usg=AFQjCNFuPoy4DzhISX8MR65TDHBhhtKoKw&sig2=hZuDQxF1XDTsnardyQpd0A&bvm=bv.50723672,d.cGE">Download eBook (.pdf, .MOBI, .ePub)</a></li> </ul> </div><!-- /.nav-collapse --> </div><!-- /.container --> @@ -72,9 +71,31 @@ <div style=""></div> <div class="container"> - +<div class="row"> + <div class="col-lg-4"> +<div class="panel panel-primary"> + <div class="panel-heading"> + <h3 class="panel-title">About</h3> + </div> + + <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> + </div> + </div> + <div class="col-lg-8"> + <h3 >Backbone.js Beginner Video Tutorial</h3> + <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> + <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> + </div> +</div> <div class="container"> - <div id="post"> + <div class="panel"> + <div class="panel-heading"> + <h3 class="panel-title">Tutorial</h3> + </div> + + + +<div id="post"> <h1>Why do you need Backbone.js?</h1> <p>Building single-page web apps or complicated user interfaces will get extremely difficult by simply using <a href="http://jquery.com">jQuery</a> or <a href="http://mootools.net">MooTools</a>. The problem is standard JavaScript libraries are great at what they do - and without realizing it you can build an entire application without any formal structure. You will with ease turn your application into a nested pile of jQuery callbacks, all tied to concrete DOM elements.</p> @@ -109,27 +130,31 @@ <p><strong>If you questions regarding why you should choose Backbone.js as your framework, please leave a comment below</strong></p> </div> - -<div style="border: 1px solid #ccc; box-shadow: 0 0 10px #ccc; margin-top: 15px; margin-bottom: 20px;padding: 15px;"> -<h3 style="margin-bottom:15 px;">Backbone.js Beginner Video Tutorial</h3><img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> -<a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> -<div style="clear: both;"></div> -</div> - - - <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> -<noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> -<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + </div> -<span class='st_facebook_vcount' displayText='Facebook'></span> -<span class='st_twitter_vcount' displayText='Tweet'></span> -<span class='st_email_vcount' displayText='Reddit'></span> -<span class='st_email_vcount' displayText='Google +1'></span> -<script type="text/javascript">var switchTo5x=false;</script> -<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> -<script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> -<hr /> +<div class="panel panel-success"> + <div class="panel-heading"> + <h3 class="panel-title">Share</h3> + </div> + + <a class="FlattrButton" style="display:none;" href="http://backbonetutorials.com/"></a> + <noscript><a href="http://flattr.com/thing/176986/Backbone-js-Tutorials" target="_blank"> + <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript> + + + <span class='st_facebook_vcount' displayText='Facebook'></span> + <span class='st_twitter_vcount' displayText='Tweet'></span> + <span class='st_reddit_vcount' displayText='Reddit'></span> + <span class='st_googleplus_vcount' displayText='Google +1'></span> + <script type="text/javascript">var switchTo5x=false;</script> + <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> + <script type="text/javascript">stLight.options({publisher: "bdee6d8c-ed9a-4867-90f6-011704c29ee3"}); </script> +</div> +<div class="panel panel-info"> + <div class="panel-heading"> + <h3 class="panel-title">Comments</h3> + </div> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ @@ -142,9 +167,12 @@ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> +</div> </div> + </div> + <script src="//static.getclicky.com/js" type="text/javascript"></script> <script type="text/javascript">try{ clicky.init(66406579); }catch(e){}</script> <noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/66406579ns.gif" /></p></noscript> diff --git a/css/style.css b/css/style.css index e69de29..8397263 100644 --- a/css/style.css +++ b/css/style.css @@ -0,0 +1,9 @@ +#post h1 { + font-size: 32px !important; +} +#post h2 { + font-size: 26px !important; +} +#post h3 { + font-size: 20px !important; +} @@ -3,26 +3,7 @@ layout: default title: --- -<div class="row"> - <div class="col-lg-4"> -<div class="panel panel-primary"> - <div class="panel-heading"> - <h3 class="panel-title">About</h3> - </div> - - <p>Backbone Tutorials is a collection of tutorials written by <a href="http://thomasdav.is">Thomas Davis</a>. Everything is open source and I try my best to keep the tutorials updated. Though I am busy and only work on this is my spare time so many <a href="https://github.com/thomasdavis/backbonetutorials/graphs/contributors">contributors</a> have also help me put this resource together.</p> - </div> - </div> - <div class="col-lg-8"> - <div class="panel "> - <div class="panel-heading"> - <h3 class="panel-title">Backbone.js Beginner Video Tutorial</h3> - </div> - <img src="/backbone.png" style="float: left;" /><p>I have put extra effort into making a very easy to understand Backbone.js video which is also free. It is 70mins long and covers everything you need to know when getting started.</p> - <a href="http://gum.co/backbone-beginner-screencast" class="btn btn-primary">Watch Video</a> - </div> - </div> -</div> + <div class="row" > @@ -84,6 +65,7 @@ title: <div class="list-group"> <a class="list-group-item" href="http://backboneboilerplate.com">Backbone Boilerplate - Using require.js with build system</a> + <a class="list-group-item" href="http://antoviaque.org/docs/tutorials/backbone-relational-tutorial/">Backbone-relational Tutorial - Nested Models With Backbone.js</a> <a class="list-group-item" target="_blank" href="http://thomasdavis.github.com/2011/02/01/backbone-introduction.html">Backbone.js Tutorial – by noob for noobs</a> </div> </div> @@ -94,12 +76,11 @@ title: <h3 class="panel-title">Example Apps</h3> </div> <div class="list-group"> - <a class="list-group-item" href="http://www.earbits.com">Earbits.com - Music streaming website built with Backbone.js - Great for programmers who listen to music when coding</a> - <a class="list-group-item" href="http://kaleistyleguide.com/">Kalei - A living CSS styleguide - Built with Backbone.js using these principles</a> - <a class="list-group-item" href="http://apiengine.io">ApiEngine.io (Beta) - Collaborativly build RESTful API's with automated testing and client mocking.</a> - <a class="list-group-item" href="https://github.com/alessioalex/ClientManager" alt="Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.">ClientManager - Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.</a> - <a class="list-group-item" href="http://antoviaque.org/docs/tutorials/backbone-relational-tutorial/">Backbone-relational Tutorial - Nested Models With Backbone.js</a> - <a class="list-group-item" href="http://www.clevertim.com">Clevertim CRM - A real life example of implementing a simple CRM with backbone.js (check the Quick Demo)</a> + <a class="list-group-item" href="http://www.earbits.com">Earbits.com - Music streaming website</a> + <a class="list-group-item" href="http://kaleistyleguide.com/">Kalei - A living CSS styleguide</a> + <a class="list-group-item" href="http://apiengine.io">ApiEngine.io - Collaborativly build RESTful API's.</a> + <a class="list-group-item" href="https://github.com/alessioalex/ClientManager" alt="Sample application built with Backbone, RequireJS, Twitter Bootstrap on the client and Node.js (Express.js, Mongoose) on the server.">ClientManager - Sample application</a> + <a class="list-group-item" href="http://www.clevertim.com">Clevertim CRM - A simple CRM</a> </div> </div> </div> |