Сучасна диджитал-освіта для дітей — безоплатне заняття в GoITeens ×
Mazda CX 30
×

Важливість верстки для фронтенд-девелопера

Усі статті, обговорення, новини про Front-end — в одному місці. Підписуйтеся на телеграм-канал!

День добрий! Є у мене верстальник, що прагне розвиватися в напрямку серйозного фронтенду.
І є в нього запитання — наскільки важливо круто вміти верстати у цьому ділі? В принципі, в нього вже непогано виходить, але хтось йому заявив, що для того, щоб бути фронтендером, треба круто верстати в першу чергу. Які будуть думки з цього приводу?

👍ПодобаєтьсяСподобалось0
До обраногоВ обраному0
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Хто не вміє верстати, пише
.salary{
min-height: 500$;
}

Той хто вміє
.salary{
transform: scale(2) !important;
}

В серйозний фронтенд з несерйозними знаннями html/css краще не суватися. Якщо можна щось переносити на CSS та DOM, то краще це робити. Ці речі двигуни браузерів гарно вміють оптимізувати, на відміну від вашого коду. Та й вміння структурувати інформацію не пропиєш.

html & css набагато простіші для сприйняття початківців чим той же JS. Тому, верстаючи з використанням BEM або подібних методологій можна досить не зле роздуплитись в таких високих матеріях, як інкапсуляція, наслідування, поліморфізм і компонентний підхід загалом, ще до вступу в програмування, бо саме тут застрягає більшість початківців. Головне не просто почати писати блоки__елементи_модифікатори, а вникнути в суть нашо це потрібно.

А верстальщик и фронтендер — это не одно и то же ?

Фронтендер еще типа программировать может.

Верстальщик перетворює макет в css + html, ну ще може підключити якийсь jquery слайдер, а фронтендер пише повноцінний клієнт включаючи навіть взаємодію з сервером.

Вибачте, ви, напевне, з Full-stack Web Developer переплутали? :-)
підкріплю себе посиланнями на теми...
— dou.ua/forums/topic/11733
habrahabr.ru/post/220437

Послати на сервер GET/POST це вже full-stack?!

Це теж саме. Це у нас чогось так називають фронтів. Наприклад за бугром не пишуть «Верстальщік», там це Front-end developer.

Якщо по скіллам говорити, то, є чудова стаття для порівняння Front-end engineer differs from front-end developer

... и начинать мыслить Web компонентами (въюху так же нужно грамотно сверстать и с учетом респонсивности), а не «могу прикрутить слайдер на джиКвери к вашему сайту», если действительно идёт речь о фронтенд-девелопере.

А наличие в команде отдельного html-верстальщика под статику, не снимает именно с фронтенд-девелопера уметь верстать.

Коментар порушує правила спільноти і видалений модераторами.

Ну знання верстки — це одне з найголовніших у роботі Front-end розробника (як на мою думку).
Навчитись круто перероблювати макети в сайти це вже перший шлях до становлення повноцінним розробником. Це як ти граєш в якусь гру й, програвши рік в неї, піднімаєш свій скілл та рівень.
Після знань верстки залишається вивчити Javascript + *.js фреймворк, наприклад, Vue й ти стаєш Front-endщиком.

Є у мене верстальник,

Раб?

Это как переход на следующий уровень, верстальщик -> front-end developer, само по себе подразумевает на стронг уровне знать\"уметь готовить" верстку, без каких-либо исключений. Быть фронтендером и быть слабым верстальщиком — это как быть xxx-framework разработчиком, зная плохо сам язык фреймворка. А таких «спецов» много — и это печально.

Верстать нужно уметь обязательно. Аутсорсить верстку не получится, потому что верстальщики сверстают статический сайт, из которого не факт что будет возможно нарезать компоненты для фронтенд-фреймворка. Кроме того, в процессе разработки SPA (а фронтендеры пишут SPA имхо, иначе это просто верстальщик) может быть так что не будет какого-то макета, который раз сверстал и всё. Наоборот, спецификации и UI могут меняться на ходу. Особенно это актуально в начале разработки.

Насколько круто верстать — другой вопрос. Я считаю что просто хорошо знать html и css достаточно, не обязательно одной рукой делать сложную анимацию. В общем, если

