Front-end
разработчик
Что входит в курс
Сколько зарабатывают Front-end разработчики
Как проходит обучение
Чему вы научитесь
Верстать сайты и создавать интерфейсы для всех типов устройств
Вы освоите различные концепции и техники вёрстки. Также научитесь создавать сложные интерфейсы для веб-приложений и адаптировать проект для любых типов устройств.
Создавать сложные веб-приложения на React
React – самая популярная и перспективная библиотека для создания веб-приложений. Вы научитесь создавать на React веб-приложения любой сложности и изучите, в каких областях применима эта библиотека.
Готовить проекты для запуска в Production
Вы изучите различные системы сборки веб-приложений, которые упрощают разработку и соберёте Production-версию собственного проекта. Также научитесь перемещать проект на Production-сервер. Благодаря этому навыку вы освоите весь цикл разработки веб-приложения: от создания до запуска.
Какие технологии вы освоите
Программа курса
- Краткая история Web и что такое интернет.
- Как устроен браузер и как он получает страницы по сети.
- Что такое Git?
- Создание первого репозитория.
- О файле .gitignore.
- Настройка рабочей среды.
- Краткая история HTML.
- Какие бывают теги и что такое атрибут.
- Теги для работы с текстом.
- Создание собственной страницы.
- Мета-теги.
- Теги для работы со списками.
- Теги для работы с таблицами.
- Теги для работы с формами.
- Div-блоки.
- Краткая история CSS.
- Подключение стилей.
- Что такое CSS-селектор?
- Что такое CSS-свойство?
- Для чего нужен !important и стоит ли его применять?
- Как определены приоритеты стилей в CSS?
- Отступы, границы и box-sizing.
- Типографика в Web.
- Свойства для работы с текстом.
- Текстовые эффекты.
- Мнемоники.
- Что такое шрифт и где его взять?
- Способы подключения шрифтов.
- Тег img и его атрибуты.
- Изображение как фон.
- Sprites: преимущества и недостатки.
- Иконочные шрифты.
- SVG как продвинутый инструмент.
- Основные термины.
- Использование медиа - запросов.
- Блочная модель и для чего нужен container.
- Способы организации сетки.
- CSS Grid Layout и его отличие от Flexbox.
- Псевдоклассы и псевдоэлементы.
- Позиционирование элементов.
- Тени и градиенты.
- Трансформация элементов.
- Анимация.
- Семантика в HTML.
- Работа с аудио и видео.
- Переменные в CSS.
- Что такое БЭМ?
- Альтернативы БЭМ.
- Введение в NPM.
- Современная сборка Front-end и что такое boilerplate.
- Работа с Pug.
- Работа с SCSS.
- Подключение stylelint.
- NPM - скрипты.
- Bootstrap.
- Foundation.
- Semantic UI.
- UIkit.
- Materialize.
- Material Design Lite.
- Less.
- Sass.
- Stylus.
- Коротко о CSS-in-JS.
- Демонстрация курсовых проектов.
- Краткая история JavaScript и зачем он нужен.
- Работа в терминале.
- Погружение в Git.
- Подключение ESLint.
- Работа с Husky.
- Переменные и типы данных.
- Преобразование типов.
- Базовые операторы.
- Условия и циклы.
- Значения Infinity, NaN, undefined, null.
- Синтаксис функций.
- Способы объявления функций.
- Что такое arguments, rest и return.
- Самовызывающиеся функции.
- Глобальные функции.
- Стек вызовов.
- Области видимости.
- Замыкания.
- Рекурсия.
- Методы для работы со строками.
- Базовый поиск в строке.
- Регулярные выражения.
- Сравнение строк.
- Создание массива.
- Копирование массива.
- Методы для работы с массивами.
- Способы перебора массивов.
- Деструктуризация массива.
- Что такое spread у массивов.
- Создание объекта.
- Копирование объекта.
- Оператор delete.
- Методы для работы с объектами.
- Способы перебора объектов.
- Деструктуризация объектов.
- spread у объектов.
- Метод Object.defineProperties.
- Основы ООП.
- Функция как класс.
- Оператор new и значение this.
- Прототип.
- Методы call, apply, bind.
- Что такое class, extends, constructor, super.
- Коллекции объектов по ключу.
- JSON.
- Математические вычисления.
- Работа с датой.
- Итераторы.
- Создание элементов.
- Работа с атрибутами и контентом.
- Навигация по элементам.
- Поиск элементов.
- Стили и классы.
- Размеры, прокрутка, координаты.
- addEventListener и типы событий.
- Всплытие и погружение.
- Делегирование событий.
- Действия браузера по умолчанию.
- События форм и их элементов.
- Интерфейсные события.
- События загрузки.
- Таймеры.
- Promise.
- Event loop.
- fetch vs XMLHttpRequest.
- async/await vs генераторы vs callbacks.
- BOM в контексте window.
- screen.
- navigator.
- location.
- history.
- Отправка файлов на сервер из формы.
- Подробно о File и что такое Blob.
- Принцип работы с Canvas.
- Обзор возможностей Canvas.
- MIME types.
- DataURL и что такое Base64.
- Зачем нужно знать алгоритмы Front-end разработчику?
- Базовые математические алгоритмы.
- Базовые алгоритмы работы со строками.
- Базовые алгоритмы поиска.
- Базовые алгоритмы сортировки.
- Оценка сложности алгоритма.
- Зачем нужно знать структуры данных Front-end разработчику?
- Связные списки.
- Очередь.
- Стек.
- Хэш таблицы.
- Куча.
- Деревья.
- Графы.
- Демонстрация курсовых проектов.
- Повторение пройденного материала.
- Stash.
- Тэгирование.
- Rebase.
- Chery-pick.
- Популярные приемы работы с ветками.
- Что такое шаблоны проектирования и зачем их использовать?
- Порождающие шаблоны (Creational).
- Структурные шаблоны (Structural).
- Поведенческие(Behavioral).
- Клиент-сервер.
- Компонентная.
- Событийная.
- REST.
- MV*.
- Однонаправленные потоки данных.
- Что такое SPA?
- Повторение HTML5 History API.
- Web Components.
- Беглый обзор современных инструментов разработки SPA.
- Установка.
- Настройка конфиг-файлов.
- Обзор и установка плагинов.
- Babel.
- Первый build и запуск dev-сервера.
- Краткая история развития React.
- Беглый обзор react-create-app.
- Что такое JSX?
- Работа с props.
- Работа со списками.
- React Developer Tools
- Stateless и Statefull компоненты.
- Обработка событий.
- Стадии жизненного цикла.
- Методы жизненного цикла.
- PureComponent и React.memo.
- Компоненты высшего порядка.
- React-Router.
- Настройки WebpackDevServer.
- Что такое Redux?
- Создание Actions.
- Создание Reducers.
- Работа со Store.
- React Redux.
- connect.
- Redux DevTools.
- Redux-Actions.
- Зачем нужны Hooks?
- Основные отличия компонента с использованием Hooks от классового компонента.
- Обзор встроенных Hooks.
- Создание собственных Hooks.
- Hooks для работы с React-Router.
- Hooks для работы с Redux.
- Что такое Middleware.
- Middleware в режиме разработки.
- Подключение Redux-Saga.
- Углубление в CSS-in-JS.
- Установка JSS.
- Создание тем.
- Подключение стилей.
- Демонстрация курсовых проектов.
- Итоговые консультации по дипломному проекту.
- Демонстрация дипломных проектов.
- Выдача сертификатов.
- Выпускной.
Что будет после обучения
Преподаватели
Преподаватель курсаДарья Бондарева- 💪2,5+ года в front-end
- 😌Работала как в аутсорсинговых, так и в продуктовых компаниях
- 😎Занималась разработкой платформы для трейдинга криптовалюты и крупной CRM-системы
- 💬"Преподаю в Intellect Fox, потому что нравится помогать людям менять жизнь и продолжать верить в себя. Простым языком объясняю сложные и непонятные темы ещё с университета. А на факультете прикладной математики и информатики их было достаточно😅"
Преподаватель курсаСтас Гончаров- 💪3+ года в front-end
- 😌C нуля изучал программирование и попал в IT
- 😎Разрабатывал проекты в разных сферах
- 👏Помог стать программистами 15+ студентам
Автор курсаАндрей Богомолов- 💪8 лет занимается разработкой
- 😌Работал в аутсорсинговых и продуктовых компаниях
- 😎Возглавлял команду Front-end разработки в аутсорсинговой компании
- 👏Помог стать программистами 50+ студентам
Учитесь в Intellect Fox и получайте подарки
Стоимость обучения
консультацию
Часто задаваемые вопросы
Для того, чтобы «войти» в IT как инженер, профессия Front-end разработчика — отличный вариант для тех, кто никогда не занимался программированием. Технологии, которые необходимы для этой профессии, достаточно легко освоить и язык JavaScript — один из самых простых в программировании.
Думаем, что да. Главное, чтобы вы могли уделять обучению минимум 10 часов в неделю: прорабатывать теорию после занятий, выполнять практические задания и читать дополнительные материалы, которые рекомендует преподаватель.
Курс построен таким образом, что 20% изучаемого материала составляет теория и 80% — это практические примеры. После каждого занятия вам даются домашние задания, которые в будущем вы будете использовать в курсовых работах.
Любой вопрос преподавателю вы сможете задать на онлайн-занятии. Но не забывайте, что у вас ещё всегда на связи будет опытный ментор, который ответит на любой вопрос по программированию:)
После каждого занятия преподаватель будет отправлять в telegram-чат видеозапись занятия. А ещё у вас всегда на связи будет ментор, который поможет разобраться с практическими заданиями и ответит на вопросы по программированию. Также все материалы будут доступны после окончания курса, чтобы вы могли освежить в памяти выученное.
Занятия проводятся онлайн 2 раза в неделю в вечернее время по 3 часа. Плюс к этому нужно будет делать практические задания. И для обучения вам понадобится минимум 10 часов свободного времени в неделю, что вполне реально для совмещения работы, учёбы и личной жизни:)
При получении сертификата на курсе мы поможем вам правильно составить резюме и расскажем, как подготовиться к собеседованию. Также после окончания обучения у вас останется доступ к telegram-чату, где мы будем оставаться на связи и по возможности помогать вам.
Если у вас не получится пройти курс до конца, выполнить все курсовые работы и дипломный проект, то мы выдадим вам справку. В ней будет указана информация о прохождении определённого количества часов по курсу «Front-end разработчик» и основные навыки, которые вы получили в процессе обучения. Также у вас останется доступ ко всем материалам занятий курса.
На онлайн-курсах вы сэкономите минимум час времени из-за того, что не нужно никуда ехать, и сможете потратить это время на обучение. Как показала практика, онлайн-обучение не меньше дисциплинирует, чем оффлайн. И на наших занятиях все студенты по возможности присутствуют с включенными камерами, чтобы меньше отвлекаться на социальные сети😅
Да, вы можете оплатить курс «Front-end разработчик с нуля» в 3 части. Но при полной оплате за весь курс стоимость обучения ниже на 50 BYN.