Desarrollo Y Reutilización De Componentes Software Y Multimedia Mediante Lenguajes De Guion. Uf1842. E-Book

Beatriz Coronado García

• Herausgeber: Clube de Autores
• Kategorie: Wissenschaft und neue Technologien
• Sprache: Spanisch

Seitenzahl: 157

Veröffentlichungsjahr: 2025

Beschreibung

Puede solicitar gratuitamente las soluciones a todas las actividades y al examen final en el email [email protected] Capacidades que se adquieren con este Manual: - Crear componentes software mediante herramientas y lenguajes de guión utilizando técnicas de desarrollo estructurado. - Crear y manipular componentes multimedia utilizando lenguajes de guión y herramientas específicas. - Seleccionar componentes de software ya desarrollados según su funcionalidad para integrarlos en documentos.

Leseprobe

Desarrollo y reutilización de componentes software y multimedia mediante lenguajes de guion. UF1842.

Autora: Beatriz Coronado García.

© EDITORIAL TUTOR FORMACIÓN

C/ San Millán, 7, bajo 10

26004 Logroño (La Rioja)

Tlf. 610687276

Email: [email protected]

Web: https://tutorformacion.es   o  https://editorial.tutorformacion.es

Edición: agosto 2024

ISBN: 978-84-19189-87-5

Depósito legal: LR 1092-2024

Reservados todos los derechos de publicación en cualquier idioma.

Según el código penal vigente ninguna parte de este o cualquier otro libro puede ser reproducida, grabada en alguno de los sistemas de almacenamiento existentes o transmitida por cualquier procedimiento, ya sea electrónico, mecánico, reprográfico, magnético o cualquier otro, sin autorización previa y por escrito de D. Miguel Ángel Ladrón Jiménez; su contenido está protegido por la ley vigente que establece penas de prisión y/o multas a quienes intencionadamente reprodujeren o plagiaren, en todo o en parte, una obra literaria, artística o científica.

Foto de portada diseñada por FreePik.

Contenido

Introducción

Arquitecturas de aplicaciones Web

1.Esquema general.

2.Arquitectura en capas.

3.Interacción entre las capas cliente y servidor.

4.Arquitectura de la capa cliente.

5.Prueba de autoevaluación.

Navegadores Web

1.Arquitectura de un navegador.

1.1.Interfaz de usuario.

1.2.Motor de exploración.

1.3.Motor de presentación.

1.4.Módulos auxiliares: persistencia, interfaz de red, intérprete de scripts, infraestructura de presentación.

2.Navegadores de uso común. Comparativa.

3.Seguridad en navegadores.

4.Integración de aplicaciones en navegadores. Adaptadores (plugins).

4.1.Adaptadores comunes en diferentes navegadores.

4.2.Configuración de tipos de ficheros y adaptadores.

5.Conformidad a estándares.

6.Prueba de autoevaluación.

Creación de Contenido Web Dinámico

1.Fundamentos de programación.

1.1.Constantes, variables. Tipos de datos simples y estructurados.

1.2.Expresiones y sentencias. Operadores básicos.

1.3.Control de flujo: secuencial, bucles y condicionales.

1.4.Subprogramas: procedimientos y funciones. Librerías.

1.5.Llamadas a funciones. Recursividad.

1.6.Nociones de orientación a objetos: clases y objetos. Herencia.

1.7.Principales metodologías de programación.

2.Lenguajes para el desarrollo de contenido dinámico.

2.1.Lenguajes de guion. Características generales.

2.2.Comparativa de lenguajes de guion. Criterios para la selección de un lenguaje de guion.

2.3.Máquinas virtuales en navegadores. Miniaplicaciones (applets).

2.4.Otros lenguajes para el desarrollo de aplicaciones web enriquecidas (RIA).

3.Prueba de autoevaluación.

Lenguajes de Guion de uso general

1.Integración de lenguajes de guion en navegadores web.

1.1.Comparativa y compatibilidad con navegadores.

1.2.Diferencias entre versiones.

2.Estructura general de un programa en un lenguaje de guion.

2.1.Variables y tipos de datos.

2.2.Operadores.

2.3.Objetos.

2.4.Sentencias. Anidamiento.

2.5.Estructuras de control y condicionales.

2.6.Bucles.

3.Funciones.

3.1.Parámetros.

3.2.Variables locales y globales.

3.3.Bibliotecas de funciones.

4.Manipulación de texto.

4.1.Funciones básicas para la manipulación de texto.