в нього вже непогано виходить

то возможно уже стоит двигаться в сторону js и фреймворков.

Я считаю что просто хорошо знать html и css достаточно, не обязательно одной рукой делать сложную анимацию.

А кто же тогда будет делать сложную анимацию?)

Практика показывает, что сначала нужно найти клиента, готового за это заплатить (хинт — обычно они не готовы). Ну а там варианты разные, от «изучить анимации» до «нанять того кто хорошо умеет»

«нанять того кто хорошо умеет»
Аутсорсить верстку не получится, потому что

Есть разница между MVC, альфа-бета версиями и завершенным продуктом. В MVC, особенно если не соцсеть писать а что-то для бизнеса, анимация будет плюсом, но не обязательна. А вот когда-нибудь потом можно и редизайнить, и анимировать всё. И анимация — не верстка, но в то же время она заметно сложнее верстки. О чём я говорю — если сейчас чувак начнет задротить эту часть, то фронтендом он не станет. Потому что фронтенд — этот тот кто делает клиентскую часть веб-приложения. В этой работе не менее половины JS, запросов к серверу и какой-то логики. А вот если JS часть подтянет — станет junior frontend, и уже потом подтянет то что конкретно ему будет нужно.

Да, ошибся аббревиатурой)

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

Тому що засовувати куски html в JS-код — не найкраща ідея.
В цьому плані Angular, як template engine, виглядає чистіше, хоч і не завжди ефективніше.

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

ой вей, это не «куски html в джс коде», это отдельная xml-подобная надстройка над джаваскриптом. Чуть больше абстракции для удобства, чтобы не писать

React.createElement(...)

ИМХО, у ангуляра в этом смысле подход куда хуже. Потому что они реально смешивают хтмл и джс.

P.S.: флеймить и холиварить не буду.

P.P.S: По сабжу — необходимость и уровень навыка верстки зависит от задач, которые перед ним, как перед фронтэндщиком будут ставить. Я бы сказал, что для большинства случаев верстку нужно знать уверенно, но не досконально.

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

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

Можно все абсолютно сделать на divах с очень жирным css. Это абсолютно не принципиальный вопрос «хтмл в коде». Тем более, что Oleksandr ответил более развернуто. Вы помните WinForms с простынями designer? Так вот это реакт. Компонент — это компонент. Его не волнует контекст почти никогда. Родитель настроит, если что.

Верстать нужно уметь, это факт.
Под версткой обычно имеется ввиду:
-Less\SCSS\PostCSS
-HTML5\4, темплейторы по типу Pug\Slim если нужно
-Уметь работать с Bootstrap\Foundation, понимать где нужны css frameworks, а где нет
-Методология наименования классов
-автоматизация сборки проекта
-адаптивная, валидная, кроссбраузерная верстка, с оптимизацией скорости загрузки
Вот обычно такие требования, ну и к этому добавляем знание ES5-6 + react \ typescript + Angular2 или любой другой джс фреймворк\либу.
Такие реалии, бытует мнение что те кто пришли во фронтенд из бека или начинали з джса, а не с верстки, они как бы покруче будут, ибо верстать научиться легче и быстрее чем джсу и сопутствующим фреймворкам.

Абсолютно необходимый навык, как для таксиста водить машину. Если ты фронтенд — ты должен разговаривать с пользователем на его языке. И если ты не собираешься общаться с ним буквами, то разумеется тебе проще объяснить КОДУ что делать, чем верстальщику.

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

С вёрсткой, благодаря «развитию» браузеров по пути заклятой дружбы, работы будет дохрена всегда. Нет, мы конечно верим, что производители [щас будет смешно] тонких клиентов между собой договорятся. Но рак из года в год умудряется потерять свисток в прериях.

Сейчас такие реалии что компании хотят видеть в одном лице и верстальщика и JS кодера . И выходит так что Front-end developer верстает , делает адаптив и другую хрень и еще должен кодить. Вот такие реалии

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

Верстать обязательно хорошо, но прям точить этот скилл до запредельного нет необходимости, за это много не заплатят

Це ясно. Ну то виходить, що можна не бути суперверстальником для цього? Бо він доволі нормально верстає вже наразі, але саме йдеться про заточування скілів.

Підписатись на коментарі