Справочници, самоучители, курсове, книги

• Online References

  1. w3schoolsсправочници + самоучители за повечето съвременни Уеб Технологии.
  2. Mozilla Web technology for developersизключително пълни и същевременно сбито представени справочници от Mozilla.

• Online Tutorials

  1. Learn to Code HTML & CSSдобре структурирани и представени уроци, обособени в два раздела: Beginners и Advanced.Съдържанието почти отговаря на книгата: "Learn to Code HTML & CSS the Book" от същия автор.
  2. TutorialRepublic - Learn the essentials of web development and build your own website.пълни, добре обяснени (с примери), тематично подредени справочници.
  3. TutorialsPoint - Web Tutorialsподобен на горния, но обхващащ повече теми свързани с Уеб програмиране.

• Online Courses

  1. coursera.org - безплатни (без сертификата) курсове от водещи университети
  2. Introduction to JavaScript @freecodecamp.org

• youtube channels

  1. (Просто потърсете и използвайте филтрите в Youtube, например така: Front End tutorial beginner.)
  2. LearnCode.academyПрофесионално създаден канал, с добре структурирано съдържание.
  3. DevTips For Designersизобилие от уроци за начинаещи и напреднали

• Free programming books

  1. You Don't Know JS (book series)Култова поредица! Едни от най-подробните, задълбочени и точни материали в областта.
  2. JS Books-The best free JavaScript resourcesкаталог с безплатни книги, който се ъпдейтва непрекъснато. Може да сортирате по категории (beginner, advanced)

WebDev Tools

• Code validators

  1. HTML validatorHTML (и не само) валидатор на W3C.
  2. CSS validatorCSS валидатор от W3C.

• Browsers support

  1. caniuse.comбързо и лесно можете да проверите какво от HTML/CSS/JS се поддържа от различните браузъри.

• Online CSS tools

  1. The ultimate CSS tools for web designers
  2. EnjoyCSS: Online CSS3 Code Generator With a Simple Graphical Interface

• Colour pallets generators

  1. coolors.coThe super fast color schemes generator!
  2. colourlovers.comCOLOURlovers: Color Trends + Palettes

WebSite mock-up/wireframing/sketching tools

• Online

  • Draw.ioOpen Source drawing tools. Provides components for Flowcharts, wireframes, mockups, UML, network diagrams, and more
  • NinjaMockcreate & share wireframe designs for Mobile and Web.

Свободни за използване ресурси

• CC Search - Creative Commonsпортал за търсене, който предлага удобен интерфейс към Google, Youtube, Flickr, и др. за търсене на съдържание публикувано под CreativeCommon(CC)

• Изображения

  1. pixabay.com - free high-quality imagesбогата колекция от качествени фотографии. С една от най-добрите вградени търсачки - може да търсите снимки по категория, размер, цвят и пр.
  2. unsplash.comFree (do whatever you want) high-resolution photos.
  3. freepik.comGraphic resources for everyone. More than a million free vectors, PSD, photos and free icon
  4. pexels.comFree stock photos you can use everywhere. ✓ Free for commercial use ✓ No attribution required.
  5. gratisography.comако ви трябват малко по-различни (е, не чак толкова колкото тези в deviantart) снимки, то артистът Ryan McGuire ви ги предоставя безплатно.
  6. PublicDomainPictures.netФотографии, рисунки, видеа - от потребители за потребители на мрежата.

• Videos

  1. Browse the Creative Commons licensed videos on Vimeoфайловете във vimeo, подредени според различните CC лицензи.
  2. youtube.com и др.посочете във филтъра при търсенето "CreativeCommons" (или използвайте търсачката: CC Search - Creative Commons)
  3. coverr.coкачествени, структурирани в категории видео клипове, който можете свободно да използвате за фон на вашата страница.

• Икони, символи, шрифтове

  1. CopyPasteCharacter.comако се налага да вмъкнете специален символ (от цялата unicode таблица) във вашата страница - това е най-лесният и удобният начин.
  2. Font-Awesome Iconsофициалния сайт в github. Показани са всички икони предлагани от Font-Awesome
  3. Google Developers- Google Fonts APIсправочник от Google за употребата на хостваните от тях шрифтове.
  4. GlyphSearchтърсене на икони по ключови думи във Font Awesome, Foundation, Glyphicons, IcoMoon, Ionicons, Material Design, and Octicons
  5. faiconsтърси по дума само във Font Awesome
  6. Your SVG + GIF + PNG Ajax Loading Iconsголяма част от иконите са платени, но се намират и безплатни.

