| Desenv. front-end avançat | Codi: M4.256 Crèdits: 6 |
L'assignatura en la que ens trobem, Desenvolupament front-end avançat, és una continuació de l'assignatura Desenvolupament front-end amb frameworks JavaScript del Màster universitari de Desenvolupament de Llocs i Aplicacions Web.
Si bé en aquesta assignatura prèvia es van treballar les bases del desenvolupament a nivell de front-end amb el framework Angular, treballant conceptes com el llenguatge de programació TypeScript, l'estàndard de programació ECMAScript 6, i aspectes més propis del framework Angular com ara treballar amb formularis, serveis i rutes, en aquesta assignatura en la que ens trobem, aprofundirem alguns d'aquests conceptes i en presentarem diversos de nous.
En una part inicial, treballarem amb els formularis reactius, i d'aquesta manera tindrem les eines necessàries per tal que l'usuari pugui inserir dades a l'aplicació i tingui una resposta adient. L'objectiu serà que la interacció de l'usuari amb la nostra aplicació sigui fluïda i el més fàcil possible.
Posteriorment, en un segon bloc força extens, estudiarem la programació reactiva i introduirem un patró de disseny molt interessant anomenat Redux que ens permetrà gestionar les dades de l'aplicació d'una manera eficient i des d'un punt de vista d'estats. Si bé és un patró de disseny que afegeix complexitat a la nostra implementació i està més pensat per a plataformes de certa complexitat, nosaltres aplicarem aquest patró a l'aplicació que anirem desenvolupant durant el curs per assolir el coneixements necessaris i entendre el seu funcionament.
Finalment, tindrem diversos blocs més concentrats on treballarem des de temes de maquetació, testos i desplegaments, com temes de refactoring. També treballarem un concepte molt important i molt present actualment que és com transformar una aplicació web a una PWA ( Progressive Web App ). Aprofundirem amb aquesta tecnologia al seu moment.
A nivell general, podem dir que aquesta assignatura conté un temari força extens i complex però un cop estudiat, ens permetrà tindre un coneixement complet de tot el que implica el desenvolupament de la part de front-end, tot utilitzant el framework Angular.
Hem de pensar que a dia d'avui, el mercat laboral té molta demanda de desenvolupadors tant de front-end com de back-end, i en el nostre cas, dintre del desenvolupament front-end el framewok Angular està molt demandat. A més, Angular al ser un framework tant complet, ens permetria en un moment donat, si tinguéssim que utilitzar algun altre framework com ara React o Vue, que el procés d'aprenentatge d'aquests altres frameworks fos relativament senzill.
En el màster de Desenvolupament de Llocs i Aplicacions Web, aquesta assignatura ha de cursar-se després d'haver realitzat l'assignatura Desenvolupament front-end amb frameworks Javascript, ja que es tracta de la seva continuació. Així doncs, amb Desenvolupament front-end avançat es culmina l'itinerari iniciat amb Programació en JavaScript per a programadors i Desenvolupament front-end amb frameworks JavaScript.
Aquesta assignatura forma a professionals en el desenvolupament web del costat client o front-end.
Per fer aquesta assignatura és imprescindible tenir coneixements d'Angular i, més concretament, haver superart l'assignatura Desenvolupament front-end amb frameworks Javascript.
És imprescindible haver superat l'assignatura Desenvolupament front-end amb frameworks Javascript.
L'objectiu principal d'aquesta assignatura és dotar als estudiants de les competències bàsiques necessàries per tal que puguin implementar el cicle complert d'un desenvolupament d'una web app amb el framework Angular, des de l'inici fins al final, és a dir, des de l'anàlisi, la implementació, les proves i el desplegament.
Això implica que l'estudiant assolirà les capacitats següents:
- Capacitat per implementar formularis reactius que permetin una interacció fluïda de l'usuari amb l'aplicació.
- Capacitat per implementar i aplicar la programació reactiva.
- Capacitat per dotar d'un aspecte visual professional la nostra aplicació web.
- Capacitat per assegurar la qualitat de les implementacions mitjançant jocs de proves automatitzats.
- Capacitat de transformar una aplicació web a una PWA i dotar-la d'una imatge corporativa, que sigui instal·lable tant a escriptori com a dispositius mòbils, i que funcioni sense connexió a internet.
- Conèixer el concepte de Angular Universal, capacitat per aplicar-lo i entendre les implicacions que té amb SEO i amb el rendiment.
- Capacitat per refactoritzar una aplicació.
- Entendre com es generen els paquets entregables d'una aplicació Angular, com es pot desplegar en un entorn local per fer proves.
De manera més transversal:
- Capacitat d'anàlisi de requeriments i implementació en conseqüència.
- Capacitat per implementar tot el cicle de desenvolupament d'una aplicació web de la part front-end des de l'anàlisi, la implementació, les proves i el desplegament.
- Capacitat per buscar la solució més òptima.
- Capacitat per aplicar els patrons de disseny adients.
- Visió més enllà del propi requeriment, pensar en tasques futures per intentar implementar un codi escalable, modulable i ben parametritzat.
Aquesta assignatura s'organitza en 8 temes ben diferenciats, a continuació els enumerem:
1. Programació Reactiva: Formularis reactius
2. Programació Reactiva utilitzant RxJS + Patró Redux (NgRx)
3. Maquetació: Angular Material
4. Proves
5. Progressive Web Apps (PWA)
6. Angular Universal (SEU)
7. Desplegant una aplicació frontend
8. Refactoring
Tots els recursos necessaris per la correcta realització d'aquesta assignatura estaran publicats a l'aula dins de cadascuna de les PACs.
Tota la documentació és pròpia i es va ampliant/millorant cada semestre.
Generalment cada tema tindrà la documentació de teoria en format pdf i si hi ha projectes relacionats amb la teoria també estaran pujats en format zip.
Els enunciats de les PACs també estaran publicats a l'activitat corresponent de l'aula en format pdf. Molts d'ells contindran enllaços a recursos complementaris, p.ex. de la biblioteca O'Reilly.
També via els fòrums de l'aula intentarem anar compartint recursos que ens semblin interessants com a lectures complementaries, com ara explicació d'algun patró de disseny, alguna noticia d'actualitat interessant relacionada amb el temari, etc.
Tota la bibliografia i les fonts d'informació estaran detallades als propis enunciats de les diferents PACs de l'assignatura.
El fil conductor de l'assignatura són les 6 Proves d'Avaluació Continua (PAC). Cada PAC tractarà, com a mínim, un dels temes indicats al temari. Totes les PACs són activitats eminentment pràctiques.
La dinàmica de treball serà:
- Primer estudiar la teoria vinculada a la PAC, la qual trobaràs adjunta en format PDF dins de de cadascunad e les activitats de l'aula. Normalment la teoria té exercicis guiats pas a pas per tal d'interioritzar el temari que correspongui, l'ideal seria aprofitar la teoria abans de posar-se amb la pràctica.
- Un cop estudiada la teoria, seria el moment de resoldre la PAC. Cada PAC tindrà un numero determinat d'exercicis. Cada exercici valdrà un percentatge de la nota. A l'enunciat de cada PAC el podreu veure.
- Davant de qualsevol dubte o pregunta, es recomana utilitzar els fòrums (hi ha un per PAC) abans d'enviar un e-mail. Igualment, t'animem a respondre als missatges dels teus companys i companyes de classe.
Aquestes 6 pràctiques serveixen per controlar, tant per part del professor col·laborador com pel mateix estudiant, el progrés en l'assignatura.
L'avaluació d'aquestes 6 PACs donen com resultat la nota final d'Avaluació Contínua (AC) que alhora es correspon amb la nota final de l'assignatura.
Les PACs seran publicades a l'aula segons les dates previstes al calendari (veure l'apartat "Dates clau" d'aquest Pla Docent).
El procés d'avaluació es fonamenta en el treball personal de l'estudiant i pressuposa l'autenticitat de l'autoria i l'originalitat dels exercicis realitzats.
La manca d'autenticitat en l'autoria o d'originalitat de les proves d'avaluació; la còpia o el plagi; l'intent fraudulent d'obtenir un resultat acadèmic millor; la col·laboració, l'encobriment o l'afavoriment de la còpia, o la utilització de material o dispositius no autoritzats durant l'avaluació, entre d'altres, són conductes irregulars que poden tenir conseqüències acadèmiques i disciplinàries greus.
D'una banda, si es detecta alguna d'aquestes conductes irregulars, pot comportar el suspens (D/0) en les activitats avaluables que es defineixin en el pla docent - incloses les proves finals - o en la qualificació final de l'assignatura, sigui perquè s'han utilitzat materials o dispositius no autoritzats durant les proves, com ara xarxes socials o cercadors d'informació a internet, perquè s'han copiat fragments de text d'una font externa (internet, apunts, llibres, articles, treballs o proves d'altres estudiants, etc.) sense la citació corresponent, o perquè s'ha practicat qualsevol altra conducta irregular.
De l'altra, i d'acord amb les normatives acadèmiques, les conductes irregulars en l'avaluació, a més de comportar el suspens de l'assignatura, poden donar lloc a la incoació d'un procediment disciplinari i a l'aplicació, si escau, de la sanció que correspongui.
La UOC es reserva la potestat de sol·licitar a l'estudiant que s'identifiqui o que acrediti l'autoria del seu treball al llarg de tot el procés d'avaluació pels mitjans que estableixi la Universitat (síncrons o asíncrons). A aquests efectes, la UOC pot exigir a l'estudiant l'ús d'un micròfon, una càmera o altres eines durant l'avaluació i que s'asseguri que funcionen correctament.
La verificació dels coneixements per garantir l'autoria de la prova no implicarà en cap cas una segona avaluació.
|
L'assignatura només es pot aprovar amb el seguiment i la superació de l'avaluació contínua (AC). La qualificació final de l'assignatura és la nota obtinguda a l'AC. |
Nota final d'assignatura: AC
L'avaluació continuada (AC) està composta de 6 Proves d'Avaluació Continuada (PACs), que es realitzaran al llarg del semestre.
La nota final d'AC (i de l'assignatura) serà la mitjana ponderada de les 6 PACs, tenint en compte que una PAC no lliurada es comptabilitzarà com una D = 0.
Per obtenir una qualificació final d'AC cal lliurar, com a mínim, el 50% de les PACs. En cas contrari, la qualificació de l'AC (i de l'assignatura) serà No Presentat (N).
A més, a la nota final d'AC es valorarà també la participació de l'estudiant al fòrum de l'aula.
Les dates de publicació d'enunciats i de lliurament de les PAC les podeu trobar a l'apartat de 'Planificació' d'aquest pla docent.
És important tenir clar que el seguiment correcte de l'assignatura us compromet a realitzar les activitats proposades (PACs) de manera individual i segons les indicacions que pauta aquest Pla Docent. En cas que no sigui així, les activitats s'avaluaran amb una D (=0). En concret, en cas d'extrema similitud entre algun exercici d'alguna PAC de dos o més estudiants que desacrediti el fet d'haver-la realitzat individualment, la nota final d'AC serà un 0 per tots ells.
D'altra banda, i sempre a criteri dels Estudis, l'incompliment d'aquest compromís pot suposar que no se us permeti superar cap altra assignatura mitjançant avaluació continuada ni en el semestre en curs ni en els següents.
La ponderació de les diferents PACs és la següent:
| Prova d'avaluació continua: | PONDERACIÓ |
| 1. Programació Reactiva: Forms | 15% |
| 2. Programació Reactiva usant RxJS + Patron Redux (NgRx) | 25% |
| 3. Maquetació: Angular Material | 15% |
| 4. Proves | 15% |
| 5. Progressive Web Apps (PWA), Angular Universal (SEU), Desplegant una aplicació frontend |
15% |
| 6. Refactoring: Lliurament final | 15% |
La PAC 6 consisteix en la refactorització de l'aplicació completa. Al llarg de l'assignatura s'aniran realitzant lliuraments de les diferents PACs d'un projecte de gran abast el qual pot ser modificat al llarg de l'assignatura en el procés de refactorització, sobretot després del tema 4 - Proves.
És a dir, que es podran realitzar modificacions del codi lliurat en les PACs, el qual serà tingut en compte en la PAC 6, en el qual es tindrà en compte el projecte finalitzat.
Com podeu veure a l'apartat anterior, cada PAC té un percentatge de la nota final.
La nota final de la assignatura es calcularà aplicant aquests percentatges.
Nota final = (PAC1*0,15)+(PAC2*0,25)+(PAC3*0,15)+(PAC4*0,15)+(PAC5*0,15)+(PAC6*0,15)
Es reserva un petit marge per valorar la participació al fòrum, l'ajuda a altres companys/es, aportacions de noticies/idees, ...
Per a cadascuna de les activitats d'avaluació del curs (PACs), el professorat docent col·laborador donarà un feedback personalitzat a cada estudiant. Tant la nota com el feedback seran proporcionats a través del Registre d'Avaluació Continuada (RAC) de l'aula.
Per cada PAC, a més de la nota, rebreu un Excel adjunt. En aquest Excel tindreu un comentari de cada exercici explicant breument el perquè de la nota.
La correspondència número - lletra seria:
| [8,5 - 10] | A |
| [7 - 8,4] | B |
| [5 - 6,9] | C+ |
| [3 - 4,9] | C- |
| [0 - 2,9] | D |
| No presentat | N |