React-dnd: Agregue ejemplos sencillos de ES5

Creado en 19 jun. 2015  ·  32Comentarios  ·  Fuente: react-dnd/react-dnd

No todos tenemos el lujo de usar la nueva sintaxis de ES7, sería de mucha ayuda para la sobrecarga de información de los recién llegados si pudiera haber un par de ejemplos de trabajo que no presentaran todas estas nuevas características de lenguaje (especialmente características experimentales como los decoradores de ES7) en los ejemplos. La utilidad de los ejemplos se diluye cuando están abarrotados de características del lenguaje experimental.


Editar del mantenedor: por favor rastree aquí:
https://github.com/vkbansal/react-dnd-es5-examples


Comentario más útil

Obligar a la gente a aprender la sintaxis de ES6 (y peor aún, ES7) solo para entender su código de ejemplo es _hostile_ en _best_. Esto parece un módulo asombroso. ¿Por qué no exportar al menos la versión ES5 de _uno_ de sus ejemplos a una carpeta de ejemplos de ES5 para los no iniciados? Decir que aceptará un PR no es útil, ya que las personas que piden los ejemplos probablemente no estén familiarizadas con ES6 y ES7 para empezar.

Le suspiro.

Todos 32 comentarios

Estoy feliz de aceptar tal contribución.

Todos los ejemplos de tutoriales se ofrecen en ES5, ES6 y ES7:
http://gaearon.github.io/react-dnd/docs-tutorial.html

Cada página de documento también tiene ejemplos en ES5, ES6 y ES7:
http://gaearon.github.io/react-dnd/docs-drag-source.html
http://gaearon.github.io/react-dnd/docs-drop-target.html
etc

Desafortunadamente, no tuve tiempo de transferir todo el código de ejemplo, pero esto debería ayudarlo a comenzar.

Hay ejemplos de ES5 en el sitio de documentación. http://gaearon.github.io/react-dnd/docs-overview.html

image

Me refiero a los ejemplos funcionales completos en el repositorio de github.

Estoy de acuerdo en que los ejemplos de ES5 con ES6 / 7 opcional serían preferibles hasta que ES6 / 7 sea la corriente principal. Será más fácil aprender react-dnd si no tiene que aprender un nuevo lenguaje de programación al mismo tiempo + transpilar a ES5 para ejecutar el código.

Yo diría que ES6 ya está generalizado con el lenguaje finalizado y Babel utilizado en toneladas de proyectos.

Obligar a la gente a aprender la sintaxis de ES6 (y peor aún, ES7) solo para entender su código de ejemplo es _hostile_ en _best_. Esto parece un módulo asombroso. ¿Por qué no exportar al menos la versión ES5 de _uno_ de sus ejemplos a una carpeta de ejemplos de ES5 para los no iniciados? Decir que aceptará un PR no es útil, ya que las personas que piden los ejemplos probablemente no estén familiarizadas con ES6 y ES7 para empezar.

Le suspiro.

Estoy de acuerdo con los chicos de aquí, @gaearon , no debes obligar a la gente a aprender ES6 / ES7 solo para entender cómo funciona la biblioteca. Esto podría llevar a la gente a usar otra biblioteca en su lugar.
Esta biblioteca es increíble, lo único que tengo que discutir es este tema. No soy un experto en JS (soy un desarrollador de Ruby) por lo que es difícil para mí entender los ejemplos, solo porque estás usando otra sintaxis (no estoy en contra de la nueva sintaxis, pero al desarrollar una biblioteca deberías adoptar estándares convencionales), lo cual es ridículo.
Si desea que esta biblioteca sea la biblioteca DnD estándar para React, debe corregir esto. De lo contrario, me temo que la gente usará otra solución "más fácil", sin importar si es mejor o peor que la suya.

solo porque estás usando otra sintaxis

FYI, esta no es otra sintaxis, es ES6, que es JavaScript. Y si tiene problemas con la sintaxis de ES6, también debe tener problemas con reaccionar, porque en realidad es otra sintaxis.

pero al desarrollar una biblioteca, debe adoptar estándares convencionales

ES6 se está generalizando. io.js y el propio react tienen soporte para ES6

Estás equivocado.

  1. Consulte Wikipedia :

