diciembre 11, 2011

working with ActiveVFP 5.6 on WebMatrix



Recuerde que..
Este blog esta desarrollado en idioma español pero utilizando Google Traductor puede adecuarlo al lenguaje de su preferencia.. Favor utilice la opcion del recuadro superior derecho... y Bienvenido a Integracion Google.

Esta es pequeña y rápida introducción a como utilizar ActiveVFP en su versión 5.6 vigente al 15/12/2011 (la ultima lanzada es la versión 6.03 del 29 de Enero del 2013, pero dicha versión solo corre sobre Windows Vista o superior, y por ello solo disponible en algunos servicios hosting.. las versiones 5.x si funcionan sobre cualquier versión de Windows y sobre cualquier servicio hosting Microsoft, y es en la practica lo mismo que la versión 6.x); y con lo que pretendemos saldar una deuda con los miembros de la comunidad del zorro, por cuanto, durante nuestro desarrollado profesional, y para el desarrollo de aplicaciones cliente-servidor de escritorio, muchas veces hemos recurrido a usar VisualFoxpro (VFP) en nuestros proyectos, y por supuesto, reconocemos las ventajas que nos proporciona utilizar el entorno de desarrollo VFP para lograr rápidamente productos de alcance profesional.. y al haberse indicado que una de las limitaciones de este entorno es su falta de integración al mundo del desarrollo Web, presentamos este codelab, que pretende mostrar en esta primera etapa, en un sencillo modelo, que también es posible trabajar rápidamente con ActiveVFP usando WebMatrix, utilizando comandos, funciones y clases VFP en nuestros proyectos Web, por el lado del servidor.

Para seguir este codelab solo se requiere tener conocimientos básicos de HTML, VFP y Javascript (no ExtJs que es el framework javascript que más utilizamos en nuestros codelabs), pues lo que buscamos es que se llegue a tener una visión completa de como trabaja ActiveVFP, y por supuesto vale reiterar, que ActiveVfp es un complemento que se encuentra correctamente integrado al desarrollo Web, y nos permite trabajar con tecnologías vigente como Ajax, Json, etc.. y a través de javascript y CSS, trabajar con frameworks como Jquery, ExtJs y toda la tecnología ligada a esas tecnologías.


Instalando nuestro codelab "avfp-guestbook" en WebMatrix

Como se indica, tenemos por supuesto que haber instalado en nuestro ordenador WebMatrix tal como se indica en nuestra entrada WebMatrix: la plataforma opensource de desarrollo Web de Microsoft, por lo que si no lo han realizado, deben seguir los pasos detallados en dicho codelab; y luego, proceder a cargar nuestro material de apoyo en una carpeta que podriamos llamar "AVFP" ó "ActiveVFP", como estimemos conveniente (..y por supuesto, si no deseamos instalar WebMatrix podríamos trabajar sobre un servidor IIS instalado en nuestro equipo Windows, pero su correcta configuración y uso tiene sus cosas.. por supuesto existe documentación y discusiones al respecto, por lo que también podríamos considerar como una opción).

