elyosmaximus

Пока забей на React/Vue и тд, и на алгоритмы и паттерны тоже.

Порядок учебы должен быть таким:
1. JS основы и практика (если практики нет в работе ищи задачки в интернете)
Настоятельно рекомендую полностью изучить этот бесплатный open-source учебник: https://learn.javascript.ru/
Я еще у них же проходил курс по JS платный (это не обязательно, курс очень во многом повторяет содержание учебника и задачи из него).
В этом учебнике ты найдешь все и про js и про ооп и про работу js в браузере и тд. И подается это все от простого к сложному.
Изучи основы js наизусть, а остальное прочитай и попрактикуй на разок и перечитывай по мере необходимости в работе.

2. Изучи как делать сборку проекта для начала с помощью gulp, потом вебпак.
например: (или другие курсы с ютуба)
https://learn.javascript.ru/screencast/gulp
https://learn.javascript.ru/screencast/webpack
Научись делить код js, scss на небольшие файлы-модули - храни их в правильной структуре и настрой сборку.
Научись настраивать проект так чтобы в нем была сборка js файлов в один, с использованием babel.
Чтобы была сборка стилей scss. И например оптимизация картинок автоматическая.

3. Немного порешай алгоритмы чтобы размять мозг,
например на https://www.codewars.com/

4. Дальше нужно поучить Реакт/Вуй и тд.
Читай документацию и попробуй сделать какой нибудь мини проект.
(например сделай приложение: список в котором можно добавлять элементы и подэлементы до бесконечности т.е. у каждого элемента будет кнопка "добавить дочерний элемент" и "удалить элемент") было у нас такое тестовое задание.

5. Пройди бесплатный курс по Redux от самого создателя редакса Дена Абрамова https://egghead.io/courses/getting-started-with-redux

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

Минутка мотивации: Я сам изучил js в основном на learn.javascript и react на оф. сайте, и сейчас спустя 3 года плотной работы с js занимаю должность senior front-end разработчика и team lead-а на проекте. (не хвастаюсь, но мотивирую :) )

Я в числе прочего собеседую людей, и самое важное на что мы в компании смотрим это крепкие знания по js.
Остальное можно доучить достаточно быстро. И когда мы набираем людей например на должность junior React разработчика, то знания js и умение шевелить мозгами обязательны, а вот знаний реакт достаточно поверхностных. Ну и желательно иметь js/react опыт хотябы в виде собственных pet projects на аккаунте github.

PHP не мода, php - классика, а классика никогда не умирает. Если умрет php, то умрут все остальные языки backend разработки потому что появится что-то такое, что сможет в разы превзойти пхп в простоте, скорости и удобстве, на данный момент что джава, что питон, что руби +- одинаковые, каждый подходит для своих целей. Тот же питон выбирают из-за простоты интеграции нейронных сетей, но если говорить не о узких, а о главных параметрах (функционал, скорость и тд) все популярные бэк языки более или менее одинаковые смотрите те же сухие графики.
А о уменьшении вакансий - глупость несусветная. трын тут приведена статистика за 2018 год и обоих графиках по вакансиям лидирует в сравнении с java/python PHP, при том на первых двух пишут как бэкэнд, так и миллион других штук. А на втором графике и вовсе пхп опережает js (единственный язык в самой популярной сфере разработки).

А вот если речь идет о реально крупных компаниях (amazon, google...) там как раз предпочитают python из-за выше упомянутой простоты интеграции нейросетей, а java из-за стабильной поддержки сверх высоких нагрузок.

Меньше слушайте диванных экспертов, пхп предрекают смерть с 00-х годов, что то он слишком долго дергается для мертвеца.

На hh.ru вижу такую тенденцию- верстку отдают на удаленные вакансии верстальщика, вы можете начать с отправки резюме на низкооплачиваемые вакансии по з/п, там у вас шанс может быть.
1) ваша ценность и шансы возрастут когда вы будете знать и уметь натягивать верстку хотя бы корпоративных информационных сайтов на популярные cms ( вот пример требования к верстальщику в каждой второй вакансии - Joomla, Bitrix, Drupal 7, Wordpress)
2) Важный пункт в каждой второй вакансии - Наличие актуального портфолио. Берете и мониторите реальные заявки на биржах, там бывают макеты, верстаете и выкладываете в своем сайте портфолио. Выполните с десяток заявок для себя в целях обучения.
3) Ваша ценность и шансы возрастут когда освоите js. Это требование в большинстве вакансий.
4) Параллельно работайте на биржах - это повысит ваши навыки и стаж по специальности.
В среднем вам нужно упорно учиться и получать навыки 1-1.5 года чтобы выйти на уровень начинающего специалиста, который сможет решать большую часть задач.

Вопрос странно составлен, на пхп еще больше пишут чем на java, про nodejs спорно что из них популярнее.

Вопрос из серии "у нас были задачи и мы их решали". Например на джаве можно писать десктопные кроссплатформенные приложения, на пхп и node это большое извращение.

Сайты/каталоги/базы с новыми сайтами и приложениями?

поисковые системы

главное чтобы я могла отслеживать появление новинок

парсить выдачу поисковых систем

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

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

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

Можно полистать какой-нибудь список идей для сайтов, и выбрать оттуда что-то интересное.

По шагам:
1. Базовые конструкции языка
2. Функции работы со строками, массивами и объектами
3. Работа с DOM
4. Функции и замыкания
4. ООП посредством функций
5. ES6 (все полностью)
6. Любой фреймворк

