AcasestudyonusingopensourcetoolstobuildaplatformforenterprisewebapplicationsusingsymfonyandYahoo!UserInterfacelibraries.

DustinWhittleYahoo!

symfony+Yahoo!UserInterfaceLibraries‣  HowdidYahoo!architectYahoo!Answerswithsymfonyand

Yahoo!UserInterfacelibraries?‣  Whatworkedandwhatdidnotwhenbuildingalargeweb2.0

productfromopensourcetools?‣  Howtoworkwithopensourceframeworksintheenterprise?

‣  Howtodevelop,test,anddeployWeb2.0applicationsfortheenterpriseusingsymfonyandtheYahoo!UIlibraries

‣  Q&A?

symfony‐project.com|developer.yahoo.com

AlookatYahoo!Answers‣  http://answers.yahoo.com

‣  Yahoo!AnswersisthelargestcollectionofhumanknowledgeontheWebwithmorethan135millionusersand515millionanswersworldwide(Yahoo!InternalData,March2008).

‣  Yahoo!Answersisthe2ndrankededucation&referencesiteontheweb(comScore)

‣  Availablein26marketsand12languages

AlookattheopensourceYahoo!‣  Yahoo!isbuiltfromopensourcetoolsandcommunities

‣  FreeBSD,Linux,Apache,PHP,MySQL

‣  Wecontributebackandeveryonewins

‣  Weshareourtools,experience,anddatathroughopenAPIsandwebservices

‣  Yahoo!UserInterfaceLibraries+EdgeCaching‣  UserInterfaceDesignPatterns‣  ExceptionalPerformanceRules+YSlow

‣  R3Template+TranslationManagement

AlookatYahoo!UserInterfaceLibraries‣  JavaScriptFramework

‣  Utilities‐YAHOO,Dom,Event,Animation,BrowserHistoryManager,ConnectionManager,Cookie,DataSource,DragandDrop,Element,Get,ImageLoader,JSON,Resize,Selector,Loader

‣  Controls/Widgets‐AutoComplete,Button,Calendar,Charts,ColorPicker,DataTable,ImageCropper,RichTextEditor,Slider,Uploader

‣  Container(Module,Overlay,Panel,Tooltip,Dialog),LayoutManager,Menu,TabView,TreeView

‣  Debug–Logger,Profiler,Test

AlookatYahoo!UserInterfaceLibraries‣  CSSFoundation‣  Reset‐NeutralizesbrowserCSSstyles‣  Base‐Appliesconsistentstylefoundation‣  Fonts‐Foundationfortypographyandfont‐sizing‣  Grids‐Thousandsofwireframelayouts

‣  UserInterfaceDesignPatternsLibrary‣  Provensolutionstocommoninterfaces

‣  http://developer.yahoo.com/ypatterns/

‣  GradeBrowserSupport/ProgressiveEnhancement

Yahoo!Answersatthebeginning‣  StartedasasmalldevelopmentteamonPHP4fromaforkof

Yahoo!TaiwanKnowledge+

‣  LaunchedDecember2005byDecember2006therewere60millionusersand65millionanswers

‣  Thecodebaseeventuallybecamedifficulttomaintainanditeratenewfeatureson

‣  Largedistributeddevelopmentteams(US/UK)

Y!AnswersArchitectureUsers

LoadBalancers

Frontend

PHPAPC,PEAR,PECL,CustomExtensions

FreeBSD4.x/6.x,Linux2.6.x

symfony/YUIApacheCustomModules

Backend

MySQL/Oracle WebServices AdAPI UserAPI

Thechoicetouseanopensourceframework‣  symfonywasinvestigatedforuseonYahoo!Bookmarksasa

testforthelaterre‐architectureofYahoo!Answers

‣  InvestigationwasperformedinFebruary2006

‣  symfony,CakePHP,Prado,ZendFramework,Struts,Tapestry,Spring,Seaside,RubyonRails,Django

