# Resumen DSW-UT01

## Evolución de la Web e Internet
El **éxito de internet** está absolutamente ligado a **la web**. Inicialmente **en internet no había páginas web**, **tenía** servicios como **correo electrónico**, la **transmisión de ficheros** o los **grupos de noticias**, que permitían realizar muchas de las tareas que se siguen realizando actualmente. Pero no había World Wide Web, los diferentes servicios se realizaban a través de software cliente especializado en la tarea concreta.

Hay varias razones para el éxito de la web:
- Su manejo es sencillo
- Es muy visual
- Sólo necesitamos un único software: El navegador

## Aplicaciones Web
- **Aplicación**: Software que permite al usuario realizar una determinada tarea o servicio
- **Aplicación Web**: Aplicación creada para ser ejecutada por un navegador

Las **aplicaciones web se crean en HTML y sus tecnologías asociadas** (CSS, JavaScript...)
Aunque **los navegadores no tienen capacidad para compilar código de lenguajes clásicos** (C, C++, Pascal...) **sí contienen intérpretes muy potentes** para lenguajes incrustados en las aplicaciones web (especialmente JavaScript) como es el caso del **motor V8** del navegador de Google Chrome.

### Ventajas de las Aplicaciones Web
1. **Gran compatibilidad**: Funcionan en todo tipo de sistemas, tanto de escritorio como sistemas móviles. Lo único que requieren es un navegador.
2. **Requerimientos mínimos en el cliente**: A veces ciertas aplicaciones web requieren determinados navegadores o bien ciertos plugins, pero disponiendo de un navegador de última generación no debería requerir nada más.
3. **Fáciles de manejar por los usuarios.**
4. **Facilidad de mantenimiento**: Las aplicaciones web también se actualizan, pero sólo en el servidor en el que se alojan.
5. **Datos centralizados**.
6. **No hay instalación**.
7. **Costes reducidos en su implantación**.
8. **Accesibles desde diferentes máquinas y ubicaciones**.
9. **Se permite el uso de Thin Clients**: Los Thin Clients son los llamados **clientes ligeros**, **software y hardware de baja potencia**. Las aplicaciones web son capaces de funcionar incluso en ordenadores ya obsoletos

### Desventajas de las Aplicaciones Web
1. **Menos potentes**.
2. **Aprovechan peor el hardware**.
3. **Se requiere conectividad**.
4. **Las aplicaciones web son más difíciles de crear**.
5. **Delegación del control de nuestra información**: Nuestros datos se almacenan en Internet, y dependemos de la empresa que gestione la app

## La web 1.0, web 2.0 y la web 3.0

### Web 1.0
Las primeras aplicaciones web eran poco más que un conjunto de **páginas que servían información estática** a los usuarios sin prácticamente interaccionar con ellos. Esta
primera web constaba de páginas que eran simplemente un **conjunto de textos e imágenes**, junto con los **hipervínculos** que permitían salir hacia otros contenidos.

### Web 2.0
Tres pilares que conforman las páginas web 2.0:
- **RIA - Aplicaciones ricas en Internet**: Los navegadores han mejorado sus prestaciones hasta el punto de ser un verdadero software compilador de aplicaciones, capaces de traducir lenguajes como JavaScript que permiten la interactividad, así como incorporar medios mucho más atractivos.
- **SOA – Arquitectura orientada al servicio**: Conjunto de tecnologías y técnicas, o arquitectura que permiten diseñar aplicaciones como un conjunto de servicios que resuelven peticiones de usuarios.
- **Web Social**: El usuario pasa a ser el centro de las aplicaciones web 2.0, conecta con otros usuarios a través de la aplicación, participa en los contenidos creándolos. Ha dejado de ser pasivo para ser enormemente activo, los contenidos ya pasan a ser propiedad del usuario no de la entidad propietaria del sitio web.