Continuando pero sobre la plataforma WebMatrix, lo primero es proceder a crear un nuevo "site" en WebMatrix a partir de la carpeta creada al extraer los archivos de nuestra descarga (denominada "avfp-guestbook"). El proceso de carga y configuración de nuestro servidor IIS es realizado en forma automática por WebMatrix, por lo que luego solo debemos seleccionar nuestro navegador de preferencia para ejecutar el ejercicio y éste será lanzado al navegador seleccionado a través de un puerto que se encuentre disponible ( http://localhost:xxxxx ).


Material de Apoyo : 
( do click on blue icons to download )

avfp-guestbook.rar, que corresponde a una adaptación de un "libro de visitas" bajo un formato que ya hemos utilizado utilizado en nuestros codelabs referidos al uso del datastore de Google App Engine, pero ahora utilizando como Back-End a Visual Foxpro, mediante ActiveVFP, y desplegando nuestro proyecto sobre un servidor IIS incluído en la plataforma de WebMatrix; debiendo reiterarse que nuestro Back-End es VFP, por cuanto utilizamos las tablas *.dbf de dicha plataforma, y los comandos, funciones y clases de VFP requeridos para interactuar con ella.







ActiveVFP es una implementación en lenguaje ASP y ASP.Net de Visual Foxpro (como por ejemplo, tambien lo es la librería Quercus que nos permite trabajar con PHP en el mundo Java), vale decir que nuestros comandos, funciones y clases VFP son interpretados como comandos ASP que son los que si reconoce y ejecuta un servidor IIS, y el nivel de adecuación de esta herramienta es bastante completa y eficiente, abarcando incluso la versión 9 de VisualFoxpro.. otro punto importante, es que el proyecto ActiveVFP es bastante activo y vigente, siendo su ultima actualización realizada a fecha 29/01/2013 (versión 6.03 como hemos indicado, y la que se puede descargar directamente del homepage del proyecto activeVFP en codeplex).

Las instrucciones y clases para la interpretación de VFP se encuentran contenidas en los archivos activevfp.dll, VFP9RENU.dll y otros archivos *.dll contenidos en el complemento, y los que deben incluirse en la carpeta principal de cada uoo de nuestros proyectos, siendo también necesaria la existencia de una carpeta "prg", que es la que va a contener como mínimo, a nuestro archivo "main.prg", la que pone en funcionamiento la librería (mediante la función "AVFPinit()"), y en la cual podremos configurar las principales variables de entorno disponibles por la librería, entre las que podemos destacar:

  • oProp.DataPath, para indicar en que carpeta de nuestro "servidor" ó equipo se encuentra alojada la data de nuestro proyecto.
  • oProp.HtmlPath, para indicar en que carpeta se alojaran nuestros archivos HTM, que este caso han sido ruteados hacia "oProp.AppStartPath", que contiene la carpeta de donde se llama a nuestro proyecto.
  • oProp.Action, en donde podemos indicar el nombre del script llamado en cada proceso, etc.

En ese mismo archivo podremos definir nuestras propias funciones VFP que utilizaremos en el proyecto.. en este caso no necesitamos ninguno (excepto el que estamos utilizando para mostrar el código de nuestra página), pero conviene que en la documentación de ActiveVFP revisemos la clase AVFPproperties (casi al final de lista de clases).

En este codelab tambien estamos trabajando con la clase AVFPrequest, para capturar los datos de los FORM de nuestras páginas HTML (*.avfp en este caso), y asimismo a la clase AVFPresponse para redirigirnos a una dirección ó URL, pero para mayores detalles también conviene que revisemos la documentación al respecto.

Considérese que nuestras tablas *.dbf en la ruta indicada en la ruta de oProp.DataPath se encuentran disponibles para su uso, y "abiertas" en modo shared, porque aún estando en ejecución nuestro proyecto, podremos acceder a ellas, abriéndolas desde la pantalla de comandos VFP, pero verificando que también usemos modo "shared"; asimismo, si hicieramos alguna modificación en las mismas no olvidemos de ejecutar el comando "flush" desde nuestra ventana de comandos (ó código de nuestros programas y sistemas) para que se carguen nuestras modificaciones a las tablas y los podamos observar al refrescar nuestro navegador.

Este último punto muestra uno de los retos de programación referidos a desarrollo Web en cuanto a que las modificaciones que puedan estar efectuando nuestros usuarios no son reflejados automáticamente en nuestras "tablas" ó "grids", excepto que nuestro código contemple un periodo de refresco (pudiendo utilizar Ajax con esa finalidad), ó adecuando nuestra lógica para que considere probables modificaciones de la data que puedan efectuar nuestros usuarios.. ests técnicas también son consideradas cuando trabajamos a nivel cliente-servidor con bases de datos externas a VFP como MySQL, postgressSQL, SQLServer, etc. por lo que ahora debemos mantener las mismas formas pero en desarrollo Web.


Instalando la demo de ActiveVFP 5.6 en nuestro WebMatrix

Para los que han tenido alguna dificultad en la correcta configuración del ruteo de los enlaces del demo de ActiveVFP 5.6, les pasamos nuestra versión corregida para que puedan trabajar con ella sin mayores contratiempos; debiendo resaltarse que, para el correcto funcionamiento de algunas de sus opciones (como el despliegue de gráficos e impresión de reportes VFP en formato PDF, eben efectuarse las instalaciones y configuraciones indicadas en el mismo demo, las que también son detalladas en la documentación disponible en el mismo demo.


Material de Apoyo : 
( do click on blue icons to download )

activeVFP_5.6.rar, correspondiente a la demo de la versión 5.6 de ActiveVFP, lista para instalar sobre WebMatrix.. y a la que le hemos agragado la "impresión de algunas variables de entorno para su revisión..




Instalando una plantilla para nuevos proyectos ActiveVFP 5.6 en WebMatrix.


Material de Apoyo : 
( do click on blue icons to download )

myproject.rar, que corresponde a un proyecto "vacío" que solo contiene un Hola Mundo para que lo podamos utilizar para iniciar nuestros propios proyectos, debiendo destacar que, para el caso de la creación de las "tablas" debemos crearlas desde la ventana de comandos de nuestro VFP directamente sobre la carpeta "mydata" de la descarga de éste material de apoyo ó configurar en el archivo "main.prg" la ruta de ubicación de nuestra data, y de los otros componentes de nuestro proyecto si lo estimásemos necesario.

Descarguemos este material de apoyo en la misma carpeta donde estemos trabajando este codelab, y luego al crear un sitio en nuestro WebMatrix a partir de la carpeta "myproject" creada con la descarga, pongamoslo en funcionamiento en nuestro navegador y tendremos una pagina como la mostrada.. y dispondremos de una plantilla ActiveVFP 5.6 que podremos utilizar para hacer nuestras propias pruebas ó proyectos.




Trabajando con el Back-End VFP en un modelo CRUD usando Ext-JS v.3.4.0


Material de Apoyo : 
( do click on blue icons to download )

avfp-CRUD.rar, que corresponde a nuestro modelo CRUD (Create, Read, Update y Delete), de una Tabla VFP que contiene a los presidentes de U.S.A. llamada presidents.dbf, la cual utiliza a otra Tabla llamada parties.dbf que contiene a los partidos políticos que respaldaron a cada presidente. Este es un modelo sencillo que nos muestra como utilizando un framework, como ExtJS version 3.4.0 en este caso, se puede "ordenar" nuestros proyectos, separando nuestros códigos del lado del cliente (HTML, Javascript, CSS), de nuestro código el lado del servidor ó Back-End.







En este caso, los códigos del manejo de nuestra base de datos NO se "incrustan" en el código HTML de nuestro proyecto; y nuestro código VFP del lado del servidor se muestra más ordenado y comprensible, los que se encuentran alojados en la carpeta "prg", y comprende a los siguientes archivos:

  • main.prg, archivo principal de nuestro proyecto, de ejecución automática al iniciarse el proyecto, y que aparte de contener la lógica principal de manejo y gestión de nuestras tablas VFP, permite la configuración de las principales variables y objetos del entorno de desarrollo activeVFP.
  • updatepr.prg, archivo PRG que contiene el código VFP que permite la modificación y actualización de nuestra tabla de presidentes.
  • createpr.prg, archivo PRG que contiene el código VFP que permite la creación de nuestra tabla de presidentes.
  • deletepr.prg, archivo PRG que contiene el código VFP que permite el borrado "lógico" de uno ó varios de los registros de nuestra tabla de presidentes. En este caso vale destacar que las tabla VFP son abiertas por defecto en modo SHARED por activeVFP, por lo que restringe el borrado físico de registros, por lo que debemos adecuar la lógica de nuestros proyectos a esta condición.
  • Las opciones de búsqueda son aplicadas directamente sobre el código de nuestro archivo main.prg, los que deberá revisar para mayor detalle.

Los archivos javascript que componen el proyecto se encuentran alojados en la carpeta  "javascript" y comprende a los siguientes archivos:

  • mainscript.js, archivo JS que contiene el código ExtJS que permiten la creación,visualización y manejo de nuestra ventana, grilla, y otros componentes de nuestro proyecto (ventanas de creación de registros, búsqueda, etc), y que además contienen la lógica del proyecto por el lado del "cliente", referidos a los procesos necesarios para que un usuario pueda realizar las operaciones CRUD de nuestro listado de presidentes desde el navegador de su preferencia.
  • searchfield.js, archivo JS que contiene el código ExtJS que permiten la búsqueda rápida de un nombre o apellido ingresado.
  • GridPrint.js, archivo JS que contiene el código ExtJs y Javascript que permiten la impresión de un listado simple de nuestra lista de presidentes.

Otros componentes del proyecto:

  • carpeta "CSS", contiene a los archivos style.css, que controla las imagenes de nuestra grilla;, y GridPrint.css, que controla los estilos de nuestra impresión.
  • carpeta "ext-3.4.0", contiene los archivos javascript y css que comprenden al framework ExtJS de la verión que se indica (los que son llamados desde el archivo index.html de nuestro proyecto.
  • y por supuesto, la carpeta "data", que contiene a las tablas presidents.dbf y parties.dbf que son las utilizadas en este ejercicio.

Inicio del proyecto:

  • El archivo de inicio de este ejercicio es el archivo "index.html" que se encuentra alojado en la ruta oProp.AppStartPath, es decir la carpeta desde donde "arranca" nuestro proyecto. Los otros archivos que se encuentran en dicha carpeta son componentes de activeVFP y no pueden ser borrados.

las carpetas "bin" y "temp" son también del proyecto activeVFP y no conviene eliminarlas.. y hay otra carpetas que parecen en la demostración del proyecto activeVFP pero que hemos eliminado porque no las utilizamos en este ejercicio.



Saludos
@Mlaynes


NOTAS DE TRABAJO :

1.- Para abrir un documento *.avfp ó *.prg desde WebMatrix, haga click derecho sobre el archivo requerido y seleccionemos la opción "abrir con WebMatrix"

2.- Resulta interesante observar que para hacer nuestra prueba y seguir este "codelab" no es necesario incluso que tengamos VFP instalado en nuestro ordenador... activeVFP compila automáticamente el archivo "main.prg" y las modificaciones que podamos realizar sobre ella, aunque por supuesto, resulta necesario tener instalado VFP para inspeccionar y/o modificar nuestras tablas *.dbf. Pero vale indicar que, si trabajamos con varios PRG, llamados a traves de SET PROCEDURE TO, activeVFP no compila automáticamente esos archivos, y resultó necesario compilar esos archivos desde la ventana de comandos de VFP (updatepr.prg, deletepr.prg, etc).

3.- Por lo expuesto en el punto anterior, conviene que durante nuestros desarrollos, realicemos y probemos nuestros códigos incrustados en nuestro "main.prg" (que se compila automáticamente), y luego, si resultase necesario, y no sobrecargar nuestro main.prg, crear los *.prg que necesitemos.

4.- No olvidemos que podemos modificar en la opción configuración de nuestro "Site" el puerto que utilizaremos para lanzar nuestro proyecto a nuestro navegador (opción Configurar)

5.- Conviene también que ejecutemos la opción "Informe" de nuestro "Site", que nos indicará en forma bastante detallada la manera de optimizar nuestros proyectos.

6.- La opción database de nuestro "Site" la utilizaremos para trabajar con una base de datos SQL Server compact, que es una versión ligera y liberada de SQLServer de Microsoft que viene integrada a WebMatrix (como MySQL en las plataformas LAMP ó WAMP).