Gutenberg es el nuevo editor de WordPress, introducido en WP 5.0. Si bien esta inclusión ciertamente cambia las cosas para los usuarios cotidianos y abre muchas posibilidades para la creación de contenido, también abre una gran oportunidad para los desarrolladores. El editor está diseñado para ser lo más extensible posible, y puede agregar cualquier cosa que se le ocurra al constructor. Hemos reunido algunos de los mejores tutoriales de Gutenberg para desarrolladores que pudimos encontrar para que pueda comenzar a agregar sus propios adornos a la nueva experiencia de WordPress.
Un par de cosas antes de sumergirnos: Gutenberg está escrito con una biblioteca de JavaScript llamada React. Es la misma biblioteca en la que está escrito Instagram, así como nuestro amado Divi Builder . Así que podemos dar fe de que es bueno lo que quieres aprender.
Porque si realmente quieres profundizar en el desarrollo de Gutenberg, también vas a entrar en JavaScript. Como dijo Matt Mullenweg hace unos años, vas a “aprender JavaScript. Profundamente.» Tenemos algunos buenos artículos que puede leer para ver qué tipo de cosas funcionarán para usted .
Tómese un tiempo, mire a través de ellos y vea qué les gusta. Y cuando los tenga marcados o guardados en Pocket, acomódese y eche un vistazo a algunos de los mejores tutoriales de Gutenberg en la web.
1. La página oficial de Gutenberg
Tienes que empezar con el sitio oficial de WordPress Gutenberg . Quiero decir, si no conoce la documentación base, nada de lo anterior tendrá sentido. Recientemente, han convertido la página principal en una demostración totalmente interactiva del constructor, además de proporcionar enlaces a las preguntas frecuentes de su manual y un tutorial llamado El lenguaje de Gutenberg , que es de lectura obligatoria antes de avanzar con el desarrollo.
2. Gutenberg.Noticias
Aunque técnicamente no es un tutorial, Gutenberg.news agrega algunos de los tuts de mayor perfil/calidad de toda la web en un solo lugar. De vez en cuando corro por allí para ver qué hay de nuevo y siempre termino cayéndome por el agujero del clic. Tienen una combinación de tutoriales para desarrolladores y usuarios, pero encontrará tutoriales como Creación de Gutenblocks personalizados con el componente de texto enriquecido y tweets con enlaces a repositorios de Github que pueden enseñarle cómo convertir sus códigos abreviados existentes en bloques de Gutenberg .
3. La guía de desarrollo de Gutenberg
Supongo que está justo ahí en el nombre, ¿eh? La Guía de desarrollo de Gutenberg es una serie de tutoriales que abarcan desde desarrolladores principiantes hasta veteranos experimentados de WP. Gutenberg Hub se parece mucho a Gutenberg.news, pero el contenido no siempre se superpone (a veces lo hace). Nuevamente, este es un agujero de clic si está buscando tutoriales de Gutenberg para desarrolladores (o cualquier persona, en realidad). Considérate advertido.
4. Curso de desarrollo de Gutenberg de Zac Gordon
No todas las mejores cosas de la vida son gratis, y el increíble curso de desarrollo de Gutenberg de Zac Gordon es prueba de ello. Uno de los primeros cursos importantes (si no el primero) de la A a la Z 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 temas pagar $79 por algo que quedará obsoleto. Zac es bien conocido en la comunidad de WordPress, y este curso te mostrará por qué. Incluso hay videos tutoriales de ejemplo que puede usar. De esa manera sabrás en lo que te estás metiendo con anticipación.
5. Blog de Zac Gordon
Probablemente entiendas que Zac Gordon es un gurú de Gutenberg. Pero no estás limitado solo a su curso pago. En su blog, tiene un montón de tutoriales de Gutenberg para desarrolladores que también querrás consultar.
6. Cómo preparar sus complementos para Gutenberg
TutsPlus tiene un tutorial realmente sólido de todas las diversas formas que necesitará saber para asegurarse de que sus complementos no se rompan cuando un usuario tiene Gutenberg activo. Desde cómo funcionan los metaboxes ahora hasta la API REST y el registro de diferentes tipos de bloques, esta es su ventanilla única para ver todas las formas en que puede integrar sus complementos con el nuevo editor Gutenberg para WordPress.
7. Reacción de pila completa
Cualquier desarrollador de Gutenberg debería estar familiarizado con React, como mencioné antes. Fullstack React es uno de mis programas favoritos para familiarizarse con la biblioteca. Es un programa de 30 días, y revisa los diversos fundamentos que necesitará para utilizar la biblioteca. Si bien estar familiarizado con JavaScript es probablemente lo mejor, entré sin poder escribir una función y entendí lo que estaba pasando. Si bien hay un curso pago involucrado, puede descargar el libro completo de forma gratuita en formato PDF (más de 300 páginas), para que pueda ver si es lo que desea usar para sumergirse en el entorno de Gutenberg.
8. Reacción moderna con Redux
Gutenberg también usa el contenedor de JavaScript Redux . En Udemy, Stephen Grider tiene un curso que te enseñará a usar el contenedor favorito de Gutenberg con su biblioteca favorita. Es cierto que el precio estándar de $ 179.99 es un poco desagradable; sin embargo, Udemy ofrece regularmente importantes descuentos en cursos (mientras escribo esto, hay una oferta loca por $ 10.99, por ejemplo). Si el precio es más alto de lo que quiere pagar en este momento, si puede esperar un poco, probablemente logre una oferta. Dicho esto, personalmente tomé el curso React y React Native de Grider , por lo que puedo dar fe de lo bueno que debería ser este.
Vamos a «Gut» Go
Eso es un Gutenpun, ¿ves? Hablando en serio, sin embargo, Gutenberg es el futuro de WordPress. Ya sea que le guste la nueva forma de crear contenido o haya instalado el complemento Editor clásico para mantenerlo a la antigua, está aquí. Y si eres un desarrollador de WordPress, tendrás que lidiar con eso. Realmente no es tan difícil continuar tu educación y ver la dirección que está tomando Gutenberg. Cualquiera de los tutoriales anteriores realmente debería ayudarlo (o destriparlo ) en su camino para comprender completamente el poder y la extensibilidad del editor.
¿Qué tutoriales o recursos de Gutenberg ha utilizado para prepararse para la nueva era del desarrollo de WordPress?
Imagen destacada del artículo de 32 Pixels / shutterstock.com