### Web 3.0
- **Web Inteligente**: Inteligencia artificial aplicada a la web, es decir, la propia web reacciona de forma inteligente ante los usuarios. La web inteligente utiliza estas áreas de la ciencia de la computación:
- Procesadores de lenguaje natural (NLP)
- Aprendizaje automático
- Sistemas de recomendación
- **Web Semántica**: Se trata de que los contenidos en la web dispongan de etiquetado o meta datos que permitan darle significado. El lenguaje XML y RDF y OWL.

## Funcionamiento de una Aplicación Web
A la hora de crear aplicaciones web, hay dos estrategias:
- **Lenguajes y tecnologías en el lado del cliente**: Se trata de elementos que se incorporan junto al código HTML de una aplicación web y necesitan ser interpretados en el navegador del usuario.
- **Lenguajes y tecnologías en el lado del servidor**: Se trata de aplicaciones que se interpretan en el servidor.

### Lado del Cliente
La página entregada por el servidor web que la alberga contiene (además del código HTML) elementos pertenecientes a otros lenguajes y tecnologías. Las principales tecnologías son:
1. **CSS**
2. **JavaScript**: Aporta interactividad a la página, se han creado para este lenguaje muchas herramientas y marcos de trabajo, como JQuery, MooTools, Modernizr o knochout.
3. **Flash**: Componente que se suele incrustar mediante una etiqueta HTML de tipo object. Que hace referencia a un archivo SWF que contiene el código flash. El navegador requiere de un plugin para poder mostrar el contenido SWF.
4. **Silverlight**: propiedad de Microsoft.
5. **Applets de java**: Se incrusta mediante una etiqueta de HTML, applet, requiere la máquina virtual de java (JVM) en el navegador.

En general las aplicaciones que utilizan tecnologías del lado del cliente requieren que el navegador del usuario tenga instalados los plugins que le permitan interpretar dichas tecnologías y que aporte la potencia necesaria para ejecutar esos componentes de forma eficiente.


Hoy en día ambos métodos se mezclan, de modo que los desarrolladores web crean aplicaciones que contienen elementos en el lado del servidor (back-end) y en el lado del cliente (front-end).

### Lado del Servidor
Cuando un usuario hace una petición de un recurso web, el servidor que contiene dicho recurso se da cuenta de que contiene elementos a interpretar en el lado del servidor y pide al **servidor de aplicaciones** adecuado que traduzca esos elementos antes de enviar el resultado al navegador. El **servidor de aplicaciones** que suele ser realmente un módulo software **enviará** el resultado al servidor web en un formato traducible en el lado del cliente, es decir, **un documento HTML**. El servidor web finalmente enviará al usuario este resultado


## Creación de Aplicaciones Web

### Servidores web
Máquina o software capaz de interpretar peticiones web, realizadas con el protocolo http o https, y de devolver el resultado de la petición, que suele propiciar la entrega de un recurso alojado en el servidor. A los servidores web se les llama también servidores http.

El navegador el que pide al servidor web el recurso que desea el usuario, así como de recibir el mismo, o bien una notificación de error si dicho recurso no existe. La mayoría de las peticiones http resultan en la entrega de un documento HTML.

### Servidores de aplicaciones web
Es el encargado de traducir instrucciones, hechas en lenguajes del lado del servidor, y entregar el resultado de esa traducción al servidor web que le pidió dicha traducción.

Los servidores de aplicaciones trabajan en conjunto con los servidores web para que el proceso se haga de forma transparente al usuario, es decir, el usuario pide el servicio a través, normalmente, de su navegador, y el servidor web atiende la petición, y pide al servidor de aplicaciones la traducción de la aplicación contenida

