Upload
giorgio-natili
View
24
Download
0
Tags:
Embed Size (px)
Citation preview
AboutMe• TechnicalLeaderandAgileCoach• Front-endDeveloper(testfirst!)• MobileDeveloper(HybridwithCordova,iOS,Android)• TechnologyEnthusiast• [email protected]
What'sNext?
ScotchStreamingandScaling11Feb2015www.meetup.com/mobiletea
Agenda• Monolithicapplications• Identifymodulesand/orcomponents• Distributingmodulesinyourorganization• RESTfulandHypermediamodels• Demo
EnterpriseApplications
• Existingcodebaseandlegacycode• Shorttimetomarket• Prototypebased• Lackofplanningandstrategy• Adaptingtomarketingneeds
M/SSizeApplications
• Unexpectedsuccess• Budgetconstraints• Missingexpertise• Lackofplanningandstrategy• Adaptingtocustomerneeds
What'sinCommon?Lackofdesigniterationsandseparationofconcerns
monkeyanimatedGIF
monkeyanimatedGIF
monkeyanimatedGIF
MajorProblems• Maintainability• Scalability• Learningcurve• Difficultsetups• Complexreleaseprocedures• Difficulttotest• Integrationnightmares• Longbuildcycles
PossibleSolutions• Refactoring• Documenting• Decoupling• Movethemodeontheserver• Addcomputationcapabilities(e.g.clouds)• Etc.
NoEscape
NoEscapeeatinganimatedGIF
eatinganimatedGIF
ModulesAnapplicationmoduleisaclassthatrepresentsabusiness
applicationtask.(Oracle)
ComponentsAcomponentisareusableprogrambuildingblockthatcanbe
combinedwithothercomponents.
That'sGood!
That'sGood!robertdeniroanimatedGIF
robertdeniroanimatedGIF
IdentifyThemStartingfromYourRequirements
SmallandDecoupled
• Identifysmallanddecoupledpartsofyourapplication• Trytounderstandwhicharereusableacrossseveralapps• Iterateacrossyourmodulesand/orcomponentslistbeforeimplementinganewfeature• Pick-uptherighttoolsettoimplementaspecificsetoffeatures• Neverreinventthewheel!
DistributionRequirements
• Amodule/componentshouldbeeasytoinstall• Dependenciesshouldbeeasytomanage• Thefeaturesofeverymodule/componentshouldbeveryclear• Allthereleasesofamodule/componentshouldbealwaysavailable(eventuallydismissthesupport)
PossibleSolutions
What'sAboutmy
What'sAboutmyPrivacy?
wtfanimatedGIF
wtfanimatedGIF
BowerUseaprivategitrepositoryongithub.comorcreateyourowngitserver
{"name":"my-amazing-component","version":"1.0.0","ignore":["**/.*","node_modules","bower_components","test","tests"
NPMTrythenpmjs.comenterpriseserviceorcreateyourprivatenpm
serverusingSinopiatocreateprivatepackages
UsingNPMYoucanthenusenpmasusualbuteverythingwillliveintoyourprivaterepo,theonlydifferenceisthatyousetadifferentregistry(actuallyyoucanswitchbetweenthem)
$npmsetregistryhttp://your_external_ip:4873$npmadduser$npmpublish
Results• Youcaninstallanduninstallcomponentseasily• Thedependenciesmanagementprocessisautomated(kinda!)• Everycomponent/modulecanbeunpluggedfromyourapplicationandchanged• Thesourcecodeisbetterorganized(componentsshouldworkalsostandalone)• Etc.
What'sMissing?Themodel...
techanimatedGIF
AbstracttheModel• Keepalwaysthemodelindependentfromyourclientsidearchitecture• JSONorXMLarevalidformatstodistributethedata• Usedataadapters(Backbone,EmberData,etc.)todealwiththemodelinyourclientsidecode
EnrichtheModel• Don'tdeliverjustdatabutalsobusinesslogicinformationlikerelatedlinks• UsetheflexibilityofJSONorXMLtoprovideastructuretoyourmodels
{"href":"http://example.com/api/v1/users/john","type":"user","head":{"allow":["GET","PUT","PATCH","DELETE"],"related":{
DeliverYourRules• Usethemodeltoexplicitlysettherulestofollowtopost/put/delete/informationtoyoursystem• Deliverformvalidationrules(e.gregexp)toavoidtore-buildtheclientifsomethingchange• Provideliveupdateinformation(e.g.websockets)toupdateyourapplication• Etc.
AlwaysAvoidTodefineamodelthatfitstheneedsofaspecificclientsidelibrary,
it'sapaththatisveryhardtoundo
Recommendations• Trytodon'tdependonlyonasingleclientsidelibrary• Don'tbetoolazy,JavaScriptcanhandlenativelythetasksperformedbyexternallibriaries• Keepthecommunicationassimpleaspossible• Writecleanandtestablecode• Etc.
ComponentsScope• UsewebcomponentsCSSscopingifyourconcernisthelookand
feelofcomponents/module• UseaniFrametoencloseyourcomponentinasandbox
Demohttps://github.com/GiorgioNatili/undoable-architectures
Resources• http://almostobsolete.net/talks/hypermedia• http://liquidmedia.org/blog/2011/01/backbone-js-part-1• http://madhatted.com/2013/3/19/suggested-rest-api-practices• http://emberjs.com/guides/models/the-rest-adapter• http://cwbuecheler.com/web/tutorials/2014/restful-web-app-node-express-mongodb• https://oncletom.io/2013/live-development-bower-component• http://tech.pro/tutorial/1308/emberjs-views-and-live-templates-with-handlebarsjs-part-1
@giorgionatili#mobiletea#javascript#swift#wearable#agile#android#tdd
Thanks!
Thanks!Grazie!Graçias!Danke!Merci!��!
thanksanimatedGIF
thanksanimatedGIF