Задать вопрос
FirstTime
@FirstTime
Постигающий силу штурмовик.
html

Как правильно изучать верстку c переходом на front-end?

Добрый день жителям Тостера.
Совсем недавно начал изучать верстку, посмотрел различные видео курсы, сейчас занимаюсь практикой. Верстаю макеты по мере сложности. В связи с постоянным развитием технологий, не хочется тратить время на то, что может не пригодиться, но по причине неопытности, нужно понимать, что стоит учить в первую очередь, а что стоит отложить на потом. Мой вопрос направлен людям, которые прошли данный путь, и имею опыт.
В какой последовательности лучше изучать данное направление (сначала верстку, а потом переход на front-end)?
Если не затруднит, пожалуйста, напишите последовательность изучения технологий, языков и т.д., кто как считает более правильной.
Спасибо.
P.S. Если кому будет не трудно помогать с версткой, на грамотность кода, пожалуйста, отпишите.
  • Вопрос задан
  • 26056 просмотров
Комментировать
Подписаться 33 Оценить Комментировать
Решения вопроса 2
Aspirin77
@Aspirin77
HTML5&CSS3, в любом случае самое первое, что стоит изучить. Html Book - неплохой вариант, для новичка, но всё же в идеале оф. сайт консорциума с документацией www.w3.org
Думаю, для хорошего верстальщика и front-end developer'a важно понимать "кухню".

Есть не плохая книга, мне лично очень нравится, Джон Дакетт "HTML и CSS". Книга не из дешевых, но лично мне очень помогла в изучение основ.

Далее, опять таки на мой взгляд, хотя бы на уровне синтаксиса - изучить JavaScript. Пока не говорю, про библиотеку JQuery. Но она по сути, важна. Книга - Бер Биро, Иегуда Кац "Подробное руководство по продвинутому JavaScript".

В плане опыта, тут уж наверное понятно, верстать и еще раз верстать, по мере решения определенных задач растет скилл, так сказать. Умение искать ответ в Google тоже немаловажный навык.

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

Свой код после верстки, можно проверить на валидаторе оф. сайта консорциума. Просто нужно вставить ссылку туда на свой сайт и он анализирует.

На YouTube, есть видеоуроки по многим направлениям. Из самых крутых на мой взгляд, Sorax

В целом терпение и желание именно заниматься версткой и front-end. Удачи )
Ответ написан
Комментировать
Комментировать
IonDen
@IonDen
JavaScript developer. IonDen.com
Начните с этого: Какие есть практические курсы\уроки по html5 + css3 + javascript?
Имейте в виду это: Основные навыки фронтенд-разработчика
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ответы на вопрос 5
almac
@almac
Есть 2 варианта развития фронт-ендера:
1. как верстальщик - тут на 1ом плане html+css и немного jquery
2. как программист - более оплачиваемая работа; на 1ом месте - javascript и различные js-фреймворки, версткой возможно и не придется заниматься на данной позиции

Что учить:
1. верстальщику - htmlbook.ru и MCSS\БЭМ
2. front-end программисту - learn.javascript.ru
Ответ написан
Комментировать
Комментировать
@mishapsv
По личному опыту:
1. Начать с верстки - порог входа ниже.
Изучать теорию, обязательно закрепляя большим количеством практики. Сверстав несколько больших макетов для портфолио активно искать работу. На этом этапе нет ничего лучше работы фуллтайм. Сначала будет куча вопросов, ошибок, проблем, но прогресс будет идти максимально быстро.
Где изучать?
Теория: developer.mozilla.org, htmlbook.ru, learn.javascript.ru/css-for-js
Удобно пробовать верстать в песочнице (мне нра codepen.io).
Практика: интерактивные курсы htmlacademy.ru (большинство можно пройти бесплатно).
У этих же ребят есть интенсив по верстке сайтов с нуля. Прошел его.
Если есть возможность оплатить - очень рекомендую. Реально вырастете за месяц. Плюс у вас останутся записи вебинаров и бесплатный доступ на все последующие интенсивы.
Могу поделиться промо-кодом "344a1a5b"(без кавычек) - скидка 800р.
2. Продолжить изучая JS.
Теория: learn.javascript.ru.
Практика: stepik.org, немного есть у htmlacademy.ru.
Интенсивы: я проходил интенсивы по JS у learn.javascript.ru и htmlacademy.ru.
Понравилось больше у htmlacademy: проработанный интерфейс курсов, интерактивные упражнения, проект годится для портфолио, постоянная помощь наставника.
3. Дальше изучать фреймфорк(и): React, Angular, Vue.
Ответ написан
Комментировать
Комментировать
psdhtmlcss
@psdhtmlcss
  • HTML, CSS (для начинающих здесь курсы)
  • JavaScript, jQuery (можно эти сайты wisdomweb, курсы на youtube)
  • Отличный справочник по HTML и CSS на сайте htmlbook.ru
  • Также рекомендую параллельно учиться печатать вслепую, отличный тренажер "Соло на клавиатуре" за 2 месяца можно научится на русской и английской раскладке уверенно печатать вслепую. Изучать технический английский.
  • В дальнейшем изучить less,sass, bootstrap, поработать с git Основы php, mysql, поработать с популярными cms: Drupal, Joomla, WordPress и т.д.
  • Также немаловажен текстовый редактор, используйте тот, в котором быстро и удобно работать. Можете почитать про Sublime Text, в том числе и про полезные плагины.
Ответ написан
Комментировать
Комментировать
xmoonlight
@xmoonlight
https://sitecoder.blogspot.com
Изучайте работу с HTML5-объектами и учитесь грамотно кодировать на нативном JS.
После этого - по-мере необходимости используйте библиотеки.
Библиотеку jquery используйте ИСКЛЮЧИТЕЛЬНО! после того как освоите нативный кодинг более-менее.
Ответ написан
Комментировать
Комментировать
trushka
@trushka
В связи с постоянным развитием технологий, не хочется тратить время на то, что может не пригодиться
Ну, здесь основной фактор, не является ли данная технология "костылём". Например, та же анимация в jQuery - сейчас есть нативные способы задать анимации с помощью css, а ещё и animation api, если не ошибаюсь в названии, разрабатывается.. Хотя некоторые вещи всё же лучше делать с использованием jquery-анимации.. Или же многие фишки разрабатывались для ИЕ, но в современном вёбе не прижились. Обычно в руководствах по этим делам прямо сказано - работает только в ИЕ.. Хотя многие из изначально чисто ИЕшных фишечек вошли в HTML5. В общем, тут лучше перебдеть, чем недобдеть, ящетаю))
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Спарсить TON PLACE: скрейпинг фото и текста с анкет по списку URL
25 апр. 2024, в 05:57
3000 руб./за проект
Правки в webApp готового и написанного телеграмм бота next, tailwind
25 апр. 2024, в 05:29
25000 руб./за проект
Фронтер - DevOps. Развернуть фронт на хостинге. Прокинуть в телегу-бот
25 апр. 2024, в 04:38
10000 руб./за проект
Ещё заказы