En informática, la sintaxis de un lenguaje informático es el conjunto de reglas que define las combinaciones de símbolos que se consideran un documento o fragmento correctamente estructurado en ese lenguaje.

Y:

ECMAScript 2015 (sexta edición) es la versión actual del estándar ECMAScript Language Specification

Sí, tanto ES5 como ES6 son JS, pero la sintaxis es diferente.
2.

ES6 se está generalizando. io.js y el propio react tienen soporte para ES6

"Convertirse" y "soporte para" denotan que usted sabe que ES6 aún no es la corriente principal. Lo hará, eventualmente, pero mientras tanto debería dar ejemplos en ES5.

Si quieren tanto ejemplos de ES5, ¿por qué no se esfuerzan por contribuir con ellos? @gaearon es una persona muy ocupada y trabaja en esta biblioteca en su tiempo libre. Entonces, en lugar de exigir, intenta contribuir, para que otros también puedan beneficiarse de ello.

Chicos, propietario del proyecto, gaearon, no está obligando a nadie a nada.

gaearon ya ha hecho un gran trabajo en esta lib. El proyecto es de código abierto y se ofrece de forma gratuita. Acusarlo de ser hostil, o como si fuera el dueño de los usuarios, es algo hostil en mi humilde opinión.

Dijo que no tiene tiempo para migrar los ejemplos a es5 y que está abierto a recibir contribuciones. Ya hay ejemplos en es5 / 6/7. Y para ser honesto, la sintaxis no es tan diferente.

Además, puede usar un transpilador, como babel, para transformar el código es6 / 7 en es5 y usarlo, examinarlo o aprender de él.

Nadie está obligando a la gente a usar react-dnd, ni el propósito de esta biblioteca es ser la solución 'única'.

@hakanderyal exactamente mi punto!

@hakanderyal no estamos discutiendo eso ... tienes razón, todos agradecemos a @gaearon por el tremendo trabajo en este proyecto.

Sabemos que no hubo ninguna intención maliciosa de escribir los ejemplos en ES6. Personalmente no estoy acusando a nadie de esto. Sin embargo, creo que este problema nos muestra que se necesitan ejemplos de ES5.

Sí, podríamos usar Babel, pero en algunos casos no desea agregar más complejidad a su proyecto agregando más bibliotecas solo porque los ejemplos que tiene las requieren. Estoy usando React y ReactDnD en un proyecto de Rails y, sinceramente, no quiero lidiar con más transpilers y otras cosas solo para ejecutar mi código.

Además, algunas personas (incluido yo mismo) no son expertos en JS, así que creo que sería bueno mantener las cosas lo más simples posible.

Cualquier colaborador existente o uno nuevo podría tomar la iniciativa en este tema y comenzar a agregar algunos ejemplos, no solo @gaearon

@ bismark64 @jeffreywescott @emergentcypher Ver # 214

: +1: ¡Excepcional @vkbansal! ¡Gracias!

Gracias, @vkbansal , genial !

Hey gente.

Pasé semanas y noches de mi tiempo personal trabajando en este proyecto y en su sitio web de documentos, que es el único sitio web de la biblioteca JS que conozco que muestra ejemplos de código ES5, ES6 y ES7 en cada página de documento que contiene algún código. Lamento no haber estado a la altura de sus expectativas con los ejemplos en sí.

Cuando tenga algo de tiempo libre después de pasar semanas y noches de mi tiempo personal no remunerado trabajando en mi charla de React Europe, podría considerar su solicitud. Mientras tanto, utilice otra biblioteca o pídale a alguien que le ayude con los ejemplos de ES5.

Aquí hay algunas cosas que le sugiero que haga cuando tenga algo de tiempo libre:

Gracias.

PD: Muchísimas gracias a @vkbansal.

Hola Gaearon,

La mayoría de las personas que lo utilizan aprecian mucho la publicación de su código para uso público.

Estás impulsando las cosas "hacia adelante" y haciéndolo de manera pública ... ninguna de las cuales es "fácil".

Estoy totalmente sorprendido (y creo que la mayoría de la gente lo estará) por las acusaciones que has recibido.
por ejemplo, 'forzar' a la gente ... y ser 'hostil'
... especialmente cuando has invitado contribuciones

Su respuesta a estos ataques es mucho más moderada que la mía si recibiera la misma provocación.

