Javascript

 

JavaScript puede cambiar el aspecto, contenido y comportamiento de las páginas web.

Actividad 1: Cambiar el contenido de un archivo HTML.

Uno de los muchos métodos HTML de JavaScript es getElementById().

El siguiente ejemplo "encuentra" un elemento HTML (con id="demo") y cambia el contenido del elemento (innerHTML) a "Hola JavaScript":

Actividad 2: Cambiar el atributo src de una imagen HTML.

JavaScript puede "mostrar" datos de diferentes maneras:

        -Escribiendo en un elemento HTML, usando innerHTMLo innerText.

        -Escribiendo en la salida HTML usando document.write().

        -Escribiendo en un cuadro de alerta, utilizando window.alert().

        -Escribiendo en la consola del navegador, usando console.log().

Actividad 3: Mensaje de bienvenida o alerta mi página web.

En HTML, el código JavaScript se inserta entre las etiquetas <script>y </script>.

Actividad 4: Botón para mostrar fecha y hora.

Fundamentos de Javascript: Fundamentos de JavaScript - Aprende desarrollo web | MDN

Introduce en tu página web FORMULARIO.HTML los siguientes efectos:

- Un botón que cambie contenido HTML

- Un botón que esconda elementos

- Un botón que muestre la hora y fecha.

Este es el código que vamos a utilizar

- Cambiar una imagen al pasar el ratón por encima

- Un botón de volver

Cómo hacer un slider de imágenes:

https://www.youtube.com/watch?v=jXfSkhnvyJk&ab_channel=Fazt

Info Javascript:

- Cómo y por qué aprender programación con Javascript

Tarjetas de Navidad con Scratch

 Tarea crea tu propia Tarjeta Navideña con Scratch! 

Algunas ideas:

https://www.youtube.com/watch?v=cPi8Bj4eGWo&ab_channel=CodeSpeakLabs

https://www.youtube.com/watch?v=K6C0lPmaCTs&ab_channel=CodeKids

CONDICIONES

Versión 1: 

- Al menos 5 objetos diferentes

- Al menos 2 fondos diferentes

- Durar al menos 20 segundos.

- Al menos dos objetos tienen que moverse y cambiar de tamaño. 

- Texto relacionado con Navidad: Feliz Navidad o algo similar

- Algún sonido de Navidad o música 

Versión 2:

- Haz una versión más extensa que incluya interacción con el visor.

-Un mensaje que diga  hacer click en algún sitio para que aparezca algún efecto.

- Customiza algún mensaje con el nombre de la persona que lo vea  (la aplicación debería preguntar tu nombre).

RECURSOS:

Canciones de Navidad y música: https://uppbeat.io/sfx/tag/christmas

RETOS NAVIDEÑOS DE PROGRAMACIÓN:

https://moodle.beverleyhigh.net/course/view.php?id=485#section-1

Resolviendo ecuaciones y problemas con Scratch

Algunos tutoriales

https://www.youtube.com/watch?v=hxT2eFsDV1U&ab_channel=STEMMC

Otros:

- Asociación de resistencias

- Ley de Ohms

FORMULARIOS TIC

  Formularios

Los formularios HTML son componentes esenciales de la mayoría de los sitios web y aplicaciones web. Permiten la interacción entre los usuarios y esos sitios web y son un concepto clave que deben comprender los desarrolladores web.

enlace 1

Atributos de la etiqueta <form>

- acción: Especifica la URL donde se deben enviar los datos del formulario.

- método: especifica el método HTTP utilizado para enviar datos del formulario ( posto get).

- objetivo : especifica dónde mostrar la respuesta después del envío del formulario 

(por ejemplo, _self, _blank, _parent) _top.

- nombre : Asigna un nombre al formulario con fines de identificación.

Tipos de entradas en un formulario:

- texto (text)

- opciones (radio)

- casillas de verificación (checkbox)

*** Busca información para crear un elemento que sea un desplegable de opciones****

AÑADE UN FORMULARIO A TU SITIO WEB atendiendo a las siguientes instrucciones:

- Crea una nueva página formulario.html en la que diseñes un formulario relacionado con la temática de tu web (puede ser un formulario de registro, de opinión, de sugerencias, de consulta, etc.), y debe tener al menos 10 campos para rellenar, variando tipo texto, radio, casillas de verificación y desplegables. Puedes probar también otros tipos predefinidos como "email", "number", etc...

CALCULADORA CON SCRATCH

Mira  este tutorial de Fernando Arciniega. 

Puedes descargar los botones  aquí

Variables:

• Num1
• Num2
• Operation
• Screen

Para cada número:

Para operaciones:

Para el botón resultado:

Para limpiar la información:

                                        or  

SOLUCIONES

 

2. Materiales y Fabricación - TIG 1 -

 

Cada uno de los estudiantes realizará una exposición oral apoyada con una presentación de prower point, canva o genially sobre uno de estos apartados del tema 2 del libro:

1.- Propiedades de los materiales: mecánicas, fisico-químicas y sensoriales (pag. 41,42,43)

2.- Metales (pag. 44,45,46)

3.- Materiales cerámicos, textiles y maderas (pag. 47,48,49,50)

4.- Plásticos (pag. 50,51,52,53)

5.- Selección de materiales en base a criterios de sostenibilidad (pag. 55,56)

6.- Nuevos materiales e Impacto ambiental (pag. 54 y 57)

7.- Técnicas de fabricación y prototipado (pag. 58,59,60)

4. PRIMERA PÁGINA WEB PERSONALIZADA

 Una vez que has realizado las 7 primeras prácticas completas, deberías dominar la estructura básica de una página html, añadiendo párrafos, imágenes, audios, vídeos, tablas, listas, etc. Además has aprendido cómo diseñar una hoja de estilos que proporcione un formato determinado a todas las páginas de tu sitio web: tipo de letra, color, tamaño, fondos, bordes, etc. Y también sabes cómo alojar tu web en un hosting gratuito. 

¡¡Es el momento de crear tu propio sitio web!!

Antes de nada dedica un tiempo para la planificación del diseño de tu web en papel. Piensa cuántas páginas va a tener y qué contenido tendrá cada página, no improvises sobre la marcha!! Visita algunas web sobre esa misma temática y coge ideas. Recopila material: imágenes, vídeos, links de interés. Y cuando tengas todo claro...abre el editor y comienza a codificar!!

Aquí tienes la lista de indicadores que debe cumplir tu web (pincha la imagen para abrir pdf)

Importante: Ten en cuenta todos estos indicadores a la hora de hacer tu diseño y no te olvides repasarlos realizando una autoevaluación justo antes de entregar tu trabajo