Ресурси за уеб разработчици Мега-компилация

Интернет непрекъснато се разраства и има стотици хиляди колективни ресурси за бъдещите уеб разработчици. От онлайн статии, уроци, инструменти, ръководства, до видеоклипове, можете да научите почти всичко в мрежата. Наистина никога не е било по-лесно да скачате онлайн!

По-долу съм събрал огромна колекция от някои много полезни ресурси за уеб разработчици. Те включват материал за начинаещи за HTML5 / CSS3 заедно с по-сложни теории за JavaScript и PHP програмиране. Възможно е няколко ентусиазирани разработчици да изучават тези езици и да създават много популярни уеб приложения, подобни на Twitter или Tumblr. Ако проявявате интерес към полезни активи за съвременни уеб разработчици, тогава ще ви хареса това компилиране на надеждни ресурси.

Полезни онлайн списания

Светът на блоговете е избухнал със стотици хиляди нови писатели, които посещават интернет. Много от тези онлайн блогове са фокусирани върху дизайна и уеб разработките. Можете да намерите много полезни ресурси, като просто прелистите тези RSS емисии.

В зависимост от вида на езика, който кодирате, той ще определи интереса ви към някой от тези блогове. Можем да се съсредоточим върху уеб разработката и да приемем, че това включва всички предни крайни работи (HTML5 / CSS3 / JavaScript), както и прости скриптове (PHP / RoR / Python / SQL). Възползвах се от възможността да създам единен списък с най-популярните блогове, които се фокусират върху предния и задния код.

• Nettuts+
• 24 начина
• Webmonkey
• Разбиващо кодиране
• Webitect
• Инспектирай елемента
• Кодовете Котки
• Line25 Уеб Дизайн Блог

Със сигурност има много други, които да обмислят. Препоръчваме Ви да удряте Google в търсене на уроци и статии на предпочитания от вас език. След това, като използвате агрегатор за RSS емисии като Google Reader, можете да създадете списъци с най-новите статии от тези списания. Това е чудесен начин да започнете вашия работен ден, или дори да убиете малко време, което ви пречи чрез уроци.

jQuery Plugins Изобилие

Както ядрената библиотека на jQuery, така и jQuery Mobile спечелиха много сцепление през изминалата година. Тези библиотеки с отворен код работят, за да създадат интерфейс, богат на анимация и лесни за изпълнение функции на Ajax, макар че мобилната библиотека не е съвсем настигнала с родителите си по отношение на приставки и код на трети страни..

Също така друг фантастичен продукт bgStretcher може да бъде използван като динамичен фон. Това ще отнеме поредица от изображения и мащабиране на размерите пропорционално на резолюцията на екрана на потребителя. Разгледайте прекрасната демонстрация, за да видите това в действие. И двете от тези плъгини са безплатни за изтегляне и се държат като прости примери за страхотния код на трета страна, изграден от jQuery. Работата с тези ресурси ще ви спести много време за работа по проекта, за да не се налага да преоткривате колелото.

Като цяло препоръчвам също да разглеждате уебсайтовете Ajax Blender и Dynamic Drive за JavaScript кодови фрагменти / плъгини. Библиотеката не е огромна, но непрекъснато нараства от новото съдържание, представено от потребителя. Сайтовете включват не само плъгини jQuery, но и библиотеки MooTools и Prototype.

Ако свършите работа с библиотеката jQuery Mobile, искам да препоръчам друг инструмент jqmPhp. Това е динамичен PHP клас, където можете да се позовавате на прости функции за извеждане на линии и линии на HTML5 код, захранван от jQuery Mobile. Честно казано, това е най-лесният начин да се създадат прототипи на динамични мобилни приложения, изградени около PHP обвивка. Блогът на сайта има много примери за справки.

Сграда в HTML5 & CSS3

Когато говорим за web-разработката на предния край, обикновено става дума за ефективност. Нямате същите проблеми при създаването на уебсайт в HTML / CSS, както бихте кодирали Ruby приложението. Няма истинска логика или обработка на грешки в HTML - това е най-вече за това колко бързо можете да мащабирате правилно дизайна на оформлението във всички браузъри.

Първо трябва да започна, като препоръчам HTML5 Boilerplate. Това е оголен шаблон с голи кости, който включва всички “стандарт” Елементи на уеб страници в HTML5 в един пакет. Това включва стил по подразбиране, JavaScript, favicon, Apple touch икони и много други екстри. Това е 100% безплатен проект и дори можете да допринесете за репо Github. Това е задължителният ресурс за всички разработчици, преди да стартира сериозен уеб проект.

Сега, ако отработите този шаблон, тогава имате възможност да добавите целия си персонализиран код. Но предлагам да се направи следващата стъпка и да се изгради с приложение, като Initializr. Това ще генерира типично оформление на сайта и дори ще ви позволи да персонализирате елементите, които са включени в пакета ви. Кодът на Google Анализ, дефинираните файлове jQuery, .htaccess или web.config, както и около дузина други опции.

