Presented by: Dr.

Miguel Angel Alejo

Macias
Diary
• Context Platform version 4
• Front Architecture
• Technologies
• Components
• Interaction with BUS
• Induction to Front
• Platform version 4 demo
Context
• Modular version 4 platform
• Modular and collaborative development
• Git submodules for separation of
• Projects
• Code
• Work groups
• Technology update
• Java JDK 17
• Primefaces 11
• Transition stage towards containers
Modular architecture with artifacts

Login and Module

Logou?\ Menu
Notifications independence
Security Profile Secure modular
Engine BPM development
Proxy Common (without committing
functionality
code)
Version control
focused on modules
Artifact Structure
Repositories

central
snapshots internal
Technologi
es
• Html 5
• javascript
• Primefaces 11
• JSF 2.2
• Template Poseidon 4.1.0
• Java JDK 17 JS CSS
• css
• Spring 5
• Security J)spring
• Core
• JBoss EAP 7.4
• Version control - git
=
New Java SE Releases
Platform structure
V •m src
V •• main
••
v Ea mx.ipn.cenac.dsi. platform, core > Ea
config

Java code packages. Managed bean, spring bean,

> Du exception
> Efilter
filters, services, etc.
> Ea model
> ea service
> Eutil
> Du view

V >1 resources
> •META-INE Tags and messages
v • mx.ipn.cenac.dsi.plataforma.core > • label
> • message
> log4j2.xml
V Blwebapp Websites
> • private Private -> Pages that require authentication
> • public
> •• resources
Public -> Pages that do not require authentication
> • cmp
> • platform-layout
> to poseidon-layout
> toWEB-INF
Unit tests
> to test
Module types

Module
withou
t BPM
Structure Without
• Elwebapp

BMP > •META-INF

• • private
> • administration
> • complements > • common
> • messaging v • modules
> • records
V • curs Within the private/modules folder, the
> • authorize
> • delete > • rejections > • review folder structure is defined according to
the needs of the application.
— authorize.xhtml f capture,
xhtml 4 curs, xhtml f
dependency.xhtml f dlgDelete.
xhtml — dlgDependencia.xhtml
— dlgNew Dependency .xhti
EdlgNewLocation. xhtml f
dlgNewOrgan.xhtml mdlgOrga
no. xhtml f dlgLocation. xhtml —
dlgValidar.xhtml — organ. xhtml
«review. xhtml «location. xhtml
Structure with BPM (I
)[ProcessIdDef]
../private/processes/
• records.xhtml - Home screen of the process, shows the
records in tabs with information about active and carried out
processes.
• F2, F3 … FN .xhtml - Screens of the activities of the
process. When a task is completed, depending on the logic of
the process, it automatically advances to the next task.
• dlgCancelRecord.xhtml - Dialog box that allows you to cancel
the process.
• dlgRemoveProcess.xhtml - Dialog box that allows you to
remove the process.
• dlgInfoRegistro.xhtml - Dialog box that displays process
information.
• dlgVerDetalle.xhtml - Dialog box to display custom process
data.
• specifictasks.xhtml - Allows you to dynamically change
activities
Structure with BPM
(2 ) dlgRegistrationInfo.xhtml
Configure process start
screen dlgCancelRecord.xhtm
display (Assigned, l
Done, Tracking)
dlgViewDetail.xhtml
records.xhtml FN.xhtml
dlgRemoveProcess.xhtml
specifictasks.xhtml F3.xhtml
F3MB.java
ModelRegsBPM.java F2.xhtml
F2MB.java
Create specifictasks.xhtml ,
records.xhtml and a ManagedBean
that inherits from BPMRegsModel

Create F
screens and a
Managed Bean
RecordsMB.java for each
screen.
Create dialogs

Includ
 e

Structure with BPM

(3 )
Interaction with
BUS Front Platform Bus Platform
 Components (I)
Component Standard Named Example
xhtml page Camelcase upper or lower [Name] .xhtml ChangePassword.xhtml
Managed Bean UpperCamelCase [Name] MB.java CreatePassword.java
DTO (Data Transfer UpperCamelCase [Name] DTO.java UserDataDTO.java
Object)
Exception UpperCamelCase [Name] Exception.java CoreException.java
Spring Service UpperCamelCase [Name] Srv.java PlatformSrv.java
Props UpperCamelCase [Name] Util.java UrUtil.java
Properties (messages) Lowercase separated by messages_ [Module] .prop messages_core.properties
underscore erties
Constants UpperCamelCase Constants.java Constants.java
 Components (II) -
