DeDe_es3a

-Se necesitara una pequeña base de Typescript para la implementación de código de la aplicación y el uso de react para la implementación de cara al usuario.

-Para realizar el control de versiones es necesario el uso de git, herramienta muy util para trabajos de gran tamaño permitiendo el uso de varias ramas para no alterar los prototipos del proyecto.

-Será necesario emplear un navegador y disponer de un proveedor de internet para poder acceder a dede_es3a y utilizar toda la funcionalidad de la que dispone.

-El sistema permitirá al usuario realizar una búsqueda mediante la que filtrar los artículos mostrados según su nombre/descripción.

-Dede_es3a dispondrá de un carrito en el que almacenar artículos y cuyo contenido podrá ser consultado por el usuario.

-Se dará al usuario la posibilidad de tanto borrar como añadir elementos al carrito.

-Permitirá el registro de usuarios mediante formulario siempre y cuando sus credenciales no cincidan con las de otro usuario.

-Dede_es3a permitirá el inicio de sesión de usuarios mediante formulario si las credenciales coinciden con la BDD.

-Se dispondrá de una lista de pedidos por usuario en la que se almacenarán sus correspondientes pedidos.

-Para la realización de un pedido será necesario: un usuario al que asociarlo y especificar una dirección para el envío.

-Dede_es3a proporcionará al usuario una forma de calcular automáticamente el precio del pedido en función de la dirección de envío.

Stakeholders primarios:

Equipo de desarrollo: que deben conocer la arquitectura de TypeScript, React y Solid.Deben trabajar de manera que se documente todo el código para facilitar el entendimiento por parte de los demás miembros del grupo. Deben realizar reuniones para plantear las arquitecturas a usar. Por ejemplo: Para el desarrollo de Diagramas de secuencia.

Cliente: quien interactuaría con la version final de la aplicacíon para la realización de compra de Objetos.

Stakeholders secundarios:

Equipos de desarrollo paralelos: en nuestro caso, tenemos una cercanía con otros grupos que están implementando sistemas similares al nuestro, lo cual, nos permite poder preguntar/pedir consejo en caso de considerarlo oportuno.

Usuarios finales de la aplicación. Son los clientes que van a realizar las compras.

Nuestro sistema de venta online (Decentralized Delivery)

Se guardará aquí toda la información necesaria para el funcionamiento de la aplciación: pedidos de los usuarios, productos, etc.

El sistema se conectará con el POD del usuario para obtener los datos de su dirección, ya que por privacidad no se almacenarán estos datos en nuestra aplicación.

Nuestro sistema se conectará con diferentes empresas de mensajería para poder calcular los costes de envío de los pedidos.

Nuestra tienda DeDe se debe cumplir los principios SOLID de descentralizacion de datos personales mediante el almacenamiento de estos en PODs independientes para cada usuario, el proveedor de PODs para DeDe será Inrupt. El front-end estara desarrollado mediante el framework React implementando componentes ya desarrollados o bien creados por nosotros mismos,el lenguaje para el desarrollo de las diversas funcionalidades de las pantallas sera TypeScript. Por la parte del back-end, nuestro SGDB es Mongo.db y mediante Node.js express realizaremos todas las transacciones a la base de datos, en la misma almacenaremos los datos de los productos y de los usuarios registrados en DeDe.

El segundo escenario muestra el proceso de "Login". Para ello, el usuario debe introducir los datos en el formulario, esos datos serán verificados y si son correctos volverá a la pantalla de inicio con la sesión iniciada.

El primer escenario muestra el proceso de compra de un producto. Para ello, el usuario debe conectarse con su cuenta y seleccionar la talla correspondiente para que se añada al carrito de la compra.

El tercer escenario nos muestra el proceso de cálculo de los costes de envío de un pedido. Tras finalizar el usuario el pedido, DeDe solicita al POD del usuario la dirección de envío del usuario. Con esta dirección solicita a la empresa de mensajería el importe de los gastos de envío. Una vez obtenido este importe le devuelve al usuario el importe total del pedido, con los gastos de envío incluidos. Si el usuario confirma el pedido DeDe procede a almacenarlo en la base de datos y muestra al usuario la confirmación del envío.

El último diagrama se corresponde con el proceso de envío al usuario del pedido desde la aplicación. Para ello, debe realizar el pedido una vez finalizado el proceso de compra.

Dede es una aplicación de compra de calzado, todo está enlazado con un diagrama de Entidad-Relación(ER-Diagram):

Para realizar la Interfaz de usuario de nuestra aplicación usaremos React. React es una biblioteca de Javascript de código abierto con la que se pueden crear numerosas interfaces de usuario facilitando el desarrollo de aplicaciones en una sóla página. React es mantenido por Facebook y la comunidad de software libre.

La opción más sencilla: estilos en línea. No aporta toda la flexibilidad de CSS, pero si aporta un estilo básico con una especificidad de nivel superior. Cada elemento React HTML tiene una propiedad de estilo que permite un objeto con todo el estilo que hayas planteado con anterioridad.Los objetos pueden tener este aspecto:

Hemos decidido usar como base de datos "MongoDB" la cual es una base de datos que usamos en otras asignaturas y podremos manejarnos de una manera más fluida que con otras bases de datos. MongoDB ofrece una gran escalabilidad y flexibilidad, así como un modelo de consultas e indexación avanzado.

MongoDB es un sistema de base de datos NoSQL, orientado a documentos y de código abierto.En lugar de guardar los datos en tablas, tal y como se hace en las bases de datos relacionales,MongoDB guarda estructuras de datos BSON (una especificación similar a JSON)con un esquema dinámico, haciendo que la integración de los datos en ciertas aplicaciones sea más fácil y rápida. MongoDB es una base de datos adecuada para su uso en producción y con múltiples funcionalidades.

Usaremos git para realizar el control de versiones. Con git, trabajaremos cada uno de los miembros del equipo sobre la rama "develop",rama que creamos con anterioridad. Sobre esa rama iremos creando diferentes subramas con nombres como "uoXXXX-<cambio a realizar>". Una vez terminada esa subrama realizaremos un merge sobre develop, para finalmente realizar un merge sobre la rama master.

Git es una herramienta que nos sirve de mucha utilidad para no pisar el trabajo de los demás miembros del equipo.

Para crear la parte de "User Interface" usaremos React, una herramienta que nos ayudará a crear interfaces de usuario interactivas de forma sencilla diseñando vistas simples para cada estado en la que se encuentre la aplicación. Nos permite crear componentes encapsulados que manejen su propio estado, para convertirlos en interfaces de usuario más complejas.

Para evitar que las imágenes que utilizamos en la aplicación dependan de proveedores externos a nosotros, las almacenaremos en Imgur, repositorio online gratuito para todo tipo de contenido audiovisual. De esta forma, sabremos que siempre tendremos disponibles estas imágenes.

En esta sección se muestra un diagrama de árbol de calidad para el sistema desarrollado. A medida que el proyecto vaya avanzando, se irá ampliando este diagrama hasta alcanzar las hojas, que serán los escenarios de calidad que describiremos en el siguiente apartado. Además, se incluirán enlaces en el árbol a los escenarios de la siguiente sección.