4.2.Introducción y validación de texto.

5.Listas (arrays).

5.1.Funciones básicas para la manipulación de texto.

5.2.Creación de arrays básicos.

5.3.Arrays multidimensionales.

5.4.Tratamiento de arrays mediante bucles.

6.Formatos estándar de almacenamiento de datos en lenguajes de guion.

6.1.Comparativa.

6.2.Tratamiento de formatos estándar.

6.3.Diccionarios de datos.

7.Objetos.

7.1.Creación de objetos: métodos y estructuras de datos.

7.2.Bibliotecas de objetos.

8.El modelo de documento web.

8.1.Estructura de documento.

8.2.Navegación por las propiedades de un documento.

8.3.Cambio de propiedades mediante lenguajes de guion.

9.Gestión de eventos.

9.1.Tipos de eventos.

9.2.Técnicas para el manejo de eventos mediante lenguajes de guion.

9.3.Manejadores de eventos.

9.4.Eventos de carga inicial.

9.5.Delegación y propagación de eventos.

10.Gestión de errores.

10.1.Manejo de error «No lenguajes de guion habilitados» (no script).

10.2.Chequeo de errores en funciones.

10.3.Captura de errores.

10.4.Uso de puntos de ruptura.

11.Usos específicos de lenguajes de guion.

11.1.Integración multimedia mediante lenguajes de guion.

11.2.Animaciones.

11.3.Efectos especiales en elementos gráficos y texto.

11.4.Rejillas de datos.

11.5.Manejo de canales de suscripción (RSS).

11.6.Descripción de las técnicas de acceso asíncrono (AJAX).

11.7.Uso de lenguajes de guion en dispositivos móviles.

12.Entornos integrados (Frameworks) para el desarrollo con lenguajes de guion.

12.1.Características de los entornos de uso común. Comparativa.

12.2.Editores avanzados.

12.3.Funcionalidades de validación y depuración de código.

12.4.Técnicas para la documentación del código.

12.5.Utilidades adicionales para la realización de contenidos dinámicos.

12.6.Extensiones de navegadores.

12.7.Uso de lenguajes de guion en dispositivos móviles.

13.Prueba de autoevaluación.

Contenidos Multimedia

1.Definición de multimedia. Tipos de recursos multimedia.

2.Inclusión de contenido multimedia en páginas web.

2.1.Adaptadores para recursos multimedia

2.2.Enlace a diferentes recursos desde páginas web

2.3.Incrustación de contenido multimedia

3.Formatos de fichero web. El estándar MIME.

3.1.Tipos de reproducción. Streaming y carga progresiva

3.2.Comparativa del tratamiento de contenido multimedia en diferentes versiones de lenguajes de marcado de páginas

4.Gráficos multimedia.

4.1.Formatos gráficos. Comparativa

4.2.Repositorios de imágenes

4.3.Tipos de gráficos: fotografías, imágenes vectorizadas e iconos

4.4.Herramientas para el tratamiento gráfico. Filtros y tratamiento de imágenes

4.5.Conversión de formatos gráficos.

5.Audio.

5.1.Formatos de audio. Comparativa.

5.2.Reproductores de audio. Inserción en navegadores web

5.3.Enlace o inserción de canales de audio

5.4.Conversión de formatos de audio.

5.5.Herramientas para el tratamiento de sonido. Edición de fragmentos de audio

6.Vídeo.

6.1.Formatos de vídeo. Calidad de vídeo y comparativa

6.2.Repositorios de vídeo

6.3.Reproductores de vídeo. Inserción en navegadores web

6.4.Enlace o inserción de canales de vídeo.

6.5.Conversión de formatos de vídeo. Optimización.

6.6.Herramientas de edición de vídeo. Creación de efectos y composición

7.Animaciones multimedia.

7.1.Principios de la animación.

7.2.Herramientas para la creación de animaciones.

7.3.Formatos de animaciones

7.4.Inclusión en páginas web

7.5.Buenas prácticas en el uso de animaciones

8.Elementos interactivos.

8.1.Creación de elementos interactivos.

8.2.Mapas Interactivos.

8.3.Ámbitos de uso

9.Prueba de autoevaluación.

Resumen

Evaluación final

Introducción

Este manual está diseñado para ofrecer una comprensión exhaustiva y detallada del desarrollo de aplicaciones web, abarcando desde los fundamentos hasta las técnicas avanzadas. A lo largo de sus capítulos, los lectores adquirirán las habilidades necesarias para diseñar, construir y optimizar aplicaciones web modernas y funcionales.

