ARQUITECTURAWEBADOLFOSANZDEDIEGO

ENERO2014

1ACERCADE

1.1ÍNDICEContenidos:AcercadeIntroducciónHistoriaevolutivadelaWebArquitecturawebEntornodeejecuciónenservidorTecnologíasdeservidorEntornodeejecuciónenclienteTecnologíasdecliente

1.2ADOLFOSANZDEDIEGOAntiguoprogramadorwebJEEHoyendía:ProfesordeFPdeinformática:Hardware,SistemasOperativosRedes,Programación

FormadorFreelance:Java,AndroidJavaScript,jQueryJSF,Spring,HibernateGroovy&Grails

Megustaprogramar

1.3HACKALOVER

Paralosamantesdeloshackathones.Meetup:

LinkedIn:

Tumblr:Twitter:YouTube:

http://www.meetup.com/Hackathon-Lovers/

http://www.linkedin.com/groups/Hackathon-Lovers-6510465

http://hackathonlovers.tumblr.com/http://twitter.com/HackathonLovers

http://www.youtube.com/channel/UCRwSe7jK-y62BMvIiNBV1qw

1.4TWEETSSENTIMENT

Esunanalizadordetweetsqueextraeinformaciónsemánticaparaconocersielsentimientogeneraldelostweetsdeundeterminadotemaespositivoonegativo.Web:Twitter:

http://tweetssentiment.com/http://twitter.com/TweetsSentiment

1.5¿DONDEENCONTRARME?Minick:asanzdiegoAboutMe:Blog:GitHub:Google+:

LinkedIn:SlideShare:Twitter:

http://about.me/asanzdiegohttp://asanzdiego.blogspot.com.eshttp://github.com/asanzdiego

http://plus.google.com/+AdolfoSanzDeDiegohttp://www.linkedin.com/in/asanzdiegohttp://www.slideshare.net/asanzdiego

http://twitter.com/asanzdiego

1.6CRÉDITOSAgradecimientosaMicaelGallego

Introducciónalasaplicacionesweb

Tecnologíasdedesarrollodeaplicacionesweb

Estastransparenciasestánhechascon:

http://twitter.com/micael_gallego

http://www.slideshare.net/micaelgallego/qu-es-la-web-30036167

http://www.slideshare.net/micaelgallego/tema2-tecnologas-de-desarrollo-de-aplicaciones-web

https://github.com/asanzdiego/marckdownslides

1.7LICENCIAEstastransparenciasestánbajounalicencia:

Elcódigodelosprogramasestánbajounalicencia:

CreativeCommonsReconocimiento-CompartirIgual3.0

GPL3.0

1.8FUENTESOtrosformatos:SlideShare

DeckSlides

RevealSlides

PlainHTML

Markdown

http://www.slideshare.net/asanzdiego/arquitectura-web-30984535

http://asanzdiego.github.io/arquitectura-web/export/arquitectura-web-deck-slides.html

http://asanzdiego.github.io/arquitectura-web/export/arquitectura-web-reveal-slides.html

http://asanzdiego.github.io/arquitectura-web/export/arquitectura-web.html

http://raw.github.com/asanzdiego/arquitectura-web/master/md/arquitectura-web.md

2INTRODUCCIÓN

2.1¿QUÉESINTERNET?InternetesunconjuntodescentralizadoderedesdecomunicacióninterconectadasqueutilizanlafamiliadeprotocolosTCP/IP.Funcionacomounaredlógicaúnica,dealcancemundial,aunqueestéformadapormultitudderedesfísicasheterogéneas.UnodelosserviciosquemáséxitohatenidoenInternethasidolaWorldWideWeb(WWW,o"laWeb"),aunqueeshabituallaconfusiónentreambostérminosporgentenoexperta.

2.2¿QUÉESLAWEB?LaWebesunconjuntodeprotocolos,estándaresytecnologías,basadasenInternet,diseñadooriginalmenteparalaconsultaremotadeinformaciónenarchivosdehipertexto.

2.3OTROSSERVICIOSExistenmuchosotrosserviciosyprotocolosenInternet:Envíoyrecepcióndecorreoelectrónico(POP3,IMAP,SMTP)Transmisióndearchivos(SSH,FTP,P2P,HTTP)Mensajeríainstantánea(IRC,XMPP)Transmisióndecontenidomultimedia(VoIP,IPTV,RTP)Conexiónremotaporconsola(SSH,Telnet)Conexiónremotagráfica(VNC)

