Introduzione al corso di Tecnologie Web -A.A. 2017/18 · meccanismi di manipolazione delle...
35
Introduzione al corso di Tecnologie Web - A.A. 2017/18 Fabio Vitali Corsi di laurea in Informatica e Informatica per il Management Alma Mater – Università di Bologna
Transcript of Introduzione al corso di Tecnologie Web -A.A. 2017/18 · meccanismi di manipolazione delle...
Introduzione al corso di Tecnologie Web - A.A. 2017/18
Fabio VitaliCorsi di laurea in Informatica e Informatica per il ManagementAlma Mater – Università di Bologna
Introduzione
Oggiesaminiamoinbreve:– Informazionipratichesulcorso– Icontenutidelcorso– L’organizzazionedelprogetto– Latipologiad’esame
Docentedellelezioni
• FabioVitali
• Ricevimento:– Primaedopolalezione– Oppurepere-mail:[email protected]
Orariodellelezioni(1)
L'orariodellelezioniè:– Lunedì,13:00-16:00,AulaM1(Mineralogia)– Venerdì,15:00-18:00,AulaM1(Mineralogia)
Èuncorsoda56ore,24orediteoriae32dilaboratorio.Organizzatein6orelasettimana,suunarcodi12settimane
Piccolecuriositàmatematiche
12x6=72
72– 56=16
cioèfare56oreinunospaziodi72lascia16oredimargineQuestosignificacheabbiamounpo'dimarginepergestireimprevisti,malattieescioperivaricheinvariabilmenteaccadonodilunedìovenerdì.
Organizzazionedellelezioni
• Lezioniditeoria(inaula)
• Lezionidiesercitazione(inaulaconvostriportatili)– L'aulaNONHAABBASTANZAPRESEELETTRICHEPERTUTTI.
– Portatevidelleciabatteelettriche
SitoWebdelcorso(1)
Ilsito(anzi,ilwiki)http://vitali.web.cs.unibo.it/TechWeb18
conterrà:– LucidiPowerPointePDF– Annuncivari– Linkadocumentidisponibilisurete
Lelezioni
Organizzazionedellelezioni– Sulucidiimmediatamenteadisposizione– Autonomeecomplete(ognilezioneunargomentodiverso- circa)
– Enfasisulsignificatodelletecnologie,piuttostochesuglistrumenti
– Indicazionedellabibliografia• utilizzataperilucidi(testonormale)• suggeritaperchivolesseapprofondire(testocorsivo)• richiestaperl’esame(testocorsivoegrassetto)
Il w
eb d
ei d
ati
Il w
eb d
ei d
ocum
enti
Il w
eb d
ei p
rogr
amm
i
Le b
asi
Argomentidellelezioni
HTTPURI
Codificadeicaratteri
XML
CSSHTML
Markup
Server-sideNodeJsClient-sideJavascriptJS frameworkWeb ServiceREST
Linked DataOntologie
SPARQL
RDF
Com'èfattol’esame
• E’ necessariopartecipareadunprogettoperteamdurantel’anno.
• L’esameconsistein:– Valutazioneoraledelcontributopersonalealprogetto
• Sfruttaletecnologiespiegatenelcorso• Evidenziaiproblemidimashup tratecnologiediverse
– Compitoscrittodi5/6domande.– Oraleincasieccezionali
ValutazionedelleproveScrittieprogettivengonovalutatiintrentesimi.
– Loscrittopesal'80%delvotofinale– Ilprogettobasepesail30%delvotofinale– L'aggiuntadifunzionalitàfacoltativeportailpeso
finoal40%delvotofinale
Siam ilvotodelloscrittoen ilvotodelprogetto,siap ilpesodelprogetto(p∈ [0.3,0.4]),ilvotofinalesaràdatoda:
0.8*m +p*nAdesempio,prendendo27alloscrittoe28alprogettobaseilvotofinalesarà:
0.8*27+0.3*28=21.6+8.4=30
Ilprogettodel2018
• Quest'annocisaràunprogettoinduelivelli.• Livellostandard:dirapidaesecuzione,richiedepocaprogrammazioneepuòesseresvoltodaungruppoddue/trepersoneconunasettimanadilavoro
• Livelloavanzato:richiedeunpo'disforzo,èilpiùstimolanteintellettualmente,epuòesseresvoltoinduesettimanedaunteamditre/quattropersone.
Appellid'esame
• Unoainiziogiugnoperchivuolefarelevacanzelungheeperchièindebitodall'annoscorso
• Unoametàgiugno,incuimiaspettoMOLTIdivoi,unoainizioluglioeunoametàluglio(nellasettimanadelletesi).
• Unoasettembre(richiestadiateneo)• Unoagennaio2019eunoafebbraio2019
Organizzazionedeiteam• Ognipersonadecideinanticiposeèinteressataasostenere
l'esameinestate,autunno,sessionestraordinariaoindeciso.• Tuttiglistudentisidividonointeamdi2persone(progetto
standard)oppure3-4persone(progettoavanzato).Nonsonoaccettatigruppidipiùdi4persone.Nonsonoaccettatiprogettisingolitranneeccezioniestremeebengiustificate.
• Ogniteamportailprogettoinsieme(noncisonoeccezioni!).Ilteamdichiarainanticipolanaturadelcontributodiciascunmembrooppureaccettachechiunquesiainterrogato(eneldettaglio!)sututtoilprogetto.
• Appositestrutturedati(sulwikidelcorso)vengonotenuteaggiornateconilnumero,nomeecomponentidiogniteam,eperiodoprevistodiesame.
• Iononsonocoinvoltonell'organizzazionedeiteam.
PallinideldocenteIngenerale– HTMLbisognasaperloebasta(Nota:nonverràspiegatoneldettagliocheverràrichiesto)
– C’èenfasisulwebcomeproduttoredicontenutiesull’approcciodichiarativo.
– Ilcontentmodelmistoèutile– Giustocompromessotracompetenzapraticaestudioteorico– Ilprogettonon forniscetuttelecompetenzeperpassarel’esame.Neiprogetti– Ilriuso(dicodice,principi,approcci,architetture)èimportante– L'interoperabilitàèimportante– Iportapizzenonsonotollerati– Glismanettonisonopremiatisolosehannoanchestudiato
Leparolechiavedelcorso
• Interoperabilità• Standard• Mashup• Dichiaratività• Semanticità
Standardeinteroperabilità• Laprimainformaticaeracontentadiunun’applicazioneche
funzionasseebasta.• Coniltemposisonointrodotticoncettidiqualità
dell’implementazione:efficienzanell’usodellerisorse,complessitàcomputazionale,gestibilitàneltempodelcodicesorgente,usabilità,utilizzoappropriatodellelibrerie,ecc.
• Anoiinteressal’interoperabilità,unnuovoaspettodellaprogettazione:nonsolocheilprogrammafunzioniechefunzionibene(perinterpretazionispecifichedi“bene”),machefunzioniconaltriprogrammidellostessotipo.
• Laidentificazionedeistandardappropriati,lacorrettaimplementazionedeglistessi,l’identificazionedisemprenuoveepiùpreciseareediinteroperabilitàsonoconcettifondamentaliperquestocorso
Mashup
• Larealizzazionedisiti,applicazioni,serviziWebrichiedelapadronanzadiunaltonumerodiconcetti,linguaggi,protocolli,ciascunodeiqualièspessosemplice,espressivo,potente.
• Ladifficoltàinquestocasoètrovareilmodopercombinareecongiungerequesticoncettiecc.inunacostruzioneampiaecomplessa,cheforniscaserviziancorapiùsofisticatidiquellideicomponentibase.
• Questoèquellocheintendiamopermashup
Dichiaratività• Laprogettazioneimperativaoproceduraleprevedelaesplicitasomministrazionediistruzioniadunamacchinaubbidienteecieca.– Questoportaconséinevitabilmenterischieproblemi(sintattici,semantici,ecc.)
– Unerroreproceduraleinterrompel’esecuzione.
• Laprogettazionedichiarativadescrivestatiinizialiefinalidiunmondoastratto– Unmeccanismoesistentegeneralacomputazionechepermettelatransizionedallostatoinizialealfinale
– Unerroredichiarativoportaadunostatofinalenondesiderato,nonadun’interruzione.
Semanticità
• Ilwebnonèpiù(nonèmaistato)ilmondodellavisualizzazionepuraesemplicediinformazionitestualio,peggio,strutturate.
• Leinformazionisignificano,eattivanoruoli,funzioni,processirilevantiedipendentidallaloronaturaedallorocontenuto.
• Un'applicazionesemanticafamoltodipiùchevisualizzare:collega,attiva,rendeeseguibilileinformazioniinmanierariccaecomplessa.
Ilprogetto
• UnsistemaVERO,chefunzionaefacoseutili• Realizzabilesiainlaboratoriocheacasa.• Enfasiinpartesullaprogrammazione(approccioprocedurale)masoprattuttosuidocumentiattivi(approcciodichiarativo)
• Enfasisulmashupditecnologieesistentiesofisticate
AlphaTube - UnsistemadiraccomandazioniperYouTube
Losviluppatoresoftwareneglianni'10
• Losvilupposw piùsorprendenteedevidentedegliultimiannièlanascitadiinnumerevolistrumentiperilprogrammatore,concuirealizzareservizisofisticati
• Framework:invecedisceglierenuovilinguaggidiprogrammazione,siusanooralibreriepergliscopipiùdisparati,facilmenteintegrabiliemescolabilitraloro
• API(ApplicationProgrammingInterfaces):invecedisviluppareapplicazionimonolitichechesvolgonoservizicomplessiinun'unicamaniera,sifornisconomeccanismidimanipolazionedellestrutturedatifondamentalieaccessoaglialgoritmipiùsofisticatiperapplicazionisviluppatedaiclienti.
• Questopermetteincredibilesofisticazione,grandecomponibilità,erapiditàdisviluppoprecedentementeirraggiungibili.
LeAPI
• LeAPIcheciinteressanosonoquellechevannosottoilnomediRESTful API,ovverochesfruttanoalmegliolanaturadiHTTPedegliURI(iprotocollipiùimportantidelweb)perfornireiloroservizi.
• UnaAPIRESTful fornisce:– UnURIbaseacuiaccedereperottenereiservizi– UnasintassidegliURIdelleentitàinterrogabiliemodificabili– Unmediatype attraversocuiottenereeforniredatidautilizzareneiservizi
forniti(adesempioXML,JSON,etc.)– Unasemanticaassociataall'usodeivariverbiHTTP(GET,PUT,POST,DELETE)
attraversoiqualiattivareeeseguireiserviziofferti.
• Ladocumentazionediun'APItipicamentedescriveneldettaglionomi(URI),verbi(comandiHTTP)eformati(InternetMediaType)perogniserviziofornito.
AlphaTube
AlphaTubeèunprogettoperlarealizzazionediunambientecomplessoincuiaccederemescolandodatidiservizidiversi:
Allabasec'èilVisualizer,chepermettedivisualizzareinmanierainteressantevideo(ades.musicali)edatirecuperatidaWikipediasuartista,canzone,albumvisualizzato.Inaggiuntac'èilRecommender,chemostraalcunivideo"collegati"aquelloinvisualizzazioneepermettedicreareunplaylist deiprossimivideo.IlRecommender suggerisceivideosullabasediunalgoritmodicomplessitàcrescente,basatoinizialmentesolosuomogeneitàdiartista,album,titolo.IlRecommender avanzatoutilizzamodellicomplessidicrowdsourcing,semantic webesocialnetworkpercreareunsistemadisuggerimentipiùsoddisfacenteepersonalizzato.
Intuttiicasi,loscopoèstudiarealcuneAPIdiservizidisponibilionlineecreareun'applicazionewebcheaccedaaquestidatiinmanieradinamica,conunarappresentazionevisivainunapaginaweb.
Illavoroditeam
• Tuttiimembrideiteamsonotenutialavorareelavorareinsieme.
• E'meglioessereparteattivadiunprogettomediocrechepassivadiunprogettomeraviglioso.
• Nonsarannotolleratiiportatoridipizze• Miriservoall'esamediscoprireilcontributoindividualediciascuno,indipendentementedallabontàdelprogettoconsegnato.
Attenzioneaglianti-pattern
• Durantelafasedianalisidelprogetto,saràmiacuraverificarechenonsianostatefattesciocchezzeimplementative,inparticolareanti-pattern(http://en.wikipedia.org/wiki/Anti-pattern).
• Alcunianti-patterndaevitareassolutamente:– CargoCultprogramming– Coding byexception– CopyandPasteprogramming– HardCode– MagicNumbers andStrings– Reinventing thewheel
Unanti-patterninpiù
Nonesistequestopatterntraquellinotiinletteratura,madovrebbeesistere.Iolochiamo
Giocareapokerconquattrocarte• Quattrocartebastanoperfarepoker.Quindiinteoriaioposso
lasciareunadellecinquecartesultavoloeprovareafarepokersoloconleprimequattro.
• Questopatternlosivedetraglistudentiquandoprovanoarealizzareilprogettoconforzabrutasenzaimmaginarsicheesisteunlinguaggio,unprotocollo,unAPIchecopreesattamentequelruolosenzabisognodireinventarselo.
• L'esempiodiJQuery
Quandodarel'esame• Ognunodevedeciderealpiùprestoinqualesessionedarloe
seriamenteimpegnarsipermantenerequestadecisione.• Idealmente:
– Estate 75-100%,– Autunno 20-0%,– Inverno 5-0%,– Indecisi 0 %.
• Quattroappelliagiugno/luglio,unoasettembre,dueagennaio/febbraio.
• Chipresentailprogettoentrofebbraio2017,anchesenonriesceadareloscritto,nondeverifareilprogettomasolostudiareilnuovoprogramma.
• Chinonriesceaportareilprogettoperfebbraio2017deveprepararsiconilnuovoprogrammaerealizzareilnuovoprogetto
Suggerimentiperl'esame
• Veniteallapresentazioneconilprogettochefunziona.Senonvaiovifacciotornare.Perquestopreferisco– vederviunasettimanadopol'appelloconilprogettochefunziona
• piuttostoche– perderetempoconlapresentazionediunprogettochenonva,– mandarviviainlacrime,e– vederviunasettimanadopol'appelloconilprogettochefunziona
• Venitealloscrittoavendolopreparato.Nonc'ènientedipiùirritantedivedereragazzisvegliecompetenti(visiriconosce)cheprendono8o10alloscrittoperchécihannosoloprovato.
• Loscrittononèdifficileperchihastudiato,èimpossibileperchinonl'hafatto.
Flessibilitàdelcorso
• Provascrittaeprovadiprogettosonoindipendenti.– Ilprogettoèsempredigruppo– Loscrittoèsempreindividuale
• Poteteprovareloscrittotuttelevoltechevolete– Ilvotoprecedenteverràcancellatosoloseconsegnateunnuovoscritto– Gliscrittisonosoloalledatedegliappelliufficiali
• Potetepresentareilprogettotuttelevoltechevolete– SoloselodecideconsensualmenteTUTTOILGRUPPO– Poteteritirarvidallapresentazionedelprogettoinqualunquemomento
etornareunasettimanaoduedopoconlecorrezionicheriteneteopportune.
Rigiditàdelcorso(nessunaeccezionepernessunmotivo)
• Ilprogettodevefunzionare.Completamenteedesattamente.• Ilprogettodeverisiederesuunamacchinadeldipartimento.• SevoleteinstallarelibrerieeSWspecialiperilprogetto,
verificateprimachequestosiapossibilesullemacchineesuisistemioperativioffertidaldipartimento
• IlprogettodevevenirepresentatodatuttoilgruppoinsiemeInviaeccezionaleèaccettabilecheunapersonasiacollegataviaskype.Innessuncasoèaccettabilechesipresentiinunadataunapartedelgruppoeinunadatadiversaglialtri.
• Nonusatetecnologiecherichiedanocompilazionioprocedurecomplessediaggiornamentodelcodiceeseguito.Deveesserepossibileaprireunfilesulserveremodificarloalvolodurantelaprova.
Conclusioni
• IlcorsodiTWvuolecoprirealcuniaspettifondamentalidelletecnologieedeglistandardconnessiconilWorldWideWeb.
• Ilprogettovuoledareun’ideadellavorod’équipeedelfunzionamentodeiteamdistandard,oltreafarprovareconmanol'applicazionedeglistandardstessi.
www.unibo.it
Fabio Vitali
Dipartimento di Informatica – Scienze e IngegneriaAlma mater – Università di Bologna