Se comienza con una introducción a la arquitectura de aplicaciones web, explorando cómo se estructuran y organizan los componentes clave para entregar la funcionalidad deseada al usuario final. Se describen diferentes modelos arquitectónicos, como la arquitectura monolítica y la arquitectura de microservicios, y se analiza cómo estos enfoques impactan en el desarrollo, escalabilidad y mantenimiento de las aplicaciones.

El manual también profundiza en el funcionamiento de los navegadores web, que son esenciales para la visualización y ejecución de contenido en Internet. Se desglosan los componentes principales de un navegador, incluyendo la interfaz de usuario, el motor de renderizado y el motor de JavaScript, explicando cómo estos elementos interactúan para asegurar que las aplicaciones web funcionen de manera eficiente y segura.

Además, se dedica una sección importante a la creación de contenido web dinámico, que es clave para proporcionar experiencias interactivas a los usuarios. Se abordan lenguajes de guion como JavaScript, Python y PHP, destacando su papel en la manipulación de datos en tiempo real, la gestión de eventos y la integración de funcionalidades avanzadas en las aplicaciones web.

El manual examina detalladamente los lenguajes de guion y su uso en el desarrollo web. Se explican sus características, su estructura básica y su aplicación en la creación de aplicaciones dinámicas y responsivas. También se analizan tecnologías como AJAX y frameworks como React y Angular, que facilitan la construcción de interfaces de usuario modernas y eficientes.

Además, se explora la integración de contenido multimedia en las páginas web, un aspecto clave para enriquecer la experiencia del usuario. Se presentan las mejores prácticas para la inclusión de elementos multimedia, como imágenes, videos y audio, y se proporcionan técnicas para optimizar estos recursos y asegurar su compatibilidad con diferentes navegadores y dispositivos.

Este manual servirá como una guía completa para cualquier persona interesada en dominar el desarrollo de aplicaciones web, proporcionando el conocimiento necesario para enfrentar los desafíos que surgen en el diseño y la implementación de soluciones web efectivas y profesionales.

A continuación, se presenta un glosario de términos relacionados con el desarrollo de aplicaciones web:

