Herramientas de usuario

Herramientas del sitio


clase:daw:proyecto:1eval:tema02

¡Esta es una revisión vieja del documento!


2. Estructura del proyecto

El proyecto consiste en crear una tienda online con su Backend, frontend y además que se conecte a un banco para hacer los pagos. De forma que cada tienda se conectará al banco del siguiente grupo.

El proyecto ha desarrollar va a ser el siguiente

  • Tienda
    • Backend
    • NGING Frontend Usuario
    • NGING Frontend Administrador
    • MySQL Base de datos
  • Banco
    • Backend
    • MySQL Base de datos

«device»Servidor«container»Backend Tienda«container»Base de datos Tienda«container»NGINX Tienda Usuario«container»NGINX Tienda Administrador«container»Backend Banco«container»Base de datos Banco

  • Proyecto 1

Tienda Backend 1Banco Backend 2Tienda DB 1Banco Backend 1Banco DB 1

  • Proyecto 2

Tienda Backend 2Banco Backend 3Tienda DB 2Banco Backend 2Banco DB 2

  • Proyecto 6

Tienda Backend 6Banco Backend 1Tienda DB 6Banco Backend 6Banco DB 6

Estructura de carpetas

Para poder automatizar el despliegue , lo primero es tener una estructura definida de nuestro proyecto y de nuestro servidor. Durante el curso vamos a usar este esquema tanto en este módulo como en los otros módulos. El esquema he intentado que sea lo mas fiel posible a la realidad de las empresas aunque he intentado simplificarlo.

  • Estructura de carpetas.

mi-proyecto
├─src
├─docs
├─disenyo_grafico
├─database
├─builder
│  └─build.sh
└─target o dist

  • src:Donde está todo el código fuente de la aplicación
  • docs:Documentación de la aplicación. Es la documentación con los diagramas UML, el JavaDoc, etc.
  • disenyo_grafico:Donde están las imágenes en formato Photshop o similares que estamos visualmente diseñando
  • database:Ficheros ".sql" de creación de la base de datos, etc. Es todo lo necesario para tener la base de datos preparada desde cero. Incluye insertar datos que siempre deben estar , como por ejemplo códigos de provincias. Pero NO las inserciones de los datos del usuario.
  • builder:Scripts para compilar la aplicación. Tendremos el fichero build.sh que creara la versión compilada en target o dist
  • target o dist:El código "compilado" de la aplicación. Estará el JAR o el HTML de nuestra aplicación.

Carpeta ''target'' o ''dist''

La carpeta target o dist es la mas importante para el módulo de despliegue ya que en ella estará el proyecto tal y como se va a desplegar.

Java

En un proyecto Java la carpeta src contiene las clases *.java mientras que en target o dist tenemos en jar con las clases compiladas y empaquetas en un único fichero.

Angular

En un proyecto Angular podemos pensar que debe ser únicamente una copia de la carpeta "src" ya que es código JavaScript pero si que se pueden hacer muchos cambios en esta carpeta.

  • Transpilar el código de TypScript a JavaScript
  • Transpilar el código de SCSS a CSS
  • Compilar las plantillas HTML
  • Minimizar el código JavaScript para que ocupe menos. Se hace para que las páginas web se carguen antes. Y suele consistir en quitar los comentarios, los retornos de carro, etc.
  • Ofuscar el código JavaScript: Para evitar que alguien pueda copiar nuestro código se suele, por ejemplo , cambiar el nombre de las variables por nombres sin sentido. Normalmente se minimiza y se ofusca a la vez.
  • Etc.

Repositorios Git

Veamos ahora los repositorios de Git que vamos a tener:

  • tienda-back : El API de la tienda en Java
  • tienda-front: El interfaz de usuario en Angular de los clientes de la tienda
  • tienda-adm-front: El interfaz de usuario en Angular del administrador de la tienda
  • banco-back: El API del banco en Java
  • desplegar-proyecto: El repositorio con los Scripts para desplegar. Es donde se usa Docker o la tecnología que se vaya a usar.

desplegar-proyecto

El repositorio desplegar-proyecto tendrá una estructura distinta ya que no es un proyecto de desarrollo de código sino únicamente para desplegar.

En el raíz del proyecto tendremos el fichero deploy.sh que desplegará todos los repositorios:

  • tienda-back : El API de la tienda en Java
  • tienda-front: El interfaz de usuario en Angular de los clientes
  • tienda-adm-front: El interfaz de usuario en Angular para los administradores de la tienda
  • banco-back: El API del banco en Java
clase/daw/proyecto/1eval/tema02.1762174192.txt.gz · Última modificación: por Lorenzo