Как стать фронтенд-разработчиком? Пошаговый гид в мир фронтенда



    Приветствую всех! Меня зовут Пучнина Анастасия, я ведущий разработчик в компании ДомКлик, занимаюсь фронтендом Витрины объявлений. Сегодня я хотела бы поделиться с вами своим мнением на тему того, что важно знать фронтенд-разработчику. Эта статья будет полезна тем, кто только начинает свой путь в разработке, или имеет опыт программирования в другой области и решил перейти на сторону фронтенда.

    Содержание:

    1. Кто такой фронтендер и чем он занимается?
    2. С чего начать и что читать? Чек-лист обучения
    3. Какие трудности могут быть? Ошибки в начале пути
    4. Подготовка к собеседованию на Junior-разработчика


    Кто такой фронтендер и чем он занимается?


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

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

    Фронтенд-разработчиками называют программистов, которые отвечают за создание такой внешней стороны (англ. front end) веб-сайтов. Это клиентская часть сайта, с которой пользователь непосредственно взаимодействует на своем компьютере или телефоне (клиенте).

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


    Фронтенд-разработчик:

    • создает пользовательский интерфейс, добавляет разметку и стили страниц сайта;
    • программирует логику, которая выполняется на клиентском устройстве, разрабатывает архитектуру клиентского приложения;
    • оптимизирует производительность фронтенда, чтобы проект быстро загружался, поисковики поднимали сайт в рейтинге выдачи, а пользователи не чувствовали задержки при навигации и взаимодействии с интерфейсом;
    • тестирует разработанную функциональность и пишет автоматические тесты, чтобы обеспечить высокое качество и не допустить ошибок при изменении кода;
    • настраивает сборку проекта, что позволяет автоматизировать дополнительную обработку кода и файлов перед запуском приложения;
    • выполняет развёртывание приложения: выкладывает на сервер, чтобы приложение было доступно в сети и пользователи могли им воспользоваться;
    • следит за возникающими ошибками с помощью средств для мониторинга и вовремя их устраняет :)

    В разных командах фронтенд-разработчики могут решать совершенно разные задачи, например:

    • Разрабатывают клиентскую часть веб-приложения для бизнеса (то, что видят конечные пользователи, когда пользуются различными онлайн-услугами).
    • Разрабатывают библиотеку компонентов интерфейса: отдельные блоки, которые другие разработчики используют в своих проектах (например, кнопки, всплывающие окна, поля форм или элементы для графиков). Это могут быть библиотеки с открытым исходным кодом, которые подключают разработчики по всему миру, или внутренняя библиотека компонентов компании с определенным дизайном.
    • Создают технические инструменты для улучшения архитектуры приложений. Инструменты, которыми сейчас пользуются всё сообщество фронтендеров, когда-то создали другие фронтенд-разработчики, чтобы улучшить пользовательский опыт при использовании сайтов и сам процесс разработки. Вы можете стать одним из таких разработчиков!

    С чего начать и что читать? Чек-лист обучения


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

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



    Три кита разработки под браузеры — это HTML, CSS и JavaScript, с которых и стоит начать.

    Если у вас нет опыта в разработке и вам сложно обучаться самостоятельно, хорошим решением будет пойти на курсы фронтенд-разработчика с наставником в одной из известных школ программирования. Также хорошие курсы по вёрстке и фронтенд-разработке можно найти на Udemy и Coursera. Однако это совсем не обязательно, в интернете много бесплатных материалов и источников по необходимым темам.

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

    Сохраняйте в закладки и пользуйтесь.

    1. Как работает Веб


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


    2. Среда разработки


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

    • VSCode — бесплатный быстрый редактор с большим количеством дополнений для разработки;
    • JetBrains WebStorm — полноценная IDE, есть пробный период и возможность получить доступ по студенческой лицензии;
    • Если у вас возникает потребность отправить другому человеку фрагмент кода, быстро проверить или сохранить код в сети, можно воспользоваться онлайн-редактором, например, Codepen.

    3. Основы HTML


    Изучите структуру HTML-документа, что такое теги и какие они есть, мета-теги, атрибуты, как добавлять изображения, создавать формы. Важными моментами в верстке является семантика и доступность.


    4. CSS



    Добавление стилей для элементов страницы. Изучаем блочную модель, позиционирование, каскадирование стилей, специфичность селекторов, псевдоэлементы, адаптивную верстку (для компьютеров, планшетов и телефонов). Учимся верстать современные макеты с помощью Flexbox и Grid.


    5. Система контроля версий Git


    Git поможет вам выйти на новый уровень в процессе написания кода. Это незаменимый инструмент для разработчиков, который позволяет поэтапно сохранять информацию обо всех изменениях в коде, возвращаться к разному состоянию, и многое другое. Желательно научиться работать с Git в терминале, а также попрактиковаться: создать репозиторий на Github или Gitlab и опробовать основные возможности Git на своём тестовом репозитории.


    Практика. Практика. Практика!



    На этом этапе я предлагаю побольше попрактиковаться и сделать свой небольшой проект, чтобы запомнить пройденный материал. Необязательно самостоятельно придумывать дизайн сайта, вы можете взять готовый макет. Создайте landing page или, например, сверстайте сайт-портфолио, сохраняйте код на Github в процессе разработки и попробуйте разместить сайт на бесплатном хостинге для статических сайтов — Github Pages. Если вам недостаточно практики, попробуйте посмотреть, как верстают другие, и повторить. На YouTube достаточно видеоуроков на эту тему (например, по запросу «верстка сайта по макету figma»).

    Если вы глубоко изучили HTML и CSS, то после прохождения предыдущих пунктов сможете стать верстальщиком сайтов. Но чтобы научиться писать интерактивные веб-приложения и стать профессиональным фронтенд-разработчиком, нужно продолжить свой путь в мире фронтенда и погрузиться в программирование.

    6. Язык программирования JavaScript


    Не путайте JavaScript с Java. Изучите основы языка: переменные, объекты, типы данных, функции, контекст и замыкания, классы. Сравните отличия спецификаций EcmaScript старых и новых версий. После понимания основ переходите к более сложным вещам: тонкостям асинхронного программирования (коллбеки, промисы, async-await) и выполнению запросов на сервер (XmlHttpRequest, Ajax, Fetch, Cookie).


    7. DOM (Document Object Model)


    DOM — это объектная модель документа, дерево, которое строит браузер, чтобы отрисовать вашу страницу на экране. Научившись работать с DOM, вы сможете с помощью JavaScript создавать или изменять элементы на странице, реагировать на клики пользователей и многое другое. Работе с DOM и событиям в браузере посвящена отдельная часть LearnJavascript.

    Подробно тема DOM также описана в книге «Выразительный JavaScript», автор Марейн Хавербек.

    8. Node.js, NPM


    Благодаря программной платформе Node.js язык JavaScript можно использовать не только в браузере. С помощью этого инструмента можно написать консольную программу или серверную часть приложения.

    Попробуйте написать свой собственный небольшой сервер.

    В своих JavaScript-программах вы можете использовать модули, написанные другими разработчиками. Ознакомьтесь с онлайн-хранилищем пакетов NPM.

    9. Babel


    Babel Js — компилятор JavaScript-кода, который позволяет использовать последние возможности языка, например, стрелочные функции, классы, optional chaining, не дожидаясь их полной поддержки браузерами. Вам необходимо лишь правильно сконфигурировать Babel под нужную версию EcmaScript или список поддерживаемых вами браузеров, исходный код будет преобразован автоматически.

    Попробуйте воспользоваться онлайн-компилятором кода на официальном сайте, чтобы посмотреть, во что превращаются современные конструкции JavaScript. Настройте компиляцию кода для небольшого JavaScript-приложения, подключив Babel как NPM-пакет.

    10. Сборщики модулей, Webpack


    При создании приложений разработчики делят код на части (модули), подключают дополнительные обработчики кода, настраивают приложения для различных окружений (development и production). Чтобы это было возможным, а нам не пришлось вручную подключать модули в HTML-файле в нужном порядке и следить за изменениями, в приложениях используются сборщики модулей (бандлеры).

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

    Webpack — один из самых популярных сборщиков модулей. Это помощник разработчиков, несмотря на то, что по началу он может показаться достаточно сложным. Его гибкость позволяет настроить сборку с использованием огромного множества плагинов и загрузчиков (пре- и пост- процессоров CSS и HTML, Babel и др.), оптимизировать ресурсы, быстро подгружать изменения в процессе разработки с помощью hot module replacement, и многое другое.


    11. Препроцессоры CSS


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

    Наиболее популярные препроцессоры:


    Основными преимуществами использования препроцессоров CSS-кода являются:

    • Модульность. Вы сможете создавать CSS-код в разных файлах и импортировать стили при необходимости.
    • Вложенность. Вкладывайте селекторы друг в друга для компактности и логичной структуры кода. Это улучшит читабельность и уменьшит дублирование (будет особенно удобно, если вы станете использовать BEM-методологию для написания CSS).
    • Использование CSS-переменных и функций (миксинов).
    • Вы можете выбрать препроцессор с удобным для вас синтаксисом (например, CSS-код без фигурных скобок и точек с запятой).

    Советую также на этом этапе ознакомиться с инструментом трансформации стилей PostCSS и, в частности, с плагином Autoprefixer. Этот плагин позволяет автоматически добавлять вендорные префиксы для CSS-свойств вашего кода.

    12. Препроцессоры HTML (Шаблонизаторы)


    Препроцессоры HTML имеют те же преимущества, что и CSS-препроцессоры. Они позволяют более эффективно писать HTML-разметку, разбивать код на модули, а также использовать условия, циклы, миксины, наследование.

    Популярные шаблонизаторы:


    Настройте свой проект, добавив в webpack-конфигурацию загрузчики для обработки CSS- и HTML-кода препроцессорами.

    13. Стиль кода и линтеры


    Стиль кода (code style) — набор правил, который позволяет сделать код единообразным, максимально удобным для восприятия и читаемым для вас и других разработчиков. Такие правила описывают, где и какие отступы и скобки должны быть, максимальную длину строк, названия переменных, позволяют определить слишком запутанный или лишний код и множество других аспектов.

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

    Существуют специальные инструменты, которые могут проверять ваш код автоматически и позволяют легко поддерживать код в определенном стиле, настроив конфигурацию проекта один раз:


    Ознакомьтесь с документацией инструментов, попробуйте подключить их к своему проекту и IDE, следуйте определенному стилю кода в своём проекте, чтобы сделать приложение лучше!

    14. Изучение фреймворка/UI-библиотеки


    React, Angular или Vue? На 2020 год основная борьба идет между этими библиотеками. Вы можете выбрать любую из них. Если вам симпатизирует какая-то конкретная компания, в которой вы хотели бы работать, можете выбрать используемый ими фреймворк.

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

    Начните изучать React с официальной документации, она достаточно подробная. Если её вам покажется недостаточно, можно найти на Udemy полноценный курс (например, Modern React and Redux — на английском языке, с очень понятным и подробным объяснением для начинающих, практическими заданиями и всем необходимым материалом по React и библиотекам).

    Уделите внимание описанию типов входных параметров для React-компонентов (проверка типов с помощью PropTypes), а также написанию комментариев по стандарту JSDoc (цикл статей по использованию JSDoc).

    По мере вашего продвижения необходимо будет научиться управлять состоянием приложения. Библиотеки, которые помогают в этом: Redux и Mobx. Начать рекомендую с Redux — это наиболее популярная библиотека в связке с React. Ознакомьтесь с официальной документацией или переводом. Также советую курс от одного из авторов библиотеки (Getting Started with Redux от Дэна Абрамова).

    Затем приступайте к изучению библиотеки для удобного выполнения асинхронных действий (например, запросов к серверу). Самая простая библиотека, с которой стоит начать — Redux Thunk (документация).

    15. Автоматическое тестирование


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

    16. Углубленное



    Какие трудности могут быть? Ошибки в начале пути




    Изучение фреймворков вместо базовых знаний


    Иногда будет казаться, что лучше сразу изучать какой-нибудь популярный фреймворк или библиотеку. Это достаточно частая ошибка, особенно во фронтенде: люди начинают изучать React или верстают с помощью Bootstrap и Material UI, не разобравшись в основах и не получив достаточных знаний по HTML, CSS и JavaScript. Можно использовать такой подход, если вы «бежите на короткую дистанцию» и вам нужно быстро сделать какой-нибудь проект. Но если вы планируете стать разработчиком, это не принесет нужного результата.


    Нет необходимости знать наизусть абсолютно все CSS-свойства или методы в JS, вы сможете поискать их, если забудете. Важно понимание основных концепций и тонкостей: это то, что будет вашим крепким фундаментом во фронтенд-разработке.

    Обучение — это труд, самодисциплина и много практики


    Ошибочно ожидать, что вы разберетесь со всем материалом за неделю или выучите JS за один день. Количество времени, которое вам будет необходимо, это очень индивидуальный вопрос, и, скорее всего, процесс займёт не один месяц.

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

    Определитесь, зачем и почему вы хотите стать фронтенд-разработчиком. Фронтенд — это область, в которой можно реализовать интересные решения и работать над проектами, которыми будет пользоваться огромное количество людей по всему миру! В добавок к этому, чем больше вы наберете знаний и опыта, тем выше будет оплачиваться ваш труд.

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

    Копирование чужого кода


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

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

    Не доверяйте на 100% коду, который вы находите


    Другие люди тоже могут ошибаться или иметь недостаточно опыта. Если вы находите видеоурок от магистра JavaScript или вёрстки, это не всегда значит, что преподносимое — идеальное решение и лучший возможный код.

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

    Подготовка к собеседованию на Junior-разработчика


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

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

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

    Сообщество разработчиков составило примерный список вопросов для интервью. Пройдитесь по всем вопросам и попробуйте дать ответ. Если вы не смогли на что-то ответить, это сигнал к повторению темы.

    В подготовке к решению задач на JavaScript могут помочь сайты с задачами по программированию, на которых вы можете попрактиковаться онлайн и проверить свои навыки (начинайте с раздела с простыми задачами). Особенно популярными задачами являются задачи на применение методов работы с массивами. Пример таких задач: проверка на палиндром или анаграмму.

    Сайты с задачами по программированию:



    В проверке знаний также могут помочь Telegram-каналы с задачками и тестами по JavaScript (например, @js_test).

    Задачи на применение действительно сложных алгоритмов и знание таких структур данных, как деревья и графы, практически нигде не даются при собеседовании на должность Junior фронтенд-разработчика. Так что не бойтесь: даже если прохождение собеседования кажется вам очень страшным, на самом деле, если вы смогли ответить на все вопросы выше, то с большой вероятностью сможете пройти собеседование.

    Маленький совет: если вы не уверены в своих силах, всё равно пройдите собеседование в какой-нибудь компании. И даже если вам не сделают предложение, вы поймете свои слабые места. К следующему собеседованию сможете подготовиться еще лучше!


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

    Желаю удачи в покорении новых вершин!
    ДомКлик
    Место силы

    Comments 22

      +1
      Вёрстка на Flexbox в CSS. Полный справочник (перевод и оригинал на CSS Tricks);


      Ссылка на перевод ведёт на 404 :( Вероятно, должна быть вот такая — чистая ссылка
      Спасибо за статью!
        0
        Отличная статья. Как раз несколько друзей столкнулись с проблемой выбора стратегии (кто-то потерял работу в кризис, кто-то не может больше получать копейки перекладывая бумажки), и было очень непросто найти (в одном месте) гайд по движению в сторону девелопера. Переслал жаждущим ссылку :)
          –2

          Все верно, единственно начинать рекомендую не с React а с Vue. И после него уже переходить на React.


          Плюс уже на уровне изучение Vue + Vuex можно начать зарабатывать на хлеб с маслом и постепенно переходить на React и MobX. Как разобрались с MobX можно уже покуситься на Redux + Redux Thunk + Reselect. Если и их освоили — то можно уже начинать изучать GraphQl.


          После того как Graphql сдастся — изучить Next/Nuxt + express + passport.js + sequilize + SQL + NoSql + Pm2 и стать уже full stack.


          Либо как вариант уйти в firebase + ReactNative и пилить простенькие приложения на мобилу после чего уходить в Java/Kotlin либо в Swift/ObjectiveC


          Есть еще вариант упороться и уйти в Rust + wasm.

            +1

            Очень спорная цепочка технологий.
            React супер популярный (на порядок), именно это и является причиной "начать с него".
            GraphQL — исключительно опциональная вещь, можно всю жизнь работать и так ни разу его и не коснуться. Хорошая технология? Определенно. Присутствует везде? Определенно нет.


            Redux/Redux-Thunk/Reselect куда проще в освоении, чем идея Observables в Mobx для новичков. С Mobx у разработчика развязаны руки в архитектурном плане, что может быть проблемой для начинающих разработичков: им нужны примеры хороших архитектур, а не песочница.


            Firebase хорош для старта, когда нужен бекенд: firebase бесплатен и имеет хорошую админку.

              0
              С Mobx у разработчика развязаны руки в архитектурном плане

              С редуксом не меньше, такого могут наворотить… Джуны любым инструментом творят дичь.
              Мобикс — всё таки ООП, исследованный вдоль и поперек. Паттерны проектирования, работы всяких классиков. Это проверено временем.

                0
                React популярней в России, возможно это так, но на западе и в Китае Vue уже более популярен. Можно посмотреть по звездам на гитхабе и по количеству статей и обучающих видео на зарубежных ресурсах. К нам все это тоже скоро прийдет, может год-два и React будет позади. Поэтому действительно — сейчас лучше начинать с Vue
                0
                Все верно, единственно рекомендую потом не переходить на React.
                  0

                  После MobX читать про Redux + Redux Thunk + Reselect (особенно Reselect) можно разве что в виде страшилки на ночь. Да и учитывая, что у мобикса и редукса диаметрально противоположные философии, это может разорвать мозг новичка).


                  А насчёт РеактНатив — может, всё таки доведут его до ума, чтобы уходить во всякую ересь не надо было...

                  –2

                  Часто всплывают истории успеха вайтишников в ленте, в 90% случаев это фронтендеры. Неужели такой большой спрос?

                    0
                    Неужели такой большой спрос?

                    hh.ru
                    3 372 вакансии «javascript»
                    3 044 вакансии «java»
                    1 448 вакансий «react»
                    1 376 вакансий «c++»
                    1 531 вакансия «php»
                    39 вакансий «rust»

                      –1

                      В эти 3к вакансий входят комбинации javascriptt с другими (основными) языками в вакансии. Например:


                      3 393 вакансии «javascript»


                      721 вакансии «javascript java»
                      203 вакансий «javascript c++»
                      913 вакансия «javascript php»
                      621 вакансия «javascript python»
                      490 вакансия «javascript с#»
                      17 вакансий «javascript rust»


                      Итого: максимум 428 чистых javascript вакансий
                      По hh сложно судить о популярности, нет фильтра по языку, а поиск работает не как в гугле

                    0
                    Выучи этот язык, потом этот )
                    Возможно именно из-за такого пути большая часть приложений люто лагает.

                    В список очень стоит добавить рекомендацию хоть немного поучиться собственно программированию. Алгоритмы, паттерны/анти-паттерны. «Совершенный код», refactoring.guru — для ленивых
                      +1
                      Спасибо за комментарий! Понимаю, о чём вы говорите. На мой взгляд к этому стоит приступать изучив хотя бы один язык, чтобы понимать, о чем идет речь, например, в книге «Совершенный код». Но я ее также очень советую, спасибо, что дописали)

                      По поводу паттернов: refactoring.guru отличный ресурс, согласна. Однако там нет примеров на JavaScript (хотя и есть на TypeScript), поэтому в список добавляла не его, а книгу по Паттернам проектирования на JS (Learning JavaScript Design Patterns в разделе «Углубленное»).
                      0
                      К разделу «Подготовка» еще стоит добавить репозиторий javascript-questions на github. Список JS вопросов с ответами и объяснениями.
                        0
                        Интересные вопросы, спасибо, что поделились!
                        0
                        del
                          0

                          А можно как-то потом расколдоваться обратно?

                            0
                            Странная статья. Т.е. если ставить целью войти во фронт разработку логично пойти на какие-нибудь курсы(их полно, как и бесплатные типа freeCodeCamp, так и с небольшой оплатой). Самый главный вопрос — как выбрать то что будет максимально практически полезно(т.е. на каждый потраченный час даст больше знаний)
                            Проходили ли вы какие-нибудь курсы?
                            И обучали ли кого-нибудь по приведенному списку?
                              0

                              Добрый день! Согласна, что пойти на курсы логично — я также писала о том, что рекомендую это сделать, особенно если совсем нет опыта в разработке — с хорошим наставником обучение может быть более быстрым. Но при этом думаю, что 1) не все могут себе позволить хорошие курсы на освоение профессии в известной школе, 2) некоторым людям полноценный курс может быть излишен и они смогут получить все знания самостоятельно из открытых источников, курсов и книг в своем темпе — в таком случае хотелось бы просто помочь сориентироваться в обучении, 3) данный список ресурсов в любом случае может быть полезен как дополнительный источник информации при обучении.


                              Среди оставленных рекомендаций несколько раз ссылалась в том числе на freeCodeCamp, udemy, курсы на youtube:)


                              Что касается меня, то я проходила курсы и не одни, когда только начинала знакомиться с программированием, а также заканчивала основную программу Технопарка при МГТУ им. Н.Э. Баумана с курсом по фронтенд-разработке и по окончании была ментором по фронтенду.


                              Большинством ресурсов из приведенного списка я пользовалась сама (так как в свое время переквалифицировалась из C++/Python-разработчика во фронт) и они были мне очень полезны. Сложно выделить максимально полезное, ведь разным людям нравятся разные подходы, именно cвоим опытом я и попыталась поделиться в данной статье. Если у вас другое видение — поделитесь, это будет полезно!:)

                                0
                                Ну т.е. вы сами учились совсем по другому. У вас был путь
                                1 — пошли в «Технопарк при МГТУ им. Н.Э. Баумана с курсом по фронтенд-разработке»
                                2 — при обучении там использовали описываемую вами литературу-курсы
                                Ключевой момент(рекомендация) который опущен в статье — идите в Технопарк, там вас научат. Было бы кстати круто расписать как проходит обучение, какие преимущества и главное недостатки вы увидели(может быть тема для следующей статьи)
                                Ну т.е. у меня большие сомнения что пункт 2 будет работать без пункта 1. Или может и будет, но с большими временными затратами, менее качественно.
                                некоторым людям полноценный курс может быть излишен и они смогут получить все знания самостоятельно из открытых источников, курсов и книг в своем темпе

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

                              Спасибо. Полезная статья. Я сейчас учусь на веб-разработчика. На курсе от очень известной IT компании. Очень интересно.

                                0
                                -

                                Only users with full accounts can post comments. Log in, please.