Gana hasta un 30% más con tu trabajo, obtén el control de tu carrera y lleva una vida más feliz, placentera y saludable.
Mario Raúl Pérez, Servicios de Capacitación Profesional.

Aprender ExtJS

Aprender ExtJS 4 puede ser una ardua tarea al principio, como es de esperar de un marco tan distinto y poderoso.

Recursos:

Arquitectura de aplicaciones

ExtJS 4 es un framework MVC con una arquitectura estrictamente definida.

Que necesita saber sobre esto:

  • Cómo armar la estructura de carpetas y archivos al crear nuevas aplicaciones ExtJS 4
  • Fundamentos de la utilización de la capa controlador
  • Fundamentos de la utilización de la capa datos (modelo -models- y almacenes -stores-)
  • Fundamentos de la creación de la capa vistas
  • Cómo implementar una aplicación ExtJS 4

Lecturas recomendadas:

Cargador

Al realizar su aplicación en ExtJS 4 creara muchos nuevos archivos con las clases personalizadas escritas en ellos.

Para utilizar las clases que debe incluir los archivos JavaScript en su index.html, ¿verdad?

Mal … Con la nueva clase Ext.Loader es suficiente que indique el nombre de su clase correctamente, y la coloque en un archivo y carpeta correcta.

Después de eso, simplemente puede crear una instancia de la clase mediante el uso de Ext.create (asegúrese de no utilizar la palabra clave nueva -el operador new-y ExtJS se cargara el archivo JavaScript en el caso de que la clase no la tenga ya disponible.

Lo que necesita saber:

  • ¿Dónde poner los archivos para cargador los pueda encontrar?
  • Como debe nombrar las clases para que el cargador de clases las pueda reconocer

Lecturas recomendadas:

Sistema de clases

Usted puede escribir clases en JavaScript puro, pero como todos sabemos, eso no es exactamente la programación orientada a objetos que se utiliza en otros lenguajes.

ExtJS 4 intenta remediar esto mediante la introducción de su propia forma de crear y crear instancias de clases.

Lo que necesita saber:

  • ¿Cómo definir una nueva clase?
    NOTA: Asegúrese de que siempre define nuevas clases de la forma que define ExtJS 4!
  • ¿Cómo crear una instancia de una clase?
    NOTA: Asegúrese de crear una instancia siempre de la nueva forma de creacion de objetos que define ExtJS 4!

Lecturas recomendadas:

Controladores

Como en todos los framework MVC, el lugar central en donde se debe escribir la lógica de negocio es en un controlador.

Lo que necesita saber:

  • Cómo cargar las vistas que son administradas por el controlador
  • Cómo referenciar a un componente, que puede estar en cualquier lugar de la aplicación, desde el controlador
  • Cómo escribir manejadores de eventos personalizados para los diversos eventos de los componentes en el controlador
  • Cómo utilizar los métodos getter auto-generados para obtener referencias a los almacences -stores- y los modelos -models-

Lecturas recomendadas:

Vistas

Vistas son cualquier clase derivada de Ext.Component, por ejemplo Ext.button.Button, Ext.panel.Panel, etc.

Lo que necesita saber:

  • ¿Qué componentes existen en ExtJS 4? Y conocer con más detalles los más importanes(la grilla, el formulario, los árboles, etc…)
  • Cómo cargar los componentes con los datos del servidor. Algunos de los componentes tienen “almacén” de propiedad que se puede utilizar para rellenar con datos desde el servidor (ellos son el Grid, los DataView, Tree, Combobox, Form, etc…)
  • Cómo crear componentes personalizados

Lecturas recomendadas:

Datos

ExtJS cuenta con un fuerte soporte para el trabajo con datos. Un potente paquete “Data” con gran cantidad de clases.

Los datos pueden provenir de muchos lugares diferentes … pueden ser codificados, proceder de servidores, de un almacenamiento local (HTML5), de la sesión, etc

Los datos pueden estar en diferentes formatos: JSON, XML.

Lo que necesita saber:

  • Cómo utilizar las principales clases para datos: Model, Store, Proxy
  • Cómo realizar las operaciones CRUD sobre la API del servidor JSON mediante el uso de las clases
  • ¿Cómo integrar los almacenes -stores- en los componentes que los utilizan? Como el Grid, el Tree, etc…

Lecturas recomendadas:

Tematización

ExtJS 4 utiliza Sass & Compass para crear sus propios temas.

Eso significa que usted usará menos CSS, pero producira resultados mucho más impresionantes.

Lo que necesita saber:

  • Sass & Compass
  • Cómo crear temas personalizados de cero