miércoles, 15 de noviembre de 2017

Instalacion de EAS - WIN10X64

Instalación en Windows

(Version en PDF : Click)

La instalación la realizaremos sobre Windows 10 X64, pero los pasos son los mismos para cualquier distribución de Windows.

Para instalar “EAS” en Windows necesitamos las siguientes herramientas:
  • Xampp 5.6.31/PHP 5.6.31
  • PostgreSQL 9.6.3
  • Jdk-8u51-windows-x64(mínimo)

Instalación de XAmpp

Primero tenemos que descargar XAMPP de la siguiente dirección:


Descargamos la versión “5.6.31 / PHP 5.6.31” tal como se muestra en la imagen:


Con el archivo en nuestro disco duro procedemos a iniciar la instalación:













Una vez instalado xampp, configurar las siguientes directivas en el archivo php.ini

Configurar las siguientes variables:

        ; Maximum execution time of each script, in seconds
        ; http://php.net/max-execution-time
        ; Note: This directive is hardcoded to 0 for the CLI SAPI

    max_execution_time=1200

    display_errors=Off

    display_startup_errors=Off

    ignore_repeated_errors=Off

    ignore_repeated_source=Off

    track_errors=Off

Habilitar las siguientes extensiones:

extension=php_pgsql.dll
 extension=php_pdo_pgsql.dll

Instalación de PostgreSQL

En la instalación de PostgreSQL utilizaremos el instalador “bigsql” el cual trae herramientas muy interesantes que nos ayudaran en el mantenimiento de la base de datos.














Instalación JDK

Para poder utilizar el generador de reportes de “EAS” es necesario instalar la máquina virtual de “JAVA”, para ello instalamos el jdk, la versión mínima de instalación debe ser la “8u51”.








Instalando y Configurando EAS

En esta instalación vamos a utilizar la versión”EAS-PRO”, la cual incluye todos los módulos del sistema:

Con el archivo .zip en nuestro disco duro procedemos a extraer todo:




Luego copiamos la carpeta “EAS-PRO”


Y la pegamos en el directorio “C:\xampp\htdocs”



Modificamos el archivo “TableSpaceW.sql” que se encuentra en la dirección: “C:\xampp\htdocs\EAS-PRO\sql” para que quede según la imagen:


Luego en el mismo archivo actualizamos el idioma para la Base de Datos, según como muestran las imágenes:

En “pgAdmin” seleccionamos la Base de Datos “postgres”, y copimos “LC_COLLATE Y LC_TYPE”


El archivo deberá quedar así:



Luego ejecutamos el archivo “run.bat”, esto creara la base de datos, los esquemas, tablas, vistas y todos los objetos que son necesarios para el correcto funcionamiento de “EAS”




Luego renombramos la carpeta “EAS-PRO” a “EAS”




Ingresamos al navegador y cargamos la Aplicación:




Lo primero que nos aparece es la pantalla para identificarnos, procedemos a ingresar los credenciales de acceso, los cuales son:

Usuario : admin
Contraseña : admin



Lo primero que podemos ver en el sistema, es la pantalla principal, en el la podemos observar en la parte superior izquierda el título de la aplicación concatenado con el nombre de la organización “EAS (NOMBRE)”.
En la parte superior derecha, se encuentran las opciones de “Desconectarse y Cambiar Contraseña”.
En el centro de  la aplicación  se encuentra un listado de todos los modulos  registrados en el sistema, en  este caso tenemos los modulos “Administrador de sistemas, Desarrollo y Diccionario de Datos”.




En la parte inferior de sistema nos muestra información relevante acerca del usuario conectado y la dirección del blog en el cual se irán publicando los manuales, tutoriales y casos específicos de desarrollo en “EAS” y las tecnologías que son utilizadas “PHP 5.6, Extjs 6.0.1, Java, JAsperReports y Postgres”




Vamos a ejecutar una solicitud para verificar que todo este correcto, para ello lanzaremos la aplicación “Monitor”, que es la que se encarga de verificar las solicitudes lanzadas por los usuarios.
Nos dirigimos a la siguiente ubicación “C:\xampp\htdocs\EAS\net\apps\modulos\sgd\monitor” y ejecutamos el archivo “runSol.bat”