Водещи сайтове с публикации за HTML/CSS/JS

• A List Apart: For People Who Make Websitesедин от първите, актуален и до днес, сайт с публикации (на изключително високо ниво) за разработка на Уеб сайтове, но фокусиран предимно в дизайна, UX/UI.
• CSS-Tricks: Tips, Tricks, and Techniques on using Cascading Style Sheetsби трябвало вече да сте попадали на материали публикувани тук. Със сигурност няма Web Developer, който да не е ползвал този сайт!

HTML5/Responsive templates

• HTML5 ★ BOILERPLATEHTML5 Boilerplate helps you build fast, robust, and adaptable web apps or sites.
• HTML5 BonesHTML5 Bones is a template that goes back to basics and provides you with the bare minimum required to get going with HTML5.
• TEMPLATED - CSS, HTML5 and Responsive Site Templatesмножество свободни и готови за използване HTML5/CSS3 шаблони(templates) с изчистен, модерен дизайн. И прекрасни като примери за самообучение.
• HTML5 UP! Responsive HTML5 and CSS3 Site Templatesподобен на горния.

VSCode

Полезни разширения (extensions)

• LiveServerLaunch a development local Server with live reload feature for static & dynamic pages
• HTMLHintVS Code integration for HTMLHint - A Static Code Analysis Tool for HTML
• Color Themes from the MarketplaceThe official docs section, which explains how to search, install and setup color themes

Клавишни комбинации

• 15 Great VS Code Keyboard Shortcuts

Задачи за упражнения. Тестове.

• JavaScript

  • JavaScript Examples @w3schools.comмножество примери, разделелни тематично, от добре познатият ни w3schools.com
  • JavaScript Exercises, Practice, Solution @w3resource.comоще повече примери и задачи (с решения) от w3resource.com (да не се бърка с w3schools.com)
  • JavaScript Examples @tutorialrepublic.comоще един от множеството сайтове - самоучители, в които са публикувани тематично разделени примери за основните понятия в JS
  • nodeschool.io - javascripting workshopLearn JavaScript by adventuring around in the terminal.
  • 7 Days of JavaScript in HackerRankползването на HackerRank платформата е почти задължително за всеки програмист, който работи онлайн. От тук може да започнете лесно и интересно с JavaScript.

Форуми, freelance сайтове

• Български

  1. Предприемач.com: Екстри - Webmaster ForumБългарски форум за предприемачи с доста активна WebDev секция.
  2. http://forums.bgdev.org/един от най-старите форуми за програмиране, с изключително активни и до днес WebDesign и Front-end Development секции, в които може да намерите не само помощ, но и предложения за работа/проекти.

• World-wide (in english)

  1. freelancer.comнай-известното място, където можете да намерите проекти, по които да работите като freelancer. Или пък да потърсите някой, който да реализира ваш проект.
  2. stackoverflow.com/мястото, където можете да получите помощ за всичко. Линкът тук е излишен - със сигурност сте попадали вече там.

Филми

• Project Code Rush - The Beginnings of Netscape / Mozilla Documentaryдокументален филм проследяващ живота на група инженери от Netscape (както и последните дни на компанията като независима), които основават проекта Mozilla open source.
• Silicon Valley - Official Website for the HBO Seriesкомедиен сериал, който макар и с измислени герои и сюжети, доста автентично илюстрира живота на програмисти, старт-ъп компании, корпоративни интереси и пр.
• The IT Crowdкултов сериал, който с типичения си Aнглийски хумор дефинира точно понятието IT geek.

Podcasts

• Тилда Наклонена Черта - Разговори за програмиране
• Nerds2Nerds - програмисти, които си говорят каквото си искат :), със силен акцент върху gaming-a.
• DEVCAST - community-driven подкаст на най-голямото онлайн dev community в България - DevBG