The develop a dynamic website, with all those smooth page transitions similar to gmail. As per design we will use Bootstrap, Bootstrap provides all the css tools you need to setup a quick website.
Frontend skills you will need
First of all we will start of with a model view controller + observer design patterns to achieve a maintainable site.
The web frameworks that we will use are
- backbone js , giving a "structure" to the code
- mustache , page templates
- jquery , dom manipulations
as font icons we can get them for free at fontello, their package includes font-awesome
templates/ <=== contains the html templates
js/views/ <=== responsible for inital html materials and listenes to model changes / actions / events
js/models/ <=== responsible for data models
js/controller/ <=== defines the site routes
blueprints/ <=== contains all the 3rd party library
To setup hashbang (similar to gmail) for page manipulations, there is a backbone module - backbone router. Using backbone router we can set up page to change dynamically depending on the hashbang setup. To let your hash bang searchable / crawable, checkout this post.
You can checkout the Boiler Plate i've setup using this structure for off the shelve deployment.
Backbone + MVC