SlideShare una empresa de Scribd logo
1 de 21
Descargar para leer sin conexión
WEB. Arquitectura,
tecnologías y herramientas
Autor: Esp. Ing. Ernesto Gigliotti. UTN-FRA
● Cliente:
● Consumidor de recursos (externos)
Arquitectura cliente-servidor
● Servidor:
● Comparte recursos y brinda un
servicio
● Mayoría de servicios de internet:
● Email, Web, DNS, etc.
● Son cliente-servidor
● Protocolo TCP/IP
● Cliente/Servidor
● Alguien inicia una comunicación
● Alguien espera una comunicación
● Protocolo HTTP
● Sobre TCP/IP
Arquitectura cliente-servidor
Modelo de Capas (OSI)
Arquitectura cliente-servidor
Request
Response
Cliente
Servidor
Arquitectura cliente-servidor
Arquitectura cliente-servidor
● Protocolo HTTP: Hypertext Transfer
Protocol
● Protocolo de request-response
● Sus recursos se identifican con URLs
● Posee un Header
● Se transmite texto plano
● Sin estado
Arquitectura cliente-servidor
● Request:
● Dirección (URL).
● Versión del protocolo.
● Campos (Por Ej. “Accept-Language:
en”).
● Cuerpo de mensaje (opcional).
● Método (GET,POST,DELETE,etc.)
● Definen la acción a realizar
● Las acciones se definen en el server.
Arquitectura cliente-servidor
● Response:
● Dirección (URL).
● Versión del protocolo.
● Campo estado (200,404, etc.)
● Campos (por Ej. “Content-Type:
text/html”)
● Cuerpo de mensaje (opcional).
Tipos de métodos
Parámetros en la URL
● Es posible especificar parámetros como
parte de una URL.
● Utilizado con el método GET para
especificar la búsqueda de un recurso o
ejecución de un servicio
● Formato:
baseURL/resource?
parameter_1=value_1&parameter_2=value_2
● Ejemplo:
https://www.paper.com/publication?
day=1&month=12&year=2019
Arquitectura cliente-servidor: Ejemplo
Arquitectura cliente-servidor: Ejemplo
Arquitectura cliente-servidor: Ejemplo
Tecnologías: Lado cliente
● HTML
● CSS
● Javascript
<!DOCTYPE html>
<html lang="es">
<head>
<link href="bootstrap.min.css" rel="stylesheet">
<script src="run_prettify.js"></script>
</head>
<body>
...
Tecnologías: Lado cliente
● HTML
● CSS
● Javascript
Tecnologías: Lado server
● Servidores web
● NodeJS (Javascript)
● Tomcat/Jeti/Weblogic (Java)
● Apache web server (PHP,C/C++,Python)
● NGINX (contenido estático)
● Lighttpd (C/C++,Python,PHP)
Tecnologías: Lado server
● Bases de datos
● Relacionales
● MySQL, MariaDB, Oracle, SQLITE
● No Relacionales
● MongoDB, Cassandra, Redis, Neo4j
Tipos de aplicaciones en servidor
● Servidor de contenido estático (archivos
multimedia, archivos js, etc.)
● Servidor de contenido web
(HTML,CSS,JS)
● Servicio web RESTful (JSON,XML)
● Servidor websocket
● MQTT broker
● Otros
● Fielding, Roy T.; Gettys, James; Mogul, Jeffrey
C.; Nielsen, Henrik Frystyk; Masinter, Larry;
Leach, Paul J.; Berners-Lee, Tim (June 1999).
Hypertext Transfer Protocol – HTTP/1.1
● Practical Internet of Things with JavaScript.
Arvind Ravulavaru. 2017. Packt>
● Raspberry Pi for Arduino Users - Building IoT and
Network Applications and devices. James R.
Strickland. 2018. Apress.
● https://restfulapi.net
● https://en.wikipedia.org/wiki/Hypertext_Transfer
_Protocol
● https://en.wikipedia.org/wiki/URL
●
Bibliografía

Más contenido relacionado

Similar a Tecnologias_WEB.pdf

Dce2 introduccion asp.net primeras 20
Dce2 introduccion asp.net primeras 20Dce2 introduccion asp.net primeras 20
Dce2 introduccion asp.net primeras 20
Marvin Romero
 
Generación de web sites dinámicos usando php
Generación de web sites dinámicos usando phpGeneración de web sites dinámicos usando php
Generación de web sites dinámicos usando php
victdiazm
 
Generación de web sites dinámicos usando php
Generación de web sites dinámicos usando phpGeneración de web sites dinámicos usando php
Generación de web sites dinámicos usando php
Carlos Cruz Rincon
 

Similar a Tecnologias_WEB.pdf (20)

