Sviluppatori e programmatori hanno utilizzato a lungo gli editor di testo come il modo principale per inserire il codice del computer. Alcuni ambienti di sviluppo hanno i loro editor integrati, ma gli sviluppatori di solito sono affezionati a un editor e si attengono a quel programma. Uno dei motivi è che un buon editor di codifica include l'evidenziazione della sintassi, una funzione che formatta il codice sorgente e assegna caratteri e colori alle parole chiave e ai costrutti all'interno del codice per rendere molto più facile la lettura. Per questo motivo, gli sviluppatori di testi come Notepad ++, che sono trattati in questa guida Tech Junkie, sono favoriti dagli sviluppatori. La maggior parte degli sviluppatori non considera Google Documenti come un potenziale editor di codifica, nonostante le sue eccezionali funzionalità per gruppi di lavoro e l'integrazione nel cloud, perché non include opzioni integrate di evidenziazione della sintassi.
Tuttavia, puoi aggiungere l'evidenziazione della sintassi al codice nei documenti di Google Doc. Esistono, in effetti, almeno un paio di componenti aggiuntivi per Documenti che consentono di formattare vari linguaggi di programmazione e markup con l'evidenziazione della sintassi. Esistono anche numerose app Web che puoi utilizzare per inserire il codice sorgente con l'evidenziazione in Google Documenti. Ti mostrerò come aggiungere l'evidenziazione della sintassi del codice sorgente ai tuoi documenti Documenti.
Formatta il codice sorgente con Code Pretty
Code Pretty è un componente aggiuntivo per Google Documenti che aggiunge automaticamente l'evidenziazione al codice selezionato. Code Pretty non include un'enorme quantità di impostazioni per personalizzare la formattazione della sintassi, ma aggiunge comunque una comoda opzione di evidenziazione della sintassi a Documenti. È possibile aggiungere CP a Documenti facendo clic sul pulsante Fr ee in questa pagina Web. Quindi premere il pulsante Consenti per confermare le autorizzazioni per il componente aggiuntivo.
Successivamente, apri Documenti nel tuo browser; e fai clic sulla scheda Componenti aggiuntivi per aprire il suo menu. Quel menu includerà ora il componente aggiuntivo Code Pretty. Per darti un esempio di come questo componente aggiuntivo evidenzia la sintassi, seleziona e copia il codice JavaScript di esempio riportato di seguito in un documento di Documenti premendo Ctrl + C.
Cosa può fare JavaScript?
JavaScript può modificare gli attributi HTML.
In questo caso JavaScript modifica l'attributo src (sorgente) di un'immagine.
Incolla l'esempio JavaScript in Documenti premendo Ctrl + V. Quindi seleziona il codice nell'elaboratore di testi con il cursore. Fai clic su Componenti aggiuntivi > Codice grazioso e seleziona l'opzione Selezione formato dal sottomenu. Ciò formatterà JavaScript come mostrato nell'istantanea direttamente sotto.
Come detto, CP non include molte impostazioni per l'evidenziazione della sintassi. Tuttavia, è possibile regolare la dimensione del carattere del codice evidenziato facendo clic su Componenti aggiuntivi > Codice grazioso e Impostazioni . Questo aprirà la barra laterale mostrata direttamente sotto. Quindi puoi selezionare una dimensione del carattere predefinita alternativa per il codice evidenziato da lì.
Formattare il codice sorgente con Code Blocks
Code Blocks è un componente aggiuntivo alternativo a CP che puoi aggiungere a Documenti. Questo è in realtà un componente aggiuntivo leggermente migliore per evidenziare la sintassi in quanto include numerosi temi di evidenziazione. Premi il pulsante Gratis in questa pagina del sito Web per aggiungere blocchi di codice a Documenti.
Dopo aver installato Code Blocks, apri Documenti e copia e incolla lo stesso codice JavaScript sopra nell'elaboratore di testi di prima. Fai clic su Componenti aggiuntivi > Blocchi di codice e seleziona Avvia per aprire la barra laterale mostrata nell'immagine di seguito.
Seleziona solo il testo JavaScript con il cursore. Assicurati di non selezionare uno spazio documento vuoto sopra o sotto il codice. Seleziona JavaScript dal primo menu a discesa. Quindi puoi anche selezionare un tema dal menu a discesa Tema . Premere il pulsante Formato per aggiungere l'evidenziazione della sintassi al codice come mostrato di seguito. Ora il testo JavaScript è molto più chiaro con i tag di markup evidenziati.
Copia e incolla il codice sorgente evidenziato in Google Documenti
Oltre a Code Blocks e Code Pretty Docs, puoi anche utilizzare app web evidenziatore di sintassi per formattare il codice sorgente. Quindi puoi copiare e incollare il codice sorgente evidenziato da un'app Web nel tuo documento Documenti. Textmate è un'app Web per evidenziatori della sintassi che formatta numerosi linguaggi di programmazione e markup.
Fare clic su questo collegamento ipertestuale per aprire Textmate. Quindi copia e incolla il testo JavaScript incluso in questo post nella casella del codice sorgente di Textmate con i tasti di scelta rapida Ctrl + C e Ctrl + V. Seleziona JavaScript dal menu a discesa Lingua. Seleziona un tema di evidenziazione della sintassi dal menu a discesa Tema. Premi il pulsante Evidenzia per ottenere un'anteprima della formattazione del codice sorgente, come mostrato nell'istantanea direttamente sotto.
Successivamente, seleziona JavaScript evidenziato nell'anteprima con il cursore e premi Ctrl + C. Incolla il codice evidenziato in Google Documenti premendo Ctrl + V. Ciò aggiungerà il codice sorgente JavaScript evidenziato al documento Documenti come mostrato direttamente sotto.
Pertanto, non è necessario un editor di testo desktop per aggiungere l'evidenziazione della sintassi al software e al codice del sito Web. Invece, puoi evidenziare il codice di sintassi nei documenti di Documenti con le estensioni Code Pretty e Code Blocks. In alternativa, copia e incolla il codice da e verso l'app Web Textmate per inserire il codice sorgente con l'evidenziazione in Google Documenti.
Hai altri modi per aggiungere la formattazione della sintassi a Google Documenti? Condividili con noi qui sotto!