2.4LAWEB1.0Alprincipio,elusuariosóloleíacontenidopublicadoporotros.Erauncontenidomuyestático,ymuydifícildeeditarporelpropiousuario.Elnavegadorweberalaúnicaaplicación"conectada",yhayquereconocerlo...laweberasobretodoparaFrikis.

2.5LASCOSASEMPIEZANACAMBIARPocoapocolastecnologíassedesarrollanylosusuariosempiezanatenermásfacilidadesparaeditarelpropiocontenido.Googleseempiezaapopularizar,naceBlogger,WordPress,laWikipedia,LinkedIn...

2.6NACELAWEB2.0En2004DaleDougherty(O'Reilly)acuñaeltérminoWeb2.0parareferirseaLaWebcomounaplataformaconaplicacionesligeras,dinámicasyenconstanteevolución.ConlaWeb2.0,laspáginaswebdejandesersimplesdocumentosonlineparaconvertirseenaplicacionesweb,yesentoncescuandolosusuariostomanelcontroldeloscontenidos.

2.7WEB1.0VSWEB2.0

3HISTORIAEVOLUTIVADELAWEB

3.1LOSORÍGENESDEINTERNETEn1962,acausadelaguerrafríaconlaURSS,lasFuerzasAéreasdeEstadosUnidospidieronaunreducidogrupodeinvestigadoresquecrearaunareddecomunicacionesmilitaresquepudieraresistirunataquenuclear.En1964,PaulBarantuvolaideadecrearunaredenformadetelaraña.Elconceptodeestaredsebasabaenunsistemadescentralizado,demaneraquelaredpudieraseguirfuncionandoaunquesedestruyeranunoovariosequipos.

3.2ARPANET(1969)

En1969,elproyectomilitarARPA(AgenciadeProyectosdeInvestigaciónAvanzados,unadivisióndelMinisteriodeDefensadeEstadosUnidos)creólaredexperimentalARPANETcuyofineraconectarlasprincipalesuniversidadesdeEEUU.

3.3NACELAWEB(1989)

En1989,TimBerners-LeejuntoaRobertCailliaucreanlaWorldWideWeb.Habilitaronlosdominiosodireccionesconletras(envezdeloscomplejoscódigosIP).Tambiéninventaronlosenlaces.EstomarcóelnacimientodeLaWebcomoloconocemoshoyendía.

3.4YAHOO(1994)

En1994,JerryYangyDavidFilo,estudiantesdeStanford,creanYahoo!undirectoriodesitiossegúnlacategoríadesucontenido,paraasíintentarponerordendentrodelbazar,cadadíamásextenso,queseestabaconvirtiendoInternet.

3.5HOTMAIL(1996)

En1996,selanzóHotmailelcorreoelectrónicogratuitodeMicrosoft.

3.6GOOGLE(1997)

En1997,LarryPageySergeyBrin,dosestudiantesdeStanford,creanGoogle,unsistemaqueanalizalosenlacesqueconectanlossitiosdeInternetparahallarinformacióndemaneraefectiva.

3.7LAS'.COM'(1998)

En1998,bancoseinversionistasvolcaronmilesdemillonesdedólaresalfinanciamientodetodotipodeempresasbasadasenlaRed,conocidascomolas'punto-com'.

3.8NAPSTER(1998)

En1998,SeanParkeryShawnFanningcreanNapsterunodelosprimerosprogramasP2P.

3.9XMPP(1999)

En1999,naceXMPP,unprotocoloabiertoideadoparalamensajeríainstantánea.

3.10BLOGGER(1999)

En1999,tambiénnaceBlogger,unserviciowebparagestionarblogs.

3.11LABURBUJA(2001)

En2001,estallalaburbujadelas'punto-com'quellevóalaquiebraalamayoría.

3.12WIKIPEDIA(2001)

En2001,salióalaluzWikipedia,unaenciclopediavirtualqueadiariosealimentaysecorrigeporsuspropiosusuarios.

3.13THEPIRATEBAY(2003)

En2003,naceenSueciaelportaldebúsquedadetorrentsThePirateBay.

3.14LINKEDIN(2003)

En2003,selanzalaredsocialdecontactosprofesionalesLinkedIn.

3.15WORDPRESS(2003)

En2003,selanzalaplataformadegestióndeblogsWordPress.

3.16GMAIL(2004)

En2004,naceGMailelcorreoelectrónicogratuitodeGoogle.

3.17FACEBOOK(2004)

En2004,MarkZuckerberg,estudiantedelaUniversidaddeHarvard,creaFacebook,unadelasredessocialesmásconocidas.

3.18YOUTUBE(2005)

En2005,conelaugedelabandaancha,elvídeoenlíneadejadeserunautopíayvelaluzelfamosoportaldeYoutube.

3.19TWITTER(2006)

En2006,JackDorseylanzalafamosaredsocialdemicrobloggingTwitter.

3.20HOYEn2009,Internetsuperalos180millonesdesitiosweb.En2012,Facebooksuperalos1000millonesdeusuarios,yestátraducidoa70idiomas.En2013,LinkedInsuperalos225millonesdeusuariosenmás200paísesyterritorios.En2013,Twittersuperalos280millonesdeusuariosactivos,ylos480millonesdeperfiles.En2013,sesuperanlos1000millonesdedispositivosAndroidenelmundo.

4ARQUITECTURAWEB

4.1CLIENTE-SERVIDORLaarquitecturawebesunaarquitecturacliente-servidorformadaporlossiguienteselementos:Unnavegador:Hacedeclienteyrealizapeticionessolicitandorecursosalosservidoresweb.Unservidorweb:Recibepeticionesdeclientesyrespondeaesaspeticionesenviadounrecursoonotificandounerror.Elprotocolohttp:EselprotocolobasadoenTCP/IPqueseutilizaparaqueelnavegadorrealicelaspeticionesalservidorwebyesteresponda.

4.2PÁGINASESTÁTICASEnloscomienzosdelaweb,todoslossitiosweberanconjuntosdepáginaswebenformadeficherosHTML.Lossitiosweberancomolibrosperoconnavegaciónmedianteenlacesenvezdenavegaciónsecuencial.Laedicióndesitioswebserealizabaconherramientassimilaresalaedicióndedocumentos(p.e.MicrosoftFrontPage)Aestaspáginasselasdenominabapáginaswebestáticas.

4.3PÁGINASDINÁMICASPocoapocolaspáginasempezaronasermásdinámicas.EnvezdeserficherosHTMLeneldisco,empezabanaserpequeñosprogramasqueseejecutabancadavezqueunusuariopedíaunapágina.Inicialmenteerancambiosmínimos(contadordevisitas,fechaactual,cambiarlaimagendecabecera,...)conlenguajesdescriptcomoPERLyPHP.

4.4APLICACIONESWEBLoscambiosseríancadavezmásprofundosylaspáginaswebseconvertiríanencompletasaplicacionesweb.UnaaplicaciónwebesaquellaquelosusuariosutilizanaccediendoaunservidorwebatravésdeInternetmedianteunnavegador.TienenlaventajadeserindependientesdelSistemaOperativo,ydequesonfácilesdeactualizarymantener.

5ENTORNODEEJECUCIÓNENSERVIDOR

5.1SERVIDORESWEBESTÁTICOSAlprincipio,laformadetrabajarconlosserivoderesweberadelasiguienteforma:Primero,elnavegadorhaceunapeticiónalservidormediantehttp.Seguidamente,elservidortransformalaURLenunarutaelsistemadearchivosydevuelveelarchivoalnavegador.

Enestecaso,paraunamismaURLelservidorsiemprevaadevolverelmismorecurso,siendonormalmenteestosrecursosficherosHTML,CSS,JavaScript,imágenes...

5.2SERVIDORESWEBDINÁMICOS(I)Perohoyendía,lamayoríadelosservidoreswebpermitenqueencadapeticiónseejecuteunprogramaquegeneradinámicamenteelrecursoqueseenvíaalusuario(server-sidescripting).AhoraparaunamismaURLelservidorpuededevolverunrecursodistinto.Aestecontenidogenerado"alvuelo"seledenominacontenidodinámico,encontraposiciónalcontenidoestáticoobtenidodelsistemadearchivos.

5.3SERVIDORESWEBDINÁMICOS(II)Esbastantehabitualqueelcontenidodinámicosegenereconlainformacióndeunabasededatos.Losservidoreswebconcontenidodinámiconosóloenvíanrecursosalnavegador,tambiénpuedenprocesarinformaciónquelesllegadelmismo:Datoscontenidosenformulariosweb.Ficherosenviadosdesdeelnavegador.Informacióncodificadaenlosenlacesquepulsanlosusuarios.

Estafuncionalidadpermiteeldesarrollodecompletasaplicacionesweb.

5.4HISTORIADELOSSERVIDORESWEBLosprincipalesservidoreswebsonohansido:CERNhttpd(1990)Apache(1995)IIS(1995)NginX(2004)

5.5CERNHTTPD(1990)CreadoporTimBerners-Leeyotros,fuéelprimerservidorweb.AlprincipiosólocorríaenordenadoresNeXTSTEP,peromásadelantefueportadoaotrossistemas.Enagostode1991,TimBerners-LeeanuncióladisponibilidaddelcódigofuenteydelsoftwareWorldWideWebdesdeelsitioFTPCERN.EldesarrollodelCERNhttpdfueadquiridoporW3Cylaúltimaversiónes1996,yhoyestátotalmenteendesuso.

5.6APACHE(1995)

Lanzadoen1995ydesarrolladoporlaApacheSoftwareFundation,hoyendíaeselservidormáspopular(Enerode2014con42%cuota)EsunservidorwebmultiplataformayconunalicenciadeSoftwareLibre(ApacheLicense)SunombrecompletoesApacheHTTPServerProject.

5.7IIS(1995)

Lanzadotambiénen1995ydesarrolladoporMicrosoft,hoyendíaeselsegundoservidormásusado(Enerode2014con30%cuota)EstáintegradoenWindowsServer,ysecompaginabienconlabasededatosMSSQLServer.SunombrecompletoesMicrosoftInternetInformationServices.

5.8NGINX(2004)

Lanzadoen2004ydesarrolladoporelrusoIgorSysoev,hoyendíaeseltercerservidormásusadoa(Enerode2014con14%cuota)EsunservidormultiplataformayconunalicenciadeSoftwareLibre(tipoBSD)Esmuyrápidoysesueleusarcomobalanceadordecarga.

5.9CUOTASERVIDORESWEB

http://news.netcraft.com

6TECNOLOGÍASDESERVIDOR

6.1INTRODUCCIÓNLosestándaressonmuyimportantesenlosnavegadoresweb(HTML,CSS,JavaScript)porquelawebtienequesercompatibleconcualquierdispositivo.Encambiolosestándaresnosontannecesariosenelservidor,ycadaorganizacióndesarrollasuservidorconlatecnologíadesuelección.

6.2CUOTASTECNOLOGÍAS

http://w3techs.comExistenmultituddetecnologíasdeconstruccióndeaplicacioneswebenelservidor,siendolasmásusadas:PHP,ASP.NET,JavaEE.

6.3OTRASTECNOLOGÍAS

Existenotrosmenosusadas,peroconungrancrecimientodepupularidad:RubyonRails,Grails(Groovy),Django(Python),Node(JavaScript),etc.

6.4PHP(I)

PHP(acrónimorecursivoquesignificaPHPHypertextPre-processor)esunlenguajedeprogramaciónoriginalmentediseñadoparaeldesarrollowebdecontenidodinámico.FueunodelosprimerosenpermitircombinarseconelHTMLdelpropiodocumento.

6.5PHP(II)FuecreadooriginalmenteporRasmusLerdorfen1994yactualmenteellenguajesiguesiendodesarrolladoconunalicencialibre(PHPlicense)porlacomunidadenPHPGroup,puesnoexisteunorganismodeestandarización.Puedeserusadoenlamayoríadelosservidoreswebyencasitodoslossistemasoperativossinningúncosto.

6.6PHP(III)EjemploscomoFacebookoWordpresssonsindudaunamuestraimportantedelapopularidaddePHP.

6.7PHP(IV)Eslatecnologíadeprogramacióndelladodelservidormásusadaenelpasadoyenelpresente.SeintegranormalmenteconApacheyMySQLenentornosLinuxenunpaquetellamadoLAMP

6.8PHP(V)ExistenmultituddeframeworksparaeldesarrollodeaplicacionesPHP:CakePHP,CodeIgniter,Symfony,YiiZend,etc.

6.9ASP.NET(I)

ASP.NETesunframeworkparaaplicacioneswebdesarrolladoporMicrosoftyusadoparaconstruirpáginaswebdinámicas.EssucesoradelatecnologíaActiveServerPages(ASP),tieneunalicenciapropietariayestápensadaparaserusadaenplataformasWindows.EstápensadaparaserprogramadoenellenguajeC#,aunquepermitecualquierlenguajedelaplataforma.NET.

6.10ASP.NET(II)LamayoríadelaslibreríasparaASP.NETsonlasoficialesproporcionadasporMicrosoft:(I)WebPages:permitecombinarHTMLconcódigoASP(similaraJSPyPHP)WebForms:permiteconstruiraplicacioneswebbasadasencomponentes(similaraJSF)MVCFramework:permitedesarrollaraplicacioneswebusandoelpatrónmodelo-vista-controlador

6.11ASP.NET(III)LamayoríadelaslibreríasparaASP.NETsonlasoficialesproporcionadasporMicrosoft:(II)AJAX:permitelaactualizacióndedatossinlarecargacompletadeunapáginaweb.EntityFramework:permitemapearobjetosalparadigmarelacional(similaraJPA)DynamicData:permitecrearaplicacionesweborientadasadatos(similaraRubyonRails)

6.12JAVAEE(I)

Javaesunlenguajedeprogramacióndepropósitogeneral,concurrente,orientadoaobjetosybasadoenclasescreadoporJamesGoslingdeSunMicrosystemsypublicadoen1995.SuscomponentessongeneralmentecompiladasabytecodeparaquepuedanejecutarseencualquiermáquinavirtualJava(JVM)sinimportarlaarquitecturadelacomputadorasubyacente.

6.13JAVAEE(II)JavajuntoconCesellenguajemáspopularenelíndiceTIOBE.

http://www.tiobe.com/

6.14JAVAEE(III)JavaEEeslaediciónempresarialdelaplataformaJava(lenguaje+JVM+bibliotecas),yestádesarrolladaporunacoalicióndeempresaslideradasporOracle,IBM,RedHat,etc.Esunatecnologíamuyusadaanivelempresarial,ybastanteestandarizadapuestieneunaorganizacióndeestandarizaciónpropiallamadaJavaCommunityProcess(JCP)quedefinelosestándaresdelaplataforma.

6.15JAVAEE(IV)

6.16JAVAEE(V)EstándaresmásimportantesenJavaEE:(I)Servlets:permiteejecutardecódigoJavaanteunapeticiónwebenunservidorJavaEE.Applets:permiteejecutardecódigoJavadentrodeunnavegadorweb.JSP(JavaServerPages):permitecombinarHTMLconcódigoJavaparagenerarpáginaswebdinámicas.JDBC(JavaDatabaseConectivity):permitelaconexiónabasesdedatosrelacionalesdesdeJava.

6.17JAVAEE(VI)EstándaresmásimportantesenJavaEE:(II)JPA(JavaPersistenceAPI):permitemapearobjetosalparadigmarelacional(ORM,ObjectRelationalMapping)JSF(JavaServerFaces):permiteconstruiraplicacioneswebbasadasencomponentesreutilizables.JMS(JavaMessegeService):permitelacreaciónygestióndecolasdemensajesentreaplicaciones.

6.18JAVAEE(VII)TodaaplicaciónwebJavaEEtienequeejecutarseenunaservidordeaplicacionesJavaEE(aunqueluegoseintegreenApache,NginXoIIS)Existenmuchostiposdeservidores,dependiendodesusfuncionalidades/rendimientoydesulicencia/coste.

6.19JAVAEE(VIII)ParadesarrollaraplicacionesJavaEEseutilizanIDEsyplugins:Eclipse:Fundación.Muchadiversidad,faltadeintegración.Softwarelibre.Netbeans:Oracle.Muyintegrado.Softwarelibre.IntelliJ:Jetbrains.Muyintegrado.Propietario.

6.20BASESDEDATOSLasbasesdedatostienenunpapelmuyimportanteeneldesarrollodeaplicacionesweb.Lasmáspopulareshansidolasbasesdedatosrelacionales,perocadavezmásseusanlasbasesdedatosNoSQL.

6.21BBDDRELACIONALES

Sonlasbasesdedatosmáspopulareseneldesarrollodeaplicaciones.Enelladodelsoftwarelibrelasmásusadasson:PostgreSQLyMySQL,Yenladodelsoftwareprivativolasmásusadasson:OracleyMicrosoftSQLServer.

6.22BBDDNOSQL

Comolasaplicacioneswebtienenmuchasnecesidadesdeescalabilidadytoleranciaafallos,hayunanuevafamiliadebasesdedatosquesedenominangenéricamenteNoSQL,quesepuedeinterpretarcomo:'NoSQL'ocomo'NotOnlySQL'

6.23TEOREMACAP(I)ElteoremaCAPoteoremaBrewer,dicequeensistemasdistribuidosesimposiblegarantizaralavez:consistencia,disponibilidadytoleranciaaparticiones.

6.24TEOREMACAP(II)

6.25TEOREMACAP(III)Definiciones:Consistencia:alrealizarunaconsultaoinserciónsiempresetienequerecibirlamismainformación,conindependenciadelnodooservidorqueproceselapetición.Disponibilidad:quetodoslosclientespuedanleeryescribir,aunquesehayacaídounodelosnodos.Toleranciaafallos:implicaqueelsistematienequeseguirfuncionandoaunqueexistanfallosocaídasparcialesquedividanelsistema.

6.26TEOREMACAP(IV)Segúnlascondicionesquecumplan:AP:garantizandisponibilidadytoleranciaafallos,peronolaconsistencia.Algunasconsiguenunaconsistenciaparcialatravésdelareplicaciónylaverificación.CP:garantizanconsistenciaytoleranciaafallos.Paralograrlaconsistenciaatravésdelosnodos,sacrificanladisponibilidad.CA:garantizanconsistenciaydisponibilidad,perotienenproblemasconlatoleranciaafallos.Esteproblemalosuelengestionarreplicandolosdatos.

6.27TIPOSDEBDNOSQLExisten4tiposdebasesdedatosNoSQL:OrientadasadocumentosOrientadasacolumnasDeclavevalorEngrafo

6.28ORIENTADASADOCUMENTOSGestionandatossemiestructuradosalmacenadosenalgúnformatoestándarcomoXMLoJSON.Sonlasmásversátilesysepuedenutilizarenmuchosproyectos,inclusoaquellosquetradicionalmentefuncionaríansobrebasesdedatosrelacionales.Enestacategoríaencontramos:MongoDB:probablementelamásfamosadelmomento.AlgunascompañíaslautilizansonFoursquareoeBay.CouchDB:esdeApacheysusdatossonaccesiblesvíaunaAPIREST.EsutilizadaporcompañíascomoCreditSuisseylaBBC.

6.29ORIENTADASACOLUMNASEstánpensadaspararealizarconsultasyagregacionessobregrandescantidadesdedatos.Funcionandeformaparecidaalasbasesdedatosrelacionales,peroalmacenandocolumnasdedatosenlugarderegistros.Enestacategoríaencontramos:Cassandra:incluidaenestasección,aunqueenrealidadsigueunmodelohíbridoentreorientadaacolumnasyclave-valor.EsutilizadaporFacebookyTwitter.HBase:EscritaenJavaymantenidaporelProjectoHadoopdeApache,seutilizaparaprocesargrandescantidadesdedatos.LautilizanFacebook,TwitteroYahoo.

6.30DECLAVEVALORSonlasmássencillasdeentender.Simplementeguardantuplasquecontienenunaclaveysuvalor.Cuándosequiererecuperarundato,simplementesebuscaporsuclaveyserecuperaelvalor.Enestacategoríaencontramos:DynamoDB:desarrolladaporAmazon,esunaopcióndealmacenajequepodemosusardesdelosAmazonWebServices.LautilizanelWashingtonPostyScopely.Redis:desarrolladaenCydecódigoabierto,esutilizadaporCraiglistyStackOverflow(amododecaché).

6.31ENGRAFOBasadasenlateoríadegrafosutilizannodosyaristaspararepresentarlosdatosalmacenados.Sonmuyútilesparaguardarinformaciónenmodelosconmuchasrelaciones,comoredesyconexionessociales.Enestacategoríaencontramos:InfiniteGraph:escritaenJavayC++porlacompañíaObjectivity.Tienedosmodelosdelicenciamiento:unogratuitoyotrodepago.Neo4j:basededatosdecódigoabierto,escritaenJavaporlacompañíaNeoTechnology.UtilizadaporcompañíascomoHP,InfojobsoCisco.

7ENTORNODEEJECUCIÓNENCLIENTE

7.1PÁGINASWEBESTÁTICASSonpáginasenlasqueelnavegadorrenderizaelHTMLconestilosCSSeimágenesperosinJavaScript.Enestaspáginas,cadavezqueelusuariohaceclicenunenlace,elnavegadorrecargaporcompletolapáginaweb.Lasprimeraspáginasweberanasí,yhoytodavíasesiguenutilizandobastante:enpáginaspersonales,en'landingspages',en'homepages',enpáginasdedocumentación,etc.

7.2PÁGINASWEBDINÁMICASElclienteesdinámicoporquelaspáginasincluyencódigoJavaScriptqueseejecutaenelnavegador.DependiendodecómoseuseelJavaScriptenelcliente,lasaplicacionessepuedendividirentrestipos:JavaScriptparaefectosgráficos.JavaScriptconpeticionesensegundoplano(AJAX)SinglePageApplication.

7.3JAVASCRIPTPARAEFECTOSGRÁFICOSJavaScriptsediseñó,entreotrascosas,paraañadirefectosgráficosbásicosalaspáginascuandoelCSSeramuylimitado.LagranmayoríadelasaplicacioneswebqueexistenenInternetutilizanJavaScriptalmenosconestepropósito.

7.4JAVASCRIPTPETICIONESENSEGUNDOPLANO

JavaScriptseusatambiénparanotenerquerecargarlapáginacompleta,realizandopeticionesensegundoplanoqueactualizansóloaquellaspartesdelapáginanecesarias.AestatécnicaselaconocecomoAJAX(AsynchronousJavaScriptAndXML),ylagranmayoríadelasaplicacionesdehoyendíalousanparamejorarlaexperienciadelusuario.

7.5SINGLEPAGEAPPLICATIONEnestecaso,laaplicaciónwebesunconjuntoderecursosHTMLyCSSestáticosquesecarganenelnavegador,yelcontenidodinámicosecargaensegundoplanoconJavaScript.UnaSPAesunaúnicapáginacuyocontenidovacambiandosegúnelusuariointeractúaconbotones,pestañas,etc.

7.6HISTORIADELOSCLIENTESWEBLosprincipalesclienteswebsonohansido:Mosaic(1993)NetscapeNavigator(1994)InternetExplorer(1995)Opera(1996)MozillaFirefox(2002)iPhone(2007)Android(2008)GoogleChrome(2008)FirefoxOS(2013)

7.7MOSAIC(1993)

En1993,salióalaluzMosaicelprimernavegadorquepermitíavergráficamentelosdocumentosescritosenHTMLyseguirlosenlacesentredistintossitiosweb.

7.8NETSCAPENAVIGATOR(1994)

En1994,nacióNetscapeNavigator,comoevolucióndeMosaic.

7.9INTERNETEXPLORER(1995)

En1995,MicrosoftlanzaelnavegadorInternetExplorer.Llegóatenerunacuotadel70%,perohoyendía,aunqueeselsegundonavegadormásusado,estáendeclivedesobretodoporelimpulsodeGoogleChrome.

7.10OPERA(1996)

En1996,nacióOperaunnavegadorquenuncahatenidounagrancuotademercado.

7.11SAFARI(2003)

En2003,ApplelanzaSafari,unnavegadorbasadoenWebKit(libre).Hoyendíaeselcuartonavegadormásusado.

7.12MOZILLAFIREFOX(2002)

En2002,naceelelnavegadorlibreMozillaFirefox.Hoyendíaeseltercernavegadormásusado.

7.13IPHONE(2007)

En2007,SteveJobs,cofundadordeAppel,lanzaeliPhone.

7.14ANDROID(2008)

En2008,sevendeelprimersmartphoneconelsistemaoperativoAndroid.

7.15GOOGLECHROME(2008)

En2008,elgiganteGooglelanzaalmercardosupropionavegador:elGoogleChrome.Hoyendíaeselnavegadormásutilizadoconmásdeun40%decuota.

7.16FIREFOXOS(2013)

En2013,lafundaciónMozillalanzaelsistemaoperativoFirefoxOS.

7.17CUOTANAVEGADORES

http://gs.statcounter.com/

8TECNOLOGÍASDECLIENTE

8.1INTRODUCCIÓNElclientewebporexcelenciaeselnavegadorweb,aunqueahoraexistenotrosclientescomopuedenserlasaplicacionesnativasdelosdispositivosmóviles,ahorabienlatendenciaesladeutilizarlosestándareswebendichasaplicaciones.Aunquelatendenciaesusarcadavezmástecnologíasestándares,aúnseusanotrastecnologíasnoestándar.

8.2ESTÁNDARESWEB

ElW3C(WorldWideWebConsortium)esunacomunidadinternacionalquedesarrollaestándaresabiertosqueaseguranelcrecimientodelaWebalargoplazo.HTML(HypertextMarkupLanguage)andCSS(CascadingStyleSheets)sondosdelastecnologíasprincipalesparalaconstruccióndepáginasweb.

8.3HTML(I)

HTMLproporcionalainformaciónestructuradaensecciones,párrafos,título,imágenes,etc.

8.4HTML(II)LaversiónactualesHTML5,queaunquetodavíanoestáfinalizada,lamayoríadelosnavegadoresimplementangranpartedelaespecificación.Hasupuestounarevoluciónenelclientepuesofrecemuchastecnologíasavanzadas:Multimedia:audio,vídeo,canvas,webgl,etc.Comunicaciones:websocketsConcurrencia:webworkersAlmacenamiento:storageOtros:geoposicionamiento,drag&drop,accesoalacámara,almicrófono,etc.

8.5CSS(I)

CSSproporcionaladistribucióndeloselementosysuestilo(colores,tiposdeletra,fondos,efectos...)

8.6CSS(II)CSSesunlenguajeusadoparadefinirlapresentacióndeundocumentoestructuradoescritoenHTML,XML,SVGoinclusointerfacesdeusuariodeotrastecnologías(JavaFX)SuversiónactualesCSS3,queaunquetodavíanoestáfinalizada,lamayoríadelosnavegadoresimplementangranpartedelaespecificación.

8.7PREPROCESADORES(I)Procesancódigoescritoenunlenguaje“A+”(HAML,Coffeescritp,SCSSoLESS)ygeneranarchivosescritosenotrolenguaje“A”(HTML,JavascriptyCSS,respectivamente).Loslenguajesfuentesonsimilaresalosqueproducen,peromássencillosdeescribir(ydeleerymantener).EnelcasodeCSSlospreprocesadoressuplenciertascarenciasquetieneelpropiolenguajecomopuedeser:variables,herencias,funciones,imports,...

8.8PREPROCESADORES(II)LospreprocesadoresCSSmásimportantesson:Sassyless.

8.9FRAMEWORKSCSS(I)FacilitanlatareadecrearsitiosResponsiveWebDesign(diseñoqueseadaptaalosdistintosclientes:móvil,tablet,ordenador)medianteelusodediseñoconrejillas,usodeclases,componentes,etc.

8.10FRAMEWORKSCSS(II)LosframeworksCSSmasimportantesson:ZurbFoundationyTwitterBootstrap.

8.11JAVASCRIPT(I)

ConJavaScriptsepuedemodificarlapáginayejecutarcódigocuandoseinteractúaconella(atravésdelmodelodeobjetosdeldocumentoDOM)

8.12JAVASCRIPT(II)AunquealgunoselementosdelasintaxisrecuerdenaJava,notienenadaqueverconJava,seeligióesenombreporrazonesdemarketing,puescuandosepublicóJavaestabaenauge.EsunlenguajedeprogramaciónbasadoenelestándarECMAScriptdeECMA(otraorganizacióndiferentealW3C)HayligerasdiferenciasenlaimplementacióndeJSdelosnavegadores,aunqueactualmentetodossonbastantecompatiblesentresí(enelpasadonofueasí)

8.13JAVASCRIPT(III)Inicialmenteeraunlenguajeinterpretado,peroactualmenteseejecutaconmáquinasvirtualesenlosnavegadores(velocidaddeejecuciónyeficienciadememoria)Características:Tipadodinámico(habitualenloslenguajesdescript)Funcionalyorientadoaobjetos(basadoenprototipos)

8.14LIBRERÍASJAVASCRIPT

ExistenmultituddelibreríasJavaScript,aunquelasmásutilizadasson:jQuery:aportafacilidaddeusoycompatibilidadentrenavegadores.Seusaparagestionarelinterfazypeticionesajax.underscore.js:permitetrabajarconunenfoquemásfuncionalypermitegestionarplantillasparagenerarHTML.

8.15FRAMEWORKSJAVASCRIPT

Ademásdelibrerías,tambiénexistenframeworksdealtonivelqueestructuranunaaplicacióndeformacompleta,siendolosmáspopulares:Angular.js,Backbone.jsyEmber.

8.16TECNOLOGÍASNOESTÁNDARENLAWEBLawebhaavanzadoyevolucionadograciasatecnologíasnoestándarincluidasenlosnavegadoresmedianteplugins.Algunasllegaronaconvertirseenestándares“defacto”,comoeselcasodeAdobeFlash.Lallegadadelosdispositivosmóviles,consolasytelevisionesconectadas(SmartTVs)ylaestandarizacióndeHTML5hanhechoqueestastecnologíasnoestándaresténendesuso.

8.17ADOBEFLASH(I)

Esunatecnologíausadaprincipalmenteparaincrustarcontenidomultimediainteractivoenpáginasweb.Durantemuchosañosfuelaúnicaformadetenerinteractividad,animaciones,vídeos,juegos...enlaweb.

8.18ADOBEFLASH(II)Esunatecnologíapropietariaycerrada,yaunqueesgratuitaparalosusuarios,noloesparalosdesarrolladoresyservidores.Hasidoacusadadedequenoeseficiente,noesabiertayportanto,noeselfuturodelaweb(Abril2010-SteveJobsporeliPhoneyiPad)AdobelohaacabadoreconociendoynoseguiráapostandoporFlashcomolaherramientabásicadelawebinteractiva(Nov2011)

8.19JAVAAPPLETS

LosappletsdeJavafueronlosprecursoresdeFlash,aunquehoyestánendesuso.

8.20MICROSOFTSILVERLIGHT

LaapuestadeMicrosoftparacompetirconFlash,aunquehoyestánendesuso.