Ahora en el sistema ingresamos al perfil “Administrador de Sistemas” y abrimos el formulario “Ejecutar Solicitud Log” seleccionamos el tab “Nueva Solicitud” y seleccionamos la solicitud “Usuarios”, y le damos click en el botón ejecutar.




Ahora seleccionamos el tab “Solicitudes” en el podemos ver las solicitudes lanzadas por el usuario, están con rojo aquellas solicitudes que tuvieron problemas al ejecutarse, y con negro las solicitudes que se ejecutaron de forma correcta, seleccionamos una y le damos click en el botón “Mostrar Solicitud”.


No mostrara el resultado de la solicitud.


Si verificamos el monitor de solicitudes, podemos ver  la configuración con la cual se ejecutó la solicitud.


Detalles técnicos de cada versión:

Característica
EAS-BASIC
EAS- STANDARD
EAS-PRO
EAS-FULL
Modulo “Administrador de Sistemas
SI
SI
SI
SI
Modulo “Desarrollo
NO
NO
SI
SI
Modulo “Diccionario de Datos
SI
SI
SI
SI
Código PHP Ofuscado
SI
SI
SI
NO
Código JavaScript Ofuscado
SI
SI
SI
NO
Componentes Extjs6.0.1 v. Community
SI
SI
SI
SI
Librería “Apps
Extensión que incluye Componentes derivados de Extjs, para crear nuevos módulos en “EAS
SI
SI
SI
SI
Librería “ExcelCsv
Extensión que permite exportar a Excel o CSV los datos mostrados en Grid.
SI
SI
SI
SI
Librería “Ext
Extensión de Extjs que contiene nuevos componentes, que son utilizados en los módulos de “EAS
SI
SI
SI
SI
Modulo “Monitor
Esta es una “App” desarrollada en JAVA que verifica y ejecutar las solicitudes programadas en el sistema.
NO
SI
SI
SI
Scripts SQL
SI
SI
SI
SI
Manuales de los Módulos
NO

NO

NO

SI
Framework Extjs6.0.1 v. Community (ext-6.0.1-gpl.zip)
NO

NO

NO

SI
Instalador sencha CMD (SenchaCmd-6.2.2-windows-64bit.zip)
NO

NO

NO

SI
Instalador JAVA(jdk-8u121-windows-x64.exe)
NO

NO

NO


Instalador Netbeans (netbeans-8.2-windows)
NO

NO

NO

SI
Instalador JAsperReports(TIBCOJaspersoftStudio-6.3.1.final-windows-installer-x86_64)
NO

NO

NO

SI
Instalador Postgresql (PostgreSQL-9.6.3-1-win64-bigsql.exe)
SI

SI

SI

SI
Instalador XAMPP (xampp-win32-5.6.24-1-VC11-installer.exe)
SI

SI

SI

SI
Proyecto principal en Netbeans de “EAS
  • Work Space Extjs
  • Proyecto PHP
  • Paquetes Extsjs(Apps,)
  • Temas Extjs
  • Proyecto JAVA del aplicativo “Monitor
NO
NO
NO
SI
Enlace de descarga
-
-
-
-



Costes de cada versión:
Servicios
EAS - BASIC
EAS - STANDARD
EAS - PRO
EAS - FULL
Actualización Módulos Standards
Según las Observaciones de mejoras, realizadas por los usuarios.
SI
SI

SI

SI


Soporte Ofline (Por correo electrónico)
SI

SI

SI

SI


Desarrollo de Nuevos Módulos a Medida
SI
SI
SI
SI
Accesoria en la creación de nuevas “Solicitudes
SI
SI
SI
(Soporte Online,Ofline)
SI
(Soporte Online,Ofline)

Accesoria en la Implementación del Sistema
En el manual de instalación esta descrito como instalarlo.
NO
NO
NO
NO
Accesoria en ExtJS 6.0.1
NO
NO
NO
NO
Accesoria en PHP 5.6
NO
NO
NO
NO
Accesoria en Postgresql
NO
NO
NO
NO
Accesoria en JAVA
NO
NO
NO
NO
Accesoria en JAsperReports
NO
NO
NO
NO
Licencia Mensual

