Modularizing web applications

Question

I was wondering how big companies tend to modularize components on their page. Facebook is a good example:

There\'s a team working on Search that has it

Answer 1

i worked with several one-page-web-app projects, from my experience

your diff teams should sit down once to setup some simple css convention

for example

mod-search.css

.mod-search .title { }
.mod-search .text { }

mod-news.css

.mod-news .title { }
.mod-news .text { }

in production use your fav front end do lump all the resources into one

also do the same to js, actually js is easier to manager than css

make sure each module is wrapped in its own closure

i am using YUI as an example

mod-search.js

(function(){
   var node = Y.Node.create('
').addClass('mod-search'); 
   // hook your event to this module node only
   node.delegate('click', handleSearch, 'button.search');
}());

mod-news.js

(function(){
   var node = Y.Node.create('
').addClass('mod-news'); 
   // hook your event to this module node only
   node.delegate('click', handleViewNews, 'a.view-news'); 
}());

all-in-one.js.php

//
// php set content type text/javascript
//
YUI().use('node', 'event', function(Y){
   // php include mod-new.js
   // php include mod-search.js
}); 

the HTML