‣  PHPhasmostsupportinternally,sothechoicewasreallybetweensymfony,CakePHP,Prado,php.MVC,andZendFramework

Whatweretheneedsfromafrontendplatform?‣  Fitexistingenvironment(BSD/PHP5/Apache)forphased

migration

‣  DevelopmentCycle–Howeasytodevelop,test,anddeploy?

‣  Cleanseparationbetweendata,logic,anddisplay(MVC)

‣  Independentmodellayertofitserviceorientedarchitecture

‣  Extensibleandpluggable‣  Internationalizationandlocalizationsupport‣  Detaileddocumentationandactivecommunityofsupport

‣  Opensourceandabilitytocontributeback

Thechoicetousesymfony‣  Philosophy‣  Full‐stackframeworkforbuildingcomplexwebapplications

‣  Adoptbestideasfromanywhere,usingexistingcodeifavailable(Mojavi,Prado,Rails,Django)

‣  Design‣  CleanseparationbetweenModel,View,andController

‣  Controllerusingmodulesandactions

‣  ViewsusingtemplatesinstraightPHPwithhelpers

‣  Easytoreuseviewmodulestocomposeapage

‣  Layouts,Components,Partials,Slots

Thechoicetousesymfony‣  Configurability/Flexibility‣  Featureswedonotwantareeasilydisabled‣  Useoffactoriesforeasycustomization

‣  Documentation/SupportCommunity

‣  TheDefinitiveGuidetosymfony(freeonline)

‣  Excellenttutorialsandexampleapplications‐Askeet

‣  Activecommunitywithwiki,mailinglists,forums,ircchannel

Alookatsymfonyfeatures‣  MVCDesign+Project/ApplicationStructure

‣  CascadingConfigurationSystem(YAML‐>PHP)

‣  Environments–Dev,Prod,Test,QA,Staging

‣  TaskSystem–Taskssystemforprojectmanagement

‣  Internationalization+LocalizationSupport‣  Form/Widget/ValidationSystem

‣  Security–CSRF+XSSProtection+UserManagement

‣  Caching–APC,Memcache,File,Database

‣  TestingFramework–LIMEUnit+Functional

Viewsareorganizedandreusable‣  Actionscanrenderdifferentviews,apartial,oracomponent

(think:sameactionforajax)

‣  View.yml–Configurescss,js,meta,layout(app/module/action)

‣  Layouts–Mostwebappsconsistoffullpageandpopuplayout

‣  Apartialisastatictemplatefragment(think:footer)

‣  Acomponentisatemplatefragmentwithbusinesslogic(think:popularlist)

‣  Slotsareplaceholdersinapageandcanbesetfromanywhere

Partials

Slots

Layouts

Component

Acompletefrontendplatform‣  Acommunitymaintainedapproachtobuildingweb

applicationsfromframeworks

‣  PHPFramework

‣  JavaScriptFramework

‣  CSSFramework

‣  UIDesignPatterns+BestPractices‣  DevelopmentTools(logger,profiler,debugger,docs)

‣  Unit+FunctionalTestingFrameworks(LIME/YUITest)

‣  DeploymentTools(rsyncdeploymentsystem)

WhatdoesYahoo!change?‣  Minorchangestofitourenvironment(bsd/php/apache)

‣  Mostofourchangesareeasilyimplementedviafactories

‣  Addeddimensionstoconfigurations(ysfDimensionsPlugin)

‣  IntegrateR3translation/templatemanagement(ysfR3Plugin)

‣  R3‐http://developer.yahoo.com/r3/

‣  DroppedtheORMandpusheddownthestack(SOA)

‣  AddedaparallelAPIDispatcher(ysfAPIClientPlugin)‣  Createdabuildanddeploymentsolution(ysfBuildPlugin)

‣  IntegratesupportforY!UserInterfacelibraries(ysfYUIPlugin)

Localizingtheexperiencewithdimensions‣  CascadingConfigurationbasedonYAML

