Разработка мобильных приложений на JavaScriptНовый курс!

Занятие 1

Основы HTML

• Понятие тега и атрибута
• Структура кода страницы
• Структурные элементы страницы

Разметка текста

• Заголовки
• Параграфы
• Нумерованный список
• Маркированный список

Основы CSS

• Простые селекторы
• Цвет фона
• Типографика
• Границы
• Отступы

Изображения

• Тег img и его атрибуты
• Группировка изображений и подписей
• Фоновое изображение

Занятие 2

Мультимедиа и анимация

• Аудио и видео
• Анимация перехода
• Покадровая анимация

Адаптивная верстка

• Функция calc()
• Медиа-запросы (media queries)
• Flexbox
• CSS Grid

Таблицы

• Простые таблицы
• Объединение ячеек
• Группировка разделов таблицы

Формы

• Тег form и его атрибуты
• Элементы формы

Занятие 3

Основы JavaScript

• Размещение сценария
• Комментарии
• Переменные и константы
• Типы данных
• Массивы и объекты
• Операторы
• Ввод-вывод информации

Условные инструкции

• Условная инструкция if..else
• Инструкция switch
• Логические операторы в условии

Занятие 4

Циклы в JavaScript

• Цикл for
• Цикл do..while
• Цикл while
• Оператор break
• Оператор continue

Массивы в JavaScript

• Особенности массивов
• Свойство length
• Перебор массива
• Методы для работы с массивами

Занятие 5

Функции в JavaScript

• Объявление и вызов функции
• Аргументы функции
• Возврат значения
• Функциональные выражения
• Стрелочные функции

Занятие 6

Объектная модель

• Объектная модель документа
• Поиск элементов в dom
• Атрибуты и dom-свойства
• Создание, добавление и удаление узлов

События

• Объект события (Event)
• Делегирование событий
• События мыши, клавиатуры и указателя
• Прокрутка и события документа
• Объект Image и предзагрузка изображений

Занятие 7

Формы и элементы форм

• События форм и элементов
• Методы форм и элементов

Строчный тип данных

• Свойство строки
• Методы класса String

Дата и время

• Создание экземпляра объекта класса Date
• Методы класса Date

Занятие 8

Регулярные выражения

• Создание шаблона регулярного выражения
• Методы для работы с регулярными выражениями

Введение в объекты

• Методы объекта
• Конструкторы
• Тип данных Symbol

Перебираемые объекты

• Псевдомассивы
• Map и Set

Занятие 9

Формат JSON

• JSON.stringify
• JSON.parse

Продвинутая работа с функциями

• Замыкание
• Привязка контекста к функции

Свойства объекта

• Свойства - геттеры и сеттеры
• Прототипы и наследование

Классы

• Базовый синтаксис
• Наследование классов
• Статические свойства и методы
• Приватные и защищённые методы и свойства

Занятие 10

Обработка ошибок

• "try..catch"

Промисы

• Колбэки
• Промисы
• Async/await

Модули

• Введение в модули
• Экспорт и импорт
• Динамические импорты

Занятие 11

Введение в React

• Что такое React
• Первое приложение
• Основы JSX
• Сервер Node.js
• React Developer Tools

Занятие 12

Основы React

• Рендеринг элементов
• Компоненты
• Свойства компонентов
• События
• Составные компоненты

Занятие 13

Состояния компонентов

• Состояние функциональных компонентов и useState
• Состояние компонентов-классов и свойство state
• Хук useEffect
• Жизненный цикл компонента
• Управление ресурсами
• Разделяемое состояние и поднятие состояния
• Глобальное состояние и Context API
• Управление состоянием с помощью useReducer
• Атрибут ref и хуки useRef и createRef

Занятие 14

Работа с формой

• Состояние компонента и управление формой
• Управление несколькими полями формы
• Валидация формы
• Разделение формы на компоненты
• Поиск в списке и фильтрация
• Создание пошаговой формы

Занятие 15

Маршрутизация

• Определение маршрута
• Дочерние маршруты
• Создание ссылок
• Параметры маршрута
• Ссылки с параметрами
• Парсинг строки запроса
• Переадресация

Занятие 16

Сетевые запросы с Fetch API

• Создание сервера
• Создание клиента

Lazy Loading и Suspense API

• Lazy Loading
• Suspense API
• Пример использования

Занятие 17

Redux

• Что такое Redux?
• Простой пример использования Redux
• Использование redux-toolkit

Занятие 18

Работа над проектом

• Выбор темы
• Проектирование интерфейса
• Создание компонентов
• Сборка приложения

Занятие 19

Введение в React Native

• Что такое React Native?
• Плюсы React Native
• Минусы React Native
• Установка и настройка React Native

Занятие 20

Компоненты интерфейса React Native

• View
• Text
• Image
• ScrollView
• TextInput
• Button
• FlatList
• SectionList
• ActivityIndicator
• Modal
• Pressable
• StatusBar

Занятие 21

Стилизация в React Native

• Разница между CSS и стилями в React Native
• Создание стилей
• Flexbox в React Native
• Адаптивный интерфейс с карточками

Навигация в приложении

• Типы навигация
• Приложение с Drawer-навигацией

Занятие 22

Состояния и хуки

• Хук useState
• Хук useEffect
• Создаем экран с таймером

Работа с API

• Что такое API
• Fetch vs Axios
• Приложение для поиска погоды

Занятие 23

Управление глобальным состоянием

• Что такое Context API
• Приложение с темной и светлой темой

Работа с формами

• Текстовые поля и клавиатура
• Formik
• Форма регистрации с валидацией

Анимация

• Анимация в React Native
• Анимация нажатия кнопки
• Анимированная заставка
• Советы по работе с анимацией

Занятие 24

Управление данными

• Основы Redux
• Корзина покупок

Работа с устройством

• Доступ к нативным функциям устройства
• Приложение для фотогалереи с координатами

Работа с модулями Expo

• Модули Expo
• Подключение модулей
• Работа с камерой
• Работа с геолокацией
• Уведомления

Занятие 25

Сборка приложения и публикация

• Expo Application Services
• Подготовка к публикации
• Интеграция с внешними сервисами
• Публикация приложения

Тестирование приложения

• Почему это важно
• Типы тестирования
• Jest для юнит-тестов
• Detox для End-to-End тестов

Оптимизация производительности

• Почему это важно
• Основы оптимизации
• Оптимизация списка из 1000 элементов
• Советы по оптимизации

Занятие 26

Защита проекта