Как эффективно переучиться на веб-разработчика?
=================================================

 Всем привет.  

  

Имею большое желание освоить веб-разработку на профессиональном уровне. Опыт программирования имею, в таких вещах как, например, ООП, программирование мультипоточных приложений, клиент-серверное взаимодействие, разбираюсь.  

Проблема в том, что с вебом раньше не имел практически никакого дела. Использовал разок libcurl да в курсе азов HTML. В остальном опыт сводился к чисто десктопным/серверным вещам, по большей части на С++ и С.  

  

В идеале хочется достичь такого уровня компетенции, который позволил бы грамотно создавать с нуля веб-сервисы любой степени сложности. То есть, как клиентскую, так и серверную части. Но готов несколько пожертвовать идеалом в плане клиентской части и ограничиться знаниями, которых было бы достаточно для осведомлённости обо всех современных трендах/техниках в данной области, общения с профильным специалистом, понимания плюсов и минусов предлагаемых им решений для конкретных задач и, при необходимости, возможности быстро добрать требуемые технические знания из интернета.  

  

Собственно, вопрос на самом деле представляет из себя два вопроса, скрывающиеся в ключевых словах «как» и «эффективно»:  

  

1. *Какие именно знания мне требуются для достижения заявленных целей?*  

  

Из очевидного, это как минимум HTML/CSS/JS по клиентской части, плюс хотя бы один скриптовый язык типа PHP/Python/Ruby и хотя бы одна СУБД типа Postgres для серверной части.  

Однако даже я понимаю, что этого нынче мало. Клиентская разработка нынче редко обходится без всяких шаблонизаторов типа HAML/SASS и JS-библиотек типа jQuery, а для эффективной серверной разработки всё и того сложнее: фреймворки, ORM, continuous integration, очереди задач и прочая-прочая.  

  

Но про все эти штуки я знаю лишь очень поверхностно, чисто благодаря собственному любопытству, общению с веб-разработчиками и, не в последнюю очередь, Хабру. Эти знания разрозненны и урывочны. Хочется обрести цельную картину того, чем сейчас живёт мир веб-программирования, и освоить всё мало-мальски важное на достойном уровне.  

  

2. *Как именно и где именно черпать необходимые знания?*  

  

Пытаясь решить эту проблему с привычной для себя фундаментальностью, я начал с базовой и при этом казавшейся мне максимально независимой вещи — с HTML. И сразу же понял, какое тут непаханое поле. Ибо нужно начать с HTML4, чтобы понимать, чем индустрия жила последние десять лет, и тут выясняется что HTML — это не вещь в себе, а SGML-based язык, то есть здравствуй копание дальше к корням и здравствуйте новые подводные камни. К примеру, я до конца так и не смог разобраться во всех отличиях CDATA от PCDATA — просто в силу того, что не смог найти исчерпывающие определения той и другой сущности, лишь обрывки.  

А ведь это лишь вершина айсберга. Спецификация HTML — всего лишь ориентир для разработчиков браузеров, и каждый реализует поддержку HTML с той или иной степенью вольности. Плюс есть уже и HTML5, который, ещё не став рекомендацией W3C, уже внедряется в браузеры, и опять в разной степени. К тому же, HTML5 ещё активно развивается, и что-то меняется прямо на ходу. А есть ещё и XHTML, который тоже имеет свои отличия…  

  

В общем, решая эту задачу в лоб, читая спецификации, я рискую закопаться настолько глубоко, что информация будет устаревать и терять актуальность быстрее, чем я буду её усваивать.  

