I had immersed in web developer more than one year. during this past year, I read a lot of books about fond-end.
from css,javascript,jquery and html. especial books about javascript. Yes, Javascript one one lauguange which you perhaps love and hate together.
but anyway, I want to move on about this laungage.
During code with Javascript, I encountered many problem which I never encountered before, this is the reason which I want to try to learn BackBone in detail.
Basic I will try to learn this js framework from www.backbonejs.org only. I will record my practise in this blog step by step.
OK,Let me have a look my first backbone demo. add underscore.js and backbone.js two files in Scripts folder. use Asp.net mvc4 bundle and minifaction framework to bundle those two scripts. one strange thing is that you should first include ‘underscore.js‘ file, current I don‘t know the reason. I will pay attention to this later.
second, refer to this package in _layout.cshtml,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>@ViewBag.Title - My ASP.NET MVC Application</title> <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> <meta name="viewport" content="width=device-width" /> @Scripts.Render("~/bundles/backbone")
third, add one action(and its view) under HomeController
//Demo action
public ActionResult Demo() { return View(); }
//Demo.cshtml
@{ ViewBag.Title = "Demo"; } <script type="text/javascript" src="~/Scripts/demo.js"></script> <h2>Demo</h2>
last in demo.js file, we use backbone to raise one later event.
(function () { var object = {}; _.extend(object, Backbone.Events); object.on("alert", function (msg) { alert("Triggered " + msg); }); object.trigger("alert", "an event"); })();
now Demo done, in IE address,input:http://localhost:49983/Home/Demo, you can see its output.
this demo is just showing brief usage of backbone. no detail explanation about it. I will dig into backbone.js to find what is benefit of this js framwork comparing with common js framework. see you.
Backbone introduce,布布扣,bubuko.com
原文:http://www.cnblogs.com/pureni/p/3905509.html