Full Day Ext JS, Spring y Hibernate

0 comentarios

Mi empresa está aperturando un full day de Ext JS. Como parte importante de toda aplicación, necesitamos frameworks del lado del servidor para poder hacer una aplicación seria. Por tal motivo en este full day se estudiará Spring y Hibernate también.

Lo que aprenderás:
* Como aplicarlo en sistemas reales. Existen muchos tutoriales pero muy pocos te enseñan como preparar la arquitectura de tu aplicación y las consideraciones que debes tener cuando haces un sistema basado en extjs
* Buenas prácticas en el desarrollo. Para que tu código sea óptimo y no tengas dolores de cabeza cuando no sabes donde está cada cosa.
* Como integrar sus componentes. Muchos sabemos hacer una grilla o un formulario, pero a la hora de integrarlos ambos o con más componentes es un martirio.
* Spring MVC y Hibernate. Necesitamos de frameworks en el lado del servidor que nos permitan desarrollar aplicaciones.
* Si tu lenguaje de desarrollo no es java, no te preocupes Ext JS está pensado para trabajar con cualquier tecnología del lado del servidor(php, jsp, servlets, asp).

Fecha: Sábado 15 de diciembre 9am - 6:00pm

Lo brinda: Lima TI SAC

Instructor: Mayer Horna

Dejanos tus datos para contactarte

Syllabus y Costo








Aprende uno de los mejores frameworks JavaScript para el desarrollo de Aplicaciones RIA.

Saludos

Ext JS - Sencha Touch

2 comentarios

En este post hablaré sobre Sencha Touch, aun tengo pendiente postear sobre otros componentes de ExtJS como Form, Tabs, etc. He dejado un poco abandonado mi blog, así que era momento de este post.

Hace un par de años se creó una nueva organización llamada Sencha, dejando de lado el nombre “Ext JS” con el propósito de impulsar no solo extjs sino además otros productos como Sencha Touch, Ext GWT, Ext Designer, Sencha Animator y Ext Core.

Sencha Touch es un framework javascript construido para desarrollar aplicaciones web móviles, está totalmente basado en HTML5, CSS3 y Javascript. En teoría cualquier smarthphone que tenga instalado un navegador que soporte estos estándares podría mostrar una aplicación hecha con sencha Touch, aunque solo certifican su uso sobre iPhone, Android y BlackBerry.

Aclarando algunas cosas: 
1) Sencha Touch es un framework javascript, al igual que ExtJS, por tanto su ámbito es un browser, la diferencia es que tiene componentes más ligeros y pequeños para que se puedan visualizar en un dispositivo móvil.

2) Al ser prácticamente una aplicación web, se comporta como tal: va a existir en un servidor web el cual centraliza los fuentes, de tal manera que cualquier actualización sobre la aplicaicón se hace sobre el servidor y cada dispositivo al acceder a la página verá el cambio, a diferencia de una aplicación nativa que si requiere un proceso de actualización iniciada en el mismo dispositivo.

3) Desarrollar aplicaciones bajo este tipo de plataformas está de moda, por ejemplo Jquery Mobile sigue el mismo concepto. Ahora los smartphones son mas accesibles económicamente.

4) Si te estás preguntando: “¿Entonces estas aplicaciones solo funcionan si el servidor web está activo o si mi smarthpone tiene conexión a internet?”. Todo dependerá de cómo desarrolles tu aplicación. Puedes crear una interfaz de pedidos y todo almacenarlo en el LocalStorage del Browser y luego hacer un proceso de sincronización que cargue todos los pedidos a tu servidor central. Ahora con HTML5 hasta sentencias SQL puedes hacer. 

La instalación: 
1)
Descarga los fuentes de http://www.sencha.com/products/touch/download/

2)
Crea una carpeta llamada demo_senchatouch en su interior crea un HTML llamado index.html El cuerpo del HTML que sea algo simple como:

 
<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
</body> 
</html>
Un documento en html 5 se reconoce por el al iniciar.
Más info sobre HTML5:
http://es.wikipedia.org/wiki/HTML5 http://www.manning.com/crowther/ http://www.manning.com/crowther2/

3)
Dentro de la carpeta demo_senchatouch crea otra llamada touch, y dentro de esta carpeta copiarás el archivo sencha-touch-all.js y la carpeta resources que se encuentran en los fuentes descargados de Sencha Touch. La instalación es muy similar a la de Ext JS

4)
Dentro del elemento head añade las siguientes líneas:
 

Estos dos archivos son los necesarios para poder empezar.


5)
Dentro del head creamos el elemento y colocamos lo siguiente:
Ext.application({
    name: 'Sencha',

    launch: function() {
        Ext.create('Ext.Panel', {
            fullscreen: true,
            html: 'Hola Mundo'
        });
    }
});
launch es como el Ext.onReady(…) se ejecuta una vez que el html ha sido cargado completamente.

