В каком порядке изучать front-end (и не только) технологии?

Question

[Владимир]

Доброго времени суток.
Помогите разобраться во всем современном многообразии инструментов веб разработки.

Мне 22 года работю толи front-end-ом, толи верстальщиком, толи не знаю кем) уже года так 3-4. Сначала как фрилансер, последнее время в маленькой конторке.

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

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

По моим оценкам на данный момент хорошо знаю:

• HTML
  
• CSS
  
• Wordpress
  

Так себе знаю:

• Git
  
• JS
  
• JQuery
  
• PHP
  
• 1С Битрикс
  

И вот что я бы хотел изучить плюсом к предыдущему списку:

• HTML5
  
• CSS3
  
• SVG
  
• БЭМ
  
• Jade
  
• SASS
  
• Bootstrap или Foundation
  
• GULP
  
• RegExp
  
• ES6
  
• ReactJS
  
• Redux
  
• ООП
  
• MySQL
  
• MongoDB
  
• NodeJS
  
• Ruby
  
• Ruby on Rails
  

Помогите расположить это все в нужном порядке.
Если посоветуете добавить в этот список что-то или убрать буду признателен. Для наводки в общем я бы хотел 100% подходить под senior front-end, и дополнительно хотел бы быть способным в одиночку (пусть и за долго) написать сервис, ну допустим, приложение менеджер задач с заметками включая front и back end. Заранее спасибо за советы)

Answer 1

[gleendo]

Roadmap to becoming a web developer in 2017

Comments

[Владимир]

Спасибо! очень ценная информация для меня)

Answer 2

[Полина Емельянова]

Владимир - ВПЕРЕД!!!
Тут вам и чем падаван отличается от ждедая, и чего знать надо и в каком порядке можно изучать. НО скажу вам по секрету- нет лучшего учителя, чем практика! Простите, но уходите из "конторки" и окунайтесь в реальный мир - берите большой проект и верстайте, верстайте, верстайте!!!

Удачи и упорства!

Comments

[Владимир]

Спасибо, Полина!)

Answer 3

[Сергей delphinpro]

За три-четыре года первые 10 пунктов из вашего "хотел бы" уже надо бы знать...

Comments

[Владимир]

Это мне известно. Дело тут в том что я клепал однотипные сайты для местных заказчиков, во время того как в университете 4 года изучал экономику, а серьезно начал работать только пол года назад, после долгожданного окончания универа.

[Сергей delphinpro]

ну давайте по-порядку
html5 - пробежался по спеке (или htmlbook.ru), посмотрел какие теги есть, для чего они - пара вечеров. По мере надобности подглядываем в справочник, незачем зубрить.
css3 - то же самое
svg - тут не так просто, но тоже зубрить незачем. есть задача - погуглил, нашел решение, в памяти отложилось.
БЭМ - тут вообще на пару часов почитать https://ru.bem.info/
Jade - полистал документацию, посмотрел примеры, попробовал простые конструкции. Всё, ты знаешь jade. При необходимости подглядываешь в справочник.
sass/less/stylus - аналогично
bootstrap/foundation/materialize - полистал документацию, посмотрел примеры, попробовал простые конструкции. Всё, ты знаешь фреймворк. При необходимости подглядываешь в справочник.
gulp - ну тут сложно. шучу. на первых порах тебе не надо досконально знать как он работает. Посмотрел доку, посмотрел примеры, (можно еще скринкаст Кантора просмотреть, там хорошо о предмете рассказывается), попробовал написать пару простых тасков, всё, этого достаточно для работы. При необходимости решения более сложных задач гуглим, в памяти откладывается.
RegExp - для многих сложная тема, но на самом деле всё оч просто. Нужно почитать и разобраться как они работают, что значат все эти каракули. Делов - на пару вечеров. При необходимости подглядываем в справочник. Я для себя распечатывал cheat sheet когда впервые знакомился с регулярками. Один раз выучил - используешь знания в любом языке, отличий практически нет.
ES6 - просто несколько плюшек поверх "обычного" джаваскрипта. тут конечно придется посидеть.
Вот остальное в списке уже за пару вечеров не освоишь.

[Владимир]

Спасибо! очень полезная информация по длительности изучения.
Пожалуй начну именно с этих вещей

Answer 4

[Александр Петров]

Привет. Мой личный опыт и рекомендации. Не истина, но можешь ориентироваться)))