Por favor, no se deje intimidar por esta minoría negativa

muchas gracias por el código y las ideas

Stu

Por favor respete mi deseo de _no_ continuar esta discusión. No quiero enviar más spam a las personas que ven este repositorio.

No estoy bloqueando el problema, pero si se publica otro comentario, espero que este sea un comentario útil que vincule a más PR o algo por el estilo, no un comentario de “discusión”. Podemos torcer las palabras del otro para siempre y "escuchar a ambos lados", pero no veo el punto.

Entiendo su preocupación: necesita ejemplos de ES5 y no quiere aprender ES6 / 7 en este momento. Un puesto totalmente válido para tener. Mi posición en este momento es que _físicamente no puedo_ trabajar en estos ejemplos. Podría hacerlo en el futuro. En este momento no hay nada que pueda hacer para ayudarlo excepto señalar este gran recurso de aprendizaje de ES6 (que es como lo aprendí yo mismo).

Además, si tuviera que centrarme en estos ejemplos, no habría enviado 1.0 en absoluto. Fue un corte necesario para sacar 1.0 porque tuve que empezar a trabajar en mi charla inmediatamente después de eso. Puede usar React DnD 0.9.2, que es la última versión que tiene ejemplos de ES5 . Tenga en cuenta que difiere significativamente de 1.0.

Finalmente, existe una cierta etiqueta de código abierto, y algunas de las frases en los comentarios anteriores la violan. Si no ve eso, este es su problema, no el mío. Romper esta etiqueta es una de las razones por las que los mantenedores se agotan y abandonan sus proyectos populares. Podría pensar que su queja era válida y tenía buenas intenciones, pero es totalmente irrelevante. Es realmente difícil entender esto realmente hasta que pones sudor y sangre en tu propio proyecto y tienes un problema similar.

En resumen, si este es un hilo productivo más adelante, estoy feliz. Si es "quién tiene la culpa", lo bloquearé.
Gracias.

Tienes toda la razón @stooboo y @gaearon. Me disculpo si mis comentarios anteriores rompieron esta etiqueta y te sentiste acusado o te he faltado el respeto. Sé que mantener un proyecto de este tipo implica mucho esfuerzo y tiempo, y lo estás haciendo muy bien hasta ahora, así que estoy agradecido por eso. Mi intención fue solo señalar esta preocupación.
Dicho esto, deberíamos pasar por alto esto y dejar que este hilo evolucione como de costumbre.

Me siento avergonzado y avergonzado. Lamento mucho mis comentarios, @gaearon. No es excusa, pero esta semana ha sido difícil para mí, y en un momento de frustración, arremetí. Realmente lo siento, y muchas gracias por esta increíble biblioteca .

Permítanme también proporcionar algo de contexto. La razón por la que los ejemplos no están escritos en ES5 es porque la principal razón por la que escribí 1.0 fue que las personas tenían problemas para usar 0.x de las clases de ES6: # 109.

Sería una tontería lanzar 1.0 “resolviendo” el problema de la clase ES6 sin clases ES6 en los ejemplos. Por lo tanto, tomé la decisión de usar ES6 más adelante.

Si está utilizando React, es muy probable que _ya_ tenga un paso de compilación. Necesitas compilar JSX, ¿verdad? (La mayoría de la gente lo usa). Si ya tiene un paso de compilación, no le cuesta literalmente nada reemplazar el paso de compilación JSX con el paso de compilación de Babel. De hecho, eso es lo que también hará Facebook.

Esperaba tener que dejar esta biblioteca "para colgar" por un tiempo porque sabía que necesitaba trabajar en mi charla. Por lo tanto, elegí construirlo _mirando hacia adelante, en lugar de hacia atrás_, para que pueda vivir un tiempo por sí solo sin mi interferencia.

@jeffreywescott No hay problema, y ​​de nada. Gracias por pedir disculpas. Realmente lo aprecio y sé que puede ser difícil admitir que estoy equivocado.

: +1:

@gaearon @emergentcypher @awarberg @jeffreywescott @ bismark64

Seguí el Tutorial principalmente ES5 (porque yo también soy lento para aprender ES6, pero eventualmente lo haré, estoy usando JSX, obviamente, y desestructurando ): https://github.com/jehoshua02/react-dnd-experiment

