Stepik О курсе
Подробнее
В этом курсе мы изучим React Native и Expo Router написав полноценное мобильное приложение с авторизацией и нативными возможностями. Этот курс подойдёт тем, кто хочет погрузиться в мобильную разработку имея опыт frontend разработки на React. От вас требуется знание JavaScript и React, а так же будет бонусом знание CSS и TypeScript, так как весь проект мы будем писать на нём.
Курс будет максимально практическим, ведь всю теорию мы разбираем прямо во время создания проекта применяя полученные знания на практике. Мы не используем банальные ToDo приложения, а работаем с реальным API и настоящим приложении личного кабинета ученика. Так же для курса было сделано большое число упражнений, которые позволят вас закрепить полученные знания, дорабатывая проект.
Требования
Что нужно для старта
- Знание React и TypeScript
Результат
Что вы получите
- Создавать приложения на React Native
- Создавать компоненты и layout экранов
- Стилизовать элементы и работать с анимацией
- Отлаживать приложения
- Использовать Expo Router
- Использовать state manager
- Работать с персистентностью данных
- Работать с авторизацией
- Работать с разлиными layout
- Использовать нативные API
- Адаптировать приложения под разные устройства
- Оптимизировать производительность
- Работать с уведомлениями
- Собирать приложения для production
Аудитория
Для кого этот курс
- Для frontend разработчиков, которые хотят освоить мобильную разработку.
Содержание
16 занятийПрограмма курса
№ТемаЧто внутри
01Введение
- Почему React Native
- Как устроен курс
- Обзор проекта
- Обзор курсов
- Перенос курса
02Настройка окружения
- Настройка окружения
- Установка Node
- Настройки VSCode
- Установка XCode
- Установка Android Studio
- Установка на устройство
- Тест - Настройка окружения
03Старт проекта
- Как работает React Native
- UI и логика
- Expo CLI vs React Native CLI
- Старт проекта
- Обзор проекта
- Запуск приложения
- Тест - Старт проекта
04Компоненты и стили
- Использование компонент
- Стилизация
- Основы flex
- Align и justify
- Self
- Flex wrap
- Flex Basis, Grow, and Shrink
- Gap
- Dimensions
- Работа в Figma
- Упражнение - Вёрстка логина
- Тест - Компоненты и стили
05События и создание компонент
- Image
- Компонент Input
- Дизайн система
- Работа с SVG
- Обработка событий
- Упражнение - Компонент кнопки
- Тест - События и создание компонент
06Анимация
- Основы анимации
- Как работает анимация
- Ограничения анимации
- Интерполяция
- Анимация кнопки
- Alert и Toast
- Упражнение - Уведомление
- Анимация окна уведомлений
- Тест - Анимация
07Отладка и lint
- Eslint
- Обработка ошибок
- Отладчик и Chrome
- React Dev Tools
- Тест - Отладка и lint
08Expo router
- Выбор роутинга
- Добавление роутера
- Страницы и навигация
- Layout
- Stack
- SafeArea и StatusBar
- Подключение шрифта
- SplashScreen
- Unmatched
- Упражнение - Страница ошибки
- Route с параметрами
- Структура проекта
- Вложенные Layout
- Тест - Expo router
09Запросы и состояние
- Выбор state manager
- Архитектура проекта
- Первый атом
- AsyncStorage
- atomWithStorage
- Запросы на сервер
- Запросы в State
- Упражнение - Выход
- Программный редирект
- Redirect компонент
- Упражнение - Реализация логина
- ActivityIndicator
- Тест - Запросы и состояние
10Боковая панель
- Drawer layout
- Стилизация панели
- Кнопка открытия
- Кастомный Drawer
- Стилизация Drawer
- Получение данных профиля
- Упражнение - Компонент пользователя
- Упражнение - Компонент меню
- Навигация
- Тест - Боковая панель
11Нативные возможности
- Обновление expo
- Рефакторинг приложения
- ImagePicker
- Permissions
- Отображение изображения
- Упражнение - Компонент загрузки
- Загрузка на сервер
- Улучшаем код
- Сохранение профиля
- Sharing API
- Тест - Нативные возможности
12Разрешения и layout
- Ориентация экрана
- ScreenOrientation
- Поддержка планшетов
- KeyboardAvoidingView
- Platform
- Тест - Разрешения и layout
13Списки
- Данные курсов
- Упражнение - Вёрстка карточки
- ScrollView
- FlatList
- RefreshControl
- Linking
- Градиентный текст
- Упражнение - Progress bar
- Тест - Списки
14Нотификации
- Типы уведомлений
- Установка expo-notifications
- Отправка уведомлений
- Обработка уведомлений
- Реакция на уведомления
- Нажатие на уведомление
- Упражнение - Уведомление с URL
- Работа с push уведомлениями
- Использование push токена
- Тест - Нотификации
15Сборка и публикация
- Процесс публикации приложений
- Конфигурация и иконки
- Переменные окружения
- Сборка через EAS
- Сборка через XCode
- Сборка через Android Studio
- Сборка без Expo
- Тест - Сборка и публикация
16Заключение
- Куда двигаться дальше
01Введение
- Почему React Native
- Как устроен курс
- Обзор проекта
- Обзор курсов
- Перенос курса
02Настройка окружения
- Настройка окружения
- Установка Node
- Настройки VSCode
- Установка XCode
- Установка Android Studio
- Установка на устройство
- Тест - Настройка окружения
03Старт проекта
- Как работает React Native
- UI и логика
- Expo CLI vs React Native CLI
- Старт проекта
- Обзор проекта
- Запуск приложения
- Тест - Старт проекта
04Компоненты и стили
- Использование компонент
- Стилизация
- Основы flex
- Align и justify
- Self
- Flex wrap
- Flex Basis, Grow, and Shrink
- Gap
- Dimensions
- Работа в Figma
- Упражнение - Вёрстка логина
- Тест - Компоненты и стили
05События и создание компонент
- Image
- Компонент Input
- Дизайн система
- Работа с SVG
- Обработка событий
- Упражнение - Компонент кнопки
- Тест - События и создание компонент
06Анимация
- Основы анимации
- Как работает анимация
- Ограничения анимации
- Интерполяция
- Анимация кнопки
- Alert и Toast
- Упражнение - Уведомление
- Анимация окна уведомлений
- Тест - Анимация
07Отладка и lint
- Eslint
- Обработка ошибок
- Отладчик и Chrome
- React Dev Tools
- Тест - Отладка и lint
08Expo router
- Выбор роутинга
- Добавление роутера
- Страницы и навигация
- Layout
- Stack
- SafeArea и StatusBar
- Подключение шрифта
- SplashScreen
- Unmatched
- Упражнение - Страница ошибки
- Route с параметрами
- Структура проекта
- Вложенные Layout
- Тест - Expo router
09Запросы и состояние
- Выбор state manager
- Архитектура проекта
- Первый атом
- AsyncStorage
- atomWithStorage
- Запросы на сервер
- Запросы в State
- Упражнение - Выход
- Программный редирект
- Redirect компонент
- Упражнение - Реализация логина
- ActivityIndicator
- Тест - Запросы и состояние
10Боковая панель
- Drawer layout
- Стилизация панели
- Кнопка открытия
- Кастомный Drawer
- Стилизация Drawer
- Получение данных профиля
- Упражнение - Компонент пользователя
- Упражнение - Компонент меню
- Навигация
- Тест - Боковая панель
11Нативные возможности
- Обновление expo
- Рефакторинг приложения
- ImagePicker
- Permissions
- Отображение изображения
- Упражнение - Компонент загрузки
- Загрузка на сервер
- Улучшаем код
- Сохранение профиля
- Sharing API
- Тест - Нативные возможности
12Разрешения и layout
- Ориентация экрана
- ScreenOrientation
- Поддержка планшетов
- KeyboardAvoidingView
- Platform
- Тест - Разрешения и layout
13Списки
- Данные курсов
- Упражнение - Вёрстка карточки
- ScrollView
- FlatList
- RefreshControl
- Linking
- Градиентный текст
- Упражнение - Progress bar
- Тест - Списки
14Нотификации
- Типы уведомлений
- Установка expo-notifications
- Отправка уведомлений
- Обработка уведомлений
- Реакция на уведомления
- Нажатие на уведомление
- Упражнение - Уведомление с URL
- Работа с push уведомлениями
- Использование push токена
- Тест - Нотификации
15Сборка и публикация
- Процесс публикации приложений
- Конфигурация и иконки
- Переменные окружения
- Сборка через EAS
- Сборка через XCode
- Сборка через Android Studio
- Сборка без Expo
- Тест - Сборка и публикация
16Заключение
- Куда двигаться дальше
Организатор
Автор курса
Мнения учеников
Отзывы о курсе
Оставьте отзыв
Расскажите о качестве обучения, поддержке и результате. Это поможет другим выбрать организацию осознанно.
Оставьте заявку
Консультант ответит на вопросы о курсе «React Native и Expo Router» и поможет разобраться в деталях обучения.
Нажимая кнопку, вы даете согласие на обработку персональных данных
Информация обновлена 3 сентября 2026 г.
Продолжить выбор
Похожие курсы
Начать без затрат