Зависит от компании и опыта. Все таки это больше про js, но так же очень не помешает собирать user-friendly интерфейсы.

Что делает? Рефакторит, оптимизирует, внедряет новое, пишет хотя бы на одном из популярных фреймворков, поглядывет на node.js, пишет свои проекты. По хорошему пишет тесты, но опять же зависит от задач и времени на них.

Нормальный фронтендер стоит много денег
Никто в здравом уме не будет использовать дорогого спеца на верстке

Верстальщик делает из псд макет в sass/less + html + минимальный жс для реализации задумки дизайнера

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

Между позицией верстальщик и фронтендер - пропасть в виде огромного багажа знаний по js и по конкретному фреймворку

Да, фронты занимаются всем тем, что видит пользователь. И если раньше, это была только верстка под 1-2 браузера, то сейчас это верстка под разные разрешения, анимация, попапы, реактивные компоненты и много чего еще. Не думаю, что обычный бэк пишущий парсеры и API, вот так может взять psd-шный макет по слоям и сделать из него за разумное время адаптивное SPA приложение, например на Vue. Вот отсюда и выросла отрасль - фронт усложнился и нужны узкие специалисты. При этом бэк в свою очередь становится все проще и проще, тк в 90% случаев бэк это лишь набор инструкций для вывода данных из базы.

1. Фрэймворк - это каркас приложения. Библиотека - это готовый код. Фрэймворк предоставляет разработчику архитектуру, на которой выстраивается приложение. Библиотека не предоставляет архитектуры. Ты вызываешь её, чтобы получить результат в отдельной части своего приложения.
2. Можно использовать несколько фрэймворков. Каждый фрэймворк отвечает за своё приложение или свою часть проекта. Например, можно сделать админку сайта на Angular.js а клиентскую часть - на React. Можно одну страницу сделать на React.js, вторую - на vue.js. одну и ту же часть проекта на разных фрэймворках делать не получится. Какой выбрать - вопрос опыта. Пока не начнёшь писать - не поймёшь.
3. Некоторые библиотеки могут заменить фрэймворки, имея полный набор абстракций доя решения задачи. Можно ли сравнивать библиотеки и фрэймворки? Это зависит от параметров сравнения. Если можешь обосновать что ты сравниваешь, то не вижу проблем. Но, для обоснования надо иметь опыт работы и решения прикладных задач.
4. Ничего не могу посоветовать: выбор библиотеки или фрэймворка - это ответственность разработчика. Если разработчик с этим вопросом идёт на тостер, то дешевле посоветовать другого разработчика.
P.S. Не стоит зацикливаться на ванильном JS. Стоит выбрать фрэймворк и работать с ним. Понимание придёт с опытом.

Про отличие фреймворка и библиотеки видел такую фразу и она мне понравилась:
Библиотеку ты вызываешь из своего кода, а фреймворк наоборот вызывает твой код.

1) Фреймворк, как правило, рекомендует (а некоторые и навязывают) определенную организацию структуры кода, да. За это он тебе тоже кое-что дает - берет на себя типовую работу, что повторяется из проекта в проект, зачем ее делать каждый раз заново.

Да, функционал их разный. От минималистичного до всеобъемлющего.

Вполне можно использовать на одном сайте фрейморк CSS для верстки, фреймворк JS для динамики, фреймворк для бекенда. Если фреймворк для CSS и фреймворк для JS еще, возможно, и могут мешать друг другу (но как правило не мешают), то фреймворк для бэкенда функционирует на сервере как вообще независимая от CSS/JS вещь (CSS/JS фунционируют в браузере, а не на сервере).

2) Да. Если они специализированы на разных проблемах (Zurb Foundation для CSS и Vue.js для JS и Yii для PHP, например).

Но если они занимаются сходными вещами (например, React и Vue) то целесообразность такого применения непонятна. Более того - они запросто могут мешать друг другу. Нужно смотреть по ситуации.

3) Библиотеки - весьма конкретно-местный инструмент. Потому более независимы от проекта.
Фреймворки же нацелены на большую автоматизацию решения ваших проблем в какой-то конкретной ситуации, а вас от них более зависимыми (что не плохо, учитывая приносимую фреймворками пользу, просто нужно учитывать).

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

4) Штатные API выбранного сервиса карт (Yandex Maps, 2GIS Maps, OpenStreet Maps и пр.). Эти API реализованы в виде библиотек. Фреймворки тут вообще не при делах.

P.S.:
2GIS специализированный сервис:
В 2GIS очень хорошо представлены предприятия\фирмы\организации (в городах, где 2GIS присутствует), лучше прочих. Между городами 2GIS нет в принципе.

Библиотека это инструмент или набор каких-то инструментов.
Бибилиотека для скачивания видео с ютуба
Бибилиотека для кропа и ресайза картинок
Бибилиотека для определения города по IP

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

"набор для постройки скворечника"
В комплекте молоток, гвозди, столярный клей, 20 деревянных досточек разных форм и расцветок и инструкция с тремая вариантами скворечника на выбор.

Или вот два фреймворка:

Можно ли их использовать вместе? (Конечно, никто не запрещает)
Можно ли из этих деталей построить что-то совсем другое, не такое как в инструкции? (Конечно да)
Можно ли с этими фреймворками использовать детали еще и из этого?

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

Можете посмотреть еще сюда, этот ответ частично покрывает ваш вопрос:
Для чего нужны фреймворки, а-ля Laravel?