Top.Mail.Ru
Программа обучения
1 Этап: «Front - End разработка»
Верстка веб-страниц. HTML CSS
Результат:
1. Получили опыт работы с Git в команде по GitFlow
2. Научились верстать через HTML и задавать стили через CSS
Практика:
1. Создадите свой собстенный одностраничный сайт на HTML и CSS
Время прохождения : 1 месяц
Содержание:
Bash и Git. Установка Git, командная строка, настройка и подключение Git к проекту.
Флексбокс-вёрстка
Grid Layout. Гриды, терминология гридов, столбцы и строки внутри грид-контейнера
Создадите одностраничный сайт и напишите CSS для работающего приложения
Результат:
Практика:
Содержание:
1. Научились адаптивной верстке, верстке под планшеты, а также на маленькие экраны
1. Разработаете свою свобственную анимацию транзишн-перехода на другие страницы своего сайта
Адаптивная верстка, декорирование
Время прохождения : 1 месяц
Разработка интерфейса для разных устройств
Анимации
2D трансформации + транзишены. Transition, матрица трансформаций
1 Этап: «Front - End разработка»
2 Этап: JavaScript и TypeScript
3 Этап: Основы React
3. На практике изучили Grid Layout, а также флексбокс-верстку
2.Получили опыт и глубокое понимание анимации, а также транзишен-переходов
Шрифты и типографика. Подключение шрифтов к странице, настройки шрифтов, подключение внешних шрифтов
SVG. Экспорт svg, использование svg
3D трансформаци. Матрица 3D-преобразований
2 Этап: JavaScript и TypeScript
JavaScript
Время прохождения : 2,5 месяца
Содержание:
Перемененный и типы данных.
Работа с DOM. DOM: выбор элементов, атрибуты и их методы, манипуляции с классами CSS
Дебаггинг JavaScript. Чтение ошибок, типы ошибок
Содержание:
Введение в TypeScript. Динамическая и статическая типизация
Объектно-ориентированное программирование
Статические поля и методы, имплементация интерфейсов, дженерики, условные типы
Методы работы с данными, условия, циклы
Создание, добавление и удаление элементов в DOM
Массивы
Циклы. Функции. Объекты
Сборка проекта. Webpack. Библиотека пакетов NPM, подключение репозитория NPM пакетов
Модули в JS. IIFE, инкапсуляция и модули, директивы export и import
Асинхронность. Асинхронные операции, колбэки, асинхронные колбэки, таймеры, event loop, promise
Обработка событий
Работа с формами
Время прохождения : 1 месяц
TypeScript
2. Изучили и на практике освоили переменные, типы данных, классы, массивы и циклы
4. Изучили особенности сборщика мусора и роботу с памятью
3. На практике изучили исключения коллекции
11
12
13
14
Валидация форм
Работа c API. Протокол HTTP, запросы из JavaScript, формат JSON, HTTP-запрос, ответ, инструменты: вкладка Network
Результат:
Тултип, валидация, дропдаун, модальное окно, табы, аккордеон, слайдер, галерея
ООП в интерфейсах
Практика:
1. Разработаете фронтенд интернет-магазина с каталогом товаров, корзиной и оформлением заказа. Затем с помощью TypeScript и ООП расширите функционал приложения
Результат:
1. На практике научитесь работать с DOM
2. Применять дебаггинг JavaScript
3.Использовать ассинхронные колбэки
4.Глубоко разберетесь в понимании HTTP и работе с API
1. Подключите веб-сервис к серверу, чтобы все изменениях данных сохранились, и сервисом смогли пользоваться другие люди
2. Научитесь применять DOM, а также работать с API в реальном проекте
1. На практике освоите применение TypeScript
2. Научитесь применять статические поля и методы интерфейсов
Практика:
3 Этап: Основы React
Основы React
Результат:
1. Самостоятельно напишите фундамент проектного приложения на React.js.
2. Создадите Redux-хранилище. Реализуете роутинг и авторизацию в приложении.
Время прохождения : 1 месяц
Содержание:
Create React App, новый проект, распаковка и структура проекта
Синтаксис JSX. React и JSX, синтаксис JSX: основы, списки и события, функциональные компоненты
Компоненты и их жизненный цикл. Классовые компоненты, жизненный цикл классовых компонентов, virtual DOM
Импорт модулей, CSS-модули
Библиотеки компонент. Добавление классового компонента, работа в изоляции, storybookпроекта
React DevTools. Установка и использование расширения React DevTools, сборка
После успешного завершения обучения:
Сертификат
Персональный сертификат о прохождении специализации. По запросу на английском языке.
Развитие карьеры и бизнеса:
У вас будет:
У вас будет:
У вас будет:
У вас будет:
Консультации с ментором в течении обучения.
Подборки вакансий, инсайты рынка труда.
Проекты в ваше портфолио.
Реальный опыт на крауд-платформах.