15 kihagyhatatlan webes eszköz fejlesztőknek

Előző posztunkban 15 remek asztali alkalmazást mutattunk be, melyek jelentősen megkönnyíthetik, vagy felgyorsíthatják a mindennapos munkavégzést.

Ahogy ígértük, górcső alá vesszük a webes alkalmazásokat, és a böngészőkiegészítőket is, ezt a bejegyzést nekik szenteljük.

JSFiddle, CSSDeck

Kipróbálnál valamit gyorsan JavaScriptben, vagy CSS-ben, de nem akarsz a futtatási környezet kialakításával bíbelődni? Ott a JSFiddle, és a CSSDeck! Mindkét kis alkalmazás számos beállítási lehetőséget nyújt (framework, külső JS/CSS import, preprocesszorok, stb...), és azonnal láthatod a kódod eredményét.

Adobe Kuler

Az Adobe egy igazán egyszerű, de nagyszerű eszköze a Kuler, ahol egy "színkerék" segítségével generálhatunk magunknak egymással passzoló színekből palettát. Jól jöhet, ha hirtelen rádsóznak ilyen jellegű feladatokat, és nem tudod, hogyan kezdj hozzá.

explainshell.com

Ész nélkül, a TUT-módszertan (tutorialok alapján történő feladatvégzés :) ) alkalmazásával gépelsz be UNIX parancsokat, és nyugtalanít, hogy a kiadott parancs vajon épp felrobbantja-e a gépet, vagy csak beállít valamit a mail-szerveren? Másold be a parancsot az explainshell.com értelmezőjébe, és kiderül, hogy mit tettél. Szép, okos, hasznos.

Responsinator

A múltkor már ajánlottunk egy mobileszközöket emuláló tesztalkalmazást, MITE néven. A Responsinator nagy előnye asztali társához képest az, hogy ugyan nem képes annyi eszközön megmutatni a végeredményt, ellenben nincs is szüksége telepítésre. Csak simán gépeljétek be a tesztelni kívánt oldal címét, és máris láthatjátok, hogyan fog megjelenni a legnépszerűbb mobilokon és tableteken.

Typetester

Szomorú tény, hogy a különböző böngészők eltérő módszerrel, és emiatt eltérő kinézettel renderelik a szöveges tartalmakat. Ami jól néz ki Firefox-ban, az nem biztos, hogy Chrome-ban is ugyanolyan szép lesz. Ha gyorsan szeretnéd megnézni, hogy a különböző fontok közül melyik mutat a legjobban, mindegyik böngészőt figyelembe véve, akkor erre a Typetester a legjobb eszköz. Számos beállítási lehetőséggel rendelkezik, néhány Google Font-ot is kezel, és CSS-ben exportálhatóak a paraméterek.

Postman - REST Client

Webservice-ek tesztelése egyenesen a böngészőből? Igen, a Postman erre vállalkozik. Elmentheted a saját hívásaidat, különböző environment-eket definiálhatsz, egyszerűen kihagyhatatlan.

Web Developer Toolbar, Web Developer Checklist, XRAY

A Web Developer Toolbar ugyan nem mai találmány, és a legtöbb böngészőnek már nagyon jó beépített funkciói vannak a DOM manipulálására, ennek ellenére számos olyan funkcióval rendelkezik, ami jól jöhet frontend fejlesztés során. Hasonszőrű társa, a Web Developer Checklist azonban éppen abban erős, hogy olyan dolgokra hívja fel az adott szakember figyelmét (oldalsebesség, SEO tippek, közösségi integráció, kódminőség), amik nem feltétlenül tartoznak egy fejlesztés első köréhez.

Az XRAY leginkább a böngésző beépített fejlesztői eszközeinek, és a Web Developer Toolbar-nak egy érdekes elegye. Akinek csak arra van szüksége, hogy kattintás után lássa az adott elem tulajdonságait, annak elég lesz ez a kis segédeszköz is.

JSONView

Ha nem tudod első ránézésre értelmezni a "nyers" JSON-t, akkor megnyugtatunk: nem benned van a hiba. Van azonban megoldás, a JSONView. Elérhető Chrome-hoz, és Firefox-hoz is, színes, összecsukható, pont jó.

XML Tree

Funkcionalitásban némiképp a JSONView-ra hajaz az XML Tree is, azonban itt nem az olvashatóságon, hanem a használhatóságon van a hangsúly.

ColorZilla

A neve ne tévesszen meg senkit, a ColorZilla elérhető Chrome-hoz, és Firefox-hoz is. Egy adott oldal bármelyik pixelének a színét meg tudjuk vele határozni.

Screen Capture

A screenshot készítő programokkal Dunát lehetne rekeszteni, a személyes kedvencem azonban a Screen Capture nevű Chrome-kiegészítő. Pont azt tudja, amit kell, se többet, se kevesebbet, a képeken egyszerű ábrákat, vagy szöveget is elhelyezhetünk, ha szeretnénk.

Cache Killer & CacheToggle

Fejlesztés közben nagyon idegesítő tud lenni, ha a CSS, vagy a JS a gyorsítótárból kerül betöltésre (akár többszöri frissítés után is). Ha szeretnénk ideiglenesen kikapcsolni a böngésző gyorsítótárát, akkor erre a legjobb eszköz Chrome alatt a Cache Killer, Firefox-ban pedig a CacheToggle.

Kommentben most is várjuk a személyes kedvenceiteket!