В поисках онлайн-самоучителей по тому же HTML, я находил сайты типа w3schools.com или htmlbook.ru. «Неприглядные» низкоуровневые подробности там опускаются, что, конечно, позволяет сфокусироваться на более прикладных вещах. Но знания получаются несистемными, больше на уровне «этот элемент для этого, а этот для этого». Плюс, на StackOverflow часто пишут, что w3schools порой откровенно врёт в своих материалах, что даже привело к появлению сайтов типа [w3fools.com](http://w3fools.com/).  

  

В многообразии ресурсов, сулящих тебе качественные знания, несложно запутаться. А не имея с самого начала хорошей базы, тяжело отличить качественный ресурс от ресурса, лишь притворяющегося таковым. Плюс, это всё теория, а теория и практика, как водится, весьма рознятся.  

Я лично с радостью бы получал знания по вышеописанным вопросам в процессе трудовой деятельности. Проблема лишь в том, что мало кому нужен работник, которого нужно предварительно обучить, прежде чем он начнёт приносить пользу, даже если он согласен работать за смешные деньги.  

  

Поэтому я хочу обратиться к тем из вас, кто считает себя профессиональным веб-разработчиком, с просьбой поделиться своим мнением относительно того, знание каких веб-технологий нынче максимально приоритетно, и каковы, по-вашему, эффективные методы их изучения.  

  

Спасибо! 

 Вообще, не увлекайтесь спецификациями. Марк Цукерберг как-то без них обошелся. Google тоже не следует строгим стандартам.   

  

Если вы хотите «эффективно» изучить матеиал, тогда вы должны читать статьи «для чайников» (которые вы с вашим опытом, наверняка освоите за кратчайшее время). HTML/CSS так устроены, что даже если вы сделаете 100 ошибок на странице, он все равно как-нибудь да отобразится. Ну если вы хотите более солидные знания, то параллельно смотрите непонятные моменты в спецификациях, это в общем-то полезно. А сэкономленное время посвятите практике. Она тут очень важна.  

  

Вот, что стоит изучить (в любом порядке):  

  

1) Начните с основ HTTP (только ради бога, не читайте спецификацию целиком, хватит общего представления о методах запросов, заголовках и теле запроса, кодах ответа 403/404/500/200/300)  

2) Изучите основы HTML (есть раздел на сайте htmlbook). SGML вам хватит в том объеме, в котором он упоминается в спецификации HTML. PCDATA не упоминается в ней и потому знать про отличия от CDATA вам не нужно (ну если так хотите узнать, найдите спецификацию SGML и почитайте).  

  

Обратите внимание, в некоторых (некачественных) статьях вы можете увидеть штуки вроде [br /] — самозакрывающиеся теги. Это ошибочный синтаксис, который употребляют авторы, путающие HTML и XHTML. В HTML такого синтаксиса нет (хотя в силу своей толерантности к ошибкам в HTML такой код как-то работает).   

  

3) Изучите CSS и позиционирование элементов. Вот хороший учебник, разъясняющий тонкости всяких флоатов: [softwaremaniacs.org/blog/category/primer/](http://softwaremaniacs.org/blog/category/primer/) А спецификацию CSS2.1, думаю, вы нагуглите сами, она довольно понятно написана.  

  

4) Изучите яваскрипт (да, включая замыкания и прототипы) и DOM. Обратите внимание, jQuery — лишь обертка над DOM и не зная DOM, вы не сможете нормально пользоваться jQuery, вы лишь научитесь копипастить скрипты из интернета, не понимая, как они работают. После этого можете изучать jQuery, заодно советую заглянуть в исходный код, а не только читать документацию.   

  

5) Изучите один из серверных языков, хотя бы основы  

  

6) Изучите основы SQL   

  

7) Начинайте что-нибудь делать, так как в этот момент у вас будет очень много теоретических знаний и очень мало практических. Можете сделать простое веб-приложение, можете улучшить какое-нибудь существующее.  

  

8) Изучите ООП  

  

9) Изучите какой-нибудь серверный MVC-фреймворк  

  

В общем, я думаю, стоит изучить базовые технологии, и приобретать практические навыки, а дальше неизвестно, понадобится ли вам HAML или что-то еще. Большинство упомянутых вами технологий изучать необязательно. Изучать надо то, что вам нужно для решения задачи, а не все подряд (иначе на это могут уйти года).  

  

> А есть ещё и XHTML, который тоже имеет свои отличия…  

  

Его уже нет, его никто не будет развивать и использовать, более того, и раньше многие использовали не XHTML, а лишь похожий на XHTML синтаксис (в частности самозакрывающиеся теги), а на деле писали HTML. Вы можете изучить его, но только ради любопытства, а не ради практической пользы.  

  