XHTML
• .xhtml extension
XHTML
• Named in camel case upper or lower
• Location in webapp/private/[Module_Name]/
• Use the available components of the primefaces 11 poseidon template (
https://www.primefaces.org/poseidon/ )
• Use the main template .../WEB-INF/template.xhtml for restricted screens
(authenticated user)
• Use the styles of the poseidon template according to the demo provided to
maintain the " responsive" functionality
• Use file properties for labels and messages. Do not directly put the hard tag
in the xhtml
 Components (III) - Managed Bean
• .java extension
• Named in UpperCamelCase with MB suffix
• Location in mx.ipn.cenac.dsi.plataforma.[module].view
• Use @Named together with @RequestScope or @ViewScope
• Don't use session scope beans
• Include Apache loggers for debugging
• To inject a spring bean (@Autowired) extend the
SpringBeanAutowiringSupport class
• Implement the Serializable class
Components (IV) - DTO, Exception and
Props \------b
1;}
.java extension - Use Apache loggers for debugging
• Exception
TAVA
• Named in UpperCamelCase with "Exception" suffix >r
• Location in mx.ipn.cenac.dsi.plataforma.[module].exception
• Extend Exception
• Useful
• Named in UpperCamelCase with suffix "Util"
• Location in mx.ipn.cenac.dsi.plataforma.[module].util
• DISC
• Named in UpperCamelCase with DTO suffix
• Location in mx.ipn.cenac.dsi.plataforma.[module].model
• Implement the Serializable class
Components (V) - Service
• .java extension
• Named in UpperCamelCase with Srv suffix
• Location in mx.ipn.cenac.dsi.plataforma.[module].service
• Use spring's @Service to use it as a service
• Include Apache loggers for debugging
• To inject a spring bean use @Autowired
• Catch exceptions and throw them
• Use BaseUtil. miniProxy (request, URL) to invoke BUS services
Components (VI) - Properties tags §
• .properties extension
• Named in lower case separated by hyphens
• Labels with support for Spanish and English
• Location in resources/mx/ipn/cenac/dsi/plataforma/[module]/label/
• tags_[module]_es.properties
• [module].profile.name=Full name
• tags_[module]_en.properties
• [module].profile.name=Full name
• To use tag in xhtml
• #{etqCore['core.login.username']}
Components (VII) - Properties messages
.properties extension
Named in lower case separated by hyphens
Error messages with support for Spanish and English
• Location in resources/mx/ipn/cenac/dsi/plataforma/[module]/message/
messages_[module]_es.properties
• error.[module].recaptcha.no.es.humano.summary=Validation error in ReCaptcha error.
[module].recaptcha.no.es.humano.detail=Possible Bot detection!
• messages_[module]_en.properties
• error.[module].recaptcha.no.es.humano.summary=ReCaptcha validation error
• error.[module].recaptcha.not.human.detail=PossibleBot detection!
• To use messages
• BaseUtil. showMsg (null, FacesMessage. SEVERITY_ERROR ,
Constants. MSJ .getString("error.core.profile.change.password.empty.repeat.summary")
Constants. MSJ .getString("error.core.profile.change.password.empty.repeat.detail"), nu
null);
Components (VIII) - Constants
• .properties extension
• Named in UpperCamelCase
• Location in mx.ipn.cenac.dsi.plataforma.[module].util
• Constant class must be final
• Attributes must be static final
• Include the module service invocation paths as follows public static
final String PLATFORM_EXIT =
PLATFORM_PORT_API + "/private/platform/exit";
public static final String PLATFORM_PORT_API = ":9002";
Base Template - Template
<ui:insert name="title/> Name of the page

<ui:insert name="head"/> Include scripts and css loading of complementary

resources
Base

Space for page development

<ui:insert name="content"/>
Common components
• General growl component to display messages to the user with
identifier id="msg"
Cannot change UR

Currently you are only assigned to one UR.

• Dialog component that allows displaying information to the user in the

form of a dialog
• regsBPM component to display data from a BPM process
• Gufi task component that allows you to interact with the
BPM functionalities (save, cancel, end, return)
Keep Cancel
F "
Go back
Poseidon Primefaces Template