Ejecuta el index.html, puedes ejecutarlo con google chrome que soporta HTML5, o descargarte algún emulador o entra a estos en la web:
http://www.testiphone.com/
http://tmobile.modeaondemand.com/htc/g1

El resultado:
6)
Formulario con Sencha Touch. Para hacer un formulario formulario no hace falta más que remplazar tu Hola Mundo por Un FormPanel. En Sencha Touch la creación de componentes es igual que en Ext JS, y en su mayoría los nombres de los componentes coinciden. Por Ejemplo, el siguiente código crea un formulario con una sola caja de texto y un botón "Verificar":
 Ext.application({
    name: 'Sencha',
    launch: function() {
        Ext.create('Ext.form.Panel', {
            fullscreen: true,
                    title: 'Cliente',
                    iconCls: 'customer',
                    xtype: 'formpanel',
                    url: 'ClienteServlet',
                    layout: 'vbox',

                    items: [
                        {
                            xtype: 'fieldset',
                            title: 'Datos',
                            
                            items: [
                                {
                                    xtype: 'textfield',
                                    label: 'Nombre',
                                    name: 'name'
                                }

                            ]
                        },
                        {
                            xtype: 'button',
                            text: 'Verificar',
                            ui: 'confirm',
                            handler: function() {
                                this.up('formpanel').submit({
                                 success:function(form, action){
           var jsonResponse = action.result;
           Ext.Msg.alert('Info', 'La información ha sido enviada');
                                 },
                                 failure:function(form, action){
                                  
                                 }
                                });
                            }
                        }
                    ]
        });
    }
});
El resultado del código anterior:
Observen la propiedad url: 'ClienteServlet' , está apuntando a un Servlet, con esto se comprueba que acá no hay magia, el submit va al servidor web y es gestionado por un Servlet .

Si se puede colocar un Servlet entonces se puede colocar cualquier recurso del servidor: .php, .asp, .jsp, etc.

Por último si tienes una aplicación con Spring MVC, no tienes que cambiar nada en el servidor, solo consumes tus controllers ya programados. Lo que cambia es tu interfaz, tendrás una interfaz para un movil y otra para tu aplicación web que consumen un mismo controller de spring.

El api para cualquier consulta:
http://docs.sencha.com/touch/2-0/#!/api 

Nos vemos pronto.

Ext JS 4 - Inicio 14 abril 2012

0 comentarios

Mi empresa está aperturando nuevamente el curso de Ext JS.

Lo que aprenderás:
* Como aplicarlo en sistemas reales. Existen muchos tutoriales pero muy pocos te enseñan como preparar la arquitectura de tu aplicación y las consideraciones que debes tener cuando haces un sistema basado en extjs
* Buenas prácticas en el desarrollo. Para que tu código sea óptimo y no tengas dolores de cabeza cuando no sabes donde está cada cosa.
* Como integrar sus componentes. Muchos sabemos hacer una grilla o un formulario, pero a la hora de integrarlos ambos o con más componentes es un martirio.
* Spring MVC y Hibernate. También hay horas dedicadas a estas materias, necesitamos de frameworks en el lado del servidor que nos permitan desarrollar aplicaciones.
* Si tu lenguaje de desarrollo no es java, no te preocupes Ext JS está pensado para trabajar con cualquier tecnología del lado del servidor(php, jsp, servlets, asp).

Inicio: Sábado 14 de abril 9am - 1:30pm

Lo brinda: Lima TI SAC

Instructor: Mayer Horna

Dejanos tus datos para contactarte

Syllabus y Costo










Aprende uno de los mejores frameworks JavaScript para el desarrollo de Aplicaciones RIA.

PD: He observado que mis últimos post son referentes al inicio de este curso.... postearé algo esta semana.

Saludos

Ext JS - Curso Verano - Convocatoria

0 comentarios

Estoy aperturando nuevo grupo Ext JS.

Lo que aprenderás:
* Como aplicarlo en sistemas reales. Existen muchos tutoriales pero muy pocos te enseñan como preparar la arquitectura de tu aplicación y las consideraciones que debes tener cuando haces un sistema basado en extjs
* Buenas prácticas en el desarrollo. Para que tu código sea óptimo y no tengas dolores de cabeza cuando no sabes donde está cada cosa.
* Como integrar sus componentes. Muchos sabemos hacer una grilla o un formulario, pero a la hora de integrarlos ambos o con más componentes es un martirio.
* Spring MVC y Hibernate. También hay horas dedicadas a estas materias, necesitamos de frameworks en el lado del servidor que nos permitan desarrollar aplicaciones.

Inicio: Sábado 28 de enero ó Sábado 04 de febrero (fechas tentativas). 9am - 1:30pm

Lo brinda: Lima TI SAC

Instructor: Mayer Horna

Dejanos tus datos para contactarte

Syllabus y Costo










Aprende uno de los mejores frameworks JavaScript para el desarrollo de Aplicaciones RIA.