javascript - que - react js
¿Dónde estoy equivocado sobre mi proyecto y estos Frameworks de Javascript? (7)
En primer lugar, los huesos más escuetos del proyecto que deseo crear es un motor wiki implementado como una aplicación web de una sola página. Planeo tener un conjunto de características disponibles desde el principio con muchas incorporaciones de funciones en el futuro.
Caracteristicas basicas
- creación de página (crea el artículo de wiki y el foro de discusión para ese artículo)
- marcado y WYSIWYG ala markitup
- conversión sobre la marcha entre markup / html / WYSIWYG
- una barra lateral para navegar rápidamente
- una barra de herramientas superior para elegir editar / ver
Características avanzadas
- barra lateral configurable para navegar a través de un método diferente
- barra de herramientas configurable (posiblemente agregue lenguaje de marcado de elección)
- etiquetas
- todo lo editable
- arrastrar y soltar cargas de archivos y archivos adjuntos de imágenes
El motor consistiría originalmente en la creación de página más básica, el marcado y la edición WYSIWYG, y el guardado. Eventualmente me gustaría ampliar este motor básico con soporte de imágenes arrastrar y soltar, cargas de archivos, gráficos de datos en vivo y una barra lateral para personalizar vistas.
He realizado una búsqueda bastante extensa de un proyecto decente desde el cual basar mi proyecto, pero aparte de TiddlyWiki no parece haber ningún buen motor de wiki basado en JavaScript. También consideré aplicar Jquery a los motores de wiki existentes, pero creo que finalmente terminaría reescribiéndolo (además, es más emocionante agregar las funciones que quiero a medida que avanzo). De cualquier manera, he llegado a implementar esta bestia con una biblioteca javascript + framework.
Sé que uno realmente no puede comparar algunos de estos marcos uno contra el otro, ya que no son manzanas con manzanas. Intenté enmarcar cualquier comentario / pregunta de comparación con elementos comparables de los marcos respectivos, pero estoy abierto a que me corrijan.
Así que, aquí vamos:
Basado en mi propia investigación y opiniones, he reducido la lista a los artículos a continuación. Intencionalmente dejé cosas como SproutCore, corMVC, YUI y otros ya que, en mi capacidad limitada, pensé que los elementos a continuación serían una mejor opción.
Mis opciones
jquery / UI + backbonejs
En general
Por lo que he leído, esta combinación es utilizada y apreciada por muchos y es muy flexible y extensible. Mi principal preocupación es que esta combinación simplemente no es el mejor punto de partida para desarrollar una interfaz de usuario más orientada a escritorio.
UI
Si bien jQueryUI o jqueryTools pueden ser competitivos, ciertamente no parecen estar a la par con las capacidades de UI de otros marcos. Específicamente, parecen ser pesados en cuanto a los efectos, pero carecen de un buen soporte para la división del diseño.
javascriptMVC
En general
JavascriptMVC parece ser esencialmente extensiones de jquery + MVC (jqueryMX), junto con algunas otras aplicaciones para documentar (documentJS), pruebas funcionales (funcUnit) y administración de código y dependencia (stealJS). Más allá de los beneficios del módulo adicional, creo que el debate funcional realmente se reduce a backbonejs vs. jqueryMX ¿Estoy en lo correcto con esto y alguien ha trabajado con ellos o los ha comparado?
UI
JavascriptMVC agrega los elementos de MXUI además de lo que está disponible para Jquery, así que, al menos, creo que es una pequeña ganancia en esa categoría.
knockoutjs
En general
Mis pensamientos e inquietudes al respecto son muy similares a los comentarios de jquery + backbone. Ambos parecen ofrecer características similares, pero solo desde una perspectiva diferente. Una desventaja citada es que la lógica empresarial y la presentación de las parejas noqueadas están demasiado ligadas a los datos comprometidos y que este método de enlace puede romperse para una interacción de IU compleja, pero me encantaría saber por qué no es un problema.
- Discussion de los conceptos backbone vs knockoutJS
- Features de knockoutjs
UI
En blanco en este momento
Dojo y ExtJS
En general
Voy a combinar la discusión Dojo y ExtJS porque sé lo menos sobre ellos y parecen jugar en casi el mismo espacio. La mayoría de la información sobre stackoverflow sobre estos dos parece estar desactualizada. Por lo que he visto es que ambos son marcos grandes que son buenos para la implementación de la aplicación de calibre de escritorio. Dojo había sido reprendido por la documentación deficiente, pero parece que ya no es el caso. ExtJS, por supuesto, tiene la licencia comercial, pero es muy razonable para lo que obtienes y no lo consideraría demasiado. Los widgets en ExtJS parecen estar hechos de una manera más profesional que Dojo, pero ciertamente podría ser corregido allí. Me interesaría saber de alguien que tenga experiencia en ambos.
UI
Dojo tiene la biblioteca dijit UI. ExtJS tiene características de interfaz de usuario, pero no están en el núcleo Ext. Aquí está la documentation y aquí están sus demos
Capuchino
En general
Y luego está el Cappuccino. Sin CSS, sin html, pero también podría ser difícil usar las bibliotecas de JavaScript existentes. Objective-J no parece aterrador, especialmente si se tiene en cuenta que también pueden escribir un javascript normal. Las demostraciones son impresionantes y parecen abordar de cerca las necesidades de la interfaz de usuario para el motor wiki. La API basada en cacao es muy útil para alguien que no está familiarizado con ella, pero quizás valga la pena. He oído que el motor de diseño no siempre es fácil de usar, pero una tecnología joven y posiblemente disruptiva como esta tendrá algunas fallas.
UI
En blanco en este momento
Me disculpo por escribir tanto, pero bueno, al menos no es una pregunta ax vs. y vs z esperando toneladas de respuestas baratas. ¿Entonces, qué piensas? ¿Cuál debería ser la base de mi computadora de escritorio como motor de wiki, que con suerte se convertirá en una característica más rica (leer compleja) con el tiempo?
¡No estas solo!
VanillaJS y Ampersand .. son excelentes ejemplos de la unidad seria para JavaScript más simple y más modular.
Incluso hay un libro sobre eso.
La simplicidad está siendo impulsada por una característica es6 infravalorada: los Modules y el estándar de implementación SystemJS . Incluso se puede usar en sistemas que no sean es6.
¡Cuan genial es eso!
Diría que se equivoca en su elección general de candidatos, ya que está omitiendo Angular y Ember, que son más adecuados que cualquiera de los otros marcos enumerados.
En general, diría que Angular.js es el marco para este.
Énfasis en el enrutamiento
Gran parte de lo que está hablando (varias barras laterales para la navegación, una aplicación de una sola página) son funciones de enrutamiento, o cómo el front-end interpreta el texto en su barra de navegación URL.
Tanto Angular.js como Ember tienen enrutadores excelentes que le permiten lograr todo lo que necesita sin código adicional.
Para su beneficio, aquí hay un desglose rápido de las características en Angular que se pueden usar para crear su wiki de una sola página
La estructura del sitio en sí
Angular tiene una biblioteca increíble llamada enrutador UI que le permite a ambos crear una navegación personalizada y establecer una estructura amigable de SEO para revelar su contenido. Varias vistas también permitirían una barra de herramientas superior.
Tutorial de Ui Router: http://cacodaemon.de/index.php?id=57
Editor WYSIWYG
Angular se basa en vinculación bidireccional en vivo (cuando cambias algo en alguna parte, cambia automáticamente en todos los demás). Por lo tanto, viene empaquetado con muchas características que funcionan bien con este tipo de editor. Ya se han hecho algunos buenos y solo necesita implementarlos.
Gráficos y otras cosas ordenadas
Las directivas angulares están diseñadas para hacer cosas como crear componentes Chart que sean reutilizables. No son totalmente diferentes de Wordpress Widgets. Muchos de estos ya se han desarrollado y pueden incluirse en su proyecto angular.
http://www.sitepoint.com/creating-charting-directives-using-angularjs-d3-js/
Respecto a Ember, no sé mucho al respecto, así que no puedo hablar de sus características particulares.
Es posible que su elección de marco no limite sus opciones de IU tanto como pueda imaginarse. Este reciente artículo de Henri Bergius sobre desacoplamiento de la gestión de contenido ilustra el punto mucho mejor de lo que podría - y, dicho sea de paso, los enlaces a un editor de contenido in situ muy puro y atractivo (independiente del marco).
No estoy seguro acerca de su línea de tiempo y recursos, pero cuando estoy tratando de decidir entre múltiples marcos / entornos, simplemente sigo adelante y trato de construir rápidamente un prototipo. Incluso si solo se trata de una o dos funciones principales, creo que toda la investigación y la documentación en el mundo no coincidirá con intentar crear algo con las herramientas. Digo tomar un día con cada uno y ver qué tan lejos llegas. Eso le dará una buena indicación de qué herramientas están a la altura de la tarea y se sentirán más cómodas para usted.
Sugeriría que primero aparezcan los requisitos de UI específicos para su proyecto. ¿Cuál de los frameworks que has probado has tomado para darle un giro?
Personalmente, ingresé en el desarrollo de ExtJS porque los proyectos en los que trabajo requieren mucha personalización de controles / widgets. ExtJS tiene un montón de ellos desde el primer momento y siempre se puede extender, combinar o enviar a cualquier monstruosidad que su negocio requiera.
ExtJS 4 también le permite "proteger" su interfaz de usuario para personalizar aún más la apariencia.
Si eres nuevo en JavaScript y te sientes cómodo con Java, incluso podrías buscar en una solución del lado del servidor como GWT , JSF o incluso Vaadin
Una sugerencia sobre Backbone, si decides usarla deberías elegir Marionnete ya que es Backbone pero con una estructura arquitectónica mejor y más dogmática (personalmente creo que Backbone no establece ninguna guía y eso se siente como un inconveniente en aplicaciones grandes) .
Trabajé con él durante unos meses combinando diferentes js libs y no se interpone en tu camino como otros frameworks y el pipeline de mensajes es una muy buena forma de conectar componentes a través de la aplicación pero mantenerlos desacoplados.
Aquí tiene una gran charla que me hizo decidir: https://www.youtube.com/watch?v=qWr7x9wk6_c
Y aquí tienes un prototipo de demostración que también tiene el elemento de arrastrar y soltar más otras js libs conectadas. Me encantaría escuchar lo que piensas acerca de mi código ya que tengo 1.5 años trabajando en desarrollo web ... todavía soy un novato: https://github.com/Drasky-Vanderhoff/marionette-demo/
Acerca de Knockout, es realmente bueno si quieres interactuar con el contenido que ya tienes y no te conectarás constantemente con el back-end. Trabajé con él durante 6 meses y termino necesitando muchas otras js libs para el enrutamiento; Además, termino repitiendo muchas de las estructuras que Backbone y otras estructuras JS terminan teniendo. Lo que diré es que no se interpondrá en su camino y será una herramienta en lugar de una restricción. También esto fue hace casi un año, así que algunas cosas han cambiado.
Una cosa, si encuentras Knockback (Knockout + Backbone) ... evítalo, la documentación no es tan buena como debería ser y te llevará mucho más tiempo aprenderla. Si quieres ir, crea primero un prototipo rápido para ver si es lo que quieres.
meteor está de moda hoy en día (el marco de JavaScript de pila completa más destacado en GitHub y Meteorpedia es un motor wiki escrito en Meteor).
El video de lanzamiento te enganchará a las 1:28.
Es agnóstico con respecto a la interfaz de usuario, y ha sido probado exhaustivamente con Bootstrap y Famo.us También genera aplicaciones móviles desde la misma base de código.