Tutto ciò di cui hai bisogno per iniziare con WordPress Gutenberg

Nel 2018, WordPress mira a modernizzare e semplificare l'esperienza di creazione di contenuti con Gutenberg. Il suo nome deriva da Johannes Gutenberg, il fondatore della tipografia. Questo è considerato uno dei più grandi cambiamenti per l'esperienza utente di WordPress e il flusso di lavoro di sviluppo dei temi.

Cos'è Gutenberg?

La maggior parte di noi pensa che Gutenberg sia solo un nuovo editore, ma non è solo questo. Mentre l'editor è al centro dell'attenzione in questo momento, il progetto avrà un impatto sull'intera esperienza di pubblicazione, inclusa la personalizzazione.

Fino ad ora, modificare una pagina significava modificarne il titolo, il corpo e i campi personalizzati. Con Gutenberg questa logica cambia completamente e si introduce il concetto di blocchi . I blocchi sono componenti dell'interfaccia utente autonomi, isolati e dinamici che vengono aggiunti dinamicamente tramite wp-admin. Non approfondirò questo, poiché il seguente video spiega tutto in dettaglio.

Presentazione di Matt Mullenweg Gutenberg su State of the Word 2017

Gutenberg è già disponibile come plug-in e sarà integrato in WordPress 5.0, il cui lancio è previsto per aprile 2018. Il team dietro di esso si sta attualmente concentrando sull'esperienza di post-editing. Ma da quel momento in poi, amplierà il loro approccio per includere la creazione di modelli, la creazione di siti e altro ancora. Per rendere più agevole la transizione a Gutenberg, è disponibile un plug-in chiamato Editor classico che consente ai team di utilizzare l'editor corrente mentre lavorano sulle migrazioni.

Perché Gutenberg è buono per me e cosa significa questo per il futuro di WordPress?

Gutenberg è senza dubbio un cambiamento importante e molti sviluppatori dovranno adattarsi ad esso. Tuttavia, secondo me, questo è uno dei migliori cambiamenti che WordPress abbia mai sperimentato. Perché modernizza il processo di sviluppo del tema e lo rende più modulare con una base di codice più pulita, una migliore manutenzione e modifica. Offre maggiore affidabilità e si sbarazza del suo vecchio approccio hackerabile monolitico.

Con l'uso dei blocchi, ottimizza e semplifica tutti i modi in cui costruiamo una pagina (codici brevi, widget, HTML personalizzato, media, formattazione del testo, incorporamenti e metabox). Come spiega Matt nel suo post:

• Gli sviluppatori e le agenzie saranno in grado di creare modelli interattivi che i clienti possono aggiornare facilmente senza rompere le cose o avere a che fare con tipi di post personalizzati.
• Gli sviluppatori di plugin saranno in grado di integrarsi completamente in ogni parte di WordPress. Includendo post, pagine, tipi di post personalizzati e barre laterali senza dover hackerare TinyMCE o spremere l'intera funzionalità dietro un pulsante della barra degli strumenti.
• Gli sviluppatori di temi non avranno bisogno di raggruppare tonnellate di plugin o creare i propri page builder. Ci sarà un modo standard e portatile per creare layout avanzati per i post e guidare le persone attraverso l'installazione direttamente nell'interfaccia. Non sono necessari tutorial in 20 passaggi o lunghi video.
• Gli sviluppatori principali saranno in grado di lavorare con le moderne tecnologie senza preoccuparsi di 15 anni di compatibilità con le versioni precedenti.
• Gli utenti potranno finalmente creare i siti che costruiscono con la loro immaginazione. Saranno in grado di fare cose su dispositivi mobili che non hanno mai fatto prima. Non dovranno mai più vedere uno shortcode. Il testo incollato da Word verrà ripulito e convertito in blocchi automaticamente e istantaneamente.

Demo ed esempi

In questo discorso di WordCamp US 2017, Morten spiega su cosa devono concentrarsi gli sviluppatori di WordPress e come WordPress verrà trasformato con Gutenberg.

Morten Rand-Hendriksen: Gutenberg e il WordPress di domani

In questo screencast, Human Made mostra una serie di implementazioni avanzate di blocchi Gutenberg.

Come iniziare

Gioca con Frontenberg , una demo live di frontend limitata dell'editor Gutenberg che ti aiuterà a familiarizzare con l'ambiente di editing Gutenberg.

Frontenberg – Un parco giochi Gutenberg disconnesso per test istantanei

Leggi il seguente articolo di Matias Ventura Bausero, uno dei principali ingegneri dietro Gutenberg .

Gutenberg, o la nave di Teseo – Come può un sistema evolversi fondamentalmente senza cambiare drasticamente?

Gioca con questi simboli Sketch e prova a progettare i tuoi blocchi personalizzati.

Automattic/gutenberg-themes-sketch – gutenberg-themes-sketch – Un set di file Sketch per aiutarti a progettare temi WordPress basati su blocchi

Leggi il manuale ufficiale degli sviluppatori su wordpress.org . È pulito, di facile lettura e si evolve costantemente. Dovresti anche iscriverti alla loro mailing list per ricevere i loro aggiornamenti.

Introduzione - "Gutenberg" è il nome in codice per il focus dell'editor di WordPress 2017.

Scava in ReactJS poiché Gutenberg è costruito su di esso.

React – Una libreria JavaScript per la creazione di interfacce utente – Una libreria JavaScript per la creazione di interfacce utente

Dai un'occhiata a questi esempi di Gutenberg creati dal core team di WordPress.

WordPress/gutenberg-examples = gutenberg-examples – Esempi per estendere WordPress/Gutenberg con blocchi

Leggi questo dettagliato e-book di Human Made (una delle migliori agenzie di sviluppo WP) .

Gutenberg, il nuovo editor di WordPress (White Paper) – Questo white paper copre le principali sfide nell'implementazione e adozione, oltre a consigli su come le aziende possono agire ora.

Dai un'occhiata a questo corso di sviluppo di Zac Gordon, educatore su alcune delle piattaforme educative più popolari FrontendMasters, Treehouse e Udemy.

Il corso di sviluppo Gutenberg di Zac Gordon – Corsi di Gutenberg

Infine, installa questo toolkit per sviluppatori a configurazione zero per la creazione di plug-in per blocchi Gutenberg di WordPress di Ahmad Awais

ahmadawais/create-guten-block – ‏ Un toolkit per sviluppatori #0CJS a configurazione zero per la creazione di blocchi Gutenberg di WordPress.

Per ora è tutto, grazie mille per aver letto questo post e per favore lascia un commento se hai pensieri, domande o suggerimenti.

Se sei un'agenzia, un'azienda o uno sviluppatore WordPress che desidera migliorare le prestazioni del tuo sito Web, la sicurezza e l'esperienza di hosting, parla con il nostro team di ingegneri. La nostra piattaforma di hosting WordPress gestita è considerata una delle migliori del suo settore con prestazioni, affidabilità e assistenza tecnica senza pari.

Il nostro team è in missione per ridefinire il modo in cui gli sviluppatori WordPress creano, ospitano e ridimensionano i loro siti Web, quindi tieniti in contatto e sentiti libero di parlare con noi.