### Arquitectura de tres niveles
Las aplicaciones web actuales utilizan lo que se conoce como arquitectura de tres niveles. Estas capas son:
- **Capa de presentación.** Maneja la parte de la aplicación web que ve el usuario. Consta del código del lado del cliente (HTML, JavaScript, CSS, Flash...)
- **Capa lógica (aplicacion) .** Encargada de gestionar el funcionamiento de la aplicación. En ella se encuentran los documentos escritos en un lenguaje que se debe de interpretar en el lado del servidor y cuyo resultado se enviará al servidor web para que éste a su vez lo envíe al cliente que hizo la petición. La programación en esta capa se suele dividir en tres partes: el **modelo**, **vista** y **controlador**.
- **Capa de negocio (datos)** En esta capa fundamentalmente **se encuentra el sistema gestor de bases de datos** de la empresa, además de otros servidores que proporcionan otros recursos empresariales (como servidores de vídeo, audio, certificados...). El servidor de aplicaciones hace peticiones a estos servidores para obtener los recursos de la empresa que se requieren para cumplir la petición http original. El acceso a estos recursos queda totalmente oculto al navegador, añadiendo una mayor seguridad al proceso.

### Programación Back-end y Programación Front-end:
- **Front-end**: Se refiere a la parte del desarrollo encargado de producir la apariencia final de la aplicación que verá el usuario. En cierto modo, es la interfaz de usuario.
- **Back-end**: Se encarga de realizar la parte de la aplicación que queda oculta al usuario. El funcionamiento de la capa lógica y de la capa de negocio es el back-end, ya que se usan los lenguajes del lado del servidor y los de bases de datos. Es la parte de la aplicación encargada de que funcione debidamente la aplicación.
- **Modelo Full-Stack**: Con la aparición de **Node.js** junto con la aparición de ciertas **bases de datos NoSQL** (como MongoDB) está proporcionando un nuevo paradigma en el que un mismo lenguaje, concretamente JavaScript, se utiliza en todas las capas. A esto se le conoce como programación Full Stack, ya que un sólo lenguaje sirve para toda la pila de trabajo (Front-End y Back-End).

### Paradigma MVC
El modelo MVC de creación de aplicaciones ha tenido una espectacular aceptación. Lo que hace esta técnica es separar la programación de la capa lógica en tres capas:
- **Modelo**: Contiene el código que se encarga de asociar la información que procede de la capa de negocio a su formato entendible por el lenguaje y tecnología utilizado para programar la aplicación web.
- **Vista**: Genera la presentación de cara al usuario. Es la encargada de definir la interfaz de usuario.
- **Controlador**: Capa encargada de manejar las peticiones del usuario y de comunicar las capas anteriores para que obtengan lo necesario de dicha petición. Básicamente lo que hace es determinar la petición, requerir al modelo los datos necesarios y enviarles a la vista para que genere el resultado final que llega al usuario.

## Tecnologías para crear aplicaciones web

### CGI (Interfaz de pasarela común – Common Interface Gateway)
Primera tecnología que permitió crear aplicaciones en el lado del servidor. La idea es **crear una aplicación** en un **servidor** (en principio utilizando cualquier lenguaje de programación) en base a un formato especial que permita comunicar dicha aplicación con el servidor web. La comunicación entre la aplicación y el servidor se realiza mediante CGI.

### Lenguajes de programación habituales para crear aplicaciones en el lado del servidor.
Estos lenguajes son acompañados generalmente por frameworks

1. **Perl**: Lenguaje clásico para crear aplicaciones de tipo CGI
2. **Phyton**: Lenguaje fácil y potente.
3. **Ruby**: Similar a Phyton
4. **Java**: Muy potente y versátil, pero más difícil que los anteriores. Durante mucho tiempo ha sido el rey de los lenguajes para programar aplicaciones web, ahora tiene más competencia.
5. **C#**: Muy popular para programar aplicaciones utilizando servidores .NET (de Microsoft)
6. **JavaScript**: Gracias a Node.js y a los marcos de trabajo como Angular.js o backbone.js