Siga los ejemplos de ES5 aquí:
https://github.com/vkbansal/react-dnd-es5-examples

Muchas gracias a @vkbansal.

Finalmente tuve algo de tiempo para terminarlo: http://vkbansal.github.io/react-dnd-es5-examples/

No era mi intención despertar las emociones de la gente, solo quiero ayudar a que la biblioteca se vuelva accesible y estaba más preocupado por los ejemplos que contienen características experimentales de ES7 que, incluso si estoy cambiando a ES6, todavía no se usarán. Creo que es importante seguir impulsando a la comunidad de desarrolladores hacia ES6 ahora que se ha finalizado y ciertamente creo que @gearon tomó la decisión correcta al tratar el código ES6 como su prioridad, y me disculpo si redacté mal mi comentario original.

Para comentar sobre los pasos de compilación, mi entorno de compilación tiene un paso de compilación JSX, pero dado que mi entorno de compilación no es Node.js sino que se maneja en otro idioma, no es necesariamente tan simple como "conectar" Babel en lugar de JSX, especialmente si estás trabajando en un equipo en el que no eres necesariamente responsable de la construcción.

Gracias @vkbansal y gracias a @gaearon por todo su trabajo en primer lugar.

  • Mientras que la mayoría de todos los involucrados apenas ingresan a ES6,
  • Mientras que la transpiración de ES7 a ES5 a menudo da como resultado un código desagradable de descifrar,
  • Mientras que todas las funciones de ES7 todavía se consideran experimentales,

Elimine todas las utilizaciones de ES7

Utilizar ES7 para la simplicidad / concisión sintáctica solo funciona si todos los involucrados conocen las variantes históricas en la sintaxis.

@vkbansal gracias por poner esos ejemplos juntos.


Ejemplo del segundo artículo:

Código limpio:

var DragSourceDecorator = DragSource(ItemTypes.CARD, cardSource,
    function(connect, monitor) {
        return {
            connectDragSource: connect.dragSource(),
            isDragging: monitor.isDragging()
        };
});

var DropTargetDecorator = DropTarget(ItemTypes.CARD, cardTarget,
    function(connect) {
        return {
            connectDropTarget: connect.dropTarget()
        };
});

module.exports = DropTargetDecorator(DragSourceDecorator(Card));

Salida transpilada (del ejemplo ):

Card = (0, _reactDnd.DragSource)(_ItemTypes2['default'].CARD, cardSource, function (connect, monitor) {
    return {
      connectDragSource: connect.dragSource(),
      isDragging: monitor.isDragging()
    };
  })(Card) || Card;
  Card = (0, _reactDnd.DropTarget)(_ItemTypes2['default'].CARD, cardTarget, function (connect) {
    return {
      connectDropTarget: connect.dropTarget()
    };
  })(Card) || Card;
  return Card;

editar: se hace referencia erróneamente a @emergentcypher como el autor del ejemplo de es5.

¿Estas borracho?
¡Lo siento! comentado en el lugar equivocado!

@adamellsworth Nadie te obliga a usar ES7. Si no desea usarlo, no lo haga, pero no tiene derecho a decirle al autor qué debe hacer.

¡La gente tiene todo el derecho a hacer comentarios! Eso es lo mejor del código abierto. No creo que decir "por favor elimine" sea dar órdenes al autor. Si el autor no quería recibir comentarios y solicitudes, entonces no debería publicar trabajos en github.

Como ahora tenemos ejemplos de ES5, cerraré esto yo mismo :)

¡La gente tiene todo el derecho a hacer comentarios! Eso es lo mejor del código abierto.

@emergentcypher tienes razón.

@gaearon es plenamente consciente de que no todas las personas se sienten cómodas usando ES7, por eso se tomó el tiempo de poner ejemplos de ES6 y ES5 en el sitio web.

Si el autor no quería recibir comentarios y solicitudes, entonces no debería publicar trabajos en github.

Sí, el autor desea recibir comentarios y retroalimentación pero que sean constructivos .

Pidiendo autor para eliminar algo completamente sólo porque usted no lo usa, es equivalente a caminar hasta su jefe y le pidió que uno de sus colegas fuego sólo porque no me gusta su / la cara.

¿Fue útil esta página
0 / 5 - 0 calificaciones