Blog

8 užitočných nástrojov pre developerov

Learn2Code tím - 11.11.2014 - Tipy a triky

Webdeveloperi a dizajnéri majú radi aplikácie a nástroje, ktoré im uľahčujú vývoj webov a aplikácií. Ide o malé aplikácie alebo knižnice, ktoré väčšinou riešia jeden konkrétny problém. V nasledujúcom poste prinášame prehľad týchto šikovných nástrojov, ktoré uľahčujú prácu.

1. Sublime Text

Moderný a prehľadný textový editor pre programátorov. Medzi výhody patrí prispôsobiteľnosť a zvýrazňovanie syntaxe veľkého množstva súborov. Súčasná beta verzia Sublime Text 3 je dostupná pre OS X, Linux aj Windows. Sublime Text je možné bezplatne využívať v skúšobnej verzii, ktorá však oproti platenej nemá žiadne obmedzenie. Ak neberieme do úvahy občasné odklikávanie okna, ktoré upozorňuje na kúpu licencie (tá stojí 70 USD).

2. Trello

V súčasnosti existuje obrovské množstvo nástrojov na projektový manažment a tým zvyšovanie produktivity. Trello je bezplatný online nástroj pomocou ktorého je možné riadiť projekt, zadávať úlohy a kontrolovať ich plnenie, spolupracovať, tvoriť a robiť všetky potrebné projektové činnosti. Trello ponúka webovú a samozrejme aj mobilnú aplikáciu.  

3. Firebug


Firebug je rozšírenie prehliadača Mozilla Firefox a ponúka veľké množstvo webdeveloperských nástrojov a funkcií. Firebug má vstavaný JavaScript debugger, ktorý umožňuje prejsť celý váš skript ako aj zistiť, prečo je pomalý. Môžete ľahko nájsť HTML, CSS, JavaScript a XML chyby a dokonca umožňuje filtrovanie a  vyhľadávanie špecifických chýb. Ďalšou veľmi užitočnou funkciou je DOM Inspector panel, ktorý opisuje štruktúru web stránky. Táto funkcia je užitočná pokiaľ pracujete na veľkom webe alebo s aplikáciou, na ktorej ste začali nedávno pracovať.

4. 960 grid system

Snahou 960 grid systému je zjednodušiť workflow vývoja webových aplikácií poskytnutím bežne používaných rozmerov. Základ systému teda tvoria stĺpce v celkovej šírke 960 pixelov, ktoré sú rozdelené na 12 a 16 stĺpcov. 12 stĺpcový systém obsahuje stĺpce šírky 60px a 16 stĺpcový šírku 40px, každý stĺpec navyše obsahuje 10 pixelový margin vľavo a vpravo. 960 grid systém je vhodný pre rýchle prototypovanie, ale funguje dobre aj v produkčnom prostredí. Použitím tohto systému je možné si jednotlivé časti web rozdeliť tak, aby vždy pôsobili vyváženým dojmom. Podrobnejšie sa o tomto systéme dočítate v blogu od Six Revisions.

5. JSFiddle, CodePen, JS Bin

V posledných rokoch vzniklo niekoľko služieb pre rýchle testovanie HTML + CSS + JavaScript. Jedným z vôbec prvých takýchto služieb bol JSFiddle, ktorý nasledovali ďalšie podobné služby. jsfiddle ponúka testovanie akejkoľvek kombinácie HTML, CSS a JS. Výzor je jednoduchý, ale ponúka mnohé pokročilé funkcie, ako napr. Ajax simuláciu. Super frontend svojej služby ponúka CodePen, ktorý upozorňuje na populárne demá (tzv. pens). Okrem toho táto služba ponúka pokročilú funkcionalitu ako napr. shareovanie alebo embedovanie. Pro verzia (od 9 USD mesačne) okrem iného poskytuje pair-programming alebo cross-browser testovanie. Jednou z mála služieb, ktorá ponúka aj javascript konzolu, je JS Bin.

6. Mou

Mou je markdown editor pre web developerov. Ide o jednoduchý, ale efektívny nástroj, ktorý analyzuje markdown syntax. Poskytuje funkcie ako zvýrazňovanie syntaxe, automatické dokončovanie slov, rôzne úpravy textu, live preview, fullscreen mode, vlastné témy a HTML, CSS a PDF export a mnoho iného. Momentálne je dostupný len pre OS X, v prípade, že nemáte Mac, môžete využiť alternatívy ako napr. Dillinger alebo Markable.

7. Fontello

Vynikajúca služba pre webdeveloperov a dizajnérov. Jednoducho si len vyklikáte symboly, ktoré potrebujete a potom ich stiahnte. Používanie web fontov so symbolmi je populárne, viete si ich upravovať pomocou CSS a výhodou je aj nízky objem dát a rýchle načítanie.  Je možné stiahnuť aj celý set ikon z repozitára na GitHube.

8. Modernizr

Na detekciu mnohých vlastností HTML5 a CSS3 je vhodná javascriptová knižnica Modernizr (open-source MIT licencia). Pokiaľ ju chcete použiť, vložte na začiatok vašej webstránky do head-u script <script src="modernizr.min.js"></script>. 

Do tohto blogpostu sme vybrali len niekoľko aplikácií a nástrojov, existuje ich samozrejme oveľa viac a každý mesiac vznikajú nové. Určite máte tipy na ďalšie užitočné nástroje, podeľte sa o ne v komentároch. Na našom profile na Twitteri denne zdieľame tipy na šikovné novinky, aplikácie a tooly pre developerov a dizajnérov, tak nás follownite ;)



Logo facebook

Learn2Code tím

Učíme ľudí dizajnovať, robiť webstránky a programovať. Naše prezenčné kurzy nájdeš vo viacerých mestách na Slovensku a pomocou online kurzov sa môžeš vzdelávať z pohodlia domova.