Hasta hace unas semanas que por ahi escuche algo de angular,dicen que sirve para hacer web apps y que agilizan todo el proceso , pero me pregunto si tambien sirve para hacer webs comerciales como por ejemplo un facebook o twitter siendo un claro ejemplo real , se escucha demasiado que agiliza un CRUD,cosas así pero eso son proyectos básicos y ejemplos muy clasicos.
Personalmente he estado desarrollando aplicaciones web en Php + Zend Framework y Asp.net con C# , ahora estoy entrando a django y RoR, y me encuentro con angular,he estado probando hacer una web ya hecha edelh.com en angular a ver si realmente sirve, pero me doy cuenta que es muy complicado entender para que sirve cada cosa de angular y como aplicarlas correctamente en un proyecto real,obviamente si quisiera hacer un simple crud para probar angular, es fácil a simple vista (lo digo por la experiencia que tengo desarrollando,aunque no mucha) , pero no pienso perder mi tiempo haciendo eso.
Hasta el momento tengo muchas interrogantes de como usar angular o quizás este intentando usarlo en un ámbito incorrecto.
Espero que puedan contarme sus experiencias sobre proyectos reales que hallan realizado en angular que vallan mas alla de un simple CRUD, xque eso es totalmente sencillo de hacer y existen muchos tutoriales.
Por ejemplo una pagina como workana, seria recomendable hacerla en angular?
Nosotros hemos realizado una red social completamente en AngularJS y nos va bien. Tenemos muros, actualizaciones de estado, chats, real time, vista, modelos... etc y angular js solo nos lo ha echo mas fácil. El principal motivo por el qual AngualrJS nos ha ayudado es para realizar las acciones real time (notificaciones, chat, muro...) y para mejorar la experiencia de usuario al carga todas las vistas sin recargar toda la página.
Igualmente no hemos abandonado el PHP, funcionamos via Api para obtener los datos, y esta está echa con PHP.
(por si quereis ver el proyecto es cronnection.com aún en fase BETA y corrigueindo bugs :P )
Gracias Francesc por tu aporte, se ve muy bien el proyecto http://cronnection.com/,lo que sucede es que no encuentro una guia más detallada o simplemente no estoy entendiendo el concepto de modulos,directivas,controladores en angular.
Por ejemplo en php + zend framework si yo tengo un controlador : home asocie un archivo home.js y hago uso de sus funciones solo para ese controlador y vista,
como haria lo mismo en angular? sin que se mezclen codigo estoy usando gulp para automatizar tareas de compresion de archivos css y js entre otros,tengo la siguiente estructura para el proyecto http://edelh.com/quiero-contratar
->app (aqui esta todo el proyecto de desarrollo)
->controllers (archivos controladores : home,quiero-contratar,quiero-trabajar)
->directives ()
->models (aquí pondría todas las llamadas a la apirest en php)
->static (todos los archivos css y librerias js)
->app.js (configuración de la aplicación)
->index.html
->dist (proyecto version comprimida)
El primer problema que he tenido es adaptarme y entender como poner cada cosa en su sitio antes hacia :
$(document).ready(function(){
miFuncion();
});
quiero-contratar.js (se carga en la vista asociada al controlador quiero-contratar)
y en angular entiendo que esto no se hace, entonces como hago para que dicha funcion solo se muestre en esa vista - controlador,considerando que el proyecto para produccion esta comprimido y los .js que no son librerias (de la carpeta static) están en un solo archivo app.min.js ,incluso cuando ejecuto el proyecto de desarrollo (carpeta app) tengo ese problema.
Si pudieras orientarme solo ese punto te lo agradecería o a cualquier colega de este foro.
No se si lo he comprendido, pero creo que te refieres a como organizar las vistas para que vaya cargando los distintos controladores. Un tema importante es la utilización del ngRoute (https://docs.angularjs.org/api/ngRoute) con este modulo puedes crear las rutas de la web para que carguen una vista o otra, y dentro de la vista "llamas" al controlador que necesites.
Si esa parte de asociar un controlador a una vista, si lo he realizado,pero en ese mismo controlador ademas asociar algunas otras funciones que sean para solo esa vista, esa parte no logro realizar.
un ejemplo si tengo la vista home y contacto, en contacto cuando ingrese quiero que se muestre un estilo diferente(css) al menu seleccionado como hago esto sin usar directamente jquery : $("#div").addClass('.miNuevaClase'); y que solo funcione en esa vista?
Es que la respuesta no es fácil... porque tengo que intentar englobar todo el funcionamiento en este textarea :). Te lo contesto por partes porque no se si te he podido comprender del todo:
1) Dentro de un controlador puedes crear las funciones que quieras, y solo se podrán utilizar para ese controlador. Por ejemplo, si quiero la función openModal(). Tengo que crear: $scope.openModal = function(){ "contenido función" } y ya. Si por ejemplo queremos crear una función y utilizarla en otros controladores podemos crear una función en un controlador principal (podemos tener varios controladores funcionando), o poner la función en lo que se denomina en rootScope (este último aunque te funcionará no es recomendado)
2) El caso concreto del addClass en angularjs es mucho mas fácil. Lo que se utiliza es ng-class, y aquí puedes modificar classes por cualquier expresión.
3) El caso del requierejs no lo he utilizado. En los casos que he puesto un loader lo que he echo es utilizar ngInclude, de esta forma he obtenido todos los datos, y una vez los he tenido he cambiado la variable del ngInclude (como si recargara otra vista).
No se si te he podido ayudar, es que es una duda muy global, te recomiendo mirar en gitHub proyectos completos. Cuesta un poco al principio, pero cuando ves el funcionamiento es como trabajar con clases, herencia, modelos, vistas... y otras cosas que no creía que en JavaScript seria capaz de organizarme. Y una vez lo domines ya me contaras, pero tiene un montón de cosas increíbles.
Francesc ,muchas gracias por tomarte tu tiempo de responder.
El punto 1 , me has aclarado muchas dudas sobre los controladores en angular.
El punto 2 , si ya lo habia visto por ahi; pero solo funciona dentro del ambito del controlador,osea:
todo lo que este aqui
Pero el tema es que necesito cambiar un estilo a la cabecera de la web (header,menu) y este se encuentra fuera de dicho controlador por eso no le puedo dar el estilo(bueno eso me di cuenta),como hago eso? o que estoy haciendo mal?
Voy a buscar en los repositorios proyecto,pero si puedes darme una mano con ese detalle seria genial.
Te comento como lo he echo yo para un tema que creo que es parecido. He creado un controlador (ng-controller="GeneralCtrl") en la etiqueta para crear unas funciones para actualizar el o el meta description. Este controlador lo utilizo para cosas "generales" que están por encima de las vistas y luego cada vista tiene su controlador.
Nosotros estamos realizando una plataforma del estilo que comentas sobre MEAN.JS, que si no estás familiarizado, se trata de usar JS de forma End-to-End, es decir, tanto en el cliente como en el servidor se usa JS, eso se consigue sirviendo Angular.JS mediante node.JS (utilizando el Framework Express.js que facilita enormemente las cosas).
Dependiendo de lo que quieras hacer te conviene más usar JS en el servidor o seguir con PHP, aunque debo decirte que estoy encantado usando Node.js, es realmente veloz. Si estas familiarizado con REST API no te será nada complicado entender el modo de funcionamiento de MEAN.JS y podrías implantarlo. Puedes probar de realizar algún "mini-proyecto" de ejemplo para ir cogiendo soltura.
Si quieres podemos charlar por privado, ya que parece que estamos interesados en realizar una plataforma bastante similar. Si quieres te puedo ir dando consejos sobre lo que nosotros nos estamos encontrando día a día.
Angular va 100% en el cliente, seguiras necesitando php u otro lenguaje de servidor aunque solo sea para poder generar webservices de los que tire angular
Personalmente he estado desarrollando aplicaciones web en Php + Zend Framework y Asp.net con C# , ahora estoy entrando a django y RoR, y me encuentro con angular,he estado probando hacer una web ya hecha edelh.com en angular a ver si realmente sirve, pero me doy cuenta que es muy complicado entender para que sirve cada cosa de angular y como aplicarlas correctamente en un proyecto real,obviamente si quisiera hacer un simple crud para probar angular, es fácil a simple vista (lo digo por la experiencia que tengo desarrollando,aunque no mucha) , pero no pienso perder mi tiempo haciendo eso.
Hasta el momento tengo muchas interrogantes de como usar angular o quizás este intentando usarlo en un ámbito incorrecto.
Espero que puedan contarme sus experiencias sobre proyectos reales que hallan realizado en angular que vallan mas alla de un simple CRUD, xque eso es totalmente sencillo de hacer y existen muchos tutoriales.
Por ejemplo una pagina como workana, seria recomendable hacerla en angular?
03/11/2014 14:51
Igualmente no hemos abandonado el PHP, funcionamos via Api para obtener los datos, y esta está echa con PHP.
(por si quereis ver el proyecto es cronnection.com aún en fase BETA y corrigueindo bugs :P )
09/11/2014 00:05
Por ejemplo en php + zend framework si yo tengo un controlador : home asocie un archivo home.js y hago uso de sus funciones solo para ese controlador y vista,
como haria lo mismo en angular? sin que se mezclen codigo estoy usando gulp para automatizar tareas de compresion de archivos css y js entre otros,tengo la siguiente estructura para el proyecto http://edelh.com/quiero-contratar
->app (aqui esta todo el proyecto de desarrollo)
->controllers (archivos controladores : home,quiero-contratar,quiero-trabajar)
->directives ()
->models (aquí pondría todas las llamadas a la apirest en php)
->static (todos los archivos css y librerias js)
->app.js (configuración de la aplicación)
->index.html
->dist (proyecto version comprimida)
El primer problema que he tenido es adaptarme y entender como poner cada cosa en su sitio antes hacia :
$(document).ready(function(){
miFuncion();
});
quiero-contratar.js (se carga en la vista asociada al controlador quiero-contratar)
y en angular entiendo que esto no se hace, entonces como hago para que dicha funcion solo se muestre en esa vista - controlador,considerando que el proyecto para produccion esta comprimido y los .js que no son librerias (de la carpeta static) están en un solo archivo app.min.js ,incluso cuando ejecuto el proyecto de desarrollo (carpeta app) tengo ese problema.
Si pudieras orientarme solo ese punto te lo agradecería o a cualquier colega de este foro.
Muchas gracias.
10/11/2014 08:47
10/11/2014 17:12
un ejemplo si tengo la vista home y contacto, en contacto cuando ingrese quiero que se muestre un estilo diferente(css) al menu seleccionado como hago esto sin usar directamente jquery : $("#div").addClass('.miNuevaClase'); y que solo funcione en esa vista?
11/11/2014 08:40
1) Dentro de un controlador puedes crear las funciones que quieras, y solo se podrán utilizar para ese controlador. Por ejemplo, si quiero la función openModal(). Tengo que crear: $scope.openModal = function(){ "contenido función" } y ya. Si por ejemplo queremos crear una función y utilizarla en otros controladores podemos crear una función en un controlador principal (podemos tener varios controladores funcionando), o poner la función en lo que se denomina en rootScope (este último aunque te funcionará no es recomendado)
2) El caso concreto del addClass en angularjs es mucho mas fácil. Lo que se utiliza es ng-class, y aquí puedes modificar classes por cualquier expresión.
3) El caso del requierejs no lo he utilizado. En los casos que he puesto un loader lo que he echo es utilizar ngInclude, de esta forma he obtenido todos los datos, y una vez los he tenido he cambiado la variable del ngInclude (como si recargara otra vista).
No se si te he podido ayudar, es que es una duda muy global, te recomiendo mirar en gitHub proyectos completos. Cuesta un poco al principio, pero cuando ves el funcionamiento es como trabajar con clases, herencia, modelos, vistas... y otras cosas que no creía que en JavaScript seria capaz de organizarme. Y una vez lo domines ya me contaras, pero tiene un montón de cosas increíbles.
12/11/2014 02:16
El punto 1 , me has aclarado muchas dudas sobre los controladores en angular.
El punto 2 , si ya lo habia visto por ahi; pero solo funciona dentro del ambito del controlador,osea:
todo lo que este aqui
Pero el tema es que necesito cambiar un estilo a la cabecera de la web (header,menu) y este se encuentra fuera de dicho controlador por eso no le puedo dar el estilo(bueno eso me di cuenta),como hago eso? o que estoy haciendo mal?
Voy a buscar en los repositorios proyecto,pero si puedes darme una mano con ese detalle seria genial.
y gracias nuevamente.
12/11/2014 08:10
11/11/2014 04:50
14/11/2014 10:54
Dependiendo de lo que quieras hacer te conviene más usar JS en el servidor o seguir con PHP, aunque debo decirte que estoy encantado usando Node.js, es realmente veloz. Si estas familiarizado con REST API no te será nada complicado entender el modo de funcionamiento de MEAN.JS y podrías implantarlo. Puedes probar de realizar algún "mini-proyecto" de ejemplo para ir cogiendo soltura.
Si quieres podemos charlar por privado, ya que parece que estamos interesados en realizar una plataforma bastante similar. Si quieres te puedo ir dando consejos sobre lo que nosotros nos estamos encontrando día a día.
14/11/2014 16:10
08/11/2014 23:12