Está en la página 1de 16

La Web como plataforma de desarrollo de software

Protocolo HTTP
HTTP (Hypertext Transfer Protocol) es un protocolo que permite realizar una solicitud de
datos o recursos, por ejemplo documentos HTML, XML, archivos de estilos, entre otros.
Este protocolo es la base de intercambios de datos en la Web. Es un protocolo de
estructura cliente-servidor, esto indica que una solicitud se realiza desde el cliente
(normalmente un navegador) y el servidor envía la respuesta de esta solicitud.

Clientes y servidores se comunican intercambiando mensajes individuales. Los mensajes


que envía el cliente son denominados peticiones, mientras los enviados por el servidor
respuestas.

El protocolo HTTP fue diseñado a principios de 1990, que desde esa época ha ido
evolucionando. Es lo que se conoce como un protocolo de capa de aplicación y se transmite
sobre el protocolo TCP, o el protocolo encriptado TLS.

Características clave del protocolo HTTP


● HTTP es sencillo
HTTP está pensado y desarrollado para ser leído y fácilmente interpretado por las
personas, haciendo fácil la depuración de errores.

● HTTP es extensible
Pueden añadirse más funcionalidades sin más que la propia arquitectura de cliente-
servidor.

● HTTP es un protocolo con sesiones, pero sin estados


HTTP no guarda ningún dato entre dos peticiones en la misma sesión. El
almacenamiento de datos normalmente se realiza por medio de HTTP cookies.

¿Qué se puede controlar con HTTP?


● Cache
El cómo se almacenan los documentos en la caché, puede ser especificado por
HTTP.

● Flexibilidad del requisito de origen


Para prevenir invasiones de privacidad, los navegadores permiten únicamente a
páginas del mismo origen compartir información o datos. Mediante la cabecera se
puede configurar esta característica para permitir datos de orígenes distintos.

● Sesiones
El uso de HTTP Cookies permite relacionar peticiones con el estado del servidor.
Esto define las sesiones, a pesar de que por definición, el protocolo HTTP es un
protocolo sin estados.
Flujo de HTTP
Cuando un cliente quiere comunicarse con el servidor, realiza los siguientes pasos:

Imagen 1: Flujo del protocolo HTTP

1. Abre una conexión TCP:


Usada para realizar una o varias peticiones y recibir la respuesta.

2. Realizar una petición HTTP:


Los mensajes HTTP son legibles en texto plano.
GET / HTTP/1.1
Host: demo.com
Accept-Language: es

3. Leer la respuesta enviada por el servidor:

HTTP/1.1 200 OK
Date: Sat, 16 Jul 2022 14:28:02 GMT
Server: Apache
ETag: "51142bc1-7449-479b075b2891b"
Accept-Ranges: bytes
Content-Length: 29769
Content-Type: text/html

<!DOCTYPE html... (here comes the 29769 bytes of the requested web page)

4. Cierra la conexión o utiliza la conexión para futuras peticiones.

Códigos de estado:
Los códigos de estado indican el estado de la respuesta a la solicitud HTTP realizada, a
continuación, se listan estos estados.
Para tener una representación gráfica de cada uno de los códigos de estado HTTP, diríjase
a la siguiente dirección: https://http.cat/
100 Continue 410 Gone
101 Switching Protocols 411 Length Required
103 Early Hints 412 Precondition Failed
200 OK 413 Payload Too Large
201 Created 414 URI Too Long
202 Accepted 415 Unsupported Media Type
203 Non-Authoritative Information 416 Range Not Satisfiable
204 No Content 417 Expectation Failed
205 Reset Content 418 I'm a teapot
206 Partial Content 422 Unprocessable Entity
300 Multiple Choices 425 Too Early
301 Moved Permanently 426 Upgrade Required
302 Found 428 Precondition Required
303 See Other 429 Too Many Requests
304 Not Modified 431 Request Header Fields Too Large
307 Temporary Redirect 451 Unavailable For Legal Reasons
308 Permanent Redirect 500 Internal Server Error
400 Bad Request 501 Not Implemented
401 Unauthorized 502 Bad Gateway
402 Payment Required 503 Service Unavailable
403 Forbidden 504 Gateway Timeout
404 Not Found 505 HTTP Version Not Supported
405 Method Not Allowed 506 Variant Also Negotiates
406 Not Acceptable 507 Insufficient Storage
407 Proxy Authentication Required 508 Loop Detected
408 Request Timeout 510 Not Extended
409 Conflict 511 Network Authentication Required

