Posts

Showing posts with the label gulp

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: More with modules - Templates

Find the previous  episode here . Checkout the part 3 branch git checkout -b part3.0 origin/part3.0 We have created the routing and added a test module to the application. Lets try to add more to module. Templating          Am going to use RequireJS "Text" plugin for templating along with  Underscore.js and Jquery Text     An AMD loader plugin for requireJS to load text resouces. We will load html using text. Underscore.js     " Underscore  is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects. " underscore provides a powerfull templating option. You could try lodash also which is a fork of UnderscoreJS Let's do some coding now. First we need to create a template in html. We will extract this code from index.html and will create a new html in modules/home/templates/home.html <div> <ul> <li><a href="#home">Hom...

RequireJS: Getting Started

Modular programming helps to divide the application code based on the module. These programming style helps to manage as well develop the application easily. Requirejs is lightweight framework used in javascript to develop applications using the modular programming. RequireJS RequireJS is lightweight javascript framework which enables AMD(Asynchronous Module Loader). RequireJS helps to load javascript file and modules asynchronously. Apart from using in browser , it’s also be used alongside in Node projects. Why RequireJS? It’s lightweight, scalable, comes with an excellent optimising tool. Apart from these the use of  RequireJS comes handy when you need to divide and load javascript files and modules whenever they need. Suppose you had an application which have a home page, employees, and projects module. And had 3 javascript files like home.js, employees.js and projects.js. Normally in single page application you need to load these files when the page loads. L...