> Клиентская разработка нынче редко обходится без всяких шаблонизаторов типа HAML/SASS   

  

Вы еще Coffescript забыли упомянуть. Это очень спорные вещи, есть мнения как за, так и против. Но в любом случае, согласитесь, как-то странно изучать SASS, не изучив вначале CSS, верно? Начинающему это не нужно.  

  

> а для эффективной серверной разработки всё и того сложнее: фреймворки, ORM, continuous integration, очереди задач и прочая-прочая.  

  

Для приложения из 3 страниц все это не нужно. Сложные технологии нужны в больших и огромных проектах, начинать можно и без них. И более того, не имея определенного опыта работы с кодом, вы вряд ли поймете, зачем это нужно. А когда понадобятся, тогда и изучите.  

  

По вопросу, где брать информацию: авторитетные источники (для поиска ответа во всех подробностях) — это спецификации W3C, официальная документация фреймворков, неофициальные источники вроде htmlbook, stackoverflow или Хабра — для того, чтобы быстро получить представление о тех или иных возможностях HTML. Еще можете какую-нибудь книгу почитать, только не старую. 

 В веб-разработке клиентской и серверной частью как правило занимаются разные люди с разным набором скиллов. Стать профи в обоих направлениях сразу — задача непростая. Вам наверное проще будет начать с серверной части. Начинайте сразу работать с каким-нибудь фреймворком, не теряйте время на ерунду. Мой субъективный совет — джанго или рельсы. А для клиентской части думаю для начала хватит Bootstrap, jQuery и jQueryUI. 

 как-то Вы заморочились на спецификации HTML — всё гораздо проще :)  

Рекомендую попробовать связку PHP-fpm + PostgreSQL + Redis + Nginx + AngularJS + Twitter Bootstrap.  

Ещё можно написать чат какой-нибудь, там слово «PostgreSQL» заменяете на NodeJS в этом уравнении и всё :)  

Наверняка в комментариях высыпят фанаты модных трендов вроде рельс — я не против рельс, не против питона, но я не могу рекомендовать вещи, в которых сам не опытен :) 

 Как я обычно советую людям изучать веб-технологии:  

  

1. Разобраться в принципах работы HTML и CSS, завести справочник по тегам/свойствам и больше к этому не возвращаться. С тонкостями разбираться лучше по мере возникновения необходимости. Вообще, всю теорию HTMLя можно уместить на двух листках А4 11м шрифтом.  

  

2. Изучить какой-нибудь из серверных языков: PHP, Python, Ruby, можно и NodeJS, но тогда лучше сначала разобраться хотя бы с основами JS. Причем не стоит сразу использовать фреймворки — для начала написать что-нибудь простое, типа «4 странички с текстом из базы + комментарии на них». Затем попробовать реализовать MVC на том же проекте. Сделать авторизацию, админку и т. д.  

  

3. Вернуться к фронт-энд части и сделать ее более динамичной — это сначала чистый JS, а потом и JQuery или Blackbone, или что вам еще понравится. Разобраться с AJAX, написать чат на нем, например. Попробовать фронт-фреймворки, LESS, SASS и т. п.  

  

4. Опять бэк-энд. Ставим фреймворк, к которому душа лежит, и пытаемся сделать какой-либо сложный проект.  

  

5. Тут вы уже сами поймете что делать ;) 

 Из языков, вам наверно проще будет выучить C# (asp). Так как уже большой опыт работы с С.  

Из попсовых и сильно востребованных (чаще ищут работодатели) это пхп. Правда после того же пхп, попробовав тот же питон или руби, уже назад не тянет. Говорю по личному опыту.  

  

Учиться проще всего:  

1. Прочитать 1-2 книги по языку, попробовать самому на коленке создать сайт небольшой (второй гугл не надо, хватит и сайта-визитки). Потом попробовать его же на фреймворке под язык.  

2. Быстрее всего осваивается язык на реальных задачах. Так как рынок программистов сейчас всёравно не до конца заполнен. Не вижу проблемы устроится в среднюю компанию по созданию сайтов. И там за пол годика наработать и практику и «портфолио». Это проще чем искать заказы на фриланс. И боятся студий не стоит. Порой туда вообще с нуливыми знаниями берут, было бы желание. Так как заказов много, а специалистов мало. 

  

