Top.Mail.Ru

Онлайн-курс Фронтенд-разработчик

Курс для новичков, которые хотят погрузиться в сферу IT и трудоустроиться в компанию на подходящую вакансию

  • Сделаете 12 интересных проектов в портфолио во время обучения.
  • За 9 месяцев станете Junior Фронтенд-разработчиком.
  • Выполните и защитите дипломный проект.
  • Составите резюме, пройдёте собеседование и будете готовы к трудоустройству в компанию.
  • Возможность вернуть 13% налогов от государства за обучение.

старт потока

08 апреля

Рынок нуждается в хороших Фронтенд-разработчиках

Сфера IT становится все более популярной и проникает во все жизненные процессы. Один из самых простых и действенных способов погрузиться в эту среду — вёрстка веб-страниц, разработка на языке JavaScript, TypeScript и библиотеке React.

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

База и практика на курсе помогут трудоустроиться в офис, на удалёнку или выйти на фриланс

Скрин сайта fl.ru, с поиском по вакансии верстальщик
Вакансии отфильтрованы следующим образом: Удаленная работа, Указан доход, Без опыта

50 000₽*

Работодатель готов платить новичкам без опыта работы.

*Сумма может меняться в зависимости от региона. Через год опыта эта цифра возрастает, т.к вы можете обучаться новым технологиям как в компании, так и самостоятельно.

Мы поможем вам добиться результата

Фото преподавателя, Максима Лескина

Преподаватель — Максим Лескин

Преподаватель курса «Фронтенд-разработчик» прошёл путь от работника завода в Челябинске до сотрудника веб-студии, фрилансера, автора и преподавателя курсов по фронтенд-разработке.

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

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

За 3 года преподавания его курсы прошли более тысячи студентов.

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

Видео из серии «Основы JavaScript для начинающих»

Программа курса

В одном уроке может быть несколько тем или по одной теме может быть несколько уроков.

11 модулей

198 Видеоуроков

