8 tutoriales de Gutenberg para desarrolladores

Gutenberg es el nuevo editor de WordPress, introducido en WP 5.0. Si bien esta inclusión ciertamente cambia las cosas para los usuarios comunes y abre muchas posibilidades para crear contenido, también ofrece una gran oportunidad para los desarrolladores. El editor está diseñado para ser lo más extensible posible y puede agregar al constructor lo que sea que se le ocurra. Hicimos algunos de los mejores tutoriales de Gutenberg para los desarrolladores que pudimos encontrar, por lo que puede comenzar a agregar sus propias flores a la nueva experiencia de WordPress. Una nota rápida algunas cosas antes de bucear: Gutenberg está escrita con una biblioteca JavaScript llamada React. Es la misma biblioteca en la que está escrito Instagram, así como nuestro propio amante Divi Builder. Por lo tanto, podemos garantizar que hay cosas buenas que desea aprender.
Porque, si realmente quieres mirar en el desarrollo de Gutenberg, también entrarás en JavaScript. Como dijo Matt Mullenweg hace unos años, “aprenderá JavaScript”. Profundo. “Tenemos algunos buenos artículos que puedes ver para ver qué tipo de cosas funcionarán para ti. Tómate un tiempo, mira entre ellos y vea cómo. Y cuando las tengas marcadas o guardadas en el bolsillo, configurar y tomar un Mire algunos de los mejores tutoriales de Gutenberg en la web. 1. Página oficial de Gutenberg

Debe comenzar con el sitio web oficial de WordPress Gutenberg. Es decir, si no conoce la documentación básica, nada de lo anterior tendrá sentido. Recientemente, hicieron de la primera página una demostración totalmente interactiva del fabricante, además de proporcionar enlaces a su manual de preguntas frecuentes y un tutorial llamado Language de Gutenberg, que es bastante necesario para leer antes de ir con el desarrollo.2. Gutenberg
Aunque no es un tutorial técnico, Gutenberg.News agrega un tipo de perfil de mayor perfil / calidad en un solo lugar. Cierto de vez en cuando para ver qué hay de nuevo y puedo caer cada vez en el hoyo. Tienen una mezcla de tutoriales para desarrolladores y usuarios, pero encontrará todo como la creación de bloques degen personalizados con el componente de texto rico y tweets a reposiciones de GitHub que pueden enseñarle cómo convertir los códigos cortos existentes en bloques de Gutenberg. 3. Guía de desarrollo de Gutenberg

Creo que está allí en el nombre, ¿verdad? La Guía de Desarrollo de Gutenberg es una serie de tutoriales que se extienden desde principiantes hasta veteranos de WP experimentados. El Centro Gutenberg se parece mucho a Gutenberg.News, pero el contenido no siempre se superpone (a veces sucede). Una vez más, este es un clickhole si está buscando tutoriales de Gutenberg para desarrolladores (o para cualquier persona, de hecho). Considérate advertido.

4. Curso de desarrollo de Gutenberg de Zac Gordon
No todas las mejores cosas de la vida son gratuitas, y el sorprendente curso de desarrollo de Zac Gordon Gordon es una prueba de este hecho. Uno de los primeros cursos de AZ (si no el primero) sobre la nueva experiencia de edición de WP. El curso se actualiza con nueva información a medida que se actualiza Gutenberg, así que no tenga miedo de pagar $ 79 por algo que se superará. Zac es bien conocido en la comunidad de WordPress y este curso le mostrará absolutamente por qué. Incluso hay ejemplos de videos tutoriales que puede usar. De esta manera, sabrá lo que se dirige hacia adelante. Blog de Zac Gordon

Probablemente entiendas que Zac Gordon es un gurú de Gutenberg. Pero no estás limitado solo a su curso de pago. En su blog, tiene muchos tutoriales de Gutenberg para los desarrolladores que desea ver. 6. Cómo preparar sus complementos para Gutenberg

Tutsplus tiene una presentación realmente sólida de todas las formas en que necesita saber para asegurarse de que sus complementos no se rompan cuando un usuario tiene gutenberg activo. Desde cómo Metabox funciona hasta REST API y grabando diferentes tipos de bloques, esta es su tienda única para ver todas las formas en que puede integrar sus arados con el nuevo editor de Gutenberg para WordPress.

7. reaccionando FullStack

Cualquier desarrollador de Gutenberg debe estar familiarizado con React, como se mencionó anteriormente. FullStack React es uno de mis programas favoritos para familiarizarse con la biblioteca. Es un programa de 30 días y usted pasa por los diferentes elementos fundamentales que necesitará para usar la biblioteca. Aunque familiarizar con JavaScript es probablemente el mejor, entré sin escribir una función y entendí lo que estaba sucediendo. Si bien hay un curso de pago, puede descargar todo el libro de forma gratuita en formato PDF (más de 300 páginas), para que pueda ver si es lo que desea usar para hundirse en el entorno Gutenberg.8. REACT MODERNO con Rodux
Gutenberg también usa el contenedor JavaScript Rodux. En Udemy, Stephen Grider tiene un curso que le enseñará cómo usar el contenedor favorito de Gutenberg con su biblioteca favorita. Así es, el precio estándar de $ 179.99 es un poco desalentador; Sin embargo, Udemy ofrece regularmente descuentos significativos de cursos (mientras escribe esto, hay una venta loca por $ 10.99, por ejemplo). Si el precio es más alto de lo que desea pagar en este momento, si puede esperar un poco, probablemente obtendrá una oferta. Dicho esto, personalmente seguí el curso de reaccionamiento y reaccionamiento de Graider, por lo que puedo garantizar lo bueno que debería ser.

“Gut” vamos es un gutenpp, ¿ves?En serio, sin embargo, Gutenberg es el futuro WordPress.Ya sea que le guste la nueva forma de crear contenido o instalar el complemento Classic Editor para mantenerlo viejo, está aquí.Y si eres un desarrollador de WordPress, deberás manejarlo.No es tan difícil continuar su educación y ver la dirección en la que va Gutenberg.Cualquiera de los tutoriales anteriores debería ayudarlo (o aguijonear) en su camino para comprender completamente el poder y la extensibilidad del editor.¿Qué tutoriales o recursos de Gutenberg utilizó para prepararse para la nueva era del desarrollo de WordPress? Imagen presentada por 32 Pixels / Shutterstock.com