### Lenguajes de programación de Script para crear aplicaciones en el lado del servidor
1. **PHP** (Personal Home Pages) : El más utilizado. Se basa en el lenguaje C y en el Perl. Lenguaje fácil de aprender, pero poco valorado por los programadores más formales por su falta de rigidez en las normas de escritura y poca potencia para hacer aplicaciones más complejas.
2. **ASP** (Activer Server Pages): Tecnología de Microsoft, se conoce como ASP.net ya que utiliza la plataforma .NET de microsoft.
3. **JSP** (Java server pages): Lenguaje de script del lado del servidor basado en java. Es la forma de script utilizada cuando una aplicación web se ha programado en java.
4. **ColdFusion**: Propiedad de Adobe. Requiere servidores especiales que son caros. Está en desuso.

### Plataformas de desarrollo de servicios web empresariales.
Se trata de soluciones de desarrollo de aplicaciones web completas. Incluyen por lo general:
1. **Una estructura de directorios rígida** en la que guarda cada tipo de archivo (programas, páginas de servidor, páginas HTML, archivos de configuración...)
2. **Una serie de archivos de configuración que permitirán configurar la aplicación como un servicio http** que sepa como atender (al menos a qué programa desviar la petición y con qué datos) cada petición que le llegue
3. Un **conjunto de programas realizado en uno o más lenguajes de programación**
4. Un **conjunto de documentos ya preparados para enviar al cliente** (los archivos HTML, css, javascript, imágenes...)
5. Una serie de archivos script de servidor (JSP, ASP .net...)
6. **Librerías diversas** (acceso da bases de datos...)
7. **Facilidad para incorporar patrones** y marcos de trabajo compatibles con el **paradigma MVC**

Las plataformas más populares:
1. **J2EE** (java 2 Enterprise Edition)
2. **.NET** plataforma de Microsoft que permite crear aplicaciones y servicios web, haciendo especial énfasis con el uso de XML

### Frameworks MVC
Un Framework es un marco de trabajo, **MVC Modelo-Vista-Controlador**. El Framework recomienda una estructura concreta de trabajo que separa los diferentes elementos de la aplicación; no solo el modelo, vista y el controlador, sino los archivos de configuración, elementos estáticos, desvío o enrutamiento de las peticiones http...

Los Frameworks MVC más populares son:
1. **Ruby on Rails**. Se puede ejecutar en casi cualquier servidor web, el lenguaje en el que se basa es en ruby
2. **Apache Struts**: Marco de trabajo más famoso para la creación de aplicaciones J2EE
3. **Spring**: Otro marco de trabajo para trabajar con J2EE.
4. **Django**: Escrita en phyton.
5. **Zend**: Framework escrito para PHP. El más popular para este lenguaje
6. **Angular.js**: Marco de trabajo para JavaScript creado por Google. Su paradigma es la variante **MVVM** (modelo-vista-vista-modelo)
7. **Backbone.js**: Marco ligero de programación de aplicaciones web usando JavaScript

## Cloud Computing
Se utiliza **internet como base de trabajo**, sustituyendo así al propio ordenador personal, el cual puede ser un **equipo de menor potencia** al delegar en la nube el proceso de las tareas y el almacenamiento de la información.

Algunos ejemplos de servidores en la nube:
1. **Servicios de almacenamiento en la nube**: Se trata de servicios que permiten al usuario almacenar dato
2. **Aplicaciones de ofimática web**
3. **Copias de seguridad en linea**: Al estilo disco virtual. Los servicios de copias de seguridad más conocidos Carbonite, Backblaze y CrashPlan.
4. **Calendarios**: Permite disponibilidad permanente de los datos de la agenda personal
5. **Contactos**
6. **Sistemas operativos web**: El más conocido EyeOS, Chrome OS de Google.
7. **Redes sociales**
8. **Bibliotecas multimedia**: YouTube o Flickr.
9. **Marcadores en línea**: Como del.icio.us o Digg, teniendo acceso a nuestros marcadores, aunque estemos en otra computadoras