Métodos de petición HTTP:


Cada uno de los métodos HTTP tiene su propia función, por ejemplo el método POST
puede servirnos para enviar datos hacia el servidor en el cuerpo de la petición, el tipo de
cuerpo es indicado en la cabecera por medio de Content-Type.

A continuación, se listan los métodos de petición HTTP:


1. CONNECT
El método CONNECT establece un túnel hacia el servidor identificado por el recurso.

2. DELETE
El método DELETE borra un recurso en específico.

3. GET
El método GET solicita una representación de un recurso específico. Las peticiones
que usan el método GET sólo deben recuperar datos.

4. HEAD
El método HEAD pide una respuesta idéntica a la de una petición GET, pero sin el
cuerpo de la respuesta.

5. OPTIONS
El método OPTIONS es utilizado para describir las opciones de comunicación para
el recurso de destino.

6. PATCH
El método PATCH es utilizado para aplicar modificaciones parciales a un recurso.

7. POST
El método POST se utiliza para enviar una entidad a un recurso en específico,
causando a menudo un cambio en el estado o efectos secundarios en el servidor.

8. PUT
El modo PUT reemplaza todas las representaciones actuales del recurso de destino
con la carga útil de la petición.

9. TRACE
El método TRACE realiza una prueba de bucle de retorno de mensaje a lo largo de
la ruta al recurso de destino.

Protocolo HTTP:
https://developer.mozilla.org/es/docs/Web/HTTP/Overview
https://aprendiendoarduino.wordpress.com/2016/07/04/protocolo-http/
https://developer.mozilla.org/es/docs/Web/HTTP/Methods/
https://developer.mozilla.org/es/docs/Web/HTTP/Status
Fundamentos del DOM en navegadores
El Document Object Model (DOM) es una interfaz de programación para los documentos
HTML y XML. Facilita una representación estructurada del documento y define de qué
manera los programas pueden acceder, con el fin de modificar, tanto su estructura, estilo y
contenido. El DOM da una representación del documento como un grupo de nodos y
objetos estructurados que tienen propiedades y métodos. Esencialmente, conecta las
páginas web a scripts o lenguajes de programación.

El DOM otorga formas de presentar, guardar y manipular los datos de un documento y


puede ser modificado con un lenguaje de script como JavaScript.

A los ojos de JS, el DOM es un objeto con el que podremos leer y modificar el contenido de
una página web a nuestro antojo.

Selectores
El primer paso para entender la manipulación del DOM, es entender el manejo de los
selectores, estos selectores nos permiten realizar operaciones de lectura o modificación del
DOM.

Selectores tradicionales
● .getElementById()
Permite la selección de un elemento por su id.

// <div id=“miDiv”></div>
document.getElementById(“miDiv”);

● .getElementsByName()
Permite la selección de varios elementos por su atributo name.

// <form name=“miForm”></form>
document.getElementsByName(“miForm”);

● .getElementsByTagName()
Permite la selección de varios elementos por su etiqueta.

// <input>
document.getElementsByTagName(“input”);

● .getElementsByClassName()
Permite la selección de varios elementos por su clase.

// <form name=“miForm”></form>
document.getElementsByName(“miForm”);
Alterando el DOM
A continuación, se presenta una recopilación simplificada de los métodos más utilizados
para la manipulación del DOM con JavaScript.

● .textContent
Nos devuelve el texto de un elemento previamente seleccionado.

● .classList.contains()
Verifica si contiene cierta clase.

● .classList.add()
Permite añadir una clase al elemento.

● .classList.remove(className)
Permite eliminar una clase del elemento.

● .cloneNode()
Permite clonar un nodo y clonar o no, sus nodos hijos también.