Full-stack JavaScript: Desarrollo integral de aplicaciones Web con JavaScript
Full-stack JavaScript: Desarrollo integral de aplicaciones Web con JavaScriptFull-stack JavaScript: Desarrollo integral de aplicaciones Web con JavaScript
Full-stack JavaScript: Desarrollo integral de aplicaciones Web con JavaScript
 
Sitios web de alto rendimiento y alta disponibilidad
Sitios web de alto rendimiento y alta disponibilidadSitios web de alto rendimiento y alta disponibilidad
Sitios web de alto rendimiento y alta disponibilidad
 
Dce2 introduccion asp.net primeras 20
Dce2 introduccion asp.net primeras 20Dce2 introduccion asp.net primeras 20
Dce2 introduccion asp.net primeras 20
 
Integración de Tecnologías y Plataformas.pptx
Integración de Tecnologías y Plataformas.pptxIntegración de Tecnologías y Plataformas.pptx
Integración de Tecnologías y Plataformas.pptx
 
Generación de web sites dinámicos usando php
Generación de web sites dinámicos usando phpGeneración de web sites dinámicos usando php
Generación de web sites dinámicos usando php
 
Generacion de web sites dinamico
Generacion de web sites dinamicoGeneracion de web sites dinamico
Generacion de web sites dinamico
 
Serverless: La evolucion de la arquitectura a la nube
Serverless: La evolucion de la arquitectura a la nubeServerless: La evolucion de la arquitectura a la nube
Serverless: La evolucion de la arquitectura a la nube
 
Adaptación de JMeter para la minería de datos de estructuras de páginas web.
Adaptación de JMeter para la minería de datos de estructuras de páginas web.Adaptación de JMeter para la minería de datos de estructuras de páginas web.
Adaptación de JMeter para la minería de datos de estructuras de páginas web.
 
S4-PD1-2.2 EF
S4-PD1-2.2 EFS4-PD1-2.2 EF
S4-PD1-2.2 EF
 
Generación de web sites dinámicos usando php
Generación de web sites dinámicos usando phpGeneración de web sites dinámicos usando php
Generación de web sites dinámicos usando php
 
Generación de web sites dinámicos usando php
Generación de web sites dinámicos usando phpGeneración de web sites dinámicos usando php
Generación de web sites dinámicos usando php
 
Headless Wordpress with React & GraphQL
Headless Wordpress with React & GraphQLHeadless Wordpress with React & GraphQL
Headless Wordpress with React & GraphQL
 
TEMA 5_ SERVICIOS_WEB_PRESENTACION.pptx
TEMA 5_ SERVICIOS_WEB_PRESENTACION.pptxTEMA 5_ SERVICIOS_WEB_PRESENTACION.pptx
TEMA 5_ SERVICIOS_WEB_PRESENTACION.pptx
 
Aplicaciones distribuidas
Aplicaciones distribuidasAplicaciones distribuidas
Aplicaciones distribuidas
 
S2-PD2.pptx
S2-PD2.pptxS2-PD2.pptx
S2-PD2.pptx
 
S2-PD2.pptx
S2-PD2.pptxS2-PD2.pptx
S2-PD2.pptx
 
Aplicaciones Web
Aplicaciones WebAplicaciones Web
Aplicaciones Web
 
Apuntes entorno cliente servidor
Apuntes entorno cliente   servidorApuntes entorno cliente   servidor
Apuntes entorno cliente servidor
 
2. Revision de Tecnologias Web.pdf
2. Revision de Tecnologias Web.pdf2. Revision de Tecnologias Web.pdf
2. Revision de Tecnologias Web.pdf
 
capa de aplicacion-sisco-netwokrs.pptx
capa de aplicacion-sisco-netwokrs.pptxcapa de aplicacion-sisco-netwokrs.pptx
capa de aplicacion-sisco-netwokrs.pptx
 

Último (6)

Vision de asignatura ESTRUCTURA DE DATOS.pptx
Vision de asignatura ESTRUCTURA DE DATOS.pptxVision de asignatura ESTRUCTURA DE DATOS.pptx
Vision de asignatura ESTRUCTURA DE DATOS.pptx
 
La busqueda de la relevancia en la economia (Harberger).pptx
La busqueda de la relevancia en la economia (Harberger).pptxLa busqueda de la relevancia en la economia (Harberger).pptx
La busqueda de la relevancia en la economia (Harberger).pptx
 
PRESENTACION SISTEMAS OPERATIVOS MOVILES_20240424_235225_0000.pdf
PRESENTACION SISTEMAS OPERATIVOS MOVILES_20240424_235225_0000.pdfPRESENTACION SISTEMAS OPERATIVOS MOVILES_20240424_235225_0000.pdf
PRESENTACION SISTEMAS OPERATIVOS MOVILES_20240424_235225_0000.pdf
 
