Sintaxi del llenguatge I - Historial de revisió

Joan a 23:56, 17 oct 2020

2020-10-17T23:56:44Z

Joan: /* Guió de l'entrega */

2020-09-25T09:05:19Z

Guió de l'entrega

Joan: /* Entrega */

2019-09-19T18:38:27Z

Entrega

Pàgina nova

=Objectius=
En aquesta primera pràctica hauràs d'anar definit el teu IDE (Entorn de desenvolupament): Netbeans, Sublime,...

També aniràs aprenent a depurar els errors en el codi, llegint bé a la consola els missatges d'error.

Concretament, farem l'exercici de la bombeta:
https://www.w3schools.com/js/tryit.asp?filename=tryjs_intro_lightbulb

Implementaràs l'exercici en els diferents entorns:
*w3school
*en local
*jsfiddle o codepen o en qualsevol altra plataforma al núvol per fer proves, com ara el curs d'introducció de Javascript de http://www.codecademy.com
*Consola (NodeJS) (aquí no pots mostrar la bombeta!)

Investigació: eliminar els botons, i fer que la bombeta vagi canviant entre encès i apagat cada segon.

=Introducció=
Aquesta pràctica té per objectiu iniciar-se en l'aprenentatge i familiarització de la sintaxi de Javascript, i continua amb les següents pràctiques. Així mateix s'explica el procediment i la pauta que seguirem mentre s'explica la teoria i es fa la pràctica.

El tutorial que seguirem per aprendre Javascript és el de http://www.w3schools.com/ (en anglès). En aquest tutorial, tots els exemples estan orientats a la web. El procediment que seguirem serà:
*el professor explicarà la teoria.
*els alumnes faran i provaran els exercicis proposats (en un entorn HTML o de consola).
*els alumnes adaptaran els exercicis proposats a un entorn de consola. Els fitxers generats tindran extensió .js. Per exemple,
<pre>
$ node ruta/codi.js
</pre>
*els alumnes assimilaran els conceptes i miraran d'ampliar coneixements, fer provatures,...

=Referències=
*http://www.w3schools.com/

*http://www.w3schools.com/js/default.asp
*http://www.w3schools.com/js/js_intro.asp
*http://www.w3schools.com/js/js_whereto.asp
*http://www.w3schools.com/js/js_statements.asp
*http://www.w3schools.com/js/js_comments.asp

=Desenvolupament=
Els alumnes provaran amb l'ordre proposat tots els exemples que s'han explicat a classe.

Anem a fer un exemple dels proposats. El fitxer ''this_is_a_paragraph.html'' s'executa obrint-lo en un navegador web:
<pre>
<!DOCTYPE html>
<html>
<body>

<p>
JavaScript can write directly into the HTML output.
</p>

<script>
document.write("<p>This is a paragraph.</p>");
</script>

</body>
</html>
</pre>

=Entrega=
Els alumnes entregaran al Classroom tots els fitxers generats (fitxers html, js, etc.). S'empaquetaran tots aquests fitxers i es pujaran al Classroom dins del termini d'entrega de la pràctica.

Recorda la '''normativa''' per entregar les pràctiques al Google Classroom: [[ASIX-M10-UF2#Normativa_d.27entrega_de_les_pr.C3.A0ctiques_al_Google_Classroom]]

==Guió de l'entrega==
<pre>
fitxers html amb scripts incrustats <script>
fitxers html amb scripts externs

document.getElementByID("demo").innerHTML(Date())

----
Node
> console.log(Date());

$ node /ruta/pr1_1.js
$ node /ruta/pr1_2.js
...
---
captura de pantalla
readme.txt
---
https://www.w3schools.com/js/tryit.asp?filename=tryjs_lightbulb
---
Recollir tots els fitxers, empaquetar-los, i enviar al Classroom
</pre>

{{Autor}}, setembre 2019
[[Categoria: Institut Jaume Balmes]]
[[Categoria: Assignatura DAW-M06-WEC]]

@@ Línia 95: / Línia 95: @@
 Recollir tots els fitxers, empaquetar-los, i enviar al Classroom
 </pre>
-'''NOTA''': algun alumne pot fer de forma voluntària un curs d'Introducció al Javascript (MOOC, massive online open course): edX, coursera, openwebinars.
+'''NOTA''': algun alumne pot fer de forma voluntària un curs d'Introducció al Javascript (MOOC, massive online open course): edX, coursera, openwebinars, codeacademy.
-{{Autor}}, setembre 2019
+{{Autor}}, setembre 2020
 [[Categoria: Institut Jaume Balmes]]
 [[Categoria: Assignatura DAW-M06-WEC]]

@@ Línia 35: / Línia 35: @@
 *http://www.w3schools.com/js/js_statements.asp
 *http://www.w3schools.com/js/js_comments.asp
 =Desenvolupament=
@@ Línia 63: / Línia 64: @@
 ==Guió de l'entrega==
 <pre>
 fitxers html amb scripts incrustats <script>
@@ Línia 76: / Línia 84: @@
 $ node /ruta/pr1_2.js
 ...
 ---
 captura de pantalla
@@ Línia 84: / Línia 95: @@
 Recollir tots els fitxers, empaquetar-los, i enviar al Classroom
 </pre>