Moro,
Onko joku testaillut Zen Codingia? Tämä video ainakin loksauttaa leuan lattiaan:
http://vimeo.com/7405114
Eli html-koodia voi kirjoittaa css-selektoreilla. Eli kirjoittamalla näin:
div#footer.bold
Generoituu koodi:
<div id="footer" class="bold"></div>
Plugaria löytyy vaikka mille:
http://code.google.com/p/zen-coding/
Jos toi toimii käytännössä, niin tehokkuus kaksinkertaistuu... ja lopun ajan voi juoda kahvia!
Zen coding
9 viestiä • Sivu 1/1
Re: Zen coding
Kirjoittaja Parasiitti » 13 Tammi 2010, 23:53
Juu, tulee käytettyä. Kun vaan osaa CSS-valitmet, niin tuon oppii minutissa. Keventää mukavasti lapiohommaosaston HTML:n kirjoittelua.
Re: Zen coding - Sparkup myös Vimille
Kirjoittaja orisinal » 14 Tammi 2010, 16:06
Zen Coding ei tainnut Vimiä tukea, mutta vastaava Vimiä ja TextMatea tukeva plugin on Sparkup.
http://github.com/rstacruz/sparkup
http://www.youtube.com/watch?v=Jw3jipcenKc
http://github.com/rstacruz/sparkup
http://www.youtube.com/watch?v=Jw3jipcenKc
Re: Zen coding
Kirjoittaja fuGii » 14 Tammi 2010, 17:37
Tuon vois ottaa testiin. Pitäs vaan löytää Dreamweaverille korvaaja(autocomplete rokkaa).
Re: Zen coding
Kirjoittaja Glen » 16 Kesä 2010, 13:22
Oli tullut kunnollinen plugari TextMatelle tästä, joten päätin ottaa testiin. Ja aivan loistava tapa kasata html:ää.
html:xs>#container>(#navigation>ul>li*5>a)+(#content>(#main)+(#secondary>.block*5))+#footer on aika paljon nopeampi kirjoittaa kuin vastaava "käsin" tai muokata valmiista pohjasta. Ja uusien blokkien luonti olemassaolevaan on todella nopeata. Eihän tuo tekstiä osaa täyttää mutta rakenteet kasautuvat todella näppärästi ainakin valikoita testatessa.
Esimerkiksi ul>(li*2>a)+(li*2>(a+ul>li*2>a))+li>a
Tunnustan, olen koodari ja tykkään tällaisista näennäiskryptististä merkkijonosarjoista, jotka avautuvat maagisesti järkeenkäyväksi rakenteeksi.
html:xs>#container>(#navigation>ul>li*5>a)+(#content>(#main)+(#secondary>.block*5))+#footer on aika paljon nopeampi kirjoittaa kuin vastaava "käsin" tai muokata valmiista pohjasta. Ja uusien blokkien luonti olemassaolevaan on todella nopeata. Eihän tuo tekstiä osaa täyttää mutta rakenteet kasautuvat todella näppärästi ainakin valikoita testatessa.
Esimerkiksi ul>(li*2>a)+(li*2>(a+ul>li*2>a))+li>a
Tunnustan, olen koodari ja tykkään tällaisista näennäiskryptististä merkkijonosarjoista, jotka avautuvat maagisesti järkeenkäyväksi rakenteeksi.
Re: Zen coding
Kirjoittaja wee » 16 Kesä 2010, 15:58
Glen kirjoitti:html:xs>#container>(#navigation>ul>li*5>a)+(#content>(#main)+(#secondary>.block*5))+#footer on aika paljon nopeampi kirjoittaa kuin vastaava "käsin" tai muokata valmiista pohjasta.
Loistava tuo syntaksi. Siitä saa helposti selville dokumentin rakenteen (ainakin uskoisin), vaikka ei ole zen codingia koskaan käyttänyt. Varmaankin CSS ja peruskoulumatikka riittää
Re: Zen coding
Kirjoittaja Glen » 16 Kesä 2010, 18:50
Puretaampa tuo syntaksi, jos vaikka kaikki sitä ei hoksaakkaan. Eli oletuksena zen tekee divejä, jollei toisin määrätä.
on
Tuossa on aika mielenkiintoisia oivalluksia noiden sisar- ja lapsielementtien suhteen. Esimerkiksi kohta
Paljon on tuon kanssa vielä opittavaa, jotta voisi ihan sataprosenttisesti käyttää. Harvemmin kuitenkaan tarvitsee kovin kummoisia asioita laajennella, yleensä yhden tai kahden tagin laajennus riittää. Tai jonkin blokin nopea monistus.
Sen verran tossa TM-bundlessa on vielä, että ympäröivän tagin pystyi poistamaan yhdellä komennolla. Lisäksi kuvan koon pystyy päivittämään komennolla, sisällön ympärille pystyy kasaamaan tagit ym. Kaikkinensa hyvin laaja päivitys muutenkin mainioon editoriin.
- Koodi: Valitse kaikki
html:xs>#container>(#navigation>ul>li*5>a)+(#content>(#main)+(#secondary>.block*5))+#footer
on
- Koodi: Valitse kaikki
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
</head>
<body>
<div id="container">
<div id="navigation">
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>
<div id="content">
<div id="main"></div>
<div id="secondary">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
</div>
<div id="footer"></div>
</div>
</body>
</html>
Tuossa on aika mielenkiintoisia oivalluksia noiden sisar- ja lapsielementtien suhteen. Esimerkiksi kohta
- Koodi: Valitse kaikki
#content>(#main)+(#secondary>.block*5)
- Koodi: Valitse kaikki
li.element_$*5
Paljon on tuon kanssa vielä opittavaa, jotta voisi ihan sataprosenttisesti käyttää. Harvemmin kuitenkaan tarvitsee kovin kummoisia asioita laajennella, yleensä yhden tai kahden tagin laajennus riittää. Tai jonkin blokin nopea monistus.
Sen verran tossa TM-bundlessa on vielä, että ympäröivän tagin pystyi poistamaan yhdellä komennolla. Lisäksi kuvan koon pystyy päivittämään komennolla, sisällön ympärille pystyy kasaamaan tagit ym. Kaikkinensa hyvin laaja päivitys muutenkin mainioon editoriin.
Re: Zen coding
Kirjoittaja Ucee » 27 Heinä 2010, 13:35
Kiitos tästä!
Plugari löytyi Codaan, ja pitääpä samalla ottaa tuo demossakin käytetty Espresso -editori testiin.
Plugari löytyi Codaan, ja pitääpä samalla ottaa tuo demossakin käytetty Espresso -editori testiin.
9 viestiä • Sivu 1/1