Web Developer Resources Mega-kompilace

Internet neustále roste a existují stovky tisíc kolektivních zdrojů pro nadcházející webové vývojáře. Od online článků, kurzů, nástrojů, průvodců až po videa se můžete dozvědět něco přes web. Nikdy nebylo snazší skočit online!

Níže jsem sestavil obrovskou sbírku některých velmi užitečných zdrojů webového vývojáře. Mezi ně patří materiál pro začátečníky pro HTML5 / CSS3 spolu s komplikovanějšími teoriemi pro JavaScript a PHP programování. Je možné, aby několik nadšených vývojářů studovalo tyto jazyky a vytvořilo divoce populární webové aplikace podobné Twitteru nebo Tumblr. Pokud máte zájem o užitečné prostředky pro moderní webové vývojáře, pak budete milovat tuto kompilaci důvěryhodných zdrojů.

Užitečné online časopisy

Svět blogů explodoval se stovkami tisíců nových spisovatelů na internetu. Mnoho z těchto online blogů se zaměřuje na design a vývoj webových aplikací. Můžete najít mnoho užitečných zdrojů tím, že jen listovat těmito RSS kanály.

V závislosti na tom, jaký typ jazyka kódujete, určí váš zájem o některý z těchto blogů. Můžeme se zaměřit na vývoj webu a předpokládáme, že to zahrnuje všechny front-endové práce (HTML5 / CSS3 / JavaScript) a jednoduché back-end skripty (PHP / RoR / Python / SQL). Dovolil jsem si vytvořit jediný seznam nejoblíbenějších blogů dev, které se zaměřují na kód front-end i back-end..

• Nettuts+
• 24 způsobů
• Webmonkey
• Rozbíjení kódování
• Webitect
• Zkontrolujte prvek
• Kočky Kdo Kód
• Line25 Web Design Blog

Určitě je třeba zvážit mnoho dalších. Doporučuji bít Google při hledání tutoriálů a článků o vašem preferovaném jazyce dev. Poté můžete pomocí agregátoru RSS kanálů, jako je Google Reader, nastavit seznamy všech nejnovějších článků z těchto časopisů. To je skvělý způsob, jak začít svůj pracovní den, nebo dokonce zabít trochu času chugging přes tutoriály.

jQuery Pluginy Galore

JQuery core library i jQuery Mobile získaly v uplynulém roce mnoho trakcí. Tyto knihovny s otevřeným zdrojovým kódem pracují na návrhu frontendového zážitku plného bohatých animací a snadno implementovatelných funkcí Ajaxu, ačkoli mobilní knihovna se s rodiči v oblasti zásuvných modulů a kódů třetích stran nedopustila..

Podobně další fantastický produkt bgStretcher lze použít jako dynamický skript na pozadí. To bude trvat řadu obrázků, a některé změny velikosti úměrně k rozlišení obrazovky uživatele. Podívejte se na úžasné demo, abyste to viděli v akci. Oba tyto pluginy jsou zdarma ke stažení a chovají se jako jednoduché příklady pro úžasný kód třetí strany, který je vypnut jQuery. Práce s těmito zdroji vám ušetří spoustu času na práci na projektu, takže nemusíte kolo znovu vynalézat.

Obecně také doporučuji procházení webových stránek Ajax Blender a Dynamic Drive pro JavaScriptové úryvky kódu / pluginy. Knihovna není obrovská, ale neustále roste z nového obsahu odeslaného uživatelem. Stránky obsahují nejen jQuery pluginy, ale také knihovny MooTools a Prototype.

Pokud skončíte s knihovnou jQuery Mobile, chci doporučit jiný nástroj jqmPhp. Jedná se o dynamickou PHP třídu, ve které můžete odkazovat na jednoduché funkce pro výstup řádků a řádků kódu HTML5 napájeného přes jQuery Mobile. Je to upřímně nejjednodušší způsob, jak prototypovat dynamické mobilní aplikace postavené na prostředí PHP. Blog webu má spoustu příkladných odkazů pro procházení.

Budování v HTML5 a CSS3

