ejemplo angularjs

angularjs - ejemplo - ¿Es angular-semilla el proyecto de facto vacío para comenzar?



ng-if (5)

Después de haberme convencido de aprender y usar Angular.js, iba a comenzar una aplicación de interfaz de usuario web concreta para lanzar la rueda de aprendizaje de la experiencia. (La aplicación va a ser algún tipo de planificación personal, lista de tareas, recordatorio, técnica de pomodoro orientada, etc.)

Uno de los videos tutoriales que he visto, por el autor de Angular, trata sobre las mejores prácticas. Y una de las mejores prácticas es comenzar con el proyecto de angular-seed .

Eso es lo que iba a hacer, pero después de buscar en Google un poco, ya hay al menos otros dos proyectos que dicen ser el buen punto de partida:

  • angular-enterprise-seed
  • angular-sprout

Soy principiante, pero me gusta invertir a largo plazo. ¿Debería preocuparme por usar algo más que angular-seed ? Siento que es muy temprano para hacerme esta pregunta, pero si ya hay otros dos proyectos, tal vez haya algunas buenas razones.


Descubrí que aunque muchas personas usan varios proyectos iniciales, el punto de partida más fácil y consistente para una aplicación angular (o cualquier aplicación web javascript) es yeoman .

Esta aplicación es una herramienta de andamios que te permite especificar generadores que construirán el kernel de tu aplicación, completa con las bibliotecas que desees (a través de bower ) y un archivo de compilación de grunt (la mayoría de los generadores vienen con una tarea de compilación, servidor tarea para edición en vivo y prueba de tareas)

Aunque una aplicación como esta es necesariamente dogmática, el andamiaje que produce sigue siendo muy genérico.

ejemplo:

mkdir my-app cd my-app npm install generator-angular npm install generator-karma yo angular


Me gusta usar Yeoman también. Pruebe estos para obtener un buen andamio:

npm install -g generator-angular # install generator yo angular # scaffold out a AngularJS project bower install angular-ui # install a dependency for your project from Bower grunt test # test your app grunt server # preview your app grunt # build the application for deployment


Para ser claros, Yeoman no es un generador. Yeoman es un formato / sistema para hacer generadores. Hay varios generadores hechos con Yeoman que puede usar para generar una aplicación AngularJS. La gente a menudo se refiere erróneamente a uno u otro de ellos como "el" generador de Yeoman. Pero hay muchos. ¿Confundido todavía? Yeoman no es el único sistema de generación de generadores. Brunch es otro.

Para responder a su pregunta, esta es una comparación muy completa de varios generadores AngularJS que puede usar para comenzar a hacer una aplicación web con AngularJS. Actualmente, contiene más de 200 aspectos diferentes de estas cosas. Uno de ellos es el estilo de organización de archivos. Para que pueda ver fácilmente cuáles organizan los archivos por función, si eso es importante para usted. Es para mi.

Todavía quedan muchos de estos para ser agregados. Los dos mencionados en este hilo son nuevos para mí. Pero esta comparación debería darle una buena idea de las opciones y cómo se comparan. También es editable, por lo que si alguno de ustedes es experto en cualquiera de estas cosas, siéntase libre de compartir lo que sabe.

Dios solo sabe por qué la gente sigue haciendo más y más de estas cosas en lugar de simplemente ayudar a mejorar las existentes. Si tiene alguna suposición, me encantaría resolver ese misterio.

EDITAR: para obtener acceso al documento, le pido que complete un cuestionario para compartir su conocimiento de algo o presionar a los expertos para que lo hagan.

Vaya aquí para hacer un cuestionario: http://www.dancancro.com/technology-questionnaires/


Reconozco que esta es una pregunta más antigua, pero parece tener un buen número de vistas, por lo que tiene sentido recomendar lo que recientemente se ha convertido en una alternativa muy popular tanto para Yeoman como angular-seed: ng-boilerplate . ng-boilerplate difiere de angular-seed en que está diseñado desde cero para aplicaciones web de gran producción y, en mi opinión, es una mejor solución que angular-seed.

Para explicar las diferencias entre los métodos Yeoman y ng-boilerplate de la aplicación kickstarting, citaré al creador de ngbp, Josh D. Miller :

Yeoman es increíble. Pero el problema que tengo con los generadores de AngularJS es que empaquetan por capa en lugar de por característica. Si almacenamos todos los controladores en una carpeta de "controladores" y todos los servicios en una carpeta de "servicios", etc., y todas nuestras pruebas en otro lugar completamente, puede ser todo un reto reutilizar nuestros componentes.

Esta también es una buena discusión por Josh en el foro de problemas de generador angular Yeoman, que profundiza en la configuración de ng-boilerplate vs. yeoman.


Todos tienen diferentes méritos, así que depende de lo que estás buscando hacer. Escribí angular-enterprise-seed y puedo hablar de sus méritos relativos.

  1. Es servidor-agnóstico. Esto es importante ya que un principio básico de AngularJS, y una de las muchas cosas que lo hacen atractivo, es que sigue el paradigma de Cliente MVC. Esto significa que está totalmente desacoplado de todas y cada una de las tecnologías de servidor. Muchas semillas existentes vinculan a AngularJS con tecnologías de servidores, como angular-sprout sprout (NodeJS) o grilled-feta (Google App Engine / Java). En el caso de los proyectos antes mencionados, si los entornos NodeJS y / o Java no están ya en su sistema, entonces tendrá que pasar por varios aros solo para ver la semilla. Esto puede ser molesto para los desarrolladores de PHP y Python, lo que resulta en la limitación de la comunidad del proyecto.

  2. En funcionamiento y en segundos. Debido a que es independiente del servidor, se puede ejecutar en cualquier contenedor (diablos, el sistema de archivos para el caso). El método sugerido es ejecutar "python -m SimpleHTTPServer" desde el directorio raíz; esto es nativo en Mac y Linux, por lo que no hay pasos adicionales.

  3. Vista previa en vivo. Es barato verificar el estado del proyecto porque una versión en vivo siempre se aloja angular-enterprise-seed . Como es independiente del servidor, esto se hace automáticamente copiando el maestro en la rama gh-páginas desde un trabajo cron.

  4. Estilo rico. Incluye Twitter Bootstrap y personalizable / construible LESS de fábrica, junto con Angular-UI, Angular-NG, fuentes y una miríada de otras herramientas para proporcionar un rico estilo y capacidad de respuesta.

  5. Widgets. Al igual que Angular-Seed y Angular-Sprout, Angular-Enterprise-Seed ejemplifica el diseño de "mejores prácticas", el enrutamiento, etc. Pero también proporciona una gran cantidad de componentes preconstruidos que pueden retirarse del estante y reutilizarse inmediatamente. Esto es un poco difícil de hacer ya que puede requerir la convergencia de varias tecnologías. Por ejemplo, para crear el ejemplo de cuadrícula, combiné angular-ui, angular-ng, angular-js y jquery. Hay ejemplos de componentes para modales, paginación, alertas, cuadrículas y más.

Angular-seed es excelente como ejercicio académico si quieres aprender cómo funcionan las piezas, pero te hará desear un punto de partida más sustancial.

No he usado brotes angulosos, así que no puedo hablar de sus méritos. Tal vez haya algún espacio para fusionar el germen angular y la semilla angular de la empresa.