Posts

Showing posts with the label browsersync

RequireJS: More with templating - Dynamic data

Find the previous  episode here . Checkout the part 3 branch git checkout -b part4.0 origin/part4.0 Lets change the templating a bit different so that we could add data to the template. Now if we click on a link other than home everything will be gone. So we will move the link list to the index before maincontent so that it will always remain there. Next we will replace the modules/home/Home.html with some dummy text. The index.html wil looks like this <div>   <ul>     <li><a href="#home">Home</a></li>     <li><a href="#employee">Employees</a></li>     <li><a href="#project">Projects</a></li>   </ul> </div> <div id="maincontent">   </div> Next we will add some more dummy content to other template html file in projects and employees . And also change the controllers to load and how the content. And also we need to...

RequireJS: Application routing

Find the previous episode here . Checkout the part2.0 branch git checkout -b part2.0 origin/part2.0 In this section we will look into how a routing can be done. For this we are using another lightweight routing framework Page.js .  First install it using bower. bower install visionmedia/page.js We already had added the page in config.js. Now we need to create a router.js which will be in router folder.   define(['page'], function(page) { }); We will create a blank module with loading the page framework. Here we use the Module ID for the module which we defined in config.js. You could use the url also like "bower_components/page/page" But it would be better if a module id us used. NOTE: In requireJS the .JS extension will not be used. Next we will require the router module in app.js. define(['config'], function(config) { "use strict"; require(['router/router']); }); This will load the router module after loading the c...