96 Практических заданий

  • Подготовительный модуль

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

    6

    Видеоуроков

    1

    Практических заданий

  • Знакомство с HTML

    • Структура HTML
    • Списки и Таблицы
    • Ссылки
    • Работа с изображениями
    • Формы
    • Типы Элементов и Семантика + Emmet

    После этого модуля вы разберётесь где и какой тег использовать. Научитесь писать разметку правильно и профессионально.

    15

    Видеоуроков

    6

    Практических заданий

    Курсовая работа

    Тема: Создание HTML-структуры страницы с соблюдением современных требований.

  • Введение в CSS + Инструменты разработчика

    • Структура CSS
    • Псевдоэлементы и Псевдоклассы
    • Единицы измерения
    • Figma & Pixso
    • Наследование. Форматирование текста и списков
    • Шрифты
    • Цвет, графика, фон и фоновые изображения
    • Normalize и глобальные стили
    • Методология БЭМ
    • Блочная модель
    • Отступы и граница (border)
    • Позиционирование
    • GIT — система контроля версий (часть 1)

    После этого модуля стилизовать любой элемент не составит труда. Вы изучите структуру и все основные CSS-свойства. Каждый современный верстальщик должен уметь пользоваться инструментами для работы с макетами и GIT, а также знать методологию БЭМ и правильно её использовать.

    26

    Видеоуроков

    14

    Практических заданий

    Курсовая работа

    Тема: Создание и подключение стилей к проекту.

  • Современный CSS

    • Flexbox
    • Состояния — hover, focus, active
    • CSS3-анимации
    • CSS3-свойства
    • Адаптивная вёрстка
    • Pixel Perfect
    • Grid Layout

    По окончанию этого модуля вы освоите базу для полноценной вёрстки макета любой сложности. Но впереди самое интересное.

    17

    Видеоуроков

    7

    Практических заданий

    Курсовая работа

    Тема: Использование продвинутых инструментов в современных проектах.

  • Знакомство с JavaScript

    • Основы программирования и Javascript
    • Типы данных, динамическая типизация
    • Условия
    • Функции. Главный строительный блок
    • Циклы
    • Структурные типы данных — Массивы
    • Методы для итерации массивов
    • Структурные типы данных — Объекты
    • Структурные типы данных — Коллекции
    • Отладка кода + ESLint
    • Функции. Стек вызовов, рекурсия, this
    • Функции. Область видимости, замыкание, IIFE

    По итогу модуля вы познакомитесь с основами JavaScript, изучите типы данных и их методы, условия, циклы, функции. Напишите приложение для закрепления основных тем.

    27

    Видеоуроков

    12

    Практических заданий

    Курсовая работа

    Тема: Закрепление основ JavaScript.

  • DOM & BOM. Знакомство

    • DOM-document
    • GIT (Часть 2)
    • Свойства и методы элементов
    • Практика. Телефонный справочник
    • События — Event
    • События — Делегирование
    • Формы
    • Хранилища — Storage
    • Паттерн — Модуль
    • Рефакторинг CRM

    По итогу модуля вы познакомитесь с DOM & BOM и напишите CRM-приложение для управления базой данных.

    18

    Видеоуроков

    10

    Практических заданий

    Курсовая работа

    Тема: Работа с DOM. Манипуляции с элементами и вывод данных налету.

  • DOM & BOM — API браузера

    • BOM — Браузер
    • Дата и таймеры
    • Интерактив
    • Анимации и requestAnimationFrame (RAF)
    • Fetch. Получение данных
    • AJAX и отправка данных
    • Знакомство с Promise
    • Формат Base64 и работа с файлами
    • Методы объекта Promise: then, catch, all, etc.
    • Регулярные выражения / RegExp
    • Эко-система JS / NPM
    • jQuery (необязательный урок)
    • Cookies и Готовые решения
    • webSocket
    • Webpack и Babel

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

    23

    Видеоуроков

    14

    Практических заданий

    Курсовая работа

    Тема: Работа с DOM. Оживление статичной страницы.

  • Профессиональная вёрстка

    • Доступность (accessibility)
    • Автоматизация — GULP
    • Препроцессор SCSS
    • Оптимизация проекта
    • Кроссбраузерная и Кроссплатформенная вёрстка
    • Финальная сборка GULP

    В этом модуле вы изучите дополнительные инструменты улучшения и автоматизации вёрстки. Сможете реализовывать проекты на новом, профессиональном уровне. Станете более конкурентны на рынке труда или фрилансе.

    10

    Видеоуроков

    5

    Практических заданий

    Курсовая работа

    Тема: Закрепление профессиональной вёрстки.

  • Программирование на JavaScript ( ТАРИФ ФЛЕКС+ )

    • Парадигмы программирования
    • Прототип и функция конструктор
    • ООП — Инкапсуляция
    • ООП — Наследование. Практика
    • ООП — Полиморфизм Паттерны
    • Паттерны ООП
    • Тестирование (unit тесты, end-to-end тесты)
    • Функции высшего порядка и паттерны

    В этом модуле мы изучим темы которые из вас сделают востребованного специалиста — frontend-разработчика. Данный модуль для вас открывает двери дальнейшего, с пониманием дела, изучения фреймворков: React, Vue, Angular и node.js.

    20

    Видеоуроков

    8

    Практических заданий

    Курсовая работа

    Тема: ООП.

  • ReactJS & Redux

    • Знакомство с React
    • JSX, Компоненты и Props
    • Классовый компонент: состояние и жизненный цикл
    • Функциональный компонент, Хуки
    • Списки и ключи
    • Работа с API, Авторизация
    • Prop drill, Context
    • Portals & Refs
    • Знакомство с Redux
    • React и Redux DevTools, combineReducer, Middleware, Redux-Thunk
    • React Роутинг + бонус Бесконечная прокрутка
    • Современный Redux (Redux Toolkit)
    • Redux-Saga
    • React Deployment
    • React Form

    В этом модуле вы познакомитесь с разработкой на React и напишите SPA-приложение.

    28

    Видеоуроков

    14

    Практических заданий

    Курсовая работа

    Тема: Разработка SPA-приложения.

  • TypeScript ( ТАРИФ ФЛЕКС+ )

    • Знакомство с TS и Настройка окружения
    • Основные типы JS в TS
    • Типы TS: union, alias, literal, enum и contract
    • Приведение типов, typeguard и interface
    • ООП в TS
    • Generics
    • TS в React

    В этом модуле вы познакомитесь с TypeScript. Научимся типизировать JavaScript с помощью TypeScript.

    8

    Видеоуроков

    5

    Практических заданий

  • Итоговый проект

    Результатом итогового проекта станет полностью свёрстанный, адаптивный и кроссбраузерный живой проект на чистом JavaScript и с качественным дизайном, который будет не стыдно положить в портфолио. После защиты диплома вы будете готовы к устройству в студию.

Упаковка после курса

Максим Лескин

Должность:

Frontend-Разработчик

Зарплата от

50 000 ₽

Навыки

  • Flexbox, Grid
  • Figma, Photoshop
  • Адаптивная вёрстка
  • Доступность
  • PixelPerfect
  • Github
  • SCSS
  • EcmaScript (ES6+)
  • DOM, BOM
  • ООП
  • Ajax, JSON, Rest
  • React, Redux
  • TypeScript
  • Gulp, Webpack, Babel

Сертификат

Фото сертификата окончания онлайн школы Метэд

Сертификат

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