HTML - +
CSS - +
Wordpress - забудь вообще. wp на мой взгляд создавался для блогов и пусть люди делают на нем блоги, все что идет дальше по функционалу - это извращение.

Так себе знаю:
Git - нужная вещь для командной работы и для "выкладывания" своих проектов на сервер, чтобы не вредить проекту. то есть ты можешь делать что-то на локалке, а когда будет итоговая версия залить на git и выложить на сервер. Я лично юзаю BitBucket и SourceTree - удобная приложуха.
JS - очень надо учить
JQuery - я стараюсь писать на чистом js, но некоторые плагины идут на jquery, да и jquery "убыстряет" кодинг как ни крути.
PHP - забудь, учи ruby on rails или python или что-то нормальное, созданное для разработки. Если хочешь остаться на php, то учи Yii - это MVC фреймворк
1С Битрикс - адовая машина. лучше забыть как страшный сон. Это как WP, только для интернет-магазинов, что более масштабное делать очень загонно, сложно, много матов проливается из уст. А если покупать из коробки, то очень дорого.

И вот что я бы хотел изучить плюсом к предыдущему списку:
HTML5 - если знаешь html, то знаешь html5) Там не так много нюансов для "бытовухи". Возможно придется делать какие-то медиа-штуки, типа плееров, тогда API поизучаешь по ходу дела.
CSS3 как и с html5
SVG - очень нужная вещь. ускоряет в разы сайты. Я сейчас все иконки делаю в svg.
БЭМ - удобно для командной работы. Но мне эта техника не понравилась. Я свой свод правил выработал.
Jade - не знаю его)
SASS - тоже не вижу смысла. Только чистый CSS, только хардкор. Не люблю всякие надстройки типы sass, haml, coffescript и т д. Их еще компилить надо ждать....
Bootstrap или Foundation - тоже ужасная хрень. не знаю про Foundation, а сайты на Bootstrap очень однотипные, единственное где удобно юзать - это свои какие-то внутриковые интерфейсы писать типа CRM, чтобы время на дизайн не тратить. единственное, можно сетки юзать, но сетку грех самому не написать.
GULP - если изучишь ruby on rails, он не понадобится (там css и js автоматом уживаются). Но для лендингов без админок - спасение и первый друг.
RegExp - не знаю
ES6 - не знаю
ReactJS - мне эта штука мозг взорвола) на мой взгляд юзать только если мобильные приложения делать. только тогда надо ReactNative учить.
Redux - не знаю
ООП - в любом случае если будешь кодить, то основы ООП надо будет выучить.
MySQL - не обязательно. В любом фреймворке mysql заложен в корень. Но основы для понимания лучше поучить. Потренируйся на php свою прогу написать с чистыми mysql запросами.
MongoDB - так же как и mysql
NodeJS - я не учил, хотя поучил бы)
Ruby - ДА
Ruby on Rails - ДА

Comments

[Александр Петров]

Короче если подытожить. Развивай навыки верстки. и изучи ruby on rails, чтобы back-end писать.
Лучше научиться делать быстрые, удобные и красивые сайты, нежели быть в тренде и знать кучу надстроек над js.
html,css, js никто не отменял и они могут очень многое.
Вообще смотри по ситуации и потребностям.

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

единственное, если пойдешь работать в веб-студию, там могут смотреть на то, сколько всяких "говно-языков" ты знаешь (там любят понтоваться). Если работаешь на фрилансе, то тебе главное заказчику угодить и чтобы он был доволен, а ему насрать на чем ты пишешь, главное чтобы сайт быстро грузился и не падал. Ну и чтобы красиво все было)

Как-то так. Вооооот.

[Александр Петров]

И еще, чтобы написать такс-менеджер, не обязательно быть сеньером)
Я в свое время пробучавшись с пол года уже написал свое веб-приложение для создания визиток. Там можно было как в фотошопе обрабатывать картинки, перемещать их, писать текст и т.д. Чтобы сделать приложение, главное не знания, а желание сделать приложение) и идея.

[Сергей Вушняков]

1С Битрикс - адовая машина. лучше забыть как страшный сон. Это как WP, только для интернет-магазинов, что более масштабное делать очень загонно, сложно, много матов проливается из уст. А если покупать из коробки, то очень дорого.