‣  Framework‐>Project‐>Application‐>Module

‣  Extendingthecascadetobebasedondimensions

‣  Dimensionscanbeanything(andcanbechainedtogether)

‣  DataCenter+Environmentforcustomizingconfigurations

‣  Cultureforlocalizinguserinterface+data‣  Themeforcustomizinglookandfeel

‣  Userinfo(isuseroncorporateintranet?)‣  Caching

Extendingtheview+i18nsystemwithR3‣  Translation+TemplateManagement

‣  Integratedwithsymfonyi18n+viewlayers

‣  <r3:trans>hello</r3:trans>vs__(‘hello’)‣  DictionaryManagement

‣  SQLite/XLIFFBackend‣  r3:include,r3:var,r3:cphp

‣  Addedtasks‣  Importing/ExportingXLIFFdictionary

‣  Generatingtranslationsforprojects

Abuildanddeploymentsystem‣  Aggregateandminifystylesheetsandjavascripts

‣  Rewritetemplates,css,jsforCDN(Akamai,S3,…)

‣  Generatetranslationsforconfigurations+templates

‣  Generateconfigurationcache‣  Aggregatecoreclasses+removedebugstatements

‣  Runlint,unit,functionaltests‣  Packageapplicationsas.tgz‣  Deploymentviarsync

RealWorldPerformance‣  symfonyisnottargetedforbuildinghelloworld‐‐Itis

targetedatbuildingcomplexwebapplications

‣  symfonycanprovidemanyfeatures(db,i18n,security,orm)disabletheonesyouwillnotuse

‣  Yahoo!Bookmarks

‣  Yahoo!Answers‣  100%dynamic(noviewcaching)

‣  40‐120qpswith<100msfrontendlatency

‣  Yahoo!Widgets

symfonyDocumentation‣  TheDefinitiveGuidetosymfony

‣  http://symfony‐project.com/book/1_1

‣  LicensedunderGFDL(readitfree)‣  APIDocumentation

‣  http://www.symfony‐project.org/api/1_1/

‣  Wiki

‣  http://trac.symfony‐project.com/wiki

‣  Manyusefultutorials,howto,andtranslations

AskeetAdvent+CommunitySupport‣  Askeet.com

‣  http://symfony‐project.com/askeet

‣  24DayTutorial‣  Howtobuildarealweb2.0application‣  In‐depthcoverageofallaspectsofsymfony

‣  IRC,MailingList,andForums

‣  irc://irc.freenode.net/#symfony

‣  symfony‐users@googlegroups.com

‣  http://symfony‐project.com/forum

YUIExamples+Documentation‣  Morethan275functionalexamples

‣  http://developer.yahoo.com/yui/examples/

‣  Yslow+PerformanceRules

‣  http://developer.yahoo.com/performance

‣  YUIBlog‣  http://yuiblog.com/

‣  MailingList@Yahoo!Groups

‣  http://tech.groups.yahoo.com/group/ydn‐javascript/

Gettingstartedin10minutes‣  InstallsymfonyfromPEAR

‣  pearchannel‐discoverpear.symfony‐project.com

‣  pearinstallsymfony/symfony‐beta

‣  Createaprojectwithsymfonycli

‣  mkdirweb2expo;cdweb2expo

‣  symfonygenerate:projectweb2expo

‣  symfonygenerate:appfrontend

‣  symfonygenerate:modulefrontenddemo

Installafoundationfromplugins‣  Communityplugins

‣  symfonyplugin:installsfGuardPlugin

‣  symfonyplugin:installsfFeed2Plugin

‣  Yahoo!Plugins(willbereleasedwith1.1stable)‣  symfonyplugin:installysfDimensionsPlugin

‣  symfonyplugin:installysfR3Plugin

‣  symfonyplugin:installysfBuildPlugin

‣  symfonyplugin:installysfYUIPlugin

Questions?

ThanksforlisteningandenjoytherestoftheWeb2.0Expo!