Primeros pasos con ember.js

Instalación o Configuración

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

  • Gestió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 hace que las aplicaciones Ember existentes sean fáciles de abordar.
  • Compatibilidad con ES2015/ES6 JavaScript a través del proyecto Babel. Esto incluye compatibilidad con módulos de JavaScript, que se utilizan en esta guía.
  • Un arnés de prueba completo de QUnit.
  • La capacidad de consumir un ecosistema en crecimiento de [Ember Addons] (https://emberobserver.com/).

Dependencias

Node.js y npm

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

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, ejecútelo en su línea de comando:

node --version
npm --version

Si obtiene un error “comando no encontrado” o una versión obsoleta para Node:

  • Los usuarios de Windows o Mac pueden descargar y ejecutar [este instalador de Node.js] (http://nodejs.org/download/).
  • Los usuarios de Mac suelen preferir instalar Node utilizando Homebrew. Después instalando Homebrew, ejecute brew install node para instalar Node.js.
  • Los usuarios de Linux pueden usar esta guía para la instalación de Node.js en Linux.

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

Git

Ember requiere que Git administre muchas de sus dependencias. Git viene con Mac OS X y la mayoría de las distribuciones de Linux. Los usuarios de Windows pueden descargue y ejecute [este instalador de Git] (http://git-scm.com/download/win).

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 la necesidad de un navegador para estar abierto. Consulte las [instrucciones de descarga de PhantomJS] (http://phantomjs.org/download.html).

Instalación

Instale 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á listo para comenzar.

Asigne puertos de host local (especialmente permisos/problemas de disponibilidad, ejecutando múltiples sitios ember 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 permisos/disponibilidad de puertos 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 según brasa: “Pase 0 para seleccionar automáticamente un puerto disponible”. (En una terminal, escriba ember help).


Para ejecutar más de un sitio Ember 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 obtiene un error sobre la disponibilidad o el permiso en cualquiera de estos casos, ingrese la siguiente secuencia de comandos 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()'

Utilice los resultados para especificar los puertos que ahora sabe que están disponibles:

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

Crear aplicación

Ember CLI le permite usar una de 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 primera confirmación)
  2. Ejecute 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 generar.

ember generate template application

La plantilla de aplicación 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 de Ember, simplemente transfiera la salida de la compilación de Ember a un servidor web. Esto se puede hacer con las herramientas estándar de transferencia de archivos de Unix, como rsync o scp. También hay servicios que le permitirán implementar fácilmente.

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

normalmente usaríamos ember build --environment=production que hace más para que su código esté listo para la producción (código gzip y minify).

Cómo trabajar con complementos de JavaScript

Hay cuatro formas de trabajar con complementos de JavaScript,

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