CLASE 1 H.I.pptx,INFORMATICANIVEL AVANZADO
CLASE 1 H.I.pptx,INFORMATICANIVEL AVANZADOCLASE 1 H.I.pptx,INFORMATICANIVEL AVANZADO
CLASE 1 H.I.pptx,INFORMATICANIVEL AVANZADO
 
La muerte de El Senequita (Amadeo Martinez-Ingles).pdf
La muerte de El Senequita (Amadeo Martinez-Ingles).pdfLa muerte de El Senequita (Amadeo Martinez-Ingles).pdf
La muerte de El Senequita (Amadeo Martinez-Ingles).pdf
 
Mapa conceptual de el hardware y software
Mapa conceptual de el hardware y softwareMapa conceptual de el hardware y software
Mapa conceptual de el hardware y software
 

Tecnologias_WEB.pdf

  • 1. WEB. Arquitectura, tecnologías y herramientas Autor: Esp. Ing. Ernesto Gigliotti. UTN-FRA
  • 2. ● Cliente: ● Consumidor de recursos (externos) Arquitectura cliente-servidor ● Servidor: ● Comparte recursos y brinda un servicio ● Mayoría de servicios de internet: ● Email, Web, DNS, etc. ● Son cliente-servidor
  • 3. ● Protocolo TCP/IP ● Cliente/Servidor ● Alguien inicia una comunicación ● Alguien espera una comunicación ● Protocolo HTTP ● Sobre TCP/IP Arquitectura cliente-servidor
  • 7. Arquitectura cliente-servidor ● Protocolo HTTP: Hypertext Transfer Protocol ● Protocolo de request-response ● Sus recursos se identifican con URLs ● Posee un Header ● Se transmite texto plano ● Sin estado
  • 8. Arquitectura cliente-servidor ● Request: ● Dirección (URL). ● Versión del protocolo. ● Campos (Por Ej. “Accept-Language: en”). ● Cuerpo de mensaje (opcional). ● Método (GET,POST,DELETE,etc.) ● Definen la acción a realizar ● Las acciones se definen en el server.
  • 9. Arquitectura cliente-servidor ● Response: ● Dirección (URL). ● Versión del protocolo. ● Campo estado (200,404, etc.) ● Campos (por Ej. “Content-Type: text/html”) ● Cuerpo de mensaje (opcional).
  • 11. Parámetros en la URL ● Es posible especificar parámetros como parte de una URL. ● Utilizado con el método GET para especificar la búsqueda de un recurso o ejecución de un servicio ● Formato: baseURL/resource? parameter_1=value_1&parameter_2=value_2 ● Ejemplo: https://www.paper.com/publication? day=1&month=12&year=2019
  • 15. Tecnologías: Lado cliente ● HTML ● CSS ● Javascript <!DOCTYPE html> <html lang="es"> <head> <link href="bootstrap.min.css" rel="stylesheet"> <script src="run_prettify.js"></script> </head> <body> ...
  • 16. Tecnologías: Lado cliente ● HTML ● CSS ● Javascript
  • 17.
  • 18. Tecnologías: Lado server ● Servidores web ● NodeJS (Javascript) ● Tomcat/Jeti/Weblogic (Java) ● Apache web server (PHP,C/C++,Python) ● NGINX (contenido estático) ● Lighttpd (C/C++,Python,PHP)
  • 19. Tecnologías: Lado server ● Bases de datos ● Relacionales ● MySQL, MariaDB, Oracle, SQLITE ● No Relacionales ● MongoDB, Cassandra, Redis, Neo4j
  • 20. Tipos de aplicaciones en servidor ● Servidor de contenido estático (archivos multimedia, archivos js, etc.) ● Servidor de contenido web (HTML,CSS,JS) ● Servicio web RESTful (JSON,XML) ● Servidor websocket ● MQTT broker ● Otros
  • 21. ● Fielding, Roy T.; Gettys, James; Mogul, Jeffrey C.; Nielsen, Henrik Frystyk; Masinter, Larry; Leach, Paul J.; Berners-Lee, Tim (June 1999). Hypertext Transfer Protocol – HTTP/1.1 ● Practical Internet of Things with JavaScript. Arvind Ravulavaru. 2017. Packt> ● Raspberry Pi for Arduino Users - Building IoT and Network Applications and devices. James R. Strickland. 2018. Apress. ● https://restfulapi.net ● https://en.wikipedia.org/wiki/Hypertext_Transfer _Protocol ● https://en.wikipedia.org/wiki/URL ● Bibliografía