AJAX (Asynchronous JavaScript and XML): Técnica que permite actualizar partes de una página web sin recargarla completamente, mejorando la interactividad y la experiencia del usuario.API (Application Programming Interface): Conjunto de reglas y protocolos que permiten la comunicación entre diferentes aplicaciones o servicios, facilitando la integración de funcionalidades externas en una aplicación web.API Gateway: Servidor que actúa como punto de entrada único para todas las solicitudes de un cliente hacia los microservicios de una aplicación, manejando la autenticación, el balanceo de carga, y la traducción de protocolos.API REST: Arquitectura para la creación de APIs que utiliza las operaciones HTTP estándar para interactuar con los recursos, facilitando la comunicación entre el cliente y el servidor.ARIA (Accessible Rich Internet Applications): Conjunto de atributos especiales que se pueden añadir a las etiquetas HTML para mejorar la accesibilidad de las aplicaciones web para personas con discapacidades.Arquitectura de Microservicios: Enfoque de diseño que divide una aplicación en pequeños servicios independientes, cada uno con su propia lógica y base de datos, permitiendo un desarrollo más ágil y escalable.Backend: Parte de una aplicación web que se ejecuta en el servidor, gestionando la lógica de la aplicación, la comunicación con bases de datos, y la manipulación de datos.Callback: Función que se pasa como argumento a otra función y que se ejecuta después de que esa función haya completado su tarea, comúnmente utilizada en operaciones asíncronas.CDN (Content Delivery Network): Red de servidores distribuidos globalmente que almacenan en caché contenido estático como imágenes, scripts y estilos CSS para mejorar la velocidad de carga de un sitio web al reducir la latencia.CI/CD (Continuous Integration/Continuous Deployment): Práctica de desarrollo que automatiza el proceso de integración y despliegue de código, permitiendo que los cambios sean testeados y liberados rápidamente y de manera segura.CORS (Cross-Origin Resource Sharing): Mecanismo de seguridad que permite o restringe las solicitudes de recursos de una página web que provienen de un dominio diferente al que la originó.Cross-Browser Compatibility: Capacidad de una aplicación web para funcionar correctamente en diferentes navegadores web, asegurando una experiencia de usuario consistente sin importar la plataforma utilizada.CSR (Client-Side Rendering): Técnica en la cual el contenido de una página web es renderizado en el navegador del usuario, utilizando JavaScript para construir dinámicamente la interfaz de usuario.CSS (Cascading Style Sheets): Lenguaje de diseño utilizado para describir la presentación de un documento escrito en HTML o XML, controlando aspectos como colores, fuentes y el layout de las páginas web.DevOps: Conjunto de prácticas que unifican el desarrollo de software (Dev) y las operaciones de sistemas (Ops), con el objetivo de reducir el ciclo de vida del desarrollo y aumentar la calidad de las aplicaciones mediante la automatización de procesos.DOM (Document Object Model): Representación estructural de un documento HTML o XML en forma de árbol, que permite a los lenguajes de programación interactuar con el contenido y la estructura de la página.DOM Manipulation: Proceso de interactuar y cambiar la estructura, estilo o contenido del Document Object Model (DOM) de una página web usando JavaScript o bibliotecas como jQuery.ETL (Extract, Transform, Load): Proceso que implica la extracción de datos de varias fuentes, su transformación para adecuarlos a las necesidades del sistema, y su carga en un sistema de almacenamiento, como una base de datos.Event Listener: Función que se ejecuta en respuesta a un evento específico, como un clic del mouse o una tecla presionada, permitiendo a los desarrolladores añadir interactividad a las páginas web.Fetch API: Mecanismo moderno para realizar solicitudes HTTP a servidores web desde el navegador, que reemplaza en gran medida a XMLHttpRequest, proporcionando una sintaxis más sencilla y poderosa para manejar respuestas asíncronas.Framework: Conjunto de herramientas y bibliotecas predefinidas que proporcionan una estructura estándar para el desarrollo de aplicaciones, facilitando la creación de aplicaciones web complejas (ejemplo: Angular, Django).Frontend: Parte de una aplicación web que interactúa directamente con el usuario, incluyendo la interfaz de usuario y la experiencia de usuario.Git: Sistema de control de versiones distribuido que permite a los desarrolladores rastrear cambios en el código fuente, colaborar con otros, y revertir a versiones anteriores del proyecto cuando sea necesario.GraphQL: Lenguaje de consulta para APIs que permite a los clientes solicitar exactamente los datos que necesitan, y nada más, mejorando la eficiencia en la transferencia de datos entre el cliente y el servidor.Headless CMS: Sistema de gestión de contenidos que desacopla la capa de presentación (frontend) del backend, permitiendo a los desarrolladores usar APIs para entregar contenido a cualquier tipo de dispositivo o aplicación.HTML (Hypertext Markup Language): Lenguaje de marcado estándar utilizado para crear páginas web, definiendo la estructura básica del contenido mediante etiquetas.JSON (JavaScript Object Notation): Formato ligero de intercambio de datos, fácil de leer y escribir tanto por humanos como por máquinas, utilizado frecuentemente para la comunicación entre cliente y servidor.JSON (JavaScript Object Notation): Formato ligero de intercambio de datos que es fácil de leer y escribir para los humanos y fácil de parsear y generar para las máquinas, ampliamente utilizado en la comunicación entre cliente y servidor.JWT (JSON Web Token): Estándar abierto para la creación de tokens de acceso que pueden ser utilizados para autenticar y autorizar a usuarios en aplicaciones web de manera segura.Lazy Loading: Técnica de optimización que retrasa la carga de recursos no críticos (como imágenes o vídeos) hasta que son necesarios, mejorando el rendimiento inicial de una página web.Library: Colección de funciones y utilidades preescritas que los desarrolladores pueden reutilizar en sus proyectos, ayudando a simplificar tareas comunes y reduciendo la cantidad de código necesario (ejemplo: jQuery, Lodash).Lighthouse: Herramienta de código abierto desarrollada por Google que se utiliza para auditar y mejorar la calidad de las páginas web, evaluando aspectos como el rendimiento, la accesibilidad, y las mejores prácticas de SEO.Loop: Estructura de control que repite un bloque de código mientras una condición específica es verdadera, fundamental para realizar operaciones repetitivas en lenguajes de guion.Microfrontend: Técnica en la cual una aplicación frontend se divide en pequeños componentes independientes, que pueden ser desarrollados y desplegados de manera autónoma.Minification: Proceso de eliminar todos los caracteres innecesarios de un archivo de código (como espacios en blanco, comentarios y saltos de línea) sin cambiar su funcionalidad, con el objetivo de reducir el tamaño del archivo y mejorar el rendimiento de la página web.Monorepo: Estructura de repositorio en la cual el código de múltiples proyectos (como varios servicios o aplicaciones) se almacena en un único repositorio, facilitando la gestión de dependencias y la colaboración entre equipos.Node.js: Entorno de ejecución de JavaScript del lado del servidor, que permite construir aplicaciones web escalables y eficientes, especialmente para tareas de entrada/salida como el manejo de archivos o la interacción con bases de datos.OAuth: Protocolo de autorización que permite a los usuarios compartir información privada con aplicaciones sin revelar sus credenciales, facilitando el acceso seguro a recursos protegidos.ORM (Object-Relational Mapping): Técnica que permite a los desarrolladores interactuar con una base de datos relacional utilizando el paradigma de la programación orientada a objetos, mapeando las tablas de la base de datos a clases y sus relaciones a asociaciones entre objetos.Promise: Objeto en JavaScript que representa la eventual finalización (o falla) de una operación asíncrona y su valor resultante, permitiendo manejar código asíncrono de manera más legible.PWA (Progressive Web App): Tipo de aplicación que combina las mejores características de las aplicaciones web y móviles, incluyendo la capacidad de trabajar offline, recibir notificaciones push, y ser instaladas en el dispositivo del usuario.Renderizado del Lado del Cliente: Proceso en el cual el navegador web es responsable de construir la interfaz de usuario, cargando y ejecutando scripts en el dispositivo del usuario.Responsive Design: Técnica de diseño web que asegura que una página web se vea y funcione bien en una variedad de dispositivos y tamaños de pantalla, utilizando media queries y diseños fluidos.RESTful API: Estilo de arquitectura para la creación de servicios web que utiliza HTTP y operaciones CRUD (Crear, Leer, Actualizar, Eliminar) para gestionar los recursos.Script: Archivo de código que contiene instrucciones escritas en un lenguaje de guion, como JavaScript, que el navegador puede interpretar y ejecutar para añadir funcionalidades dinámicas a una página web.SEO (Search Engine Optimization): Conjunto de prácticas y técnicas utilizadas para mejorar la visibilidad de un sitio web en los motores de búsqueda, aumentando su tráfico orgánico mediante la optimización de su contenido y estructura.Serverless Architecture: Modelo de computación en la nube donde el proveedor gestiona automáticamente la infraestructura y los servidores, permitiendo a los desarrolladores concentrarse únicamente en el código, pagando solo por el tiempo de ejecución.Single Page Application (SPA): Aplicación web que carga una única página HTML y actualiza dinámicamente el contenido a medida que el usuario interactúa, mejorando la experiencia y la velocidad de navegación.Sitemap: Archivo XML que lista todas las URLs de un sitio web, proporcionando información adicional sobre cada URL, como la última fecha de modificación y la frecuencia de cambios, ayudando a los motores de búsqueda a indexar el contenido de manera eficiente.SQL (Structured Query Language): Lenguaje estándar utilizado para gestionar y manipular bases de datos relacionales, permitiendo realizar operaciones como consultas, inserciones y actualizaciones de datos.SSL/TLS: Protocolo de seguridad que cifra la comunicación entre el navegador web y el servidor, protegiendo la información sensible transmitida y asegurando la autenticidad del sitio web.SSR (Server-Side Rendering): Técnica en la cual las páginas web se renderizan en el servidor antes de ser enviadas al cliente, mejorando el rendimiento inicial y la optimización para motores de búsqueda.Templating Engine: Herramienta que permite a los desarrolladores generar HTML dinámico utilizando plantillas predefinidas y datos variables, facilitando la creación de contenido dinámico en aplicaciones web.Tokenization: Proceso de protección de datos sensibles reemplazándolos con identificadores únicos o tokens, que no tienen un valor intrínseco fuera del sistema específico que los generó.URL (Uniform Resource Locator): Dirección única utilizada para identificar y acceder a un recurso en la web, como una página web, un archivo o una imagen.Variable: Espacio en la memoria del ordenador que almacena un valor que puede ser cambiado durante la ejecución de un programa, fundamental para la programación en cualquier lenguaje de guion.Version Control (Control de Versiones): Sistema que registra los cambios realizados en los archivos de un proyecto a lo largo del tiempo, permitiendo la colaboración entre varios desarrolladores y la recuperación de versiones anteriores.Versioning: Proceso de asignar y rastrear diferentes versiones de un software o aplicación, asegurando que los cambios y actualizaciones se gestionen de manera ordenada.