CSS Designers

Сега, след като погледнахме малко в HTML5 кодирането, трябва да разгледаме и някои от популярните CSS3 рамки. Те са по-отворени, отколкото HTML шаблони, тъй като можете да направите много повече с CSS. Дизайнерите също ще осъзнаят трудностите при изграждането на стандарти, отговарящи на изискванията за всички съвременни уеб браузъри.

Системата Golden Grid е фантастична като рамка за отзивчиви уеб проекти. Тези оформления ще се адаптират към мобилните екрани и ще се сгънат навътре, докато променяте размера на прозореца на браузъра. Той също така помага при планирането на ширината и размера на всяка област на колоната. Blueprint е друга удобна CSS рамка, която трябва да проверите. Това е чудесно решение за създаване на персонализирани сайтове и предлага фантастична документация.

Когато става въпрос за CSS инструменти, CSS3 PIE трябва да е в трите ми любими. Това е просто уеб приложение, което извежда правилния код за рендиране на CSS3 ефектите, поддържани в Internet Explorer 6-9. Можете да създавате динамични линейни градиенти, закръглени ъгли и сенки за кутии с възможност за персонализиране. Сайтът има примери за IE, ако искате да ги проверите.

Разработчиците също ще се стремят да намалят размера на своите файлове за производство. Clean CSS е един ресурс, където можете да избирате от многобройни опции, за да опростите кода си и да намалите размера на файла. Друг алтернативен код Beautifier не предлага толкова опции, колкото е по-лесен за използване.

Персонализиране на теми с WordPress

WordPress публикуването е лесно най-популярната CMS в тази епоха. Видяхме вероятно милиони нови блогове и уебсайтове, които се захранват от това фантастично решение за управление на съдържанието. И като такива, разработчиците на WordPress се нуждаят от изграждане на персонализирани приспособления и теми за уебсайтове.

Новата версия на Constellation Theme дава на разработчиците на WordPress по-лесна отправна точка от шаблоните по подразбиране. Новата тема Twenty Eleven е много хитра и минималистична, но не може да се конкурира с цял шаблон за тема, изграден върху HTML5Boilerplate. Темата за Constellation WP дори включва медийни заявки за различни резолюции на устройства, като таблети за iPhone и iPad.

Wonderflux е друг шаблон на WordPress тема, която не е толкова далеч в развитието. То беше наскоро освободен от бета версия в v1.0 заедно с някои онлайн документация. Тази тема е малко по-сложна от Constellation, която ви дава по-голям контрол върху оформлението. Разработчиците са включили потребителски PHP куки, функции и филтри, за да направят вашия WordPress сайт по-динамичен.

Сериозните разработчици на WP трябва да проверят и двете решения, за да видят дали някой от тях ще помогне за бъдещата работа по проекта.

Намиране на безплатни уеб разработчици

В сравнение с PSDs и графиките, уеб развитието на общността изглежда малко липсва в галерии за freebie. Винаги можете да намерите страхотни скриптове в Github, но често трябва да ги търсите и да ги изпробвате сами.

Трудно е да се намерят уебсайтове, които предлагат безплатни изтегляния и демонстрации, както и примери за скриптове. Любимият ми нов ресурс е CodeVisually, който каталогизира предоставените от потребителя инструменти за разработка, плъгини, библиотеки и други чисти неща. Оформлението е настроено като галерия, където всяка страница включва връзка към продукта, демо-скрийншот и някои допълнителни подробности.

Галерията включва стотици примери за HTML / HTML5 шаблонен код, CSS3 библиотеки и със сигурност много неща jQuery. Също така открих, че това е чудесен уебсайт, за да изпращате свой собствен отворен код на публиката. Вашето име е свързано с подаването, плюс можете да поставяте връзки към собствения си уебсайт, където потребителите могат да имат достъп до кода.

API на уеб приложения

Много популярна тенденция в модерното уеб разработване е изграждането на API като приложение на трета страна. Повечето от основните марки социални мрежи включват работещ API и сегмент за документация точно на техния уебсайт. Освен това има много тонове свободни класове на Github, написани на всички основни езици за програмиране.

Разработчиците трябва да се чувстват комфортно да работят с тези типове кодови библиотеки, тъй като те се увеличават в търсенето. С помощта на системата OAuth можете бързо да изградите потребителска база от много от тези приложения. По-долу съм посочил само няколко препратки към популярните онлайн API и пълната им документация.

• Twitter API
• API на CloudApp
• Instagr.am API
• eBay API
• API за Foursquare
• Dribbble API
• Github API

Възползвайте се от тези ресурси за нови проекти, когато е възможно. Мрежата става все по-свързана и потребителите винаги се стичат към следващото голямо приложение. Можете да наемете хиляди по-специални членове в приложението си, когато посетителите ви не трябва да регистрират нов профил и вместо това да се регистрират директно чрез Twitter или Facebook.

Ресурси за въпроси и отговори

