TEMA 1

FUNDAMENTOS DEL DESARROLLO DE

APLICACIONES WEB

M. Sc. Ing. Joel Reynaldo Alánez Durán

 ¿Qué
aprenderemos?
 HTML, CSS y
JavaScript
Tecnologías
Front End
 Base de Datos, Lenguajes
de Programación,
Servidores
Tecnologías
Back End
Desarrollo Full
Stack
Arquitectura C/S - Definición

• Una arquitectura distribuida

que permite a los usuarios
finales obtener acceso a la
información en forma
transparente aún en entornos
multiplataforma.
 Arquitectura C/S - Definición
• En el modelo cliente servidor, el
cliente envía un mensaje
solicitando un determinado servicio
a un servidor (hace una petición), y
este envía uno o varios mensajes
con la respuesta (provee el
servicio).
• En un sistema distribuido cada
máquina puede cumplir el rol de
servidor para algunas tareas y el rol
de cliente para otras.
Arquitectura C/S - Definición

• La arquitectura C/S es una

forma de dividir y especializar
programas y equipos de
cómputo de forma que la
tarea que cada uno de ellos
realiza se efectúa con la
mayor eficiencia posible y
permita simplificar las
actualizaciones y
mantenimiento del sistema
Arquitectura C/S
Cliente

• Es el proceso que
permite al usuario
formular los
requerimientos y
pasarlos al
servidor, se le
conoce con el
término front-end
Arquitectura C/S -Cliente
• El Cliente normalmente maneja
todas las funciones relacionadas
con la manipulación y despliegue de
datos, por lo que están
desarrollados sobre plataformas
que permiten construir interfaces
gráficas de usuario (GUI), además
de acceder a los servicios
distribuidos en cualquier parte de
una red.
Arquitectura C/S – Funciones del Cliente

Funciones del Cliente

Administrar la Interfaz del usuario
Interactuar con el usuario
Procesar la lógica de la aplicación y hacer validaciones locales
Generar las solicitudes para la BdD
Recibir los resultados del servidor
Dar formato a los resultados
Arquitectura C/S –
Servidor

• Es el proceso encargado de
atender a múltiples clientes que
hacen peticiones de algún
recurso administrado por él. Al
proceso servidor se le conoce
con el término back-end.
Arquitectura C/S – Funciones del Servidor
Servidor
Aceptar las solicitudes de la BdD de los clientes

Procesar las solicitudes de la BdD

Dar formato a los resultados y transmitirlos al cliente

Llevar a cabo la verificación de integridad

Mantener los datos generales de la BdD

Proporcionar control de acceso concurrente

Llevar a cabo recuperación

Optimizar el procesamiento de consultas/actualización
 En función al Servicio • Servidores de objetos
• Servidores de archivos ✓ Msg.: Invocación a
✓ Msg.: Peticiones de procedimientos
archivos remotos
Arquitectura C/S ✓ NFS, SAMBA,... ✓ servidores CORBA,

Clasificación
OLE/DCOM,...
• Servidores de bases de
datos • Servidores Web
✓ Msg.: Peticiones SQL ✓ Msg.: Peticiones
HTTP
✓ Oracle, Sybase, SQL
Server,... ✓ servidores HTTP,...
• Servidores de • Servidores de
transacciones groupware
✓ Msg.: Transacción ✓ Msg.: Mensajes de
(Conjunto de groupware, e-mails
peticiones SQL) ✓ Lotus Notes,
✓ OLP,... Exchange, etc.
Internet – Red Mundial

Es una red mundial de

computadoras interconectadas
que permite la comunicación y el
intercambio de información
entre usuarios de todo el
mundo. Es una red
descentralizada que utiliza
protocolos de comunicación
estandarizados para conectar
dispositivos y servicios en línea
World Wide Web (www) - Web

• Es un sistema de información en
línea que permite el acceso y la
interacción con documentos,
imágenes, videos y otros recursos
a través de internet.
• La web utiliza tecnologías como
HTTP y HTML para organizar y
presentar la información de
manera que los usuarios puedan
navegar fácilmente de un recurso
a otro mediante enlaces
hipertextuales.
 HTTP – Protocolo de la Web
• Protocolo de Transferencia de
Hipertexto (Hypertext Transfer
Protocol).
• Es un protocolo de comunicación
utilizado para la transferencia de
información en la Web.
• HTTP se basa en un modelo
cliente-servidor, donde un cliente
(como un navegador web) envía
solicitudes HTTP a un servidor, y el
servidor responde con los recursos
solicitados, como páginas web,
imágenes, archivos, etc.
HTTP – Protocolo de la Web

• Las solicitudes HTTP están

compuestas de diferentes
partes, incluyendo una línea de
solicitud que especifica el
método de solicitud (como GET,
POST, etc.), la URL del recurso
solicitado y la versión del
protocolo.
• Las respuestas HTTP incluyen
un código de estado que indica
si la solicitud fue exitosa o no,
junto con los datos del recurso
solicitado (si corresponde).
HTTP – Protocolo de la Web

• HTTP es un protocolo sin

estado, lo que significa que
cada solicitud es
independiente de las
anteriores. Sin embargo, se
puede mantener cierto estado
utilizando cookies u otros
mecanismos de seguimiento.
• HTTP ha evolucionado con el
tiempo, con nuevas versiones
como HTTP/1.1, HTTP/2 y
HTTP/3 que ofrecen mejoras
en rendimiento, seguridad y
funcionalidad
 URL – La Ruta en la Web