● .innerHTML
Cambia o devuelve la sintaxis HTML de un elemento… así como de sus hijos.

● .getAttribute()
Devolver el valor de cierto atributo o una cadena vacía en caso de no existir.

● .setAttribute()
Cambiar el valor de un atributo o lo añade si no existe.

JavaScript, ¡Inspírate! - Ulises Gascón Gonzalez (Parte III - Web dinámica y conectada… → DOM)
https://leanpub.com/javascript-inspirate
https://developer.mozilla.org/es/docs/Web/API/Node/textContent
https://developer.mozilla.org/es/docs/Web/API/Element/classList
https://developer.mozilla.org/es/docs/Web/API/Node/cloneNode
https://developer.mozilla.org/es/docs/Web/API/Element/innerHTML
https://developer.mozilla.org/es/docs/Web/API/Element/getAttribute
https://developer.mozilla.org/es/docs/Web/API/Element/setAttribute
Servidores Web
Los servidores web son ordenadores con software específico para prestar el servicio de
transmitir la información pedida por clientes. Los servidores web se comunican comúnmente
por medio de navegadores usando el protocolo HTTP. Además, soportan el protocolo de
correos SMTP (Simple Mail Transfer Protocol) y FTP (File Transfer Protocol).

Los servidores también son usados para almacenar los datos para una aplicación web,
levantando páginas web simples o múltiples usando virtualizaciones.

¿Cómo funciona un servidor web internamente?


Cuando el servidor recibe una solicitud de contenido para una página web como esta:

http://www.mipagina.com/index.html

El servidor carga el archivo desde el almacenamiento del servidor a través de la red del
usuario por medio del navegador a través del protocolo HTTP. El flujo de esta solicitud se
presenta a continuación:

Imagen 2: Flujo de solicitud y respuesta de un servidor web

1. El usuario realiza la solicitud del documento (index.html)


2. El servidor web busca el documento en su sistema de archivos.
3. El servidor web retorna el archivo del sistema de archivos.
4. El Servidor web retorna el documento al navegador.
Opciones de mercado
A continuación, se detallan algunos tipos de servidores utilizados en la industria del
software, como puede observar en la siguiente imagen, Nginx es el servidor más utilizado
en el mercado de servidores web.

Imagen 3: Estadística de uso de servidores web

Nginx
Es un servidor web de código abierto y de alto rendimiento, lanzado en el año 2004.
Empresas como Netflix o Pinterest utilizan servidores Nginx. Según W3Techs, Nginx posee
un 33.7 % del mercado de servidores web a julio de 2022.

