2012-09-16 28 views
6

Soy nuevo en la red troncal, y estoy aquí para pedirle un poco de ayuda para entender cómo me gustaría construir mi proyecto de webapp actual. Estoy desarrollando un panel de administración modular para servidores. Cada "página" individual del panel debe ser un "módulo" empaquetado que incluya controladores, modelos y vistas.Configuración modular de Backbone.js

El panel consistirá en una vista de diseño principal que se carga inicialmente, con una navegación básica. Cuando un usuario hace clic en un enlace en la navegación, una página se carga a través de AJAX en el diseño. (Y si esto suena estúpido/hay una razón para no hacerlo, por favor dígame :))

Como otros desarrollarán estas páginas también, y dado que son modulares, no sabré qué modelos, vistas y controladores que se presentarán dentro de la página que cargo a través de AJAX.

¿Cómo haré para hacer esto con la columna vertebral?

Me pregunto especialmente cómo ampliaría los modelos de Backbone, etc. de forma dinámica, y cómo me las arreglaría (por ejemplo) para que el usuario salga de la página o la vuelva a visitar más adelante.

Si Backbone proporciona algo con lo que pueda trabajar, ¿tendré que hackearme a mí mismo algo, ¿hay alguna manera mejor de hacer las cosas que me falta?

Respuesta

2

Su forma de pensar sobre los problemas parece muy correcta. Haga que sus componentes de interfaz de usuario sean lo más autónomos posible. Mire esto 10 min video para obtener más información sobre las mejores prácticas de componentes de UI.

Si le interesan otras inquietudes importantes sobre el desarrollo de aplicaciones JavaScript, mire la arquitectura de referencia BoilerplateJS que publiqué para compartir mis experiencias. Eso contiene una aplicación de muestra similar a la que describió (menú con activación de componentes).

mis recomendaciones para su activación de componentes de interfaz de usuario, la desactivación son:

  • No retire/crear componentes DOM. Reutilice con hide/show, ya que los elementos lo recitarán en la memoria incluso después de eliminarlo de DOM
  • Minimice el mantenimiento de la información de estado en el lado del cliente. Cuando un usuario vuelva a visitar el componente, actualícelo con una llamada al servidor y luego haga que sea visible (use el servidor como la única verdad de la información del estado).

Consulte las implementaciones de componentes de muestra BoilerplateJS para obtener más detalles. Conozco a pocos que lo usan con BackboneJS (actualmente viene con JS noqueado). Enviaremos un ejemplo de ello utilizando BackboneJS en v0.2 que vence en una semana.

+1

BoilerplateJS parece ser una buena forma de hacer las cosas, ¡gracias por compartir! –

+2

En BoilerplateJS, hemos agregado un componente de muestra que usa BackboneJS para MVC. Eche un vistazo al componente TODO de muestra en http://boilerplatejs.org/samples/productsuite/index.html#todo. Puede encontrar el código comprometido en GitHub. – Hasith

1

Eche un vistazo a Marionette o Chaplin. Ambos se basan en Backbone y proporcionan una forma estructurada de crear una aplicación más grande con Backbone.

2

Un marco de carga de script modular común que se utiliza junto con Backbone sería require.js. Puede ser lo que estás buscando. Require.js se trata de módulos AMD, módulos asíncronos. Por lo general, cada modelo, colección, vista es su propio módulo que define las dependencias que un módulo particular necesita y luego carga esos módulos según sea necesario. Es especialmente adecuado para grandes proyectos en los que tiene muchas piezas individuales que necesitan ser mezcladas en diferentes puntos de su aplicación.

Por supuesto, puede combinar múltiples elementos principales en un solo módulo (generalmente reservo esto para Vistas y subvistas específicas que solo se usarían con la vista principal) pero depende de usted.

Con Backbone, generalmente la intención es crear aplicaciones de una sola página, lo que significa que todos los andamios de página generalmente se envuelven como un único archivo y se cargan por completo en el lado del cliente al llegar. Los datos para cada página se llaman a través de ajax y se rellenan a medida que el usuario navega y carga diferentes aspectos de la aplicación. ¿Es esto lo que pretendías en tu descripción?

Si está buscando cargar diferentes páginas que cada una ha sido tomada individualmente del servidor, entonces no estoy seguro de que Backbone sea la respuesta. Hay otros frameworks MVC en el lado del servidor que ayudan a lograr eso.

Eso generalmente se refiere a cómo se usa Backbone para este tipo de cosas.

En cuanto a cómo extender los modelos de Backbone y tal, Backbone utiliza Underscore como una dependencia y subrayado proporciona una agradable función _.extend() que puede extender fácilmente todos sus objetos de la forma que desee. Anulando la funcionalidad por defecto, lanzando mixins, todo es bastante sencillo en lo que respecta a Backbone. Como marco, Backbone es muy agradable cuando se trata de modificar, modificar y personalizar cada pieza.

En cuanto al manejo de usuarios que visitan y vuelven a visitar páginas, Backbone.router le permite crear URL que no solo apuntan a "páginas" específicas en su aplicación sino que también ejecutan código arbitrario que debe ejecutarse para llegar allí. Algo así como un usuario conectado que visita "cuenta de mysite/#" activaría el enrutador para cargar ciertos scripts que muestran esa vista en particular, así como también los datos necesarios para que el usuario inicie y ejecute esa vista.

No estoy seguro si hay recursos que le den algún tipo de estructura básica para empezar. La mayoría de las experiencias que conozco tienden a ir a través de los tutoriales básicos como "Lista de tareas" y seguir su camino desde allí. No estoy seguro de cuál es su nivel de experiencia con javascript o la programación en general, pero comencé con Backbone AND require cuando realmente no sabía casi nada. Solo una noción vaga de lo que era JSON y una comprensión de bajo nivel de HTTP como en "es lo que obtiene páginas web". Dicho esto, creo que Backbone fue realmente fácil de conseguir para mí y ha profundizado mucho en mi conocimiento sobre toda la estructura de la aplicación tipo RESTful del lado del cliente.

Hay una muy buena lista de la aplicación "Lista de tareas" en muchos sabores diferentes, como Backbone y Knockout y algunos otros. Cuando decidí sobre un framework, básicamente revisé ese código comparando todos los diferentes frameworks disponibles y Backbone seleccionado porque parecía tener más sentido para mí. No me arrepiento Es muy divertido y creo que la mejor manera de hacerlo es probar algunos tutoriales de demostración.

+0

Gracias por este gran respuesta. "Si está buscando cargar diferentes páginas que cada una ha sido tomada individualmente del servidor, entonces no estoy seguro de que Backbone sea la respuesta. Hay otros frameworks MVC en el servidor que ayudan a lograr eso". ¿Podría indicarme dichos marcos? –

+0

No he usado la mayoría de estos, así que no puedo responder por ellos, pero puede revisar esta lista y verificar algunos de ellos [PHP MVC Frameworks] (http://www.phpwact.org/php/mvc_frameworks) . CakePHP y Codeigniter parecen tener una reputación de ser simple y agradable de usar.He usado partes del framework Zend antes sin todo el framework y tiene una biblioteca realmente extensa y bien pensada. – jmk2142