Create Professional Webpages in Minutes using Mustache and jQueryCycle

Learn how jQuery, CSS, jQueryCycle, and Mustache (a JavaScript templating library) can work together with JSON data to provide a professional and responsive web-site.

This workshop takes you through a scrolling carousel of employee images and information, using simple and short code snippets. It starts with ZERO knowledge and ZERO code, and results in a professional page using templating library Mustache, along with the skills of jQueryCycle. The data is read from a JSON file (it could be read from any database as well.)


Link to the complete documentation on S3.



Outline/Structure of the Workshop

Explaining the final output: 3 minutes

Downloading the technologies needed: 7 minutes

Setting up IIS: 5 minutes

Creating a basic shell page: 5 minutes

Introduction to JSON: 5 minutes

Example reading from JSON file using getJSON: 5 minutes

Fitting the JSON data into Mustache (non array): 10 minutes

Reading JSON data into Mustache (array): 10 minutes

Simple conditions with Mustache: 10 minutes

Including jQueryCycle: 5 minutes

Using jQueryCycle methods to cycle through Mustache data: 10 minutes

Beautification of the final output using CSS: 10 minutes

Buffer and Q&A: 5 minutes

Learning Outcome

This workshop will help participants to write professional code using template libraries faster.

Target Audience

Programmers, IT Managers

schedule Submitted 5 years ago

Public Feedback

comment Suggest improvements to the Speaker
  • Steve Ropa
    By Steve Ropa  ~  5 years ago
    reply Reply

    Hi Ajay,


    Can you help me understand the Agile link to this proposal?  Are there specific practices associated with Agile that you will be presenting?