Сертификат поможет работодателю оценить структуру курса по которой вы обучались. Навыков полученных на курсе будет достаточно, чтобы устроиться в штат на позицию стажёра (junior) или принимать заказы на аутсорсе (вне штата) у компаний.

Подготовим к трудоустройству

После окончания обучения с вами будет работать опытный эйчар, который уже более 7 лет трудоустраивает джунов в компании в сфере ИТ.

Что он будет делать:

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

Фриланс

Окончив курс выпускники смогут брать заказы на фрилансе через фриланс-биржи и свои социальные сети.

Блок о трудоустройстве и фрилансе будет последним на нашем курсе.

Записи курса останутся у вас навсегда. А все обновления курса вы будете получать автоматически с этими записями.

Окружение при обучении

Скрин платформы Getcourse

Уроки в GetСourse

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

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

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

Для выполнение курсовой работы будет даваться дополнительное время.

Скрин Telegram

Общение в Telegram

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

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

Всё общение будет проходить в мессенджере Telegram. В нём есть удобное деление на разные каналы коммуникации и никакая информация не потеряется.

Там будут основные объявления по учёбе, информационные сообщения, каналы помощи и общения, а также персональные каналы с вашим куратором и группой.

Скрин сайта fl.ru, с поиском по вакансии верстальщик

Практика в VSCode

Сам код вы будете писать в программе VSCode. Это мощная программа для разработке на самых популярных языках программирования. У неё много полезных возможностей для верстальщиков и Front-end разработчиков, а так же есть большое количество плагинов, которые помогут улучшить качество работы с кодом.

Проекты будут сдаваться через GitHub и GitHub Pages. Таким образом вам не понадобится покупать домен и хостинг для обучения. А навык использования этих технологий полезен для современной разработки сайтов и пригодится вам в дальнейшем.

Отзывы участников

  • фотография участника

    Антон Шахов

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

    <...
  • фотография участника

    Павел Васильев

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

  • фотография участника

    Александр Загумённов

    Несколько дней назад я завершил прохождение курса по верстке от школы MethEd и хочу поделиться своими впечатлениями.

    Начну с того, зачем мне понадобился ...

  • фотография участника

    Максим Мельник

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

  • фотография участника

    Алексей Константинов

    Хороший курс, много знаний. Максим как всегда объясняет досконально.

    Заниматься пришлось очень плотно, иногда даже задачи мозг решал во сне. 😄 Сказывала...

Тарифы

ФЛЕКС

  • Доступ к видеоурокам и учебным материалам
  • Курсовые проекты
  • Проверка домашних заданий куратором
  • Общий чат со всеми участниками потока
  • Чат с куратором
  • Прямые трансляции в конце модуля
  • Защита дипломного проекта
  • Помощь при трудоустройстве и подборе вакансий
  • Именной Сертификат
  • До 28 видеосозвонов с кураторами
  • Уроки выходят сразу, как сдали предыдущий.
  • Комфортный темп и больше времени на домашние задания
69 000 ₽ 110 000 ₽

Подходит для тех, кто хочет быстрее изучить всё самое необходимое. Длительность курса составлена с учетом сдачи 3-х уроков в неделю

ФЛЕКС+

  • Доступ к видеоурокам и учебным материалам
  • Курсовые проекты
  • Проверка домашних заданий куратором
  • Общий чат со всеми участниками потока
  • Чат с куратором
  • Прямые трансляции в конце модуля
  • Защита дипломного проекта
  • Помощь при трудоустройстве и подборе вакансий
  • Именной Сертификат
  • До 48 видеосозвонов с кураторами
  • Уроки выходят сразу, как сдали предыдущий.
  • + 2 модуля (JavaScript и TypeScript).
  • + бонусный модуль.
  • Комфортный темп и больше времени на домашние задания
79 000 ₽ 120 000 ₽

Подходит для занятых людей. Длительность курса составлена с учетом сдачи 3-х уроков в неделю

Несколько вариантов оплаты

Способ оплаты кураса - логтип Мastercard Способ оплаты кураса - логтип Visa Способ оплаты кураса - логтип МИР

Банковской картой

Visa/Mastercard/МИР из любой страны

Беспроцентная рассрочка

Мы делим платёж на 2 части. Первую часть вы оплачиваете сразу, вторую через 30 дней после старта курса

Способ оплаты кураса - логтип Тинькофф

Банковская рассрочка без переплат на 6, 12 и 24 месяца

Первую оплату вы делаете через 30 дней после одобрения рассрочки. Доступно для граждан РФ, Беларуси и Казахстана.

Возврат

Если в течении первой недели вы поняли, что наш курс вам не подходит — мы вернём вашу оплату в полном размере независимо от причин.

FAQ