Weblabor

A sitebuilder élete nem csak játék és mese, az egyik legjobban kikopott gomb a billentyűzetén valószínűleg az F5 (vagy ízlés szerint Ctrl-R, ⌘-R). Pedig nem kell így lennie, a folyamatos CSS változtatások gyorsabb megtekintésére több lehetőség is van.

Alapból ha szerkesztjük a CSS fájlokat, akkor a böngészőben újra kell töltenünk az oldalt, hogy láthassuk változtatásaink eredményeit. Apróságokat jellemzően ki lehet próbálni a böngésző fejlesztői eszközeivel (példéul a Chrome-os beépítettre, vagy a Firefox Firebugjára gondolok), de a kedvenc editorunkban szerkesztés azért jellemzően kényelmesebb. Ebben a bejegyzésben négy eszközről is szó lesz:

• CSS reloader: kiterjesztés Firefox-hoz
• Vogue: node.js-es újratöltős megoldás
• LiveJS: AJAX-szal változások figyelése, újratöltés
• Backfire: a böngésző fejlesztői eszközeiben végzett változtatások szerverre mentése

CSS reloader

A CSS reloader egyszerű feladatra vállalkozik, és azt jól csinálja: az oldal újratöltése nélkül lehet az oldal CSS-eit betölteni. Windows alatt az F9 gombot is használhatjuk. Ez igazából nem tűnik egy hatalmas előrelépésnek az F5 gomb nyomkodásához képest, amit nyerhetünk vele, hogy akármilyen gyors is a fejlesztői környezetünk, az oldal előállításának idejét megspórolhatjuk. Hátránya ez: ablakváltásokat, gomb nyomkodásokat nem spórolunk.

Vogue

A Vogue egy Node.JS-ben írt mini szerver, melyet a saját gépen kell futtatni, és beinclude-olni a céloldalon. Figyeli a fájlok módosulását a fájlrendszeren, és ha módosul valamelyik, akkor beindít egy frissítést, az adott fájl befrissül a böngészőben (a beinclude-olt kódon keresztül).

Live.JS

A LiveJS egy szerver oldal nélküli megoldás, AJAX kéréseket indít folyamatosan a szerver felé HEAD kérésekkel, s ha azt látja, hogy változás volt, akkor újra tölti azokat. Ahhoz, hogy működésbe lépjen, nem kell csinálni sokat, csak beinclude-olni, sőt, bookmarklet is rendelkezésre áll, bármikor működésbe lehet állítani include-olás nélkül is.

Backfire

A Backfire egy igen érdekes módon működik: egy kis JavaScript könyvtár észleli a böngészőben végzett (Firebug, vagy hasonló eszköz által) módosításokat, elküldi azokat a szervernek, ami menteni tudja azokat. A szerver kód egy példa implementáció C#-ban, de más nyelven is implementálható. Vannak ismert hibái.

Összefoglalás

Mivel alapvetően most nem sitebuilderként dolgozom, ezért napi szinten egyik eszközt sem használom, de az egyik branchemben például bekötöttem a Live.JS-t (commit nélkül), és érdekes élmény. :) A Backfire-t nem próbáltam, de félnék a problémáitól, a másik két eszköz pedig jól működött, de annyira nem fogott meg. A problémára többféleképpen nehéz lenne választ adni, viszont a gyakorlott sitebuildereknek valószínűleg annyira ráállt már a kezük a megfelelő billentyűkombókra, hogy nehezen fog beépülni a napi gyakorlatukba bármelyik eszköz is.