Front-end
разработчик
Что входит в курс
Сколько зарабатывают Front-end разработчики
Как проходит обучение
Чему вы научитесь
Верстать сайты и создавать интерфейсы для всех типов устройств
Вы освоите различные концепции и техники вёрстки. Также научитесь создавать сложные интерфейсы для веб-приложений и адаптировать проект для любых типов устройств.
Создавать сложные веб-приложения на React
React – самая популярная и перспективная библиотека для создания веб-приложений. Вы научитесь создавать на React веб-приложения любой сложности и изучите, в каких областях применима эта библиотека.
Готовить проекты для запуска в Production
Вы изучите различные системы сборки веб-приложений, которые упрощают разработку и соберёте Production-версию собственного проекта. Также научитесь перемещать проект на Production-сервер. Благодаря этому навыку вы освоите весь цикл разработки веб-приложения: от создания до запуска.
Какие технологии вы освоите
Программа курса
- Краткая история Web и что такое интернет
- Как устроен браузер и как он получает страницы по сети
- Что такое Git
- Создание первого репозитория
- О файле .gitignore
- Настройка рабочей среды
- Краткая история HTML
- Какие бывают теги и что такое атрибут
- Теги для работы с текстом
- Создание собственной страницы
- Основы ветвления Git
- Создание pull request на GitHub
- Мета-теги
- Мнемоники
- Теги для работы со списками
- Теги для работы с таблицами
- Теги для работы с формами
- Разница между div и span
- Краткая история CSS
- Подключение стилей
- Что такое CSS-селектор
- Что такое CSS-свойство
- Наменование CSS-классов
- Для чего нужен !important и стоит ли его применять
- Как определены приоритеты стилей в CSS
- Отступы, границы и box-sizing
- Типографика в Web
- Что такое шрифт и где его взять
- Способы подключения шрифтов
- Свойства для работы с текстом
- Текстовые эффекты
- Favicon
- Тег img и его атрибуты
- Изображение как фон
- Способы работы с цветом
- Градиенты
- Sprites: преимущества и недостатки
- Иконочные шрифты
- SVG как продвинутый инструмент
- Методология BEM
- Основные термины
- Использование медиа - запросов
- Блочная модель и для чего нужен container
- Переменные в CSS
- Построение адаптивной сетки на flexbox
- CSS Grid Layout
- Псевдоклассы и псевдоэлементы
- Позиционирование элементов
- Тени
- CSS-фигуры
- Трансформация элементов
- Семантика в HTML
- Работа с аудио и видео
- Анимация
- Введение в NPM
- Современная сборка Front-end и что такое boilerplate
- Работа с Pug
- Обзор препроцессоров
- Подключение stylelint
- NPM - скрипты
- Bootstrap
- Foundation
- Semantic UI
- UIkit
- Materialize
- Material Design Lite
- Разбор популярных кейсов
- Демонстрация курсовых проектов.
- Краткая история JavaScript и зачем он нужен
- Работа в терминале
- Погружение в Git
- SSH аутентификация
- Подключение ESLint
- Работа с Husky
- Переменные и типы данных
- Преобразование типов
- Базовые операторы
- Значения Infinity, NaN, undefined, null
- Условия и циклы
- Синтаксис функций
- Способы объявления функций
- Что такое arguments, rest и return
- Самовызывающиеся функции
- Глобальные функции
- Рекурсия
- Отладка
- Обработка ошибок
- Стек вызовов
- Области видимости
- Замыкания
- Основы unit-тестирования
- Методы для работы со строками
- Базовый поиск в строке
- Регулярные выражения
- Сравнение строк
- Создание массива
- Копирование массива
- Методы для работы с массивами
- Способы перебора массивов
- Деструктуризация массива
- Что такое spread у массивов
- Создание объекта
- Копирование объекта
- Оператор delete
- Геттеры и сеттеры
- Методы для работы с объектами
- Способы перебора объектов
- Деструктуризация объектов
- spread у объектов
- Метод Object.defineProperties
- Основы ООП
- this
- Функция конструктор
- Оператор new
- Прототип
- Статические методы
- Методы call, apply, bind
- Что такое class, extends, constructor, super, static
- Коллекции объектов по ключу
- JSON
- Математические вычисления
- Работа с датой
- Итераторы
- Создание элементов
- Работа с атрибутами и контентом
- Навигация по элементам
- Поиск элементов
- Стили и классы
- Размеры, прокрутка, координаты
- Типы событий
- addEventListener и addRemoveListener
- Всплытие и погружение
- Делегирование событий
- Действия браузера по умолчанию
- События форм и их элементов
- Интерфейсные события
- События загрузки
- MutationObserver
- Таймеры
- Promise
- Event loop
- HTTP
- AJAX
- fetch vs XMLHttpRequest.
- CORS
- Знакомство с REST и GraphQL
- async/await vs генераторы vs callbacks
- BOM в контексте window
- screen
- navigator
- location
- history
- Browser storages
- Отправка файлов на сервер из формы
- File API
- Принцип работы с 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
- Краткая история развития React
- Беглый обзор react-create-app
- Что такое JSX
- Работа с props
- Работа со списками
- React Developer Tools
- Установка
- Настройка конфиг-файлов
- Обзор и установка плагинов
- Babel
- Первый build и запуск dev-сервера
- Stateless и Stateful компоненты
- Обработка событий
- Стадии жизненного цикла
- Методы жизненного цикла
- PureComponent и React.memo
- Зачем нужны Hooks
- Основные отличия компонента с использованием Hooks от классового компонента
- Обзор встроенных Hooks
- Создание собственных Hooks
- Работа с Context
- Работа с Refs
- Компоненты высшего порядка
- React-Router
- Настройки WebpackDevServer
- React-Router hooks
- Создание layouts
- Что такое Redux
- Создание Actions
- Создание Reducers
- Работа со Store
- React Redux
- connect
- Redux hooks
- Redux DevTools
- Redux-Actions
- Что такое Middleware
- Middleware в режиме разработки
- Подключение Redux-Saga
- Углубление в CSS-in-JS
- Обзор CSS-in-JS библиотек
- Создание тем
- Подключение стилей
- Разбор популярных кейсов
- Демонстрация курсовых проектов
- Выдача заданий на дипломный проект
- Итоговые консультации по дипломному проекту
- Демонстрация дипломных проектов
- Выдача сертификатов
- Выпускной
Что будет после обучения
Преподаватели
Преподаватель 5 потокаАртём Телущенко- 💪2+ лет в Full Stack разработке
- 😌Работал в аутсорсинговых компаниях
- 😎Во время учёбы на инженера-энергетика, понял, что это не моё и решил попробовать себя в программировании. Как видите, всё получилось:)
- 💬“По своему опыту знаю, как сложно войти в IT с нуля и кардинально сменить сферу деятельности. Поэтому хочу помочь добиться этой цели своим студентам и вырастить из них крутых разработчиков.”
Преподаватель 4 потокаКирилл Бубенцов- 💪5+ лет в front-end
- 😌Работал в стартапах, продуктовых и аутсорсинговых компаниях
- 😎Разрабатывал enterprise приложения
- 👏Занимался менторством и с моей помощью 5 человек с нуля стали Junior разработчиками
- 💬"Люблю учиться, обучать других и видеть результат своей работы. Поэтому я здесь😅"
Преподаватель 3 потокаДарья Бондарева- 💪2,5+ года в front-end
- 😌Работала как в аутсорсинговых, так и в продуктовых компаниях
- 😎Занималась разработкой платформы для трейдинга криптовалюты и крупной CRM-системы
- 💬"Преподаю в Intellect Fox, потому что нравится помогать людям менять жизнь и продолжать верить в себя. Простым языком объясняю сложные и непонятные темы ещё с университета. А на факультете прикладной математики и информатики их было достаточно😅"
Преподаватель 2 потокаСтас Гончаров- 💪3+ года в front-end
- 😌C нуля изучал программирование и попал в IT
- 😎Разрабатывал проекты в разных сферах
- 👏Помог стать программистами 15+ студентам
Автор курса, преподаватель 1 потокаАндрей Богомолов- 💪8 лет занимается разработкой
- 😌Работал в аутсорсинговых и продуктовых компаниях
- 😎Возглавлял команду Front-end разработки в аутсорсинговой компании
- 👏Помог стать программистами 50+ студентам
Учитесь в Intellect Fox и получайте подарки
Стоимость обучения
консультацию
Часто задаваемые вопросы
Для того, чтобы «войти» в IT как инженер, профессия Front-end разработчика — отличный вариант для тех, кто никогда не занимался программированием. Технологии, которые необходимы для этой профессии, достаточно легко освоить и язык JavaScript — один из самых простых в программировании.
Наш курс разработан не только для тех, кто уже что-то изучал, но и для тех, кто хочет освоить профессию с нуля. Главное, чтобы вам было это интересно и вы могли уделять обучению минимум 12 часов в неделю (не включая онлайн-занятия): выполнять теоретические и практические задания, читать дополнительные материалы, которые рекомендует преподаватель.
Мы рекомендуем идти на курс с базовыми знаниями английского. Занятия проходят на русском языке, но большинство материалов для изучения мы даем на английском. Также в требованиях большинства вакансий "Junior Front-end developer" минимальный уровень английского Pre-intermediate (A2).
Курс построен таким образом, что 20% изучаемого материала составляет теория и 80% — это практические примеры. После каждого занятия вам даются домашние задания, которые в будущем вы будете использовать в курсовых работах.
Любой вопрос преподавателю и ментору вы сможете задать в чате группы. Кроме этого на онлайн-занятиях вы сможете общаться с преподавателем.
На следующий день после каждого занятия мы высылаем в чат группы видеозапись занятия, доступ к записям и другим материалам у вас останется навсегда. А если будет что-то непонятно, вы сможете задать вопрос в чате группы, и вам помогут.
Занятия проводятся онлайн 2 раза в неделю в вечернее время по 3 часа. Плюс к этому нужно будет выполнять теоретические и практические задания. В среднем наши студенты тратят минимум 12 часов в неделю на домашние задания.
При получении сертификата на курсе мы поможем вам правильно составить резюме, профиль в LinkedIn и расскажем, как подготовиться к собеседованию. Также после окончания обучения у вас останется доступ к чату группы, где мы будем оставаться на связи и по возможности помогать вам.
Если у вас не получится пройти курс до конца, выполнить все курсовые работы и дипломный проект, то мы выдадим вам справку. В ней будет указана информация о прохождении определённого количества часов по курсу «Front-end разработчик» и основные навыки, которые вы получили в процессе обучения. Также у вас останется доступ ко всем материалам занятий курса.
На онлайн-курсах вы сэкономите минимум час времени из-за того, что не нужно никуда ехать, и сможете потратить это время на обучение. Сейчас большинство компаний работают удаленно, поэтому онлайн-курс поможет вам развить навыки удаленной работы.
Да, вы можете разбить оплату курса «Front-end разработчик» на 3 этапа. Но при полной оплате за весь курс стоимость обучения ниже на 50 BYN.