Estructura de un proyecto con Ionic

Cuando creamos un proyecto en Ionic, tendremos una estructura de archivos como la de la siguiente imagen:

folder-structure

Es muy importante a la hora de desarrollar conocer el propósito de todos los archivos y carpetas del proyecto, por esa razón vamos a dar una vista rápida a todos sus elementos.

  • hooks: Son scripts que se disparan durante el proceso de construcción. Generalmente se usan por comandos de Cordova para customización y la construcción de procesos automáticos.
  • platforms: Aquí es donde se crean los proyectos de Android y de IOS. Podemos encontrarnos algunos problemas específicos de la plataforma durante el desarrollo que requieren estos archivos. Pero las dejaremos intactas durante la mayor parte del tiempo.
  • plugins: Aquí se encuentran los plugins de Cordova. Cuando se crea una aplicación de Ionic, ya hay algunos de estos plugins instalados
  • resources: Esta carpetas se utiliza para añadir recursos como el icono y la pantalla de bienvenida
  • scss: Desde que el núcleo de Ionic esta construido con Sass, está es la carpeta donde se encuentra el archivo.
  • www:  Es la carpeta donde trabajaremos de forma habitual y mantiene una estructura de carpetas en su interior por defecto, pero se pueden modificar según las necesidades del proyecto
    • css: aquí estarán nuestros estilos CSS
    • img: para las imágenes
    • js: contiene el fichero principal de configuración app.js, los componentes de AngularJS (controladores, servicios, directivas) y todos los archivos js
    • libs: aquí pondremos las librerías
    • templates: para los archivos html
    • index.html: el punto de inicio de la aplicación
  • Otros archivos
    • .bowerrc: el archivo de configuración de bower
    • .editorconfig: el archivo de configuracion del editor
    • .gitignore: sirve para elegir que parte de la aplicación es ignorada cuando se sube en un repositorio de Git
    • bower.json: contiene los componentes y dependencias si decidimos usar bower package manager
    • gulpfile.js: Se utiliza para la creación de tareas automatizadas usando el administrador de tareas gulp
    • config.xml: se trata del archivo de configuración de Cordova
    • package.json: contiene información sobre la app, dependencias y plugins ques son instalados usando np