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

Программа обучения

• Введение во frontend4 ак. часа

  • Базовые понятия. Как устроен web и клиент-серверное взаимодействие. Какие задачи делает frontend-разработчик. Обзор основных технологий (HTML, CSS, Javascript).

  • Основные инструменты для frontend-разработчика.

  • Основы использования системы контроля Git.

• HTML7 ак. часов

  • Базовые понятия. Базовая структура html документа. Мета-теги, подключение ресурсов к странице, фавикон. Разделение страницы на блоки. Базовые теги Семантическая верстка атрибуты.

  • Типовые задачи. Формы, списки, таблицы, карточки, базовая раскладка страницы.

  • Графика. Добавление изображений в html, img и picture. Форматы графики. Jpg png webp svg avif gif vs mp4.

• CSS11 ак. часов

  • Базовые понятия. Что такое каскадные таблицы стилей. Селекторы. Наследование стилей. Специфичность. Способы добавления. Блочная модель.

  • Управление размерами и положением элемента, управление контентом. Ширина и высота для разных типов элементов. Margin. Padding/ Позиционирование. Единицы измерения, абсолютные и относительные. Управление фоном. Псеводэлементы. Псевдоклассы. Подходы к написанию css.

  • Текстовые свойства. Работа со шрифтами. Управление размерами шрифтов. Свойства работы со шрифтами.

  • Инструменты для верстки сетки и создания адаптивности. Создание сеток на флексбоках. Создание сеток на гридах. Медиа-запросы. Подходы к адаптации страницы под разные устройства. Container queries.

• JavaScript (JS)22 ак. часа

  • Введение в JS. Типы данных. Способы объявления переменных. Приведение типов. Математические операторы.
  • Функции. Типы функций и особенности. Циклы. Ветвление условий.
  • Ссылочные типы данных, this и прототипы. Объекты и массивы. Особенности ссылочных типов данных. Map и Set. Встроенные функции для работы с массивами и объектами. Работа this в javascript. Прототипная модель наследования. Классы в js.
  • Особенности исполнения JS. Всплытие события в JS. Области видимости и замыкания. Event loop.
  • Браузерные API.  Хранилище данных в браузере. Cookie. Location API. History API. Интернационализация и форматирование. SessionStorage. LocalStorage. Geolocation API. IntersectionObserver API. Clipboard API. Fullscreen API.
  • Взаимодействие с DOM. Манипуляции с DOM API. Добавление и удаление элементов. Взаимодействие с интерактивными элементами на странице. Работа с формами.
  • Aсинхронный JS. Способы выполнения асинхронного кода. Функции. Promise. Async await. Генераторы и итераторы. Способы отправки запроса на сервер.
  • Отладка JS в браузере. Обзор панели разработчика в google chrome.
  • Инфраструктура современного проекта на JS. Введение. Shell. Node.js.
  • Модули и Сборка JS. Npm. Модули. Пакеты. Common JS. ESM. Webpack. Npm scripts.
  • Организация работы. Git. Github.Github actions. Eslint. Stylelint. Сommitlint. Git-hooks.

• TypeScript (TS)11 ак. часов

  • Базовые типы TS. 

  • Примитивные типы. Массивы. Объекты - Функции. Объединение типов in, instanceof, typeof, keyof.

  • Предикатные type guards. Интерфейсы. Индексируемые типы. Управление атрибутами типов. Условные типы. Утилитные типы.

  • Дженерики.

• React4 ак. часа

  • React базовые понятия.

  • React hooks.

  • Подходы к оптимизации приложений. 

  • Стилизация в JS.

  • Менеджеры состояний. 

  • Роутинг в приложениях на React. 

  • Тестирование.

• Soft skills для разработчиков

  • Работа в команде.

  • Aдаптация к работе.

  • Типичные сложности, с которыми сталкивается разработчик.

• Проект