Работа верстальщиком. Тупик в самостоятельном обучении. Что делать и как лучше выстроить обучение и поиск работы?
Всем доброго времени суток. Сразу прошу прощения за кучу нубских вопросов.
В общем, нужен взгляд со стороны уже работающих в сфере людей. Сделав крюк от работы в саппорте до помощника руководителя проекта (три проекта, один с нуля до запуска) и контент менеджера с задачами от верстальщиков в одном, окончательно стало понятно, что хочется развиваться в направлении сперва верстальщика, а потом front-end.
По опыту работы и навыкам в целом, поверхностно:
- был опыт работы в поддержке хостинга. Есть базовые знания php +mySQL (на уровне чтения чужого кода, плюс пару раз написания обработчиков простеньких форм). В вебе вообще варюсь последние года три, но все как-то не там и не так.
- последние два года опыт работы на поддержке крупного сайта моб оператора (в основном работа с голым html - занесения контента, редко что-то приходилось дописывать в стилях. Еще реже - правка js скриптов на уровне контента). Всякие скиллы с заказчиками, jira и управлением проектами не в эту копилку.
+ есть навыки работы с командной строкой, просто представления о том как все работает. Общая грамотность, в общем, в айти.
- по теме верстки. Были курсы от Питерской школы по верстке, но из-за работы времени на обучение было выделено минимум. Зато появилось представление о БЭМ, SASS, LESS. В общем, несистематизированная каша, с которой можно работать. Вся верстка была на float'ах. jQuery просто "знаю", тк приходилось прикручивать галереи знакомым на сайт.
Сейчас удалось устроить себе отпуск еще на пару месяцев перед поиском работы. За прошлые пару недель:
- пройдены все курсы от htmlacademy на сайте (платные в тч), сверстаны пару учебных макетов академии с использованием пока только HTML/CSS, но пока делаю это дико неуверенно (сетка была на float'ах, медленно перехожу на флексбоксы). Но код ревью не давала, потом фиг знает насколько адекватно.
- смотрю вебинар от той же академии, пока Базовый. На очереди продвинутый.
- освежила знания командной строки и работы с Git. Поэкспериментировала с конфликтами, с ветками и просто. На работе прошлой с гитом работали, но не сильно много. Командную строку люблю, умею, практикую с момента работы в саппорте.
Вопросов по делу несколько.
1) Сколько реально времени надо затратить на обучение для того, чтобы получить начальную должность верстальщика? Я понимаю, что индивидуально все, но все же.
Я пытаюсь спланировать дедлайны, но по моим ощущениям пока выходит, что на уверенное освоение верстки и шапочное хотя бы знакомство надо еще минимум месяц - это голые html\css, адаптивная и кроссбраузерная, посмотреть css-препроцессоры, фреймворки(?). Плюс надо хотя бы начать чистый js, курс и книжки от Кантора у меня есть.
2) Как вообще с описанным выше багажом знаний выстроить поиск работы? То есть, когда есть правда огромное желание работать в этой сфере. С какого момента вообще можно начинать поиск работы?(понятно, что хоть с 0, но я говорю про ситуацию, чтобы не быть обузой работодателю и чтобы было полезно и мне, и ему) И что реально надо уметь на уверенном уровне, чтобы начинать искать работу и не стать "обузой" работодателю?
У меня из идей только: сейчас сверстать несколько шаблонов (на флоатах, флексах, с использованием sass/less) и выложить это все на свой акк на github), ссылку на профиль на академии.
3) Приземленный вопрос: что просить по зарплате? Учитывая почти нулевой старт и готовность работать за еду))) Интересует Питер. Получать 100500 миллионов не планирую, но разброс по анализу hh от 15 тыс до 40-50. Реально ступор.
4) Как все же дальше лучше выстроить обучение? У меня некоторый тупик. В голове есть теория от хтмл-академии и надо ее применять на практике как-то. Понятно что практика-практика-практика, но...
5) Что касается код-ревью. Поползав по ответам тут же, я так понимаю, что можно не стесняться кидать сюда ссылку на гитхаб и просить посмотреть получившееся?
Еще в ответах нашелся ресурс htmlforum.io
Hyubert, это извращение над языком HTML, а не говнокод — это обычный аккуратный HTML. А если нужен шаблонизатор, то можно прикрутить какой-нибудь сервер и взять какой-нибудь блочный шаблонизатор.
Выдавать код пуга за идеальный не надо. Говнокодом он является по причине слабой поддержки - приходит тебе от верстальщика вёрстка в пуге и там очень сложно поправить без каких-то проблем, так как синтаксис не знаком, да и ограничения какие-то он накладывает.
А HTML чем хорош? Его все знают. Пришла тебе вёрстка в HTML, ты с ней легко дальше работаешь.
Александр Першин, согласен - обычный HTML хорош, но к сожалению его нельзя переиспользовать. Да мы можем просто копировать куски кода, но если страница не 1... надеюсь понятно.
Говнокодом он является по причине слабой поддержки
- возможно вы и правы, только на выходе получаеться все тот же HTML
Hyubert, я вам написал эти комментарии, отчасти объясняя почему ваш код - говнокод (на самом деле нет). Прислушаться или нет - дело сугубо ваше. Если бы вы были в моей команде, я бы вас за это ругал.
Правда тут оказалось, что Александр Першин употребил слово "говнокод" потому, что не осилил запустить таск по сборке Pug в HTML, либо верстальщик с которым он работал не удосужился оставить инструкцию. Но это уже совсем другая история)
Андрей Хохлов, интересний вариант, он лучше моего (не сарказм), но у меня возник 1 вопрос - как добавить модификатор елементу блока (например для .photo-upload__btn) только в одном месте вызова, а в другом не добавлять?
Андрей Хохлов, я скорее заказчик, который видел как страдают люди, получившие вёрстку от верстальщика-любителя пуга. Теперь для меня пуг по умолчанию говнокод, потому что есть более адекватные шаблонизаторы. А если сравнивать синтаксис со скриншота с обычным красивым HTML – то только слово "говнокод" и просится.
Андрей Хохлов, а вы задумались, как это звучит "инструкция от верстальщика для работы с его кодом". Это же жесть. Верстальщик делает хороший HTML, присылает заказчику и всё, можно работать, никакая инструкция не нужна. А с доп. инструментами всегда какие-то проблемы выскакивают.
Александр Першин, на выходе, как сказано выше, чистый и красивый HTML.
Инструкция по интеграции вёрстки это хорошо и правильно. Потому что хорошая вёрстка, это куча вот этих дополнительных инструментов, которых вы так боитесь.
Это классический спор мира, где вёрстка, это то что делает студент с фриласру, и мира где вёрстка это основа фронтенда.
Когда начнёте серьёзно относиться ко фронтенду - пишите) выберем шаблонизатор, подходящий проекту, не обязательно Pug, сделаем классную архитектуру шаблонов и интегрируем в процесс разработки все современные инструменты. (даже если это битрикс, но тут с оговорками про шаблоны)
Андрей Хохлов, хорошая вёрстка — это хороший HTML и CSS, код, а не обвесы верстальщика, которые ускоряют его работу.
Мне как заказчику всё равно, что вы там используете в процессе работы, лишь бы на выходе я получил HTML и CSS, который работает как надо. В случае простого проекта я могу в дальшейшем сам модифицировать этот код. Если проект сложный, то вёрстка отдаётся бэкендерам и они натягивают её на шаблоны, которые используют сами.
Но если мне приходит непоймичто, накрученное на пуге, то возникают проблемы. Прям представляю, как придётся навязывать своим разработчикам инструменты стороннего верстальщика. Они лучше застрелятся. А если это простой проект, который нужно иногда поддерживать и что-то менять по мелочам, то зачем там пуг и инструкции?
И, честно говоря, мне абсолютно плевать, какой-там у вас внутри рабочего процесса тулинг, лишь бы на выходе получалась хорошая вёрстка. А профессионала делает профессионалом не тулинг, а умение решить задачу качественно в срок.
Hyubert, из исходного поста могло показаться, что такой код должен приходить и заказчику.
А если более глобально, то профессионализм подменяется тулингом. "Вот когда начнёшь юзать тулинг, тогда ты профессионал".
Профессионал-фронтендер в первую очередь умеет решать задачи с помощью HTML, CSS, JS и решать их в срок. А какие-там инструменты он использует в рабочем процессе — абсолютно не важно.
Александр Першин, вы так усердно питаетесь доказать свою позицию что забыли о чем был первоначальный вопрос. Прочтите его еще раз. Мы расматриваем фронтенд не с стороны заказчика, а с стороны разработчика и при этом делимся своим опытом с начинающим.
Александр Першин, интересное начинается, когда приходится поддерживать фронт проекта, который вот так профессионально в пару тысяч строк CSS'а был написан, а потом ещё все кому не лень там сами изменения вносили.
Сайт htmlacademy, основателем которой вы судя по профилю являетесь, использует и webpack, и процесс сборки проекта, и, готов поспорить, препроцессор для стилей. Шаблонизатор там тоже есть, правда я не раскопал что у вас на бэке. Я не думаю, что вы уволили фронтендера сразу после того, как он отдал вам HTML и CSS) И бэкендеры ваши явно не застрелились до сих пор.
Ну а споры про Pug - просто вкусовщина, на его месте может быть любой шаблонизатор, в идеале тот, который затем будет использоваться бэкендом проекта. Помимо шаблонизаторор при вёрстке можно, например, rigger использовать, но он проигрывает по возможностям.
А на хорошую работу можете идти когда при верстке Ваш код будет выглядеть как то так [страшный скриншот пуга]
Если бы на скриншоте был хороший HTML-код, поддержал бы двумя руками. Основная проблема, как уже писал выше, подмена профессионализма на владение каким-то инструментарием. Точно так же можно было написать:
А на хорошую работу можете идти когда при верстке будете использовать эммент.
Андрей Хохлов, речь, конечно, шла о работе внешнего исполнителя и заказчика. Внутри команды можно любые инструменты использовать, естественно. Но уже разобрались, комментатор со скриншотом пуга не имел ввиду, что этот код должен приходить заказчику от внешнего исполнителя.
Ответ на вопрос 1:
Можно самому научится, читая только книги и практикуясь на полученных знаниях от прочтенного, примерно за полтора года и не только фронт енд, но и бэк энд + библиотеки (я не вру, сам так начал делать и есть куча знакомых, которые уже в другой стране работают). Если фронт энд, то можнео за пол года.
Почему не стоит тратится на курсы?
Зачем платить кому-то за то что бы он тебе по сути дела тупо перечитывал то, что есть в книге?
Зачем платить в 10 раз и получить меньше знаний чем в книге?
Сейчас большинство выбирают курсы, это называется синдромом поиска папы, когда человек ищет кого-то, что тот ему помог, так как человек усердно верит в то, что сам не сможет ничего добится (это не относится к боевым искусствам и еще парам вещей).
Просто поймите, что ваш преподавателей, это по сути аудиокнига, которая может отвечать на вопросы (как и гугл и множнство форумов)
Ответ на вопрос 2:
Советую работу на фрилансе. Нету привязке к офису и т д. Никакого гемороя.
Ищите работу уже после JS HTML и CSS, есть, безусловно, предложения, но зарплата небольшая. Лучше фреймворки выучить (это дело 2-х недель) и можете как хороший FRONT END разработчиков работать.
Ответ на вопрос 3:
40-50 тысяч -довольно скромная зарплата для хорошего программиста (в США вообще 400 000руб до 800 000руб в месяц! (поймете о чем я далее)). Я бы на вашем месте, если уж работать в России, что не лучший вариант, не просил бы больше 160 000 (это довольно высокая зарплата для програмиста в России), на начальной стадии не менее 80 000 тысяч.
Ответ на вопрос 4:
Учите BACK END, учите библиотеки PHP и т д . Учите при этом дизайн, для того, что бы верстать афигенные и красивые сайты + на фрилансе делать логотипы на заказ (можно еще 20 000 в месяц заработать)
Ответ на вопрос 5:
Не совсем понял
Совет:
1. Учите английский (тут желательно курсы, для фонетики и Listening + практика)
2. Уезжайте из России
С книгами есть момент устаревания знаний — пока напишут, пока отредактируют, издадут, распространят… Базовые знания да, но свежие актуальные техники, интересные визуальные эффекты — это скорее читать и анализировать чужой код от авторитетов. Может посоветуете какие-то конкретные книги по верстке?
Иван, как мне говорил один backend-разраб - мой бывший коллега по работе "без знаний React/Vue/Angular/Ext (хотя бы одного) тебя больше чем на 50 не поднимут". И он был прав. Не поднимают, паскуды.
Никита Кит, верстальщик без опыта(то есть джун фронт-енд который не падает в обморок при [].contact.call(arguments) // первое что в голово пришло в 12 часов ночи) может рассчитавать от 15-25к ,сужу так как сам постоянно смотрю вакансии и являюсь новичком
Иван, я впервые заюзал call, когда апнулся до 40к. Так что хзхз. Ну тут всё зависит от других решающих факторов. git, jquery, умение собирать front, а не городить всё в main.css, main.js , умение применять шаблонизатор, умение писать по БЭМ првильно, умение cms-ок , не помешают также хоть какие-то скиллы в back-end. Всё это тоже играет роль. Так показала практика мне
Odisseya, не знаю, Большая книга CSS и носорог (шестого издания) остаются актуальны даже сейчас. Флэнаган описывает ECMAScript 3 и ECMAScript 5, новые версии можно учить дальше по статьям из инета. Главное база, а по JS базу лучше Флэнаган никто не даст. Книга JavaScript. Шаблоны Автора Стоян Стефанов тоже довольно актуальна и уникальна,
В последнее время слишком много начали гнать на книги, якобы они устаревают слишком быстро, надо учить документацию. Но документация как правило сухая, мало примеров, из уроков обычно короткий Quick Start а дальше зубрите API. В книге же ты и учишься, и получаешь удовольствие от книги, и еще делаешь задачки и знакомишься с API, волей не волей запоминая его. Базу (не начало, а именно базу, такую как язык, паттерны, SOLID, ООП) нужно учить по книгам, а всякие библиотеки, фреймворки, вебпаки, гит - это да, к документации.
Читайте книги господа!
Vlad_IT, Просто книги не всем подходят. Лично мне нужна обратная связь, так как у меня всегда куча тупых вопросов, на которые ни книга, ни гугл, не яндекс не ответит, поэтому у каждого свои стили обучения, например вам подходит книга, а мне вебинары и форматы видеокурсов.
Олег Петров, Форумы же есть... И как по мне замещение форeма учителем не стоит 15 000 - 100 000 рублей за обучение. Ладно, на вкус и цвет товарищей нет.
Олег Петров, а тут уже открывается вопрос умения пользоваться гуглом. Ответ на любой вопрос (особенно в уроках для начинающих) можно получить в гугле в короткой и развернутой форме. Умение самостоятельно находит ответы на такие вопросы, самый важный навык программиста, и очень пригодится в последующем, т.к. вопросов будет только больше. Конечно быстрее спросить у профи, но лучше разобраться самому, чтобы потом не зависать на банальных вещах.
Иван, в ООП сложно привязываться к какому-то отдельному языку, на JS нет развернутой литературы по ООП, т.к. классы там появились совсем недавно. Для меня лучшей книгой по ООП является Р.Лафоре Объектно-ориентированное программирование в С++, как видно из названия, она по С++, и там не разбираются интерфейсы, но зато она дает базу понимания ООП. А дальше уже можно просто познакомиться с реализацией ООП в JS в разных новых книгах или статьях в интернете.
По SOLID много читать не надо, т.к. это довольно короткие принципы. вот цикл статей sergeyteplyakov.blogspot.ru/2014/08/single-respons... но опять не по JS, по JS читал только это getinstance.info/articles/good-code-principles/sol... это тоже цикл, там внизу ссылка не следующую статью, а в ней на следующую и.т.д.
По паттернам проектирования конечно же банда четырех "Приемы объектно-ориентированного проектирования. Паттерны проектирования", если будет сложно, можно начать с этой "Паттерны проектирования" от O'REILLY.
За то время, что вы потратили на эту телегу, вы могли откликнуться на 2 десятка вакансий.
На свой главный вопрос вы сами ответили: все индивидуально. И не только со стороны работника, но и работодателя. Кто-то фул-стака обзывает верстальщиком и предлагает 30к, а кто-то готов взять со знаниями меньше, чем у вас.
во первых за два месяца не выучить)
во вторых теория и практика, как вариант можно фрилансить. Но в идеале найти норм фирму, попасть туда жуниором или стажером, по мне так практики и обучения будет больше, чем в вольном плавании.
в третьих з/п смотреть от фирмы. если контора крутая и готова вас взять на стажировку, то соглашайтесь на любое з/п.
1) 2 месяца если с нуля
2) Искать работу после двух разноплановых свёрстанных респонсив макетов (хотя я начал после одного нереспонсива, но я у мамы способный)
3) Для Питера, наверное, 40+ просить, но это на джуниора фронта, если не брезгуете джаваскриптом, но тогда и на изучение его основ понадобится месяца полтора. Если брезгуете - тыщ 20, но тогда лучше на зарубежный фриланс и зарабатывать от 15$/час.
4) Учиться на новых проектах и следить за профильными реддитами, повышать уровень проектов
5) Читайте стайлгайды от известных компаний, находите лучшие практики и не понадобится код-ревью.
На SASS LESS и т.п. можно не тратить время. Это все равно что вместо html использовать haml, а вместо javascript coffescript, а еще некоторые умудряются требовать bootstrap - другими словами это для хипстеров и знаний html, CSS и минимума jquery среднему верстальщику достаточно.
Сверстайте 2-3 шаблона наподобие вот этого. Если можете сверстать такой шаблон за 1 неделю (в идеале за 1-2 дня), то ищите работу.
Чтобы начать искать работу верстальщиком вам нужно сверстать всего 2-3 шаблона - этого достаточно.
Обзванивайте работодателей, рассылайте резюме. Работу найдете быстро и работы будет очень много.
Чтобы больше заработать на верстке надо либо уметь рисовать web-дизайн в фотошопе либо хорошо знать javascript и к примеру vuejs в качестве фреймворка, потому что он самый простой и при этом популярный.
snap44, конечно я не верстальщик :) Но факт остается фактом. Лучше уметь дизайнить или javascript, чем тратить время на препроцессоры(хотя там учить особо нечего). Потому что знания less или sass не отражаются на зарплате как и знания bootstrap.
Скорее не знание их отражается на зарплате. Потому что з.п. просто не будет у вас. Ну если речь не о человеке, специализирующемся на говнолендингах на виксе.
snap44, Скорее - незнание их отражается на скорости работы. Ну а там уже всё понятно: чем меньше скорость - тем меньше заработаешь(про качество можно ничего не говорить т.к. на выходе и там и там чистый css).
Только практика, про гитхаб мысль хорошая, там же статический сайт развернуть можно. Чистый JS не стоит, лучше то, что в него компилится типа coffeescript + на фреймворки посмотреть, ангуляр итд. SASS, bootstrap заюзать. Всякие сборщики типа gulp.
Вместо курсов поискать туториалы хорошие по этому всему и запилить проект по мотивам.
В питере это сейчас тысяч 35-50 джуну.
Простой
Простой
Простой