Localizador Uniforme de
Recursos (Uniform Resource
Locator).
• Es una cadena de caracteres
que se utiliza para
identificar de manera única
la ubicación de un recurso
en internet. Ej: página web,
un archivo, una imagen, un
video, etc.
• La URL proporciona la
dirección precisa que un
navegador web necesita
para localizar y recuperar el
recurso solicitado.
Servidor Web – HTTP

• Es utilizado para la
distribución (entrega) de
contenido web en redes
internas o en Internet
• Como parte de una red de
PC’s, un servidor web
transfiere documentos a
los llamados clientes. Ej:
una página web a un
explorador.
Servidor Web

HTTP

Referencia a 2 cosas:
• Software del servidor
(es decir, al programa
en sí)
• Al equipo en el que el
software del servidor
web se está ejecutando
(host)
• Un host puede alojar
múltiples soluciones de
software para
servidores web.
 WEB HOSTING – Alojamiento Web
• Un hosting es un servicio de
alojamiento web que
permite publicar un sitio
web o aplicación en
Internet.
• Cuando se contrata un
servicio de hosting,
básicamente se alquila un
espacio en un servidor físico
donde se almacenan todos
los archivos y datos
necesarios para que un sitio
web funcione
correctamente.
 WEB HOSTING – Alojamiento Web
• Los proveedores de hosting
proporcionan la tecnología
y los recursos necesarios
para que un sitio web
funcione de forma eficaz y
segura.
• Éstos se encargan de
mantener el servidor en
funcionamiento, aplicar
medidas de seguridad y
garantizar que datos como
textos, fotos y otros
archivos se transfieran
correctamente a los
navegadores de los
visitantes.
Navegador – Web
• Es un software que permite a
los usuarios acceder y visualizar
páginas web en internet.
• Los navegadores web
interpretan el código HTML de
las páginas web y muestran el
contenido de forma gráfica para
que los usuarios puedan
interactuar con él.
• Algunos ejemplos de
navegadores web populares son
Google Chrome, Mozilla
Firefox, Microsoft Edge, Safari y
Opera.
Página Web – Documento de la www

• Es un documento o
recurso de información
que se encuentra en
internet y que puede ser
accedido a través de un
navegador web.
• Las páginas web pueden
contener texto, imágenes,
videos, enlaces a otros
sitios, formularios
interactivos, entre otros
elementos.
 Página Web – Tipos

• Páginas web estáticas: Son

páginas web que muestran
siempre el mismo contenido y
no cambian en función de la
interacción del usuario. Suelen
ser más sencillas de diseñar y
mantener.
• Páginas web dinámicas: Son
páginas web cuyo contenido
puede cambiar en función de la
interacción del usuario o de
otros factores. Suelen requerir
el uso de bases de datos y
lenguajes de programación.
Página Web – Tipos

• Interactivas: Estas páginas

web suelen utilizar
JavaScript, junto con HTML
y CSS, para proporcionar
interactividad y dinamismo.
Pueden incluir efectos
visuales, animaciones, y
funcionalidades avanzadas
del lado del cliente, como
validación de formularios,
juegos en línea, entre otros.
 Página Web – Tipos
Páginas web responsivas: Son páginas web que se adaptan automáticamente al
tamaño de la pantalla en la que se visualizan, ofreciendo una experiencia de usuario
óptima en cualquier dispositivo.
Página Web – Propósito, Contenido

Páginas web de comercio

electrónico: Son aquellas
dedicadas a la venta de
productos o servicios en
línea. Suelen incluir catálogos
de productos, carritos de
compra, sistemas de pago
seguros, etc.
Página Web – Propósito, Contenido

Páginas web de redes

sociales: Son plataformas en
línea que permiten a los
usuarios crear perfiles,
compartir contenido,
conectarse con otros
usuarios, unirse a grupos y
participar en comunidades en
línea.
 Página Web – Propósito, Contenido

Páginas web de medios de comunicación y entretenimiento: Incluyen sitios

web de noticias, revistas en línea, portales de entretenimiento, plataformas de
streaming de música y vídeo, entre otros.
 Página Web – Propósito, Contenido

Páginas web educativas:

Son aquellas diseñadas
para proporcionar recursos
educativos, tutoriales,
cursos en línea,
plataformas de aprendizaje
a distancia, etc.
 Página Web – Propósito, Contenido

Páginas web de blogs y foros: Son sitios web donde los usuarios pueden
publicar contenido en forma de entradas de blog, artículos, opiniones,
preguntas, respuestas, etc.
 Página Web – Propósito, Contenido

Páginas web
institucionales: Son
aquellas que representan a
organizaciones,
instituciones, empresas o
entidades
gubernamentales. Suelen
incluir información sobre la
misión, visión, servicios,
historia, equipo, contacto,
etc.
Página Web – Propósito, Contenido
Páginas web de portafolio: Son sitios diseñados para que profesionales creativos, como
artistas, diseñadores, fotógrafos, etc., muestren su trabajo y experiencias.
Página Web – Propósito, Contenido
Páginas web personales: Son sitios web creados por individuos para compartir información
sobre sí mismos, sus intereses, pasatiempos, viajes, pensamientos, etc.
 Sitio Web – Definición
• Es un conjunto de páginas web
relacionadas y vinculadas entre
sí, alojadas en un servidor web y
accesibles a través de Internet.
• Tienen una estructura
organizada, jerárquica y una
navegación coherente para
facilitar la experiencia del
usuario al moverse entre las
diferentes páginas y secciones
del sitio.
• Además, pueden incorporar
características como búsqueda
interna, sistemas de gestión de
contenido, análisis de tráfico,
entre otros, para mejorar su
funcionalidad y rendimiento.