развеселило! :)))
советую с годик "по-бултыхаться" в этом аду, чтоб понять как мир прекрасен. чисто по русский сделанная хрень. напоминает комбайн ск-4 советских времен, много функций , рычагов управления, но все равно то жатка застрянет, то копнитель криво вылетит.

[Владимир]

Александр Петров спасибо тебе за советы добрый человек)
Php мне все таки нужен так как я уже в студии работаю и заказчики часто требуют WP или 1С Битрикс а они на php)
front end: в этом всем я как раз 3 года варился)) сейчас хочу переходить из сферы типичных адовых российских проектов во что то поинтересней) а из последних моих достижений: на wp я один от студии делал для американской строительной компании сайт полностью на связке wp + google api построеный, а на битриксе крупный портал спортивной команды мной построен с внедрением crm подключением api статистик разных и кучи всякого другого

Уже в общем меня подташнивает от этого)) хочется новых технологий, стартапов, imac 27" и кружечку латте на столе))

[Александр Петров]

front end: ахахахах) Рад, что есть единомышленники)
У меня был апогей, когда мне для интернет-магазина надо было фильтрацию сделать(не помню уже какую), а встроенный API не позволял так сделать, а тех. поддержка в открытую писала, что битрикс так делать не умеет))))

[Александр Петров]

Владимир: Про латте и мак хорошая мечта)

На мой взгляд, что разработчик умирает работая в веб-студии или делая проекты на wp для "не понятно кого". В этом повариться обязательно стоит, чтобы "прохавать жизнь", но до 40 лет вы не будете же этим заниматься.

Я за свое время разработки пришел к двум выводам:

1) Надо выходить на такой уровень, когда ты диктуешь на чем ты будешь делать, а у заказчика есть бомбическая идея, а тебе очень уж хочется повариться в этом идее. И заказчик должен быть адекватным чувак)

По моему текущему проекту не было вопроса в чем делать. Я пришел на встречу, сказал что делать буду на ruby, а заказчики порадовались) Сейчас мы чуть не лучшие друзья и в следующих проектах я уже буду соучредителем и буду капать дивиденты. Ну огонь же) Надеюсь, что все выгорит и проект завершиться благополучно и мы продолжим в тех же отношениях.

2) Учиться кодить надо для того, чтобы сделать что-то свое супер-пупер крутое. И то, что будет приносить деньги. Я сейчас параллельно с заказом делаю свой проект по обучению разработке сайтов. Утром, под кофе, на кухне записываю уроки, скоро оформлю и буду продавать. Идея лежала давно, много раз тестировалась, короче должно зайти) И до этого я кучу проектов делал, которые в силу моей глупости не запустились, но тем не менее. Мне всегда было интересно что-то для себя делать.

Короче вывод в том, что надо выходить за рамки наших "русских" заказчиков с тупыми заказами на wp за 10-20т.р. И начинать менять мир))))

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

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

Кстати, еще совет. У меня недавно была такая же проблема как у тебя, в плане того, что изучать и куда идти. Я просто нашел двух крутых разработчиков по front-end и back-end. Пообщался, поспрашивал и нашел все ответы)

[Владимир]

Александр Петров: крутяк, спасибо за советы) у меня такие же взгляды)) полностью согласен и поддерживаю) сейчас тоже нахожусь в окружении идейных людей) хочу чтобы тоже все складывалось по подобному пути) нужно создавать что-то крутое и менять мир))

[Александр Петров]

Владимир: Удачи!!! Рад, что существуют программисты-идеологи)))))

[Владимир]

Спасибо) тебе тоже удачи!)

[Александр Петров]

Владимир: Спасибо)

[cha-cha]

Одно "не знаю", другое "вынесло мозг", SASS оказывается безсмысленная фигня... С такими знаниями воздержались бы от советов.

[Александр Петров]

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

[cha-cha]

Александр Петров: С чего вы взяли что ваш личный опыт это найлучший путь развития? Разумеется все хвалят то чем пользуются, но с вашими знаниями советовать что-то, при этом не имея понятия есть ли лучшие технологии - нехорошо, ибо вводит в заблуждение других.
А отвечать я не стал потому-что iamevg_ уже дал довольно хороший ответ.

[Александр Петров]

cha-cha: А с чего вы взяли, что личный опыт - плохой опыт?

[cha-cha]

Александр Петров: я не говорил что он плохой.

[Александр Петров]

cha-cha: Так и я не говорил, что мой мой личный опыт "наилучший путь развития"