Skip to content

Commit

Permalink
Explicación gráfica AOP, Imagenes Arregladas/Añadidas, Ortografía (#253)
Browse files Browse the repository at this point in the history 
* - Se agregaron imágenes faltantes al index-html de poa
- Se arreglaron las rutas de algunas imágenes que no aparecían
- Se añadieron tildes faltantes

* Se añadió una explicación gráfica de los
conceptos relacionados con programación orientada
a aspectos

* Ortografía corregida

* Update poa/poa_teoria/Pages/evolucion.html

---------

Co-authored-by: Felipe Restrepo-Calle <[email protected]>
  • Loading branch information
@sergio-sanchezo @ferestrepoca
sergio-sanchezo and ferestrepoca authored Nov 22, 2023
1 parent 5c79555 commit d820683
Show file tree
Hide file tree
Showing 12 changed files with 41 additions and 10 deletions.
Binary file added poa/poa_teoria/Images/advice_jp.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/adviceoap.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/aop_opp.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/aspect.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/espaghetti.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added poa/poa_teoria/Images/func.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added poa/poa_teoria/Images/joinpoint.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/obj.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added poa/poa_teoria/Images/pc.webp
View file
Binary file not shown.
Binary file added poa/poa_teoria/Images/trad.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
35 changes: 33 additions & 2 deletions poa/poa_teoria/Pages/evolucion.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -228,7 +228,7 @@ <h3>

<hr>

<p align="justify"><em>Estas definiciones de Target y proxy se entienden mejor en la siguiente imagen, donde claramente se ve que la clase aconsejada o Target es la clase <strong>FooService</strong> y el objeto creado Proxy después de aplicar ese Concejo es <strong>FooServiceProxy</strong></em></p>
<p align="justify"><em>Estas definiciones de Target y proxy se entienden mejor en la siguiente imagen, donde claramente se ve que la clase aconsejada o Target es la clase <strong>FooService</strong> y el objeto creado Proxy después de aplicar ese Consejo es <strong>FooServiceProxy</strong></em></p>

<p align="center"><img src="https://github.com/ProgramacionOrientadaAspectos/POA_teoria/blob/gh-pages/Images/proxy_target.png?raw=true" alt=""></p>

Expand Down Expand Up @@ -305,8 +305,36 @@ <h3><strong>Tipos de Entrelazado:</strong></h3>
<img width="800" height="300" src="../Images/tejedor2.webp?raw=true"> </img>
</p>


<h3>
<strong>
Programación orientada a aspectos Ilustrada:
</strong>
</h3>

<p align="justify">
Sabemos que puede resultar un poco difícil comprender todos estos conceptos de la programación orientada a aspectos. Por eso, a continuación, vamos a mostrar de manera gráfica los elementos mencionados anteriormente.
</p>

<p align="center">
<img src="../Images/aop_opp.webp" alt="" style="width: 70%; height: auto;">
<img src="../Images/aspect.webp" alt="" style="width: 70%; height: auto;">
<img src="../Images/joinpoint.webp" alt="" style="width: 70%; height: auto;">
<img src="../Images/adviceoap.webp" alt="" style="width: 70%; height: auto;">
<img src="../Images/advice_jp.webp" alt="" style="width: 70%; height: auto;">
<img src="../Images/pc.webp" alt="" style="width: 70%; height: auto;">
</p>

<!-- Crédito imagenes -->
<p align="center">
<strong>
Imágenes tomadas de [3]
</strong>
</p>


<h3>
<a id="referencias" class="anchor" href="#referencias" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a><strong>Referencias:</strong>
<a id="referencias" class="anchor" href="#referencias" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a><strong>Referencias:</strong>
</h3>
<ul>
<li>
Expand All @@ -315,6 +343,9 @@ <h3>
<li>
[2]G. Kiczales et al., "Aspect-oriented programming", 1997. Available: https://www.cs.ubc.ca/~gregor/papers/kiczales-ECOOP1997-AOP.pdf. [Accessed 7 June 2020].
</li>
<li>
[3]M. Jonathan., "Aspect Oriented Programming for Babies", 2023. Available: https://manerajona.medium.com/aspect-oriented-programming-for-babies-cb567cc85035. [Accessed 20 November 2023].
</li>

</ul>
</section>
Expand Down
16 changes: 8 additions & 8 deletions poa/poa_teoria/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
</head>
<body>
<section class="page-header">
<h1 class="project-name">Programacion Orientada a Aspectos</h1>
<h1 class="project-name">Programación Orientada a Aspectos</h1>
<h2 class="project-tagline"></h2>
<a class="btn btn-actual">Inicio</a>
<a href="Pages/historia.html" class="btn">Historia</a>
Expand Down Expand Up @@ -41,7 +41,7 @@ <h1>
funcionalidades estaban mezcladas por todo el código. A esta etapa se le llama la <b>generación del
código "espaghetti"</b>:</p>

<p align="center"><img src="https://raw.githubusercontent.com/anfmorenoso/Archivos/master/Spag.jpg" alt=""></p>
<p align="center"><img src="Images/espaghetti.png" alt=""></p>

<p align="justify">En la imagen, las formas tienen la función de representar los datos, y los colores
representan la funcionalidad. De ésta manera la imagen ilustra lo que llamamos
Expand All @@ -51,7 +51,7 @@ <h1>
del concepto "<em>divide y vencerás</em>". Los desarrolladores comenzaron a identificar las partes
más manejables del código y las expresaron como funciones definidas dentro del dominio del problema:</p>

<p align="center"><img src="https://raw.githubusercontent.com/anfmorenoso/Archivos/master/Func.jpg" alt=""></p>
<p align="center"><img src="Images/func.png" alt=""></p>

<p align="justify">Se consiguió encapsular de cierta manera las funcionalidades, y se
permitió incluir nuevas funciones de forma más sencilla. No obstante, todavía existían
Expand All @@ -66,7 +66,7 @@ <h1>
Su descomposición en objetos es mucho más acertada en el entorno real que la descomposición
funcional.</p>

<p align="center"><img src="https://raw.githubusercontent.com/anfmorenoso/Archivos/master/obj.jpg" alt=""></p>
<p align="center"><img src="Images/obj.png" alt=""></p>

<p align="justify">Aunque la <em>programación orientada a objetos</em> es un paradigma de
programación que resuelve bastantes problemas de la programación tradicional, como el integrar
Expand Down Expand Up @@ -102,7 +102,7 @@ <h1>
formar todo el sistema. En definitiva, lo que se persigue es implementar una aplicación
de forma eficiente, fácil de entender y mantener.</p>

<p align="center"><img src="Images/d_aspects.JPG" alt=""></p>
<p align="center"><img src="Images/d_aspects.webp" alt=""></p>

<p align="justify">En este esquema se observa que la disociación de los distintos conjuntos
se realiza tanto en base a la forma (datos) como a las tonalidades (funciones). Además,
Expand All @@ -111,11 +111,11 @@ <h1>

<p align="justify">Todos estos conceptos se encuentran diseminados por todo el código, a veces incluso implementados múltiples veces, por cada objeto o clase que necesite de las mismas. Un código normal, implementado con paradigmas actuales puede lucir de la siguiente manera:</p>

<p align="center"><img src="https://raw.githubusercontent.com/anfmorenoso/Archivos/master/Cod.jpg" alt=""></p>
<p align="center"><img src="Images/trad.png" alt=""></p>

<p align="justify">En una version orientada a aspectos del mismo codigo, tenemos un programa mas compacto y modularizado.</p>

<p align="center"><img src="Images/aspect_org.JPG" alt="">
<p align="center"><img src="Images/aspect_org.webp" alt="">

<p align="justify">La no separación de los conceptos transversales en la programación ocasiona distintos tipos de problemas como pueden ser:</p>

Expand Down Expand Up @@ -152,7 +152,7 @@ <h1>
</p>

<footer class="site-footer">
<span class="site-footer-owner"><a href="https://github.com/ProgramacionOrientadaAspectos/POA_teoria">Programacion Orientada a Aspectos</a> is maintained by <a href="https://github.com/ProgramacionOrientadaAspectos">ProgramacionOrientadaAspectos</a>.</span>
<span class="site-footer-owner"><a href="https://github.com/ProgramacionOrientadaAspectos/POA_teoria">Programación Orientada a Aspectos</a> is maintained by <a href="https://github.com/ProgramacionOrientadaAspectos">ProgramacionOrientadaAspectos</a>.</span>
<span class="site-footer-credits">This page was created by Jenny Sánchez Cruz, Felipe Moreno, Jeisson Prieto, Diego Rojas, Gustavo Galvis y Dorian Tovar.</span>
</footer>
</section>
Expand Down

0 comments on commit d820683

Please sign in to comment.