El éxito de Nginx es por su capacidad de resolver el problema c10k (que impide que
algunos servidores web puedan gestionar más de 10,000 conexiones simultáneas.

Características:
● Gratuito y de código abierto
● Arquitectura asíncrona basada en eventos
● Alto rendimiento
● Bajo consumo de memoria
● Compatibilidad con IPv6
Apache
El servidor apache, se lanzó en 1995 y es un servidor web gratuito y de código abierto;
desarrollado y mantenido por ASF (Apache Software Foundation). Apache posee un 31.4 %
del mercado de servidores según W3Techs a julio de 2022.

Apache es uno de los servidores web más populares del mundo. Es muy flexible y
personalizable, ofrece varios módulos de seguridad y autenticación.

Características:
● Gratuito y de código abierto
● Arquitectura basada en módulos
● Fácil configuración y personalización
● Actualizaciones y parches de seguridad regulares
● Gran comunidad de desarrolladores
● Compatibilidad con IPv6

Microsoft IIS
Microsoft Internet Information Services (IIS) fue lanzado en 1995, su arquitectura modular
permite añadir y quitar extensiones con facilidad. Cuenta con múltiples características de
seguridad y mecanismos de autenticación. Se usa frecuentemente para alojar sitios
estáticos y aplicaciones web ASP.NET. Microsoft IIS posee un 6 % del mercado según
W3Techs a julio de 2022.

Características:
● Arquitectura basada en módulos
● Seguridad y control
● Gestión remota

NodeJS
Tiene varias cualidades que permiten varios beneficios para ciertos proyectos y otras
características. NodeJS a pesar de ser un servidor relativamente nuevo, posee un 2 % del
mercado según W3Techs a julio de 2022.

Características:
● Su velocidad:
● Adaptabilidad, está pensado para la web, pero es útil para aplicaciones de consola,
aplicaciones de escritorio, robótica e internet de las cosas.
● Asíncrono
● Capacidad de integrarse con diferentes stacks (conjunto de tecnologías). Ej. MERN
(Mongo, Express, React, Node) o MEAN (Mongo, Express, Angular, Node).
Tomcat
Tomcat es un contenedor open source de servlets para la implementación de Java Servlet,
Java Server Pages (JSP), Java Expression Language y Java WebSocket. Tomcat posee un
0.1 % del mercado según W3Techs a julio de 2022.

Características:
● Es gratuito y de fácil instalación
● Sencillo para el lanzamiento de una aplicación web.

https://nanduribalajee.medium.com/what-is-a-web-server-5c28c9391464
https://www.stackscale.com/es/blog/top-servidores-web/
https://w3techs.com/technologies/overview/web_server
https://www.mytaskpanel.com/node-js-caracteristicas-y-casos-de-uso-de-esta-tecnologia/
Herramientas de desarrollo
Las herramientas de desarrollo de aplicaciones web le permiten crear aplicaciones
web a las que pueden acceder los usuarios en internet en sus navegadores web.

La siguiente es una lista de algunos de los productos IBM que puede utilizar para
crear aplicaciones web preparadas para la empresa:
IBM i Access para Web
IBM i Access para Web permite a los usuarios finales aprovechar la información del
negocio, las aplicaciones y los recursos por toda la empresa extendiendo los
recursos de IBM i al escritorio de cliente mediante un navegador web.
IBM Rational Developer para i
IBM Rational Developer para i es un entorno de desarrollo integrado (IDE)
construido en la plataforma Eclipse. Diseñado para la creación y el mantenimiento
de aplicaciones en sistemas IBM i, reside en el escritorio del desarrollador,
soportando el desarrollo en modalidades de conectado a host y desconectado.
IBM Rational Application Developer para WebSphere Software
IBM Rational Application Developer para WebSphere Software ayuda a los
desarrolladores de Java™ a diseñar rápidamente, desarrollar, montar, probar,
perfilar y desplegar aplicaciones de alta calidad Java/Java EE, Portal, Web/Web 2.0,
OSGi, servicios web y SOA.
IBM Rational Host Access Transformation Services
IBM Rational Host Access Transformation Services transforma rápidamente las
aplicaciones de pantalla verde 3270 y 5250 en interfaces de usuario intuitivas de
web, portlet, cliente rico o dispositivo móvil, y amplía las pantallas verdes de 3270,
5250 y VT como servicios web estándar.
IBM Lotus Workflow
El software IBM Lotus Workflow es una herramienta de desarrollo de aplicaciones
de flujo de trabajo autónoma que amplía las prestaciones de flujo de trabajo nativo
del software de IBM Domino y acelera la creación y el despliegue de aplicaciones
orientadas al flujo de trabajo.

La Accesibilidad permite el acceso universal a la Web para todos los usuarios


independientemente de sus posibles limitaciones, tanto personales (algún tipo de
discapacidad, edad, nivel cultural, etc.), como derivadas del entorno (iluminación,
ruido, etc.) o de la tecnología empleada (dispositivo, velocidad de conexión,
software, etc.). En los últimos años, la Accesibilidad Web se ha convertido en
varios países del mundo en una preocupación porque atañe directamente a la
posibilidad de acceso de los ciudadanos a la información, comunicación y servicios
(públicos y privados) ofrecidos a través de la Web.

Es así como el consorcio W3C ha desarrollado recomendaciones, denominadas


Directrices de Accesibilidad al Contenido Web, versión 1.0 (WCAG 1.0) [19] y
versión 2.0 [20], que son recomendaciones de Accesibilidad consideradas como
normas de facto y citadas como referencia obligada en la mayoría de las
legislaciones sobre Tecnologías de la Información y Comunicación (TICs) de todo
el mundo. Por ejemplo, la Section 508 de Estados Unidos [18], el PAS 78 del Reino
Unido [16], la Legislación Italiana [17], y la ley 26.653 denominada “Guía de
Accesibilidad para Sitios Web del Sector Público Nacional”1 de Argentina, entre
otras. Si bien existen varias técnicas y/o herramientas que asisten a la producción y
evaluación de contenido accesible, la oferta se debilita cuando se trata de propuestas
que permitan aplicar estos instrumentos de Accesibilidad al terreno de una
implementación concreta y para mejorar la experiencia de los usuarios Web en los
diferentes dominios de aplicación. A más de doce años en que el consorcio W3C
lanzó las recomendaciones WCAG 1.0, el balance sobre el estado de la WWW
desde la perspectiva de accesibilidad, es poco alentador.

A pesar de los esfuerzos invertidos por diversos organismos y la producción


propuesta por los grupos de investigación, la conformidad a la Accesibilidad sigue
siendo una propiedad difícil de alcanzar por los productos desarrollados para la
Web. En la Web coexisten aplicaciones con diferentes grados de complejidad que
van desde aplicaciones de hipermedia Web (presencias Web básicas) hasta
aplicaciones Web propiamente dichas (sistemas Web complejos) con escalas
intermedias en las denominadas aplicaciones de Software Web. En este contexto,
los expertos en Accesibilidad deben no sólo proveer buenas prácticas de diseño,
evaluación y/o re-diseño accesible, sino que también, propuestas concretas para
transferir las mismas al desarrollo de los diferentes productos requeridos por la
Web.

Editores
Entornos de Desarrollo Como el resto de los programas, los compiladores corren en el
contexto de un sistema operativo; dependiendo el sistema, la integración puede ser más o
menos orgánica. El compilador, el editor, el depurador, las bibliotecas, y otras utilidades
conforman la caja de herramientas de desarrollo, junto con el sistema operativo donde
corren, constituyen el entorno de desarrollo. Editores Una actividad principal del
desarrollador es escribir código fuente, quizás la principal es leer código fuente.

Para eso es necesario poder acceder al texto del programa de forma amigable y eficiente
con editores de texto plano ó, hace ya unos años, editores de código fuente, que son
editores de texto especializados para el código fuente. Ejemplos de editores de texto de
código fuente son Visual Studio Code, Notepad++ (Windows), Sublime Text, TextMate
(macOS), vi, y Vim. IDEs Los IDE (Integrated Development Environment, Entornos
Integrados de Desarrollo) son paquetes de software que proveen una solución todo en uno:
desde el editor, pasando por el compilador, depurador, y empaquetador, hasta la ayuda
sobre la tecnología de desarrollo y otras herramientas que facilitan el desarrollo.

Estos sistemas son muy productivos, pero pueden ser avasalladores al principio y consumir
muchos recursos de nuestro sistema. Integración con Sistema Operativo En sistemas
operativos tipo-Unix, como por ejemplo GNU/Linux y macOS, hay una integración orgánica
entre el sistema y las herramientas desarrollo basadas en un compilador C. Esto se debe a
que la relación entre Unix, creado por Ken Thompson y Dennis Ritchie, y el Lenguaje C,
creado por Ritchie, es muy estrecha, y se remonta al origen de ambos con el compilador de
C llamado cc (C compiler).
En esos sistemas es común que haya pre-instalado un compilador de C/C++; aunque en
macOS requiere la instalación a demanda de Xcode o sus Command Line Tools. Los
compiladores más populares para estos sistemas con gcc y clang. En Windows la historia
es diferente, aunque existe una gran cantidad de compiladores libres y comerciales para
ese sistema operativo, no tienen integración orgánica como sí ocurre en sistemas tipo Unix.
Pero hay una opción que es MinGW, un paquete de software que porta las herramientas de
desarrollo de entornos tipo-Unix y las disponibiliza en Windows. OK.

Todo Bien ¿Pero Cuál Compilador Instalo? La respuesta rápida es: "cualquiera C++17 ,
siempre y cuando compile para C18 o superior en el caso de C++." en el caso de C y para
Lo interesante es que explores, pruebes y decidas por vos mismo. Pero, para facilitar los
primeros pasos, en la próxima parte de este texto te contamos cómo instalar y dejar
funcionando un entorno desarrollo basado en el set de herramientas MinGW y el editor de
código fuente Visual Studio Code corriendo sobre el sistema operativo Windows. Si tenes
un GNU/Linux, probablemente ya tengas instalado gcc o clang, así que MinGW no es
necesario.

Es también probable que estés acostumbrado al uso de la línea de comando y tengas un


editor de texto preferido, pero de todas maneras también podes instalar Code para
GNU/Linux o un IDE como Eclipse CDT, que también está disponible para Windows y
macOS. Si tenes macOS, el estándar de facto es el Xcode, un IDE muy popular para esta
plataforma. Recordá que macOS requiere que explícitamente descargues las herramientas
de desarrollo para línea de comando. Pero también podes armar tu propio entorno basado
en Code, en un editor de texto, o en otro IDE como Eclipse CDT.

HERRAMIENTAS PARA EL DESARROLLO DE SISTEMAS

En general, una herramienta es cualquier dispositivo que, cuando se emplea en forma


adecuada, mejora el desempeño de una tarea, tal como el desarrollo de sistemas de
información basados en computadora. En general las herramientas se agrupan en las
siguientes categorías:Análisis, Diseño y
Desarrollo.

Herramientas para análisis:

Estas herramientas ayudan a los especialistas en sistemas a documentar un sistema


existente, ya sea éste manual o automatizado, y a determinar los requerimientos de una
nueva aplicación. Estas herramientas incluyen :

• Herramientas para recolección de datos: capturan detalles que describen sistemas y


procedimientos en uso, documentan procesos y actividades de decisión
• Herramientas para diagramación: crean representaciones gráficas o modelos de
sistemas, apoyan el dibujo y la revisión de diagramas e íconos
• Herramientas para el diccionario: registran y mantienen descripciones de los
elementos del sistema. Con frecuencia proporcionan la capacidad de examinar las
descripciones del sistema para deducir si son incompletas o inconsistentes, muchas
incluyen la facilidad de reportar donde se utilizar los elementos del sistema.
Las herramientas de análisis, por su gran utilidad, más que en cualquier otra categoría,
están siendo ya automatizadas tanto para mejorar la eficiencia del analista como para
permitir obtener del esfuerzo de análisis, resultados más completos y exactos.

Herramientas para diseño:


Las herramientas para diseño apoyan el proceso de formular las características que el
sistema debe tener para satisfacer los requerimientos detectados durante las actividades de
análisis:

• Herramientas de especificación: apoyan el proceso de formular las características


que deben tener una aplicación, tales como entradas, salidas, procesamiento y
especificaciones.
• Herramientas para presentación: se utilizan para describir la posición de datos,
mensajes y encabezados sobre pantallas de terminales, reportes y otros medios de entrada
y salida.

Los analistas han utilizado las herramientas para el diseño de sistemas desde el inicio de la
era de las computadoras. Sin embargo, la reciente infusión de ayuda computarizada así
como la facilidad de generar gráficas de gran calidad están dando a estas herramientas un
nuevo significado en el diseño de sistemas.

Herramientas para el desarrollo

Estas herramientas ayudan al análisis a trasladar los diseños en aplicaciones funcionales:

• Herramientas para ingeniería de software: apoyan el proceso de formular


diseños de software, incluyendo procedimientos y controles, así como la documentación
correspondiente.
• Generadores de código: producen el código fuente y las aplicaciones a partir
de especificaciones funcionales bien articuladas.
• Herramientas para pruebas: apoyan la fase de evaluación de un sistema o de
partes del mismo contra las especificaciones. Incluyen facilidades para examinar la correcta
operación del sistema así como el grado de perfección alcanzado en comparación con las
expectativas.

La difusión de procesamiento computarizado, aunado con prácticas de diseño sofisticadas,


está cambiando en forma dramática la manera en que se trasladan las especificaciones de
diseño en sistemas de información funcionales.
Herramientas de Versionamiento.
Pendiente

También podría gustarte