Tutti gli sviluppatori creano il proprio set di strumenti quando si tratta di gestire vari progetti. Gli strumenti utilizzati da uno sviluppatore Web possono ridurre il tempo necessario per completare un sito Web o un’app Web e possono semplificare la gestione delle attività.
Gli strumenti intelligenti sono essenziali per il flusso di lavoro di ogni sviluppatore di successo, quindi se vuoi migliorare il tuo toolkit con una nuova serie di trucchi, è una buona idea leggere questo articolo attentamente dall’inizio alla fine.
Non mancano gli editor di codice che puoi utilizzare per semplificare il tuo lavoro. Decidere tra di loro diventa molto più difficile quando ci sono così tante opzioni che ti aspettano.
Pertanto, presenteremo un’opzione che si erge sopra il resto: Sublime Text. Questo è uno degli editor di codice più utilizzati sul mercato ed è preferito da migliaia di programmatori, sviluppatori web e web designer.
La cosa così impressionante di Sublime Text è la sua flessibilità. Puoi facilmente estendere l’editor di codice utilizzando i plug-in Sublime Text creati per quasi tutti gli scopi immaginabili. Inoltre, puoi persino creare pacchetti personalizzati che miglioreranno visibilmente il tuo flusso di lavoro e aumenteranno la tua produttività.
Continua a leggere di più in questo articolo creato dal nostro team di wpDataTables e scopri alcuni dei migliori pacchetti di testo sublime, come funzionano e come puoi usarli.
Plugin di testo sublimi: installazione di pacchetti
Prima di elencare i plugin di Sublime Text che consideriamo rilevanti per tutti i web designer, dovresti imparare come installare i pacchetti su questo editor di codice. Ecco i passaggi che devi seguire:
- Scarica il file zip del repository del pacchetto. Puoi farlo dalla pagina GitHub del pacchetto.
- Estrai i file nella cartella Pacchetti di testo sublime. Dovresti trovarlo in: {{ nome utente }}AppDataRoamingSublime Text {{ versione }}Pacchetti
O
- Installa il pacchetto tramite il controllo del pacchetto ufficiale di Sublime Text Fai clic sul collegamento e copia il codice adatto alla versione di Sublime Text che possiedi.
- Incolla il codice sulla tua console Sublime Text, a cui puoi accedere premendo CTRL + ~.
- Riavvia l’editor di codice, apri la finestra di comando premendo CTRL + Maiusc + P e digita "Controllo pacchetto: Installa pacchetto" (o semplicemente "Installa pacchetto": il completamento automatico mostrerà le opzioni desiderate)
Una volta installato il pacchetto, non apportare modifiche al suo file di configurazione predefinito, a meno che tu non sappia esattamente cosa stai facendo. I pacchetti di Sublime Text sono principalmente pensati per essere personalizzati con l’uso di file di sostituzione separati in modo che le modifiche non vengano perse quando i pacchetti vengono aggiornati.
Plugin di testo sublimi che tutti gli sviluppatori Web dovrebbero provare
Parlando dell’estendibilità dell’editor di codice, sarebbe utile elencare alcuni dei migliori plug-in di testo sublime in circolazione e come possono aiutarti a diventare uno sviluppatore migliore nel più breve tempo possibile.
Si spera che troverai questi plugin utili e rilevanti per il tuo lavoro. Ecco l’elenco:
Controllo del pacchetto
Sublime Text Package Control è probabilmente lo strumento più popolare disponibile per questo editor di codice. Ti consente di scaricare, installare e aggiornare i pacchetti direttamente dall’interfaccia di Sublime Text.
Sebbene "plugin" e "pacchetto" siano spesso usati in modo intercambiabile, i pacchetti includono plug-in, menu, frammenti e altri bit e bob che possono essere utilizzati per estendere il testo sublime a proprio piacimento.
Invece di scaricare i file del pacchetto da soli e installarli nella cartella giusta, lascia che questo plugin faccia tutto per te senza uscire da Sublime Text. Se sei un programmatore, pensalo come pip per Python o npm per node.js.
Allineamento
L’allineamento fa esattamente quello che dice il suo nome: è uno di quei plug-in Sublime Text che rende il tuo lavoro 10 volte più semplice allineando il tuo codice per renderlo più ordinato e facile da leggere. Funziona alla grande con PHP, JavaScript, CSS e altro.
Puoi allineare sezioni, selezioni su più righe o l’intero codice con l’uso di delimitatori come "=". Anche se potresti pensare che non sia di grande aiuto, una volta che lo usi diventerai dipendente da quanto sia utile.
Emmet
Tra i plug-in Sublime Text più utilizzati c’è Emmet, un semplice plug-in che può migliorare la produttività di qualsiasi sviluppatore aiutandolo con il flusso di lavoro CSS e HTML.
Ad esempio, se scrivi html:5 e premi CTRL + E mentre usi Emmet, avrai accesso a un modello di pagina HTML5 di base con cui lavorare. Il plugin è semplice, ma estremamente efficace e migliorerà sicuramente il tuo lavoro.
Cambia Citazioni
Odi gestire le citazioni? Congratulazioni, sei uno dei milioni di sviluppatori là fuori che hanno anche difficoltà a mantenerli coerenti. ChangeQuotes ti aiuterà.
Può facilmente convertire virgolette singole/doppie e rifuggirle. Se desideri modificare le virgolette, posiziona il cursore all’interno del testo citato e apri la tavolozza dei comandi. Esegui il plug-in e non è più necessario selezionare l’intera riga per modificare le virgolette. È molto più veloce in questo modo!
Miglioramenti alla barra laterale
Questo plug-in Sublime Text aggiungerà alcune nuove funzionalità al menu della barra laterale. Ad esempio, puoi creare un nuovo file molto più velocemente rimanendo nella cartella del progetto corrente. Puoi anche spostare più facilmente file e cartelle, duplicarli secondo necessità e aprire file nel Finder o nel tuo browser.
SublimeEnhancements aggiunge una serie di utili funzioni della barra laterale che ti aiuteranno a gestire il tuo progetto in modo più efficiente. Installalo per scoprire tutte le funzioni utili.
SublimeLinter
Se sei un utente di Sublime Text 3, adorerai SublimeLinter. Non molti plug-in Sublime Text sono stati aggiornati per l’ultima versione dell’editor, quindi è sempre bello vedere che gli sviluppatori di plug-in si concentrano sull’aggiornamento dei loro prodotti. Invece di avere tutti i tuoi linter in un unico pacchetto, questo plugin ti consente di installare quelli che usi regolarmente.
Fondamentalmente, SublimeLinter ti offre un framework da usare per il linting del codice. Nel caso non lo sapessi, linting rappresenta il processo di segnalazione della sintassi non portatile o errata nel tuo codice. In parole più semplici, ti avverte quando il codice è pieno di bug.
Sublime Git
Lavorare con il software di controllo della versione è comune per gli sviluppatori. Il più popolare è Git. Per coloro che sono stanchi di salvare file di testo e tornare a un terminale per eseguire un paio di comandi Git, SublimeGit sarà la risposta. Questo plug-in Sublime Text ti consente di eseguire tutti i tuoi comandi Git all’interno dell’editor di testo.
Utilizzando SublimeGit, gli sviluppatori possono fare di più in meno tempo, aumentando così notevolmente la loro produttività. Non dovrai passare avanti e indietro tra l’editor di codice e la riga di comando.
Questo era disponibile solo come plug-in a pagamento, ma l’anno scorso è diventato open source. Ha numerose funzionalità che troverai utili, oltre ai documenti SublimeGit, che ti aiuteranno a comprendere e utilizzare il plug-in.
GitGutter
Puoi sempre eseguire comandi Git all’interno di Sublime Text stesso, ma non è il modo più veloce per gestire questa attività. Sublime Text ti fa eseguire un comando separato, invece di farti visualizzare le modifiche in tempo reale. Bene, è qui che interviene GitGutter.
GitGutter è simile ad Atom da alcuni punti di vista. Aggiunge gli stessi tipi di funzionalità a Sublime Text, il che significa che puoi iniziare ad aggiungere suggerimenti diff alla grondaia della barra laterale. Passando con il mouse sugli indicatori della barra laterale, accedi a utilissimi popup delle differenze.
SASS
L’evidenziazione è fondamentale per notare rapidamente errori e bug. Per gli sviluppatori, correggere gli errori in modo rapido ed efficiente è un must assoluto. SASS ti aiuta a farlo. Evidenzia la sintassi SASS e SCSS e aiuterà qualsiasi sviluppatore CSS che utilizza questi linguaggi di estensione.
GitHubinator
Coloro che utilizzano i repository GitHub/Bitbucket devono provare GitHubinator. Questo plugin mostra il testo selezionato sul repository remoto. Pertanto, il testo che stai cercando viene evidenziato e puoi semplicemente fare clic sul menu di scelta rapida per avviare la pagina Web corrispondente nel browser.
Come nel caso di altri plugin di Sublime Text qui elencati, GitHubinator aiuta gli sviluppatori a risparmiare tempo ed evitare azioni ripetitive.
GitOpenChangedFiles
Come puoi vedere, questo plugin viene utilizzato per aprire i file modificati da un repository Git. Devi semplicemente installarlo e avviare il plug-in per aprire i file che hai precedentemente modificato nel tuo ramo Sublime Text.
Non è un gran plugin, ma chi richiede questa funzione la troverà davvero molto utile.
terminale
Sai quanto dura il processo di apertura delle cartelle di progetto con Sublime Text. Terminale ti consente di aprire le cartelle direttamente da Sublime Text nella piattaforma con un solo tasto di scelta rapida. Non è conveniente?
Quando si eseguono righe di comando in una determinata cartella, è necessario eseguire alcuni passaggi che richiedono tempo e sono piuttosto stressanti. Il terminale riduce questi passaggi al tasto di scelta rapida CTRL + MAIUSC + T.
SublimeREPL
L’uso di SublimeREPL renderà il lavoro di un programmatore 10 volte più semplice. Questo plugin ti consente di eseguire interpreti dei linguaggi più comuni, inclusi NodeJS, Python, Ruby, Scala o Haskell.
Puoi eseguire un interprete in una qualsiasi di queste lingue e altro, direttamente da Sublime Text. Dai un’occhiata alle altre funzioni del plugin per una comprensione più approfondita di ciò che può fare.
Babele
Se hai bisogno di definizioni di lingua per ES6+ Javascript, dovresti usare Babel. Non molti plug-in Sublime Text offrono buone definizioni linguistiche, specialmente per la sua ultima versione. Babel è stato creato appositamente per Sublime Text 3 e non supporta le versioni precedenti. Supporta anche la sintassi React JSX.
TuttoCompletamento automatico
Per impostazione predefinita, Sublime Text utilizza l’opzione di completamento automatico solo sulle parole presenti nel file corrente. Per espandere questa funzionalità a tutti i file aperti, puoi utilizzare AllAutocomplete, un plug-in che ricerca ogni file che hai aperto e trova corrispondenze, suggerendo anche le parole.
CSSComb
CSSComb ordina le proprietà CSS in modo che il codice diventi più pulito e più facile da leggere. Mette il codice nell’ordine giusto e ti consente di personalizzare le sue proprietà senza troppi problemi. È un plug-in utile per coloro che lavorano in team in cui non tutti i membri scrivono codice nello stesso modo.
Anteprima Markdown
Molti sviluppatori sono abituati a creare file Markdown in GitHub, StackEdit o Markable, nel cloud. Se sei uno scrittore della vecchia scuola e preferisci conservare i tuoi file in locale, allora dovresti provare MarkdownPreview.
Puoi anche installare MarkdownEditing e avere il tuo codice Markdown evidenziato.
Blocco documenti
In alcune aziende, tutte le linee guida di codifica devono essere rispettate religiosamente. Questo può mettere sotto pressione le spalle degli sviluppatori. DocBlockr semplifica la creazione di commenti per il codice, l’analisi di funzioni, variabili o parametri e l’aggiunta automatica di elementi di base.
Dovrai solo digitare /e il plugin fa il lavoro per te.
Snippet CSS materializzati
MaterialiseCSSisa framework front-end memorabile creato da Google. È moderno, completamente reattivo e pronto per l’uso da parte di tutti i designer e sviluppatori. Questo plug-in Sublime Text ti aiuterà a utilizzare Materialise CSS all’interno dell’editor di testo con l’uso di frammenti comuni.
I frammenti CSS materializzati aggiungono componenti CSS direttamente nell’editor di codice, così puoi accedervi con i comandi di base. I frammenti CSS materializzati possono risparmiare un sacco di tempo ed energia che normalmente verrebbero assorbiti digitando manualmente la sintassi e aggiungendo componenti CSS separatamente.
Formato standard
Senza formattazione, il tuo codice apparirà disordinato e difficile da esaminare. StandardFormat ti consente di creare una base di codice molto più solida mentre aiuta le persone a leggere il tuo codice in modo più rapido ed efficace ogni volta che ne hanno bisogno.
Il plugin si basa sulla libreria Standard Format JS, che verrà applicata a ciò che scrivi. Tutti sanno come leggere il tradizionale formato JS, quindi questo plugin si rivela molto utile per gli sviluppatori.
Snippet di query multimediali CSS
Le media query vengono utilizzate per lo sviluppo di app e software per dispositivi mobili o dimensioni dello schermo scalabili. Senza queste query, non puoi trasformare il tuo progetto in uno compatibile con i dispositivi mobili.
CSS Media Query Snippets ha lo scopo di aiutarti in questo compito, offrendo modelli pre-scritti per le media query. Puoi semplicemente utilizzare il modello per apportare modifiche.
Shell Exec
Sappiamo tutti che l’accesso alla shell è un argomento controverso a causa delle configurazioni non sicure che i server avrebbero eseguito in passato. Cadere preda degli hacker era molto più comune quando era possibile accedere ai comandi Shell Exec dall’esterno, aprendo le vulnerabilità nella piattaforma.
Questo plugin ti aiuta a eseguire i comandi della shell all’interno di Sublime Text 3, considerando che Internet è molto più sicuro ora. È un buon modo per risparmiare tempo, ma non dimenticare di configurare le impostazioni del firewall e capire i modelli di accesso per evitare la suddetta situazione.
Laravel BladeHighlighter
Laravel è un framework open source per PHP e ha influenzato lo sviluppo di PHP in modo abbastanza visibile. Laravel utilizza Blade Engine, una sintassi che ti consente di sviluppare nuovo software oltre al framework.
Sublime Text non sarebbe lo stesso senza Laravel Blade Highlighter se usi Laravel quotidianamente. Con oltre 300.000 installazioni, questo plugin non può mancare a nessuno sviluppatore PHP.
Considerazioni finali su questi plug-in di testo sublime
Sublime Text è abbastanza forte da solo, ma plugin e pacchetti lo rendono ancora più potente. Il più grande vantaggio di questi plugin è di farti risparmiare tempo aiutandoti a personalizzare Sublime Text in base alle tue esigenze, ai tuoi requisiti e alle tue attività quotidiane.
Ogni sviluppatore preferisce una certa routine di codifica e puoi sostenere quella routine selezionando i plug-in Sublime Text che funzionano meglio per la tua situazione. Scegli quelli che hanno senso per il tuo modo di lavorare e il tuo lavoro. Ciò renderà tutto più efficiente e meno dispendioso in termini di tempo.
Buona fortuna con le tue attività di codifica!
Se ti è piaciuto leggere questo articolo sui plugin di Sublime Text, dovresti dare un’occhiata a questo sui temi di Sublime Text.
Abbiamo anche scritto di alcuni argomenti correlati come i migliori pacchetti Atom e come diventare uno sviluppatore front-end.