p.s. Прямо сейчас завершаю проект. который делался на незнакомых angularjs, nodejs + express, mongodb (работал раньше). Так что освет опробовал на себе, до сих пор все доки на технологиям не освоил, зато проект делается без проблем и освоил кучу недокументированных возможностей и косяков, а опыт с работой с mongodb в php мне только мешал. 

 Ruby / Ruby on Rails - Все просто. И свои знания не потеряете. И новым научитесь довольно быстро. 

 А если у вас энетрпрайзные приолжения, то рекомендую посмотреть в сторону джавы — не просто так именно она является самым популярным языком в энтерпрайз среде. И еще в ней есть фреймворки, которые позволяют писать клиентсайд ничего не зная про HTML и jQuery. 

 Я бы посоветовал пройти курсы на [www.codecademy.com/](http://www.codecademy.com/)  

Стоит пройти HTML, CSS, JS, Jquery, Projects, Php.  

После этого картина станет вполне целостной и уже можно будет браться за реальные задания.  

И не нужно зацикливаться на тонкостях HTML или JS, это даже вредно. Главное — понимать общую суть и уметь пользоваться справочниками, а остальное приобретается с опытом. 

 На самом деле всё просто, вам нужно много практики, теория это прекрасно, но часто бывает что даже в теории ошибки, когда начинаешь проверять то что прочитал.  

Где брать практику, как выше советуют сайты «визитки» не стоит. Да вообще фриланс для изучения чему-то не очень хорошее место, задачи там однотипные и уровень на начальном этапе всегда низкий. Я бы посоветовал конкурсы для разработчиков, их можно найти в рунете, участников обычно мало, задачи интересные и призы часто деньгами и не очень сложно как кажется. Я участсвовал от микрософта успешно, участвовал в конкурсе яндекс денег, был единственный участник =) И сейчас [techday.insales.ru/page/1million](http://techday.insales.ru/page/1million), но заявки там уже закончили принимать пару недель назад.  

Хороший опыт поковырять html5 игры, неделю назад здесь человек писал [habrahabr.ru/qa/36347/](http://habrahabr.ru/qa/36347/). А если многопользовательская, то вы окунётесь в полный комплект актуальных технологий, как со стороны сервера так и клиента. 

 Приходите к нам работать за опыт и стипендию — переучим. :)  

  

Году в 2006 помню взял студента на 12000р в обучение, в 2007-2008 парень учась все еще в институте уже в районе 50 000р. в среднем в месяц поднимал.   

  

Очень многое в этом деле зависит от наставников в том числе и задач. Важно быть на передовом фланге. 

 Почитал ответы. Немного подумал и решил кое-что добавить.  
  

Не паникуйте. Веб-разработка мало отличается от десктопной разработки. Да, именно так. :) Это тоже самое, но совсем чуть чуть иначе. Вы же представляете как работает любая программа? Стандартное, самое простое, разделение это UI и логика. Так вот, написание логики веб-приложения не отличается от написания логики декстопного приложения. Основные различия это UI, хранение данные сеанса и точка входа в логику вашего приложения. Т.е. если раньше для получения доступа к логики вы просто дергали метод вашего класса (если C++), то сейчас вы просто будете отправлять сообщение из браузера (или любого другого клиента) на сервер, если логика на сервере. Если раньше вы могли хранить все данные в памяти десктопного приложения, то сейчас данные и логика будут размазаны между сервером и клиентом (опять таки зависит от "толстости" клиента, посмотрите что такое тонкий и толстый клиенты). Ну и конечно UI. Тут HTML + JS + CSS.  
  

Стэк технологий вам пока не нужен. Не думайте о технологиях (хотя, правды ради, большинство технологий, которые вы перечислили используются и в desktop приложениях 
> фреймворки, ORM, continuous integration, очереди задач и прочая-прочая

). Возьмите просто платформу любую и работайте на ней. Возьмите руби на рельсах. Или советую Asp.Net MVC 4 (5). Да ограничиваетесь только виндой, но зато все просто и .net очень богатая платформа а C# отличный язык.