Desarrollo de los Módulos en la Herramienta TYPO3

3.7.2.1. Módulo 1

Para la creación de este módulo se usa la aplicación kickstarterwizard, la cual ayuda en la creación de los archivos necesarios para el funcionamiento de la extensión que se llamará LibreriaArticulos, a la cual se definine como FrontendPlugin. Ver Figura III.67.

Figura III. 67: Creación de la extensión LibreriaArticulos, con la aplicación kickstarterwizard - Módulo 1 Herramienta Typo3 v. 4

Los archivos a crearse de la extensión LibreriaArticulos con la aplicación kickstarterwizard, son los siguientes. Ver Figura III.68

Seguidamente ir al archivo ubicado en el directorio typo3conf\ext\LibreriaArticulos\tca.php el cual contiene los campos de nuestra interfaz con su respectivo tipo y dimensiones. Ver Figura III.69.

Figura III. 69: Archivo tca.php con los datos para nuestra interfaz de usuario - Módulo 1 Herramienta Typo3

Ahora hay que ubicarse en el back-end de la aplicación, se va a la página y se añade un nuevo elemento, en este caso un nuevo artículo de librería. Ver Figura III.70.

Una vez escogido el nuevo elemento de artículo de librería se navega en la interfaz del elemento. Ver Figura III.71.

Figura III. 71: Formulario de ingreso de datos de un Artículo de librería - Módulo 1 Herramienta Typo3

3.7.2.2. Módulo 2

Para la creación del presente módulo, de igual manera al anterior se hace uso de kickstarterwizard en el establecimiento de la tabla tx_libreriaarticulos_articulo, con sus respectivos campos. Ver Figura III.72.

Figura III. 72: Creación de los campos de la tabla tx_libreriaarticulos_articulo con la aplicación kickstarterwizard - Módulo 2 Herramienta Typo3

Para comprobación se observa que la tabla es creada en la base de datos. Ver Figura III.73.

Figura III. 73: Tabla creada en la base de datos, con sus respectivos campos - Módulo 2 Herramienta Typo3

En el archivo typo3conf\ext\LibreriaArticulos\ext_tables.php se encuentra el código necesario para guardar los datos en la tabla tx_libreriaarticulos_articulo. Ver Figura III.74.

Figura. 74: Código necesario para el ingreso de datos de un artículo en la base de datos en el archivo ext_tables.php - Módulo 2 Herramienta Typo3

La interfaz para que el usuario ingrese un nuevo artículo es simple y amigable, Ver Figura III.75.

Figura III. 75: Ingreso de datos de un nuevo artículo de librería en el back-end - Módulo 2 Herramienta Typo3

Así como el listado de los artículos que se encuentran ya ingresados. Ver Figura III.76.

Figura. 76: Visualización del artículo ingresado en el back-end de nuestra aplicación - Módulo 2 Herramienta Typo3

En el archivo ubicado en:

typo3conf\ext\LibreriaArticulos\pi1\class.tx_LibreriaArticulos_pi1.php se encuentra el código necesario para la visualización en el front-end del listado de artículos ingresados en la base de datos. Ver Figura III.77.

Figura. 77: Archivo class.tx_LibreriaArticulos_pi1.php, con el código para visualizar el listado de artículos en el front-end - Módulo 2 Herramienta Typo3

La visualización del listado de los artículos se da de forma prolija y amigable. Ver Figura III.78.

En el archivo ubicado en:

typo3conf\ext\LibreriaArticulos\pi1\class.tx_LibreriaArticulos_pi1.php se encuentra el código necesario para la visualización en el front-end de un artículo específico. Ver Figura III.79.

Figura III. 79: Archivo class.tx_LibreriaArticulos_pi1.php, con el código para visualizar un artículo específico en el front-end - Módulo 2 Herramienta Typo3

La visualización del listado de los artículos se da de forma prolija y amigable. Ver Figura III.80.

3.7.2.3. Módulo 3

