Ext.js - Configuración del entorno

Configuración del entorno local

Esta sección le guía sobre cómo descargar y configurar Ext JS en su máquina. Siga los pasos para configurar el entorno.

Descarga de archivos de biblioteca

Descargue la versión de prueba de los archivos de la biblioteca Ext JS de Sencha https://www.sencha.com. Obtendrá la versión de prueba del sitio en su identificación de correo registrada, que será una carpeta comprimida llamada ext-6.0.1-trial.

Descomprime la carpeta y encontrarás varios archivos JavaScript y CSS, que incluirás en nuestra aplicación. En su mayoría, incluiremos los siguientes archivos:

JavaScript Files - El archivo JS que puede encontrar en la carpeta \ ext-6.0.1-trial \ ext6.0.1 \ build son -

No Señor	Descripción del archivo
1	ext.js Este es el archivo principal que contiene todas las funcionalidades para ejecutar la aplicación.
2	ext-all.js Este archivo contiene todo el código minimizado sin comentarios en el archivo.
3	ext-all-debug.js Esta es la versión no minificada de ext-all.js con fines de depuración.
4	ext-all-dev.js Este archivo tampoco está minimizado y se utiliza con fines de desarrollo, ya que contiene todos los comentarios y registros de la consola para comprobar cualquier error / problema.
5	ext-all.js Este archivo se utiliza principalmente para fines de producción, ya que es mucho más pequeño que cualquier otro.

Puede agregar estos archivos a la carpeta JS de sus proyectos o puede proporcionar una ruta directa donde reside el archivo en su sistema.

CSS Files - Hay varios archivos basados en temas, que puede encontrar en la carpeta \ ext6.0.1-trial \ ext-6.0.1 \ build \ classic \ theme-classic \ resources \ theme-classic-all.css

Si va a utilizar la aplicación de escritorio, puede utilizar temas clásicos en la carpeta \ ext-6.0.1-trial \ ext-6.0.1 \ build \ classic
Si vamos a usar una aplicación móvil, entonces puede usar temas modernos que se pueden encontrar en la carpeta \ ext-6.0.1-trial \ ext-6.0.1 \ build \ modern

Los siguientes archivos de biblioteca se agregarán en una aplicación Ext JS.

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "..\ext-6.0.1-trial\ext-6.0.1\build\classic\theme-classic\resources\theme-classic-all.css" />
      <script type = "text/javascript" 
         src = "..\ext-6.0.1-trial\ext-6.0.1\build\ext-all.js" > </script>
      <script type = "text/javascript" src = "app.js" > </script>
   </head>
</html>

Mantendrá el código de la aplicación ExtJS en el archivo app.js.

Configuración de CDN

CDN es una red de entrega de contenido con la que no necesita descargar los archivos de la biblioteca Ext JS, sino que puede agregar directamente el enlace CDN para ExtJS a su programa de la siguiente manera:

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-crisp/resources/theme-crisp-all.css" / >
      <script type = "text/javascript" 
         src = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"> </script>
      <script type = "text/javascript" src = "app.js" > </script> 
   </head>
</html>

Editores populares

Al ser un framework JavaScript, que se utiliza para desarrollar aplicaciones web, en nuestro proyecto tendremos archivos HTML, JS. Para escribir nuestros programas Ext JS, necesitaremos un editor de texto. Incluso hay varios IDE disponibles en el mercado. Pero por ahora, podemos considerar uno de los siguientes:

Notepad - En una máquina con Windows, puede usar cualquier editor de texto simple como el Bloc de notas (recomendado para este tutorial), Bloc de notas ++, sublime.
Eclipse - Es un IDE desarrollado por la comunidad de código abierto de eclipse y se puede descargar desde https://www.eclipse.org/.

Navegador

Ext JS admite la compatibilidad entre navegadores, es compatible con todos los navegadores principales, como:

IE 6 y superior
Firefox 3.6 y superior
Chrome10 y superior
Safari 4 y superior
Opera 11 y superior

Puede utilizar cualquier navegador para ejecutar la aplicación Ext JS.