### Modelos de Cloud Computing
1. **SaaS** (Software as a Service - Software como servicio): Aplicación que no requiere instalación en el equipo del usuario, sino que se accede a ella a través de http. Por ejemplo, Google Calendar
2. **PaaS** (Platform as a Service - Plataforma como servicio): Se trata de un servicio que proporciona una plataforma preparada para desarrollar aplicaciones, con todo: ´Sistema operativo, librerías, compiladores, APIs de desarrollo, etc. **Un ejemplo es Heroku**.
3. **IaaS** Infrastructure as a Service es un servicio en la nube : Nos permite virtualizar hardware de todo tipo: un servidor, una red de ordenadores, un disco duro.... El más conocido **Amazon Web Services (AWS)**

### Implementación de nubes para el Cloud Computing
Se puede entender que una nube es realmente un conjunto de servidores conectados que trabajan de forma distribuida.

Tres tipos de nubes:
1. **Nubes públicas**: Nubes ofrecidas por empresas externas. Toda la gestión es externa, el problema es que se delega en terceros, información que puede ser crítica.
2. **Nubes privadas**: Implementadas por la propia empresa que necesita la nube. Requiere una inversión más grande, pero permite personalizar absolutamente el servicio.
3. **Nubes híbridas**: Mezcla de las anteriores, parte de nuestro negocio se delega a una nube pública y parte lo gestionamos en nuestra nube privada, intenta aunar lo mejor de ambas.

## Aplicaciones Web y Aplicaciones Móviles (Apps)

El éxito de los teléfonos inteligentes ha sido permitir que se acceda a los servicios disponibles en internet desde el móvil. Las aplicaciones presentes en los móviles conocidas popularmente como apps aúnan sencillez de uso y acceso directo para resolver problemas complejos o al menos, muy interesantes para el usuario. Las aplicaciones que puede ejecutar son de dos tipos:

- **Web apps**: Aplicaciones web que se ejecutan en el navegador pensadas para ser utilizadas en un dispositivo móvil. Se crean fundamentalmente en HTML5, CSS y javaScript/JQuery.
- **Apps nativas**: Aplicaciones programadas en los lenguajes nativos de los dispositivos móviles: Java, C#, C++, Objective C o Swift dependiendo de la plataforma. El hardware de la máquina está a disposición de la apps ya que el lenguaje con el que se crean las apps nativas permiten acceder al GPS, la luz LED, etc.

También han aparecido **frameworks webs** que permiten crear apps nativas compatibles mediante **HTML**, **CSS** y **JavaScript** (React Native, Flutter, etc).

## Elementos necesarios para crear Aplicaciones Web

Las aplicaciones web requieren ser implementadas en un servidor en internet. Cuando se desarrollan aplicaciones a nivel profesional se suelen configurar **dos entornos de trabajo**: uno en un **equipo local** y otro **en Internet**. Para el aprendizaje basta con equipar a nuestro equipo local. Los elementos que necesitamos configurar son:

- **Servidor web**: Encargado de recibir las peticiones http relacionadas con nuestra aplicación. Para seleccionar el sistema tendremos que pensar en nuestras necesidades: si queremos que sea gratuito o no, cuál es el sistema operativo, el número y tipo de peticiones que debe atender, cuál va a ser el lenguaje elegido, si deseamos soporte o no…
Los más populares hoy en día son:
- **Apache**: gratuito y de código abierto y robusto. Es el habitual para programar en PHP.
- **Nginx**: Gratuito y de código abierto, muy utilizado para aplicaciones con PHP, es un servidor al alza, sobre todo cuando hay que atender a numerosas conexiones
- **IIS**: Servidor web de Microsoft (de pago) aparece como componente de los sistemas Windows Server.
- **Apache Tomcat**: Servidor web pensado para ejecutar aplicaciones en java.
- **Node.js**: Servidor de JavaScript
- **Instalar un servidor de aplicaciones web**: Hoy en día bastará con añadir módulos al servidor web. Por ejemplo, si se va a programar en PHP basta activar e instalar el módulo PHP en el caso del servidor web Apache, o instalar extensiones en otros servidores. Hay soluciones compactas de servidores web que son además de aplicaciones, como el caso de Apache Tomcat, servidor web con capacidad para implementar aplicaciones.
- **Instalar un servidor de bases de datos**: Normalmente necesitaremos un sistema gestor de bases de datos. El sistema gestor de bases de datos habitual para programar en PHP es MySQL.
- **Instalar/configurar conectores de bases de datos**: Todos los componentes deben estar conectados. En el caso de las bases de datos puede implicar instalar conectores en el servidor, de modo que nuestra lógica conecte con el negocio. El conector es lo que permitirá que podamos invocar al servidor de bases de datos desde el código de las aplicaciones web. Por ejemplo, en las aplicaciones java se necesita instalar un conector JDBC y en las aplicaciones de Microsoft conectores tipo ODBC u OLE DB. En el caso de PHP se necesita instalar un módulo PHP necesario para conectar con la base de datos y a veces una librería externa.
- **Entorno de desarrollo**: La creación de aplicaciones web implica escribir muchas líneas de código. El código se crea en archivos de texto, con lo que cualquier editor de texto valdría para hacerlo. Pero hay software de edición de código que aporta mejoras al escribir código como:
- **Coloreado de sintaxis**: Permite diferenciar las palabras claves del lenguaje.
- **Autocorrección**: Permite detectar los errores de código mientras vamos escribiendo.
- **Depuración de código**: Facilita la realización de pruebas de código.
- **Facilidades para la navegación**: Búsqueda rápida de apartados en el código, ventanas con acceso rápido a las diferentes secciones de código, lista de archivos en uso…
- **Creación de snippets**: Son abreviaturas que facilitan la escritura del código habitual.
- **Depurador de código**: Se trata de un software que se instala en el servidor de aplicaciones y que permite realizar pruebas de código.
- **Software de máquina virtual**: No es obligatorio instalar una máquina virtual pero sí es interesante, ya que, si instalamos directamente el software servidor en nuestra máquina de trabajo, hará que su ejecución sea más lenta, además de que los fallos en instalaciones y pruebas pueden afectar al funcionamiento. Una máquina virtual permite hacer pruebas sin la preocupación que resulta de manipular la máquina de la que dependemos para trabajar a diario.
- **Sistema de control de versiones**: Volver a la versión anterior del código es muy fácil utilizando un sistema de control de versiones. Hoy en día el más popular es **Git**. Con esto siempre podremos sincronizar nuestro trabajo desde cualquier ubicación.
- **Software de test**: La fase de pruebas resulta compleja porque requiere de la interacción de diversos elementos. Para ello se han creado herramientas que permiten automatizar esta fase.

## Soluciones apaches, php y mysql integradas (AMP)
Se trata de paquetes de software que instalan fácilmente Apache y PHP e incluso MySQL.
- **XAMPP**: Multiplataforma, funciona para Windows, Linux y OSX. Instala Apache, MySQL, PHP, phpMyAdmin (facilita la gestión de MySQL), Perl (interesante instalarlo para poder ejecutar el script de seguridad de MySQL, un servidor FTP(Filezilla), otro de java y otro de correo, además de otras herramientas.

- **Configuración de XAMPP**: En Windows la raíz de XAMPP suele ser c:\xampp y en Linux optlamp se encuentran los siguientes directorios:
- **Apache**: Raíz de instalación de Apache
- **htdocs**: Raíz de documentos del servidor apache
- **php**: Raíz de PHP
- **mysql**: Raíz de MySQL
- **bin y sbin**: Solo en el caso de Linux, contienen todos los ejecutables de los servicios instalados…

###### tags: `DAW` `DSW`