Když mluvíme o vývoji front-end webu, je to obecně o účinnosti. Nemáte stejné problémy při vytváření webové stránky v HTML / CSS, jak byste kódování back-end aplikace Ruby. V HTML neexistuje žádná reálná logika ani zpracování chyb - je to většinou o tom, jak rychle můžete správně upravovat návrh rozvržení ve všech prohlížečích.

Nejprve musím začít doporučením HTML5 Boilerplate. Jedná se o striped bare-kosti šablony, která obsahuje všechny “Standard” Prvky webové stránky HTML5 v jednom balíčku. To zahrnuje výchozí styl, JavaScript, favicon, ikony Apple touch a spoustu dalších dobrých věcí. Je to 100% bezplatný projekt a můžete dokonce přispět na jejich Github repo. To je nutné mít zdroj pro všechny vývojáře před zahájením na jakékoli vážné webového projektu.

Pokud nyní pracujete mimo tuto kotelnu, máte možnost přidat si vlastní kód. Ale doporučuji, aby se další krok a budování s aplikací, jako je Initializr. To bude generovat typické rozložení webové stránky a dokonce vám umožní přizpůsobit, které prvky jsou obsaženy v balíčku kotelny. K dispozici je kód služby Google Analytics, zhuštěné soubory jQuery, .htaccess nebo web.config, plus asi tucet dalších možností.

Návrháři CSS

Teď, když jsme se trochu podívali do HTML5 kódování, měli bychom také zvážit některé z populárních CSS3 frameworků. Ty jsou otevřenější než šablony HTML, protože s CSS můžete dělat mnohem více. Designéři si také uvědomí, že je obtížné vytvořit kód vyhovující standardům pro všechny moderní webové prohlížeče.

Systém Golden Grid je fantastický jako rámec pro citlivé webové návrhy. Tato rozvržení se přizpůsobí mobilním obrazovkám a při změně velikosti okna prohlížeče se skládají dovnitř. Pomáhá také při plánování šířky a velikosti každé oblasti sloupců. Blueprint je další šikovný CSS framework, který byste měli zkontrolovat. Je to skvělé pro budování vlastních webových stránek a nabízí fantastickou dokumentaci.

Pokud jde o nástroje CSS, musí být CSS3 PIE v mých třech nejoblíbenějších favoritech. Je to jednoduchá webová aplikace, která vydává správný kód pro vykreslení efektů CSS3 podporovaných v aplikaci Internet Explorer 6-9. Můžete vytvářet dynamické lineární přechody, zaoblené rohy a stíny s přizpůsobitelnými nastaveními. Místo má IE příklady, pokud chcete zkontrolovat je také.

Vývojáři se také budou snažit zmenšit velikost souborů pro výrobu. Clean CSS je jeden zdroj, kde si můžete vybrat z mnoha možností, jak zjednodušit kód a snížit velikost souboru. Další alternativní kód Beautifier nenabízí tolik možností, ale může být jednodušší.

Přizpůsobení témat pomocí aplikace WordPress

WordPress publikování je v této éře jednoduše nejoblíbenější CMS. Viděli jsme možná miliony nových blogů a webových stránek, které jsou poháněny tímto fantastickým řešením pro správu obsahu. A jako takové WordPress vývojáři jsou ve vysoké poptávce po budování vlastní widgety a webové stránky témata.

Nové vydání Téma Constellation dává vývojářům WordPress snadnější výchozí bod než výchozí šablony. Nové téma Twenty Eleven je velmi šikovné a minimalistické, ale nemůže soutěžit s celou šablonou motivů postavenou na vrcholu HTML5Boilerplate. Téma Constellation WP obsahuje i mediální dotazy pro různá rozlišení zařízení, jako jsou tablety iPhone a iPad.

Wonderflux je další WordPress téma šablony, která není zcela tak daleko ve vývoji. To bylo právě nedávno propuštěn z beta do v1.0 spolu s nějakou on-line dokumentace. Toto téma je o něco složitější než Constellation, což vám dává větší kontrolu nad rozvržením. Vývojáři zahrnuli vlastní háčky PHP, funkce a filtry, aby vaše stránky WordPress byly dynamičtější.

