Tasca: Entorn de desenvolupament per a JavaScript¶
Informació sobre la tasca
El lliurament serà en format PDF.
La tarea se calificará con una nota de correcte (10) o no correcte (0).
Durada aproximada activitats: 2 hores.
RA1. Selecciona les arquitectures i tecnologies de programació sobre clients web, identificant i analitzant les capacitats i característiques de cadascuna
Activitats¶
És molt important llegir els apunts i realitzar les activitats. Les activitats d'aquesta unitat són base per a la realització d' activitats en les properes unitats.
Activitat 1: Navegador¶
Instal·la el navegador web Firefox Developer Edition i Brave.
Accedeix a l'eina de desenvolupament de cada navegador (tecla F12) i executa a la consola les següents línies de codi una a una:
console.log("Sóc en <tu usuari> i <m'agrada o no m'agrada> les pilotes amb salsa")
alert("Sóc en <tu usuari> i tipus de música que més m'agrada és el <tipus musica preferit>")
Recorda que has de substituir tot el que apareix entre "<" i ">"
📸 Fes una o diverses captures per demostrar que has realitzat aquesta tasca. Recorda que les captures de pantalla han de cobrir tot l'escriptori perquè es vegi la data i hora de realització!
Activitat 2: Entorn de desenvolupament¶
Instal·la l'entorn de desenvolupament WebStorm de JetBrains.
Una vegada instal·lat, crea un document <nom_llinatge>.html.
En el nou document genera una estructura base per a un document HTML.
Afegeix en el body:
<h1>Sóc en <nom_llinatge> i m'agrada el cinema del tipus <gènere></h1>
Intenta veure la previsualització del que acabes de fer:
📸 Fes una o diverses captures per demostrar que has realitzat aquesta tasca. Recorda que les captures de pantalla han de cobrir tot l'escriptori perquè es vegi la data i hora de realització!
Activitat 3: Integració de codi JavaScript¶
Afegeix les dues línies de codi de la primera activitat utilitzant l'element script.
Pregunta
Es veu el resultat del 'console.log()' i de l''alert()' a la previsualització? Si no és així, com puc comprovar que el meu 'console.log()' i el meu 'alert()' realment funciona?
📸 Fes una o diverses captures per demostrar que has realitzat aquesta tasca. Recorda que les captures de pantalla han de cobrir tot l'escriptori perquè es vegi la data i hora de realització!
Activitat 4: Script extern¶
Crea el fitxer 'script.js' i mou les dues línies de codi de l'activitat anterior a aquest nou fitxer fent que s'executi de la mateixa manera.
Pregunta
Es veu el resultat del 'console.log()' i de l''alert()'? Si no és així, ¿com puc comprovar que el meu 'console.log()' i el meu 'alert()' realment funciona?
Pregunta
En què part del document HTML hauríem d'afegir l'element 'script'? ¿I si utilitzéssim els atributs 'async' o 'defer'?
📸 Fes una o diverses captures per demostrar que has realitzat aquesta tasca.
Activitat 5: GitHub¶
Crea un compte a GitHub si no la tens.
Crea un repositori per a aquest mòdul professional, anomenat DWECCIFPBMOLL2526_llinatgenom
Puja els fitxers que has utilitzat per aquesta pràctica al repositori.