Para este módulo, se expandirá el componente haciendo uso de kickstarterwizard, se añaden 4 tablas más a la base de datos, la tabla tx_libreriaarticulos_categoria, tx_libreriaarticulos_subcategoria, tx_libreriaarticulos_proveedor y la tabla tx_libreria_articuloproveedor. Y a la vez se modifica la estructura de la tabla tx_libreriaarticulos_articulo, eliminando el campo categoría para tenerla en una tabla aparte, con su respectiva sub categoría. Para la demostración se muestra la creación de la tabla tx_libreriaarticulos_categoria. Ver Figura 3.76.

Figura III. 81: Creación de los campos de la tabla tx_libreriaarticulos_categoria con la aplicación kickstarterwizard - Módulo 3 Herramienta Typo3

Continuando con la demostración del componente expandido, aquí se presenta la tabla creada en la base de datos. Ver Figura III.82.

Figura III. 82: Tabla creada en la base de datos, con sus respectivos campos - Módulo 3 Herramienta Typo3

En el archivo typo3conf\ext\LibreriaArticulos\ext_tables.php se encuentra el código necesario para guardar los datos de todas las tablas creadas anteriormente, tx_libreriaarticulos_categoria,

tx_libreriaarticulos_subcategoria,

tx_libreriaarticulos_articulo, tx_libreriaarticulos_proveedor,

tx_libreriaarticulos_articulosproveedor. En el archivo ext_tables.php se encuentra el código para el ingreso de los datos de todas las tablas creadas. Ver Figura III.83.

Figura III. 83: Código necesario para el ingreso de datos de un artículo en la base de datos en el archivo ext_tables.php - Módulo 3 Herramienta Typo3

Ahora se va a ingresar datos a cada una de las tablas mediante el formulario de ingreso de cada una de las tablas en el back-end. Aquí se presenta la demostración el ingreso de los datos respectivos de una nueva categoría. Ver Figura III.84.

Figura III. 84: Ingreso de datos de una nueva categoría en el back-end - Módulo 3 Herramienta Typo3

Una vez ingresado la categoría deseada, se mostrara el listado de las categorías existentes. Ver Figura III.85.

Figura III. 85: Visualización de la categoría ingresada en el back-end de nuestra aplicación - Módulo 3 Herramienta Typo3

En el archivo ubicado en

typo3conf\ext\LibreriaArticulos\pi3\class.tx_LibreriaArticulos_pi3.php se encuentra el código necesario para la visualización en el front-end del listado de categorías disponibles ingresadas en la base de datos. Ver Figura III.86.

Figura. 86: Archivo class.tx_LibreriaArticulos_pi3.php, con el código para visualizar el listado de categorías en el front-end - Módulo 3 Herramienta Typo3

El cual presenta los datos requeridos en pantalla en el front-end. Ver Figura III.87.

Figura III. 87: Visualización del listado de categorías en el Front-End - Módulo 3 Herramienta Typo3

Cada visualización de la información requerida tiene su propio código que supervisa el diseño de presentación de los datos en pantalla en el front-end, como se muestra en las dos figuras anteriores.

3.7.2.4. Módulo 4

En este módulo, se va a estudiar las facilidades que TYPO3 ofrece para la administración de las extensiones o componentes, su instalación, desinstalación, habilitación, des habilitación, entre otros. Ver Figura III.88.

Figura III. 88: Menú para la administración de extensiones - Módulo 4 Herramienta Typo3

Para la instalación de un componente Typo3 brinda interfaces sin complicaciones, ver Figura III.89.

Typo 3 permite buscar el componente en forma local o en una dirección web, ver Figura III.90.

Figura. 90: Búsqueda del componente a instalar - Módulo 4 Herramienta Typo3

Si el procedimiento se realizó correctamente, y el componente a instalar contiene todos los archivos necesarios de instalación, se mostrará en pantalla un mensaje de éxito en la instalación. Ver Figura III.91.

Para la desinstalación de un componente, Typo3 muestra un listado de los mismos, si se desea desinstalarlo completamente se lo ubica y se da clic en la figura de una esfera verde con un signo “-” sobre esta. Ver Figura III.92.

Figura. 92: Gestión de componentes, desinstalación - Módulo 4 Herramienta Typo3

Si el proceso de desinstalación se realizó completamente se mostrará un mensaje de éxito de la desinstalación. Ver Figura III.93.