Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.
202004724 – Carlos Daniel Acabal Pérez
Resumen
El proyecto 3 se llevó a cabo con el objetivo de
desarrollar una solución integral que implemente
un API que brinde servicios utilizando el
Protocolo HTTP bajo el concepto de
programación orientada a objetos (POO), mediante
la lógica y conocimientos que se le han impartido
durante la clase y aplicarlos en el laboratorio.
Se presentó el problema del proyecto y la solución
que se dio al mismo, así como la utilización del Abstract
paradigma Programación Orientada a Objetos
(POO) para utilizar clases y objetos que emulen
las entidades que posee el problema.
Además se adjuntó un diagrama de clases que
modela los atributos, propiedades y relaciones
entre clases. Se explicó la forma en la que se
implementó el FrontEnd y Backend del software,
además del uso de hilos para mostrar los
movimientos de una máquina.
Se mostró el funcionamiento de cada una de las
opciones que posee el programa, también lo que
debe ingresar el usuario y la respuesta que debe
mostrar el programa.
PROYECTO 3
El programa se desarrolló en Python, HTML y
CSS.
Palabras clave
● API
● Backend
● FrontEnd
● XML
Project 3 was carried out with the aim of developing
a comprehensive solution that implements an API
that provides services using the HTTP Protocol
under the concept of object-oriented programming
(OOP), through the logic and knowledge that has
been taught during the class and apply them in the
laboratory.
The project problem and the solution given to it
were presented, as well as the use of the Object
Oriented Programming (OOP) paradigm to use
classes and objects that emulate the entities that
have the problem.
Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.
In addition, a class diagram was attached that
models the attributes, properties and relationships
between classes. It describes the way in which the
FrontEnd and Backend of the software were
implemented, as well as the use of threads to show
the movements of a machine.
The operation of each of the options that the
program has was shown, as well as what the user
must enter and the answer that the program must
show.
The program was developed in Python, HTML and
CSS.
Keywords
● API
● Backend
● FrontEnd
● XML
Introducción
En la actualidad casi todas las empresas tienen un
sitio web, el cual posee información acerca de la
empresa o proporciona servicios, la forma en la que
se producen los servicios utilizan la comunicación
cliente-servidor. Además utilizan protocolos HTTP
para realizar distintas peticiones.
El desarrollo web se refiere a la construcción,
creación y mantenimiento de sitios web. Incluye
aspectos como diseño web, publicación web,
programación web y base de datos gestión. Además,
un desarrollador web puede ayudar a mantener y
actualizar una base de datos utilizada por un sitio
web dinámico.
Desarrollo del tema
Descripción del problema:
La Superintendencia de Administración Tributaria
necesita un software que pueda ser consumido desde
Internet como un servicio. Este software recibirá un
mensaje con los datos para solicitar la autorización
de un Documento Tributario Electrónico (DTE)
emitido por un contribuyente y como respuesta
emitirá un número único de autorización, este
número será un correlativo que iniciará con el valor
1 cada día y no deberá repetirse de nuevo en ese día.
Solución:
a. Implementación de la Programación
Orientada a Objetos Se utilizaron los
principios de la programación orientada a
objetos:
1. Abstracción: Se analizaron las
características del problema para modelar el
programa y luego se agruparon en clases y
objetos.
2. Encapsulación: Para asegurar la
información en el bloque de código, se
agruparon en las clases los atributos y
métodos que serán privados y los que
tendrán acceso público. La forma de acceder
y modificar los atributos de los objetos se
realizó a través de los métodos “setters” y
“getters”.
3. Polimorfismo: Permite que métodos y
funciones con el mismo nombre ejecuten
distintas operaciones sin ningún problema.
El diagrama de clases que modela los
atributos, propiedades y relaciones entre
clases se encuentra en la sección de Anexos.
b. BackEnd
Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.

