Share
Molti di noi hanno già familiarità con la popolare utility di codifica Zen. Per coloro che non lo sono, trasforma il processo di creazione di markup complessi in un selettore simile a CSS. Questo può farti risparmiare una quantità straordinaria di tempo; tuttavia, ha alcune carenze. Fortunatamente, un altro strumento, Sparkup, ispirato a Zen Coding, rimedia a questi problemi e spinge la produttività ancora più in alto!
Considera il seguente markup:
Questo è un markup abbastanza comune che creerai per ogni nuovo sito web. Supponendo di non averlo già salvato come snippet, può essere facilmente ricreato in pochi secondi, con Zen Coding.
#container> nav> ul> li * 4
Accentsconagua
ids e classi con il # e . selettori. > per filtrare l'albero e creare elementi figli. * simbolo. + simbolo per creare fratelli. Sfortunatamente, ci sono alcuni problemi che ho con Zen Coding.
ul> li * 4 selettore, non sono a conoscenza di un modo per filtrare il backup su ul, e quindi creare un elemento fratello. innerHTML a un elemento. Non sarebbe bello se potessi digitare, ul> li Alcuni testi qui? linguetta tra una fermata e l'altra dopo l'espansione. Fortunatamente, un'utilità, ispirata a Zen Coding, risolve tutti i problemi sopra elencati. È compatibile con le versioni precedenti: ciò significa che tutte le tue conoscenze sul codice Zen verranno trasferite senza problemi.
Al momento della stesura di questo documento, Sparkup è disponibile per TextMate, Vim e per uso generale, tramite la riga di comando. È abbastanza semplice da installare. Per ulteriori informazioni, fare riferimento allo screencast qui sopra.
Con Sparkup possiamo risalire l'albero.
ul> li * 3> a < < + #contents
Nota come stiamo usando il < per risalire l'albero. Dal tag di ancoraggio, uno < ci porterà alla voce della lista, e un'altra ci riporterà alla lista non ordinata, a quel punto possiamo creare un fratello con la + simbolo. Molto utile!
Usando le parentesi graffe, possiamo assegnare valori, o innerHTML agli elementi che creiamo. Questa funzione era assolutamente necessaria.
ul> li> p Il mio testo qui
Il mio testo qui
Con Sparkup, possiamo linguetta oltre le fermate necessarie, in modo che possiamo inserire manualmente i nostri attributi / valori il più rapidamente possibile. Con MacVim, come mostrato nello screencast, puoi usare Controllo + N e Control + P per passare tra le fermate.
In questo modo, piuttosto che dover ricorrere a numerose pressioni di tasti direzionali, un singolo comando ti porterà dove devi essere. Fare riferimento allo screencast per un esempio.
Allora, cosa ne pensi? Farai il passaggio?
