¿Cómo estructurar un proyecto en Ember.js? En realidad en Ember.js no existe un estándar sobre como organizar o estructurar nuestros proyectos. Uno puede generar los modelos, vistas, templates, controladores y rutas en el mismo archivo, en nuestro caso en el archivo app.js con el cual hemos venido trabajando a lo largo del curso. Yo prefiero mantener un poco las cosas mas organizadas por lo que estructuro mis proyecto muy parecido a lo que encontramos en un proyecto de Ruby on Rails. Si quieres conocer sobre Rails te invito a que le eches un vistazo a la Rails desde Cero.
Veamos primero la organización necesaria que debería tener nuestro proyecto, para así entender que hay dentro de las principales carpetas.
-
/css – Contiene los archivos CSS que nuestra aplicación necesita para mostrar el look deseado por nosotros. En esta carpeta no la tocaremos mucho ya que todo depende del los css que quieras aplicar en tu app.
-
/js – Contiene todos los archivos de javascript que nuestra app va a necesitar para poder funcionar y en los cuales vamos a desarrollar el comportamiento de la misma.
-
/app – Contiene los controladores, modelos, vistas y configuraciones de la aplicación. En esta carpeta escribiremos la mayoría del código para que nuestra aplicación funcione.
-
/app/controllers – Contiene todos los archivos con las clases de los controladores que sirven para interactuar con los modelos, las vistas y manejar el comportamiento de la aplicación.
-
/app/models – Los modelos son clases que representan la información (datos) de la aplicación y las reglas para manipularlos.
-
/app/views – Este directorio contiene los archivos que poseen el comportamiento de renderización de todos los templates de la aplicación.
-
/app/app.js – En este archivo van a estar todos las configuraciones necesarias para que nuestro site funcione correctamente.
-
/app/router.js – En este archivo van a estar definidas todas las rutas que nuestra app va a necesitar.
-
/libs – En esta carpeta se alojan todas las librerías que conforman el framework y sus dependencias.
-
index.html – En este archivo van a estar todos los templates necesarios para poder crear el ”workflow” de la aplicación.
¿Por donde empezamos? Muy fácil, lo que debemos hacer es lo siguiente:
Navegamos a Sitio de Ember.js y descargamos el paquete de inicio o starter kit.
Una vez descargado, creamos las carpetas necesarias con ayuda de nuestro sistema operativo o vía consola para obtener una estructura de proyecto idéntica a la antes propuesta.
Al final deberíamos obtener la siguiente estructura de proyecto:
Conclusión
En esta lección, aprendimos a generar nuestra estructura de proyecto. Si tienes alguna pregunta, yo estaré feliz de responderte en los comentarios, además espero que te unas y le eches un vistazo a todo el resto de este curso.
¡Te espero la próxima semana!
Puzzle Bobble
Karate Blazers
Puzzle De Bloques
Magical Cat Adventure