https://www.primefaces.org/poseidon/
Unit tests
• The relevant unit tests must be carried out in the folder designated for
this purpose "test", use the same package structure (corresponding) as
the source code to be tested
• They must be java files in UpperCamelCase with Test suffix for example:
LoginTest.java
• JUnit (@Test) is used for unit testing.
Better practices
• Reuse code, avoid duplicate code
• Develop JSF components for common functions where relevant
• Follow Java development standards
• Do not use attributes in session
• Use apache logger
• Do not use System.out.println
• Do not use hard code
• Using BaseUtil.java Utilities
 Version control
• Gitlab allows continuous integration and deployment
• Every time a merge request is accepted
• Continuous integration and deployment pipeline

http://dev.plataforma.ipn.mx:[PORT]/[MODULE]
Git GIT_Develop new functionality in Development

Flow start

git clone [PROJECT PATH]

ex: git clone git@git.cenac.ipn.mx:malejo/plataformaipn v4.git git checkout dev gitpull

'Do I have
project
Switch to branch Update branch
• Clone project < dev development site
loaded

git commit -am ■[COMMIT_MESSAGE]"

ex: git commit -am "Login terminated"

Create branch for

Add files >it's over! Develop develop
Make commit functionality
new functionality functionality
new

git add.
git checkout -b [INITIALS]_devJFUNCTIONALITY] -
e: git checkout -b MAAM_dev_Login

Upload changes to Create merge Aerge reque If any

gitlab request in gitlab accepted? functionality
takes a long time to
develop
Must perform
update of the
git push
branch code
local development
daily
Version Control – Branches
Branch naming
Brief description that
Initials of identifies the
developer functionality to be
performed
f- MAAM_dev_Login
1.............................
Branch where desired
perform the functionality
Semantic versioning
Dev E>modulo-1.0.1-SNAPSHOT
Prod (Tag) = module-1.0.1

• Make versioning tags when moving to production

• Major – Drastic change in the Software, it does not have compatibility with code
from other versions 1.0.1 -> 2.0.0
• Minor – New functionality to the Software or improvement that is compatible
with existing code 1.0.2 -> 1.1.0
• Patch – When a productive bug is fixed 1.0.1 -> 1.0.2

Induction to Front Development

 Developer profile (I)
Technology Required level Observation

java jdk 17 Medium - High The development is based on Java

javascript Basic - Medium Knowledge of javascript is required, it
really takes little time
css Basic - Medium
A notion of styles is required, you
really don't have to worry so much
HTML5 Medium - High All pages are based on HTML 5 and
specifically xhtml
JavaServer Faces 2.2 (JSF) Medium - High It is the MVC framework (Model –
View – Controller) used
Primefaces 11 Medium - High
Extends JSF to add functionality with
AJAX (Asynchronous Requests)

Spring 5 Basic - Medium We seek to understand dependency

injection
 Developer profile (II)
Technology Required level Observation

JBoss EAP 7.4 Basic - Medium

The application is deployed locally on
this application server

git (gitlab) Basic - Medium

It is the version control system used

Relational Database (Oracle) Basic - Medium For basic queries based

Basic - Medium For basic queries based

Non-Relational Database (Mongo DB)
 OS Permissions for Count for
Debian 11 project internal repository
(Recommended) PlatformIPN_v4 archival

Requirements
File of
Install Apache
Gitlab account properties for
maven
development

Install and
IntelliJ IDE with
Install JDK 17 configure git on
Command line
license for
education
Useful resources
• Poseidon Components (
https://www.primefaces.org/poseidon/ )
• Primefaces Official Documentation
•
https://www.primefaces.org/showcase/ui/input/input
Text.xhtml
• Tag Project
(primefacesposeidon/primefaces/poseidon-
3.0.0/tag)
• PrimefacesPoseidon
Code Project ID: 230

e acespose or
Ap)GitLab
reference
• Available in gitlab
 • https://www.git.cenac.ipn.mx/malejo/pr
• Gitlab repository
•
mA ™
archive
https://www.git.cenac.ipn.mx
• Archiva artifact repository
• https://dev.plataforma.ipn.mx:8085/#welcome
Demo
 Platform
version 4 -
Core
Doubts
and
(? Yo
Questions
Thanks for
,92
your
attention
EgE