información de los
Es una API que brindará servicios utilizando movimientos de cada Nit
el protocolo HTTP, su funcionalidad 5. resetear
principal es procesar los datos recibidos del Borra los datos almacenados
FrontEnd Todos a excepción de procesar
retornan datos en formato XML
i. Los servicios se desarrollaron en el como respuesta de la API.
Framework Flask, se definieron los
siguientes endPoints: c. FrontEnd
1. /reset Se desarrolló en el Framework Django
2. /consulta-datos i. URLs
3. /peticiones/resumen-iva Se utilizaron los endPoints del
4. /peticiones/resumen-rango BackEnd y los siguientes:
5. /peticiones/grafica /info
6. /peticiones/pdf /documentacion
7. /procesar ii. Templates:
1. index
ii. Se utilizó la clase DTE y Consume la carga y consulta
Autorización, el modelo de estas de autorizaciones, además
clases está en la sección de Anexos. posee el reseteo
2. info
iii. Se utilizó un Gestor, el cual procesa Posee información del
la información en formato XML, las estudiante
peticiones que que realiza son las 3. documentacion
siguientes: Tiene la documentación
1. Procesar 4. peticiones
Filtra las autorizaciones por Consume los servicios de
fecha y valida los datos de resúmenes, gráficas y reporte
entrada para el conteo de pdf
errores y creación de códigos iii. Vistas:
de aprobación Cada vista le corresponde a una
2. Consultar URL, éstas hacen las peticiones a la
Retorna información sobre las API y luego retornan los templates
solicitudes de autorizaciones con la información.
3. rangoFecha
Filtra autorizaciones por la
fecha dada y retorna
información de los
movimientos de cada Nit Funcionamiento del programa:
4. resumenIva 1. Carga del Archivo
Filtra autorizaciones por el Al presionar el siguiente botón se mostrará
rango de fecha dado y retorna un cuadro de diálogo, seleccione un archivo
XML con la solicitud de autorización:
Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.

5. Resumen rango de fechas

Deberá ingresar una fecha de inicio y fin,
luego de presionar el botón enviar, se le
mostrará una gráfica de los valores totales o
Figura 1. Carga de Archivo sin IVA
Fuente: Elaboración propia, 2021
2. Enviar
Al presionar este botón el contenido del área
de texto entrada será enviado a /procesar de
la API

Figura 2. Area entrada y salida

Fuente: Elaboración propia, 2021
3. Reset
Al presionar este botón los datos
almacenados se borran automáticamente
Figura 5. Resumen rango
Fuente: Elaboración propia, 2021
6. Gráficas
Al presionar éste botón se mostrará una
gráfica de los movimientos hechos por cada
Figura 3. Botón enviar y reset emisor en las fechas consultadas de las
Fuente: Elaboración propia, 2021 peticiones anteriores
4. Resumen Iva 7. Reporte PDF
Deberá ingresar una fecha y luego de Al presionar este botón se descargará un
presionar el botón enviar, se le mostrará una documento en pdf que muestra un reporte de
gráfica de los valores, IVA y totales de cada las peticiones hechas
Nit emisor
8. Ayuda

Figura 4. Resumen IVA

Fuente: Elaboración propia, 2021
Figura 6. Ayuda
Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.

Fuente: Elaboración propia, 2021 Anexos:

a. Información del Estudiante Diagrama de Clases:
Al presionar este botón podrá visualizar la
información del estudiante

Figura 7. Información estudiante

Fuente: Elaboración propia, 2021
b. Documentación
Al presionar este botón se mostrará la
documentación del programa

Figura 8. Documentación
Fuente: Elaboración propia, 2021
Conclusiones
1. La abstracción es el elemento más
importante para la modelación de sistemas,
puesto que a partir de cómo representamos el Figura 9. Diagrama de Clases
Fuente: Elaboración propia, 2021
mundo real, nuestro modelo puede describir
Arquitectura general:
de manera sencilla el sistema de interés.
2. Puesto que la API desarrollada da respuestas
cada vez que se le hace una solicitud, se
pueden crear varios aplicaciones clientes que
consuman la API.
3. El lenguaje de marcado XML es una muy
buena opción para compartir datos a través
de diferentes sistemas, como Internet.
Universidad de San Carlos de Guatemala
Escuela de Ingeniería en Ciencias y Sistemas, Facultad de Ingeniería
Introducción a la programación y computación 2, 2do. Semestre 2021.

Figura 10. Arquitectura General

Fuente: Elaboración propia, 2021