Най-полезният опит между разработчиците е задаването на въпроси и изучаването на нови техники. Общността на разработчиците винаги е толкова полезна на новодошлите и желае да предложи своя опит в много ситуации. Ако имате някакви проблеми или конкретни въпроси по даден проект, потърсете чрез Google за свързан форум на уеб разработчика.

Аз лично трябва да препоръча да се присъедините към общността на Stack Exchange, ако вече не сте член. Това включва невероятни сайтове като Stack Overflow и Super User, където можете да получите помощ при програмирането на всичко. Членовете на общността са запознати с всички основни уеб езици, включително jQuery и по-малки PHP класове.

Чист трик, който научих, е да търся чрез Google и да видя дали проблемът ви вече е решен. Въведете няколко ключови думи в търсенето с Google и добавете суфикса сайт: stackoverflow.com. Всички върнати резултати от търсенето ще бъдат въпроси от архивите на препълването на Stack - ако имате късмет, може да намерите точно решението на проблема си.

Тестване на скоростта на страницата онлайн

Този нов инструмент, разработен от Google Developers, всъщност беше наистина впечатляващ. Приложението Page Speed ​​Online ще анализира съдържанието на уебсайта ви и ще генерира аналитичен отчет за скоростите ви. Това включва възможни решения за намаляване на времето за зареждане и за запазване на посетителите ви на сайта по-дълго.

Също така може да ви помогне да определите проблеми с нивата на отпадане и по-ниските реализации. Google Анализ е задължителен за всеки уебсайт, но считам, че Page Speed ​​достига по-високо ниво на анализ.

Изходът на доклада се класифицира от висок до нисък приоритет и често включва много различни елементи. Ако разбирате LAMP настройките и работите на Apache сървъри, можете да помислите и за модула mod_pagespeed. Той автоматично извършва много от тези оптимизации на уебсайта ви, за да намали времето за зареждане и да кешира важни уеб данни (изображения, икони, скриптове).

Най-добър софтуер на разработчика

Между двете най-популярни операционни системи можете да намерите десетки програми. От графичен софтуер до редактори на изходния код и IDE, има много ресурси, от които уеб разработчиците да избират. Но ако търсите популярни предложения, препоръчвам следните заглавия.

Mac OS X

Panic е софтуерна компания, която създаде Coda - най-доброто приложение за уеб разработка за Mac. Имате достъп до редактор на изходния код, терминал и FTP клиент, където можете да правите промени директно към файловете на сървъра. Coda допълнително поддържа дълъг списък от синтактично осветяване за езици като HTML, XML, CSS, JavaScript, PHP, SQL и много други..

Ако обаче имате нужда от безплатно решение, трябва да проверите Комодо Редактиране. Софтуерът е разработен за Windows и Mac, с отворен код и напълно свободен за изтегляне. Тя включва същата поддръжка за синтактично осветяване и много подобни функции като Coda (без FTP за съжаление). TextWrangler е друго безплатно решение, което може да искате да опитате, също и просто текстов редактор.

За безплатно приложение за FTP проверете Cyberduck в Mac App Store. Въпреки че лично аз предпочитам платена алтернатива като Yummy FTP или Transmit.

Microsoft Windows

Софтуерният пакет на Adobe винаги идва на ум, когато мислите за уеб дизайна и разработката. Потребителите на Windows имат много алтернативи на Dreamweaver и много от тях са напълно безплатни.

Notepad ++ е чудесен пример за софтуер с отворен код Win32. Проектът е все още в активна разработка и често издава актуализации (почти ежемесечно). Обичам интерфейса с раздели и поддръжка за толкова много допълнителни плъгини. Както споменах по-горе, Komodo Edit също се предлага за Windows XP / Vista / 7, така че можете да опитате това като алтернатива.

Уеб разработчиците на Windows също не са без FTP клиент. Filezilla е може би най-популярната безплатна алтернатива. За алтернативи проверете нашия безплатен списък с FTP клиенти заедно с подобни инструменти.

Други полезни ресурси за Dev

• 100 Основни инструменти за уеб разработки
• Най-доброто от 2011 г .: Най-полезни плъгини и уроци за jQuery
• Наръчници за начинаещи за уеб разработки
• 7 Вълнуващи тенденции в Web Development за 2011 година

заключение

Досега първото тримесечие на 2012 г. започна с гръм и трясък! Вече видяхме невероятно съдържание, което се излива от дизайнери и уеб разработчици от цял ​​свят. Професионалистите, които изграждат мрежата, разполагат с толкова много инструменти в сравнение с преди 1-2 години.

Надявам се, че тази огромна компилация от инструменти и ресурси ще прокара вашата методология за по-добро развитие. Обичам да работя с уеб разработчиците и непрекъснато да се запознавам с нови проекти. И все пак има толкова много място за нови ресурси, които можем да включим, така че съм сигурен, че съм пропуснал няколко скъпоценни камъка. Ако имате идеи или предложения за свързани ресурси за уеб разработчици, уведомете ни в зоната за дискусии.