ember.jsEmpezando con ember.js


Observaciones

Esta sección proporciona una descripción general de qué es ember.js y por qué un desarrollador puede querer usarlo.

También debe mencionar cualquier tema grande dentro de ember.js, y vincular a los temas relacionados. Dado que la Documentación para ember.js es nueva, es posible que deba crear versiones iniciales de esos temas relacionados.

Versiones

Versión actualizada

Versión Fecha de lanzamiento
2.14.0 beta 2017-04-29
2.13.0 2017-04-29

Instalación o configuración

Comenzar con Ember es fácil. Los proyectos de Ember se crean y administran a través de nuestra herramienta de compilación de línea de comandos Ember CLI. Esta herramienta proporciona:

  • Administración moderna de activos de aplicaciones (incluyendo concatenación, minificación y control de versiones).
  • Generadores para ayudar a crear componentes, rutas y más.
  • Un diseño de proyecto convencional, que facilita el acceso a las aplicaciones existentes de Ember.
  • Soporte para JavaScript ES2015 / ES6 a través del proyecto Babel . Esto incluye soporte para módulos de JavaScript , que se utilizan en esta guía.
  • Un completo arnés de prueba QUnit .
  • La capacidad de consumir un creciente ecosistema de Ember Addons .

Dependencias

Node.js y npm

Ember CLI está construido con JavaScript y espera el tiempo de ejecución Node.js. También requiere dependencias buscadas a través de npm . npm está empaquetado con Node.js, por lo que si su computadora tiene Node.js instalado, está listo para comenzar.

Ember requiere Node.js 0.12 o superior y npm 2.7 o superior. Si no está seguro de si tiene Node.js o la versión correcta, ejecute esto en su línea de comando:

node --version
npm --version

Si recibe un error de "comando no encontrado" o una versión desactualizada para el nodo:

Si obtiene una versión desactualizada de npm, ejecute npm install -g npm .

Git

Ember requiere que Git gestione muchas de sus dependencias. Git viene con Mac OS X y la mayoría de las distribuciones de Linux. Los usuarios de Windows pueden descargar y ejecutar este instalador Git .

Vigilante (opcional)

En Mac y Linux, puede mejorar el rendimiento de visualización de archivos instalando Watchman .

PhantomJS (opcional)

Puede ejecutar sus pruebas desde la línea de comandos con PhantomJS, sin necesidad de abrir un navegador. Consulte las instrucciones de descarga de PhantomJS .

Instalación

Instala Ember usando npm:

npm install -g ember-cli

Para verificar que su instalación fue exitosa, ejecute:

ember -v

Si se muestra un número de versión, estás listo para ir.

Asigne puertos de localhost (especialmente permisos / problemas de disponibilidad, ejecutando múltiples sitios de brasas simultáneamente)

Ocasionalmente, es útil asignar uno o más puertos manualmente en lugar de usar los valores predeterminados. Si lo hace, puede resolver problemas de disponibilidad / permisos de puerto o permitir la ejecución de más de una instancia de ember a la vez.


Para que ember-cli intente identificar y asignar un puerto disponible, use:

ember serve --port 0
 

Ayuda por persona: "Pase 0 para elegir automáticamente un puerto disponible". (En una terminal, escriba ember help).


Para ejecutar más de un sitio de brasas al mismo tiempo, cada uno necesita su propio servidor y puertos de recarga en vivo. Un enfoque simple: en ventanas de Terminal separadas navegue a cada instancia y use lo siguiente para iniciarlas con sus propios puertos:

ember serve --port 0 --live-reload-port 0
 

Si recibe un error sobre la disponibilidad o el permiso en cualquiera de estos casos, ingrese el siguiente script de Python en el indicador de su Terminal para identificar un puerto disponible:

python -c 'import socket; s=socket.socket(); s.bind(("", 0)); print(s.getsockname()[1]); s.close()'
 

Use los resultados para especificar los puertos que ahora sabe que estarán disponibles:

ember serve --port <known_port_1> --live-reload-port <known_port_2>
 

Creación de la aplicación

Ember CLI le permite usar una de las dos opciones para generar una nueva aplicación:

  1. Cree una carpeta y ejecute ember init (genera la estructura de la aplicación y configura git y realiza su primer compromiso)
  2. Ejecutar ember new <app name> (crea una carpeta con el nombre especificado, entra en ella y ejecuta ember init )

Una vez que se complete el proceso de generación, inicie un servidor de recarga en vivo dentro de la carpeta de la aplicación ejecutando:

ember server
 

o ember s para abreviar. * Ta-da, ahora tienes una aplicación Ember en ejecución! Documentos oficiales

Creando tu primera plantilla

Vamos a crear una nueva plantilla usando el comando ember generate .

ember generate template application
 

La plantilla de la application siempre está en pantalla cuando un usuario visita su aplicación. En el editor de su elección, abra app/templates/application.hbs y agregue el siguiente código:

<h2>My first Ember application</h2>

{{outlet}}
 

Ahora debería ver el texto recién agregado en la página de bienvenida de su aplicación. También tenga en cuenta que Ember detecta automáticamente el nuevo archivo y vuelve a cargar la página por usted. Limpio, ¿verdad?

Implementar aplicación

Para implementar una aplicación Ember, simplemente transfiera la salida de la compilación de brasas a un servidor web. Esto se puede hacer con herramientas estándar de transferencia de archivos Unix como rsync o scp . También hay servicios que te permitirán desplegar fácilmente.

ember build
scp -r dist/* myserver.com:/var/www/public/
 

normalmente ember build --environment=production que hace más para preparar su código para la producción (gzip y minify code).

Cómo trabajar con complementos de JavaScript

Hay cuatro formas de trabajar con los complementos de JavaScript,

  1. Complemento Ember
  2. Importar complementos de JavaScript a nivel mundial
  3. Consumir complementos de AMD con nombre
  4. A través de ember-browserify