Enlace de descarga
-
-
-
-


Todas las versiones a excepción de la “FULL” pueden contratar cualquiera de los servicios, haciendo una cancelación previa, el cobro se realizara por hora, siendo el valor de cada hora de 25$.

La versión “FULL” tiene incluido todos los servicios, pero también puede contratar una hora adicional si así lo quisiera.

El pago mensual de la licencia no es obligatorio, pueden pagar un mes y no pagar los meses restantes.

En el caso que solo se page un mes, los siguientes meses se los tomara como la licencia “FREE”.

El pago se realizara atreves de PayPal a la cuenta: joseg709@gmail.com

Una vez realizado el pago, envían un correo a: joseg709@gmail.com, adjuntando el comprobante de pago y especificando que versión de la aplicación es la que han pagado, y se les enviara el enlace de descarga previa verificación del monto.

jueves, 9 de noviembre de 2017

Despliegue Rápido de Aplicaciones WEB

Llevo ya dos años desarrollando pequeñas aplicaciones con Extjs desde  la versión 4.2 hasta la más reciente 6.0.1 en sus versiones OpenSource, he integrado este framework con PHP, ASP MVC y Java Servlet.

En el mercado nos encontramos con infinidad de aplicaciones que nos ayudan a optimizar el desarrollo de aplicaciones web gratis y de pago, pero muy pocas desarrolladas con Extjs como capa de presentación.

Es por eso que me di en la tarea de desarrollar una herramienta que nos ayude a optimizar los tiempos de desarrollo de aplicaciones web con Extjs.

EAS es un sistema creado para optimizar el desarrollo y despliegue de aplicaciones Web basadas en las siguientes tecnologías: Extjs, Php, Java, JAsperReports y PostgreSql

TECNOLOGIA
DESCRIPCION
ExtJs 6.0.1
Ext JS es una biblioteca de JavaScript para el desarrollo de aplicaciones web interactivas usando tecnologías como AJAX, DHTML y DOM.
Ext JS soporta todos los navegadores web más importantes, incluyendo:
PHP
Es un lenguaje para programar scripts del lado del servidor, que se incrustan dentro del código HTML. Este lenguaje es gratuito y multiplataforma.
Un lenguaje del lado del servidor es aquel que se ejecuta en el servidor web, justo antes de que se envíe la página a través de Internet al cliente
JAsperReports
JasperReports es una biblioteca de creación de informes que tiene la habilidad de entregar contenido enriquecido al monitor, a la impresora o a ficheros PDF, HTML, XLS, CSV y XML.
Está escrito completamente en Java y puede ser usado en gran variedad de aplicaciones de Java, incluyendo J2EE o aplicaciones web, para generar contenido dinámico.
Su propósito principal es ayudar a crear documentos de tipo páginas, preparados para imprimir en una forma simple y flexible.
Java
Java es un lenguaje de programación de propósito general, concurrente, orientado a objetos que fue diseñado específicamente para tener tan pocas dependencias de implementación como fuera posible. Su intención es permitir que los desarrolladores de aplicaciones escriban el programa una vez y lo ejecuten en cualquier dispositivo (conocido en inglés como WORA, o "write once, run anywhere"), lo que quiere decir que el código que es ejecutado en una plataforma no tiene que ser recompilado para correr en otra
PostgreSql

El objetivo principal de “EAS”, es brindar a los usuarios las herramientas necesarias para que puedan desarrollar sus propios ERP’s, la herramienta cuenta con las funcionalidades básicas que debería tener todo ERP, las cuales son:
  •          Control de Usuarios
  •          Registro de aplicaciones(módulos)
  •          Registro de funciones(formularios)
  •          Configuración dinámica de menús
  •          Configuración dinámica de Perfiles de Usuarios
  •          Configuración dinámica de Solicitudes (Informes, invocación de procesos almacenados o invocación de método de contenidos en una clase Java/Php).
  •          Configuración dinámica de Grupos de Solicitudes(Encapsulación de informes)


A cada nueva aplicación en “EAS” le corresponde un esquema de Base de Datos, este esquema se crea de forma automática al registrar una nueva aplicación, así como se crean la estructura de carpetas en el servidor, la siguiente imagen muestra la esta estructura:


EAS también nos proporciona herramientas para crear objetos en la base de datos, así como la generación dinámica de ABM’s.

El motor de solicitudes de EAS permite generar varios reportes a la vez, el usuario solo debe seleccionar la solicitud que dese ejecutar y enviarla al servidor,  el motor se encarga de ejecutar la solicitud he informar al usuario del estado de la misma, así de esta forma no tenemos que esperar a que termine el proceso para poder hacer otras actividades dentro del sistema.

La siguiente imagen explica la estructura interna de EAS en el servidor:


A continuación les dejo los manuales oficiales de la aplicación:

Manual del Módulo Administrador: Version PDF

Manual del Módulo Desarrollador: Version PDF

usuario: admin
clave: admin

Videos

A continuación te dejo los enlaces a los videos tutoriales que he preparado con respecto a la herramienta.

Configurar una Aplicación(nuevo modulo)..?
Crear Objeto de Base de datos con EAS…….?
Crear modelos y controladores………………….?
Crear ABM y Registrar función (usando el módulo DEV)…………………..?
Crear ABM y Registrar función (de forma manual)…………………..?

Crear una solicitud tipo “PROC”…………………?
Crear una solicitud tipo “IReport”…………………?
Crear una solicitud tipo “JAVA”….…………………?
Crear un grupo de Solicitudes……….………………?
Crear un menú……………………….…………………….?
Crear un Perfil………………………………………………?
Crear una empresa……………………………………….?
Crear un usuario…………………………………………..?
Crear juego de valor tipo “TABLA”………………..?
Crear juego de valor tipo “INDEPENDIENTE”..?
Ejecutar una solicitud……………………………………?


martes, 7 de abril de 2015

Paquetes con Sencha Cmd

Los paquetes en Sencha, son la mejor forma de compartir código JavaScript entre varias aplicaciones con diferentes tecnologías(Extjs y Sencha Touch).En este articulo veremos como aprovechar esta funcionalidad junto a nuestras aplicaciones Ext JS.


Preparando el escenario

La mejor forma de trabajar con Sencha Cmd y la generación de aplicaciones es atraves de los espacios de trabajo "Workspace", un espacio de trabajo no es mas que un directorio determinado dentro de nuestra PC, donde podemos encontrar elementos comunes tales como: aplicaciones,paquetes y el frameworks de ExtJs, esta no es la única forma de trabajar con Sencha Cmd, pero de lejos es la mejor para poder tener todo centralizado en un solo lugar.

Para este artículo, vamos a crear un espacio de trabajo de prueba en una carpeta vacía:

D:\extjs> sencha generate workspace .
Sencha Cmd v5.0.1.231
...


Ahora vamos a crear dos aplicaciones en nuestro nuevo espacio de trabajo,para ello nos dirigimos, en la consola de comando ejecutamos :

D:\extjs> sencha -sdk D:\Instaladores\ext-4.2.2-gpl\ext-4.2.2.1144 generate app ExtApp1 extApps/app1
Sencha Cmd v5.0.1.231
...

D:\extjs> sencha -sdk ext generate app ExtApp2 extApps/app2
Sencha Cmd v5.0.1.231
...

Podemos observar en el primer comando se puso la dirección absoluta del SDK de ExtJs, el cual no esta en nuestro "Workspace", esta instrucción crea nuestra aplicación y hace una copia local del SDK en nuestro worksape, es por esto que en el segundo comando se apunta a este para crear la segunda aplicación.

Ahora, tenemos un área de trabajo, un subconjunto de Ext JS y dos aplicaciones vacías en una estructura de carpetas que se ve así:

extjs/
    ext/             (Una copia con los archivos necesarios de Ext JS)
        packages/    (Paquetes proporcionados por Ext JS)
    extApps/
        app1/
        app2/
    packages/        (Carpeta para paquetes que no son del framework)

Vamos a Generar un paquete

Los paquetes pueden ser generados de forma similar a las aplicaciones, así:

D:\extjs> sencha generate package common
Sencha Cmd v5.0.1.231
...

La diferencia clave es que el nuevo paquete se coloca en la carpeta de "packages":

extjs/
    ...
    packages/
        common/
            resources/
            sass/
            src/
            package.json
            ...

ahora crearemos un archivo que sobrescriba la clase "Ext.form.field.Text", la dirección del archivo sera la siguiente:

el contenido de este archivo sera el siguiente :


Ahora vamos a utilizar el paquete en el proyecto app1, para ello en el archivo "app.json" en la seccion requires ponemos lo siguiente:


con esto nos estamos asegurando que nuestra aplicación cargara el contenido de este maquete, el sobrescribe la clase "Ext.form.field.Text".

Ahora actualizamos nuestra aplicación :

luego la ejecutamos:


y el resultado sera el siguiente:


como ahora si quisiéramos utilizar este mismo componente en la aplicación "app2", bastaría con modificar su respectivo archivo "app.json" incluyendo el paquete "common" y listo.

esta es una de las principales funcionalidades de trabajar con espacios de trabajo y paquetes.

eso es todo amigos espero que el articulo se de utilidad.











lunes, 19 de enero de 2015

Integrando Extjs 4.2 y Netbeans 8.2 utilizando Sencha CMD


En esta ocasión vamos a ver n ejemplo de cómo integrar Extjs y Netbeans utilizando la utilidad de comando Sencha CMD.
Los pasos que vamos a seguir serán los siguientes:
  1. Creamos un proyecot MVC con Sencha CMD(se debe tener instalado Sencha CMD para lograr este objetivo)
  2. Crear un Proyecto HTML5 utilizando "HTML5 Application with Existing Source"
  3. Crear un Proyecto Java Web(Web Application)
  4. Integrar los proyecto HTML5 y Java Web
  5. Crear un Theme personalizado con Sencha CMD
Bueno manos a la Obra:

Creando el Proyecto MVC con Sencha CMD

Vamos a crear un proyecto con Sencha CMD utilizando Extjs4.2, también podemos crear utilizando Extjs5, pero para fines de ejemplo lo haremos con la versión 4.2, yo tengo instalado en mi maquina Sencha CMD 5,para poder utilizarlo con extjs, nos dirigimos al directorio donde tenemos instalado extjs en mi caso seria: "D:\GWT\ext-4.2.2-gpl\ext-4.2.2.1144".

Abrimos la consola de comandos en este directorio tal y como se muestra en la siguiente imagen:




Ahora ejecutamos el siguiente comando para generar la aplicación con Sencha CMD:
sencha generate app Demo D:\GWT\DEMOS\DEMOSTRACION




Esta secuencia de comando lo que hace es generar toda la estructura de nuestro proyecto Extjs en el directorio "D:\GWT\DEMOS\DEMOSTRACION", lo siguiente que tenemos que hacer es crear nuestro proyecto HTML5 en Netbeans.

Crear un Proyecto HTML5 utilizando "HTML5 Application with Existing Source"

Abrimos Netbeans, hacemos click en el botón "New Project":





Seleccionamos "HTML5", y en la lista de proyectos seleccionamos "HTML5 Application with Existing Source":



En el campo "Site Root" debemos color el directorio donde están los archivos de código fuente de nuestra aplicación creada con Sencha CMD, en Netbeans nuestro proyecto tendrá la siguiente estructura:




Ahora Procedemos a crear nuestro proyecto "Java Web".

Crear Proyecto Java Web(Web Application)

Ahora vamos a crear un proyecto "Web Application" en netbeans tal cual se muestra en las siguientes imágenes:




Ahora tendremos dos proyectos en Netbeans, en el proyecto Java Web es donde tendremos la lógica de negocio y la comunicación con el servidor atravez de objetos que extiendan de la clase "HttpServlet" , y en el proyecto HTML5 es donde estará nuestra capa de presentación, la cual estará diseñada utilizando objetos de extjs contenido en archivos de JavaScript,la imagen a continuación muestra como estaría nuestro árbol de proyectos en Netbeans:





Ahora solo nos queda integrar estos dos proyectos, para que cuando construyamos la aplicación HTML5 con Senha CMD, todo el código compilado se refleje en el proyecto Java Web.

Integrar los proyectos HTML5 y Java Web

Para integrar los proyectos, vamos a modificar el archivo "build.xml" del proyecto HTML5, adicionando las siguientes sentencias:

<target name="-after-build">
<copy todir=" D:/GWT/DEMOS/DemoExtJs/web ">
<fileset dir="${build.dir}"/>
</copy>
</target>

Con esto simplemente le estamos diciendo que cuando termine la construcción del proyecto , todo se copie al directorio "D:/GWT/DEMOS/DemoExtJs/web", ahora nuestro archivo quedaría de la siguiente forma tal como se muestra en la siguiente imagen:



Con esto ya tenemos integrado los dos proyectos, ahora vamos a construir la aplicación con ayuda de Sencha CMD, para ellos nos dirigimos al directorio donde esta nuestro proyecto HTML5 el cual seria "D:\GWT\DEMOS\DEMOSTRACION", abrimos la consola de comandos en este directorio y ejecutamos: "sencha app build package"




Ahora si revisamos nuestro proyecto Java Web en netbeans notamos que se han creados varios archivos, tal como se muestra en la imagen:




Estos archivos fueron copias por Sencha CMD, estos archivos contienen todo el código fuente de los componentes de extjs, así como también el código fuente de nuestra aplicación, ejecutamos la aplicación:




Vamos hacer una pequeña modificación a nuestra aplicación HTML5, vamos a modificar el archivo "app.js" tal como se muestra en la imagen:




Ahora volvemos a ejecutar el comando: "sencha app build package", luego ejecutamos la aplicación desde netbeans:



Ahora solo nos queda crear un Theme y utilizarlo en nuestra aplicación.

Creando un Theme personalizado con Sencha CMD

En el mismo directorio donde esta nuestra aplicación HTML5 ejecutamos el siguiente comando: sencha generate theme theme-demo tal como se muestra en la figura:




Ahora observamos nuestro proyecto en netbeans y vemos que se nos han creado nuevos archivos:





Estos archivos son los que corresponden al nuevo theme que vamos a personalizar para nuestra aplicación, primero vamos a modificar el archivo package.json el cual esta ubicado en Site Root\packages\theme-demo, vamos a dejarlo tal como se muestra en la imagen:




Luego creamos un archivos .scss llamado "Component.scss" en la carpeta Site Root\packages\theme-demo\sass\var




Ha este archivo le agregamos la siguiente línea: $base-color: #004D70 !default;




Con esta línea estamos definiendo el color base para todos los componentes.

Ahora procedemos a modificar el archivo "sencha.cfg" el cual se encuentra en el directorio "D:\GWT\DEMOS\DEMOSTRACION\.sencha\app", vamos a modificar la línea:

# The name of the package containing the theme scss for the app
app.theme=ext-theme-classic

y la vamos a dejar de la siguiente forma:

# The name of the package containing the theme scss for the app
app.theme= theme-demo

Con esta modificación lo que le estamos diciendo al compilador de extjs, que esta aplicación va a utilizar el tema que hemos creado, ahora en la consola de comando ejecutamos los siguientes 
comandos:

sencha ant clean -- limpiamos el directorio en caso de que ya hayamos construido la aplicación anteriormente

sencha app build -- contruimos la aplicación




Ahora ejecutamos la aplicación y veremos el resultado:




Utilizando Sencha CMD para construir nuestra aplicación es lo más conveniente, ya que el resultado final es un código reducido, si no decidiéramos utilizarlo tendríamos que copiar toda la carpeta Extjs a nuestro proyecto Java Web y esto solo nos ocuparía espacio en disco innecesario, además que para poder crear y utilizar Theme personalizados es necesario crear nuestros proyectos con esta utilidad.

 

La aplicación que hemos realizada aquí es solo una demostración de lo que podríamos hacer, por el momento solo es presentación, agregaremos más adelante la integración con el servidor y con el motor de Base de Datos.

pueden descargar el código fuente de  Aqui

Eso es todo amigos, espero que les haya gustado el artículo.

File sharing system in PHP free code (Veno File Manager v4.2.7)

  File sharing system in PHP free code (Veno File Manager v4.2.7) Download: veno-file-manager-v427 File sharing system in PHP free code ===...