Seriózní vývojáři WP by měli prověřit obě řešení, aby zjistili, zda by jeden z nich pomohl při budoucí práci na projektu.

Hledání webového vývojáře Freebies

Ve srovnání s PSD a grafikou se komunita webového vývoje zdá být v galeriích freebie trochu postrádána. Vždy můžete najít skvělé skripty na Github, ale budete často muset hledat a testovat sami.

Je těžké najít webové stránky, které nabízejí zdarma ke stažení a dema, stejně jako příklady skriptů. Můj oblíbený nový zdroj je CodeVisually, který katalogizuje uživatelem navržené vývojové nástroje, pluginy, knihovny a další upravené věci. Rozložení je nastaveno jako galerie, kde každá stránka obsahuje odkaz na produkt, ukázku obrazovky a některé další podrobnosti.

Galerie obsahuje stovky příkladů kódu HTML / HTML5 šablony, knihoven CSS3 a jistě i spoustu věcí jQuery. Také jsem zjistil, je to skvělé webové stránky, aby předložily svůj vlastní open source kód pro veřejnost. Vaše jméno je vázáno na podání, a navíc můžete umístit odkazy na své vlastní webové stránky, kde mohou uživatelé přistupovat k kódu.

API webových aplikací

Velmi populární trend v moderní vývoj webových aplikací je stavět mimo API jako aplikace třetích stran. Většina běžných značek sociálních sítí zahrnuje pracovní rozhraní API a dokumentační segment přímo na svých webových stránkách. Kromě toho jsou tuny volných tříd na Githubu napsány ve všech hlavních back-end programovacích jazycích.

Vývojáři by se měli cítit pohodlně pracovat s těmito typy knihoven kódů, protože roste poptávka. Pomocí systému OAuth můžete rychle vytvořit uživatelskou základnu z mnoha těchto aplikací. Níže jsem uvedl jen několik odkazů na populární online API a jejich úplnou dokumentaci.

• Twitter API
• CloudApp API
• Instagr.am API
• eBay API
• Foursquare API
• Dribbble API
• Github API

Využijte těchto zdrojů na nové projekty, kdykoli je to možné. Web se stává stále více propojeným a uživatelé se stále hrnou do další velké aplikace. Do své aplikace můžete najímat tisíce dalších specializovaných členů, když vaši návštěvníci nemusí registrovat celý nový účet a mohou se místo toho zaregistrovat přímo prostřednictvím služby Twitter nebo Facebook.

Zdroje Q&A

Nejpřínosnější zkušeností mezi vývojáři je klást otázky a učit se novým technikám. Komunita developerů je vždy nováčkům tak ochotná a ochotná nabídnout své zkušenosti v mnoha situacích. Pokud máte nějaké problémy nebo konkrétní otázky týkající se projektu, prohledejte fórum Google pro související fórum webového vývojáře.

Osobně musím doporučit připojení ke komunitě Stack Exchange, pokud již nejste členem. To zahrnuje úžasné webové stránky, jako je Stack Overflow a Super User, kde můžete získat programovou pomoc v podstatě cokoliv. Členové komunity mají znalosti ve všech hlavních webových jazycích včetně jQuery a menších tříd PHP.

Úhledný trik, který jsem se naučil, je vyhledávat v Googlu a zjistit, zda váš problém již byl vyřešen. Do vyhledávání Google zadejte několik klíčových slov a připojte příponu site: stackoverflow.com. Všechny vrácené výsledky vyhledávání budou dotazy z archivu Stack Overflow - pokud budete mít štěstí, můžete přesně najít řešení aktuálního problému.

Testování rychlosti stránky online

Tento nový nástroj vydaný vývojáři Google byl skutečně opravdu působivý. Aplikace Rychlost stránek online analyzuje obsah vašich webových stránek a vygeneruje analytický přehled o vašich rychlostech. To zahrnuje možná řešení, která zkrátí dobu načítání a zajistí, že návštěvníci budou na webu delší dobu.

Může také pomoci určit problémy s mírou odchodů a nižší konverzí. Služba Google Analytics je nutností pro všechny webové stránky, ale domnívám se, že služba Page Speed ​​dosahuje vyšší úrovně analýzy.

Výstup zprávy je hodnocen z priorit s vysokou až nízkou hodnotou a často zahrnuje mnoho různých položek. Pokud rozumíte nastavení LAMP a pracujete na serverech Apache, můžete také zvážit modul mod_pagespeed. Automaticky provádí mnoho z těchto optimalizací na vašich webových stránkách, aby se snížily časy načítání a ukládala důležitá webová data do mezipaměti (obrázky, ikony, skripty)..

Nejlepší vývojářský software

Mezi dvěma nejoblíbenějšími operačními systémy najdete desítky programů. Od grafického softwaru po editory zdrojových kódů a IDE existuje mnoho zdrojů pro webové vývojáře, z nichž si mohou vybrat. Ale pokud hledáte populární návrhy, doporučuji následující tituly.

Mac OS X

Panic je softwarová společnost, která vytvořila Codu - zdaleka nejlepší webovou vývojovou aplikaci pro Mac. Máte přístup k editoru zdrojového kódu, terminálu a klientovi FTP, kde můžete provádět změny přímo na serverových souborech. Coda navíc podporuje dlouhý seznam zvýraznění syntaxe pro jazyky jako HTML, XML, CSS, JavaScript, PHP, SQL a mnoho dalších.

Pokud však potřebujete bezplatné řešení, měli byste se podívat na Komodo Edit. Tento software je vyvinut pro Windows a Mac, open source, a zcela zdarma ke stažení. Zahrnuje stejnou podporu pro zvýraznění syntaxe a spoustu podobných funkcí jako Coda (bohužel bohužel ne FTP). TextWrangler je další bezplatné řešení, které můžete zkusit, také jen jednoduchý textový editor.

Pro bezplatnou aplikaci FTP se podívejte na Cyberduck na Mac App Store. I když osobně dávám přednost placené alternativě, jako je mňam FTP nebo přenos.

Microsoft Windows

Sada softwaru Adobe vždy přijde na mysl, když přemýšlíte o návrhu a vývoji webu. Uživatelé systému Windows mají k Dreamweaveru mnoho alternativ a mnoho z nich je zcela zdarma.

Notepad ++ je skvělým příkladem nějakého open source softwaru Win32. Projekt je stále v aktivním vývoji a pravidelně (téměř měsíčně) aktualizuje. Miluji jejich tabbed rozhraní a podporu pro tolik dalších pluginů. Jak jsem zmínil výše, Komodo Edit je také nabízen pro Windows XP / Vista / 7, takže si to můžete zkusit jako alternativu.

Weboví vývojáři v systému Windows nejsou ani bez klienta FTP. Filezilla je pravděpodobně nejoblíbenější volnou alternativou. Pro alternativy, podívejte se na náš bezplatný seznam klientů FTP spolu s podobnými nástroji.

Další užitečné Dev zdroje

• 100 Základní nástroje pro vývoj webu
• Nejlepší z roku 2011: Nejlepší užitečné jQuery pluginy a návody
• Ruby on Rails Návody pro začátečníky pro vývoj webových aplikací
• 7 Vzrušující trendy vývoje webu pro rok 2011

Závěr

Zatím první čtvrtletí roku 2012 začalo s třeskem! Už jsme viděli nějaký úžasný obsah, který vylévá z návrhářů a webových vývojářů z celého světa. Profesionálové, kteří staví na webu, mají v porovnání s 1-2 lety k dispozici tolik nástrojů.

Doufám, že tato obrovská kompilace nástrojů a zdrojů bude prosazovat vaši metodologii pro lepší rozvoj. Mám rád práci s webovými vývojáři a neustále se seznamuji s novými projekty. Přesto je zde jen tolik místa pro nové zdroje, které můžeme zahrnout, takže jsem povinen vynechat pár drahokamů. Máte-li nápady nebo návrhy pro související zdroje webového vývojáře, dejte nám vědět v oblasti po diskusi.