MobileDevTisbi

Задания

Секция 1. JavaScript

Практика №1. Простая веб-страница с HTML

Практика №2. Использование git, github

Практика №3. Вывод информации о себе в консоль.

Практика №4. Преобразование типов

Практика №5. Использование ветвления.

Практика №6. Вывод таблицы умножения с помощью цикла for

Практика №7. Функции для работы с строками

Практика №8. SSR-сервер с динамической генерацией страниц

Практика №9. CSR с гидратацией. Интерактивный счётчик

Секция 2. React

Практика №10. Интерактивный счётчик с изменением темы

Практика №11. Игра-кликер

Практика №12. Социальная сеть - Часть 1. Верстка

Практика №13. Социальная сеть - Часть 2. Миграция на TypeScript

Практика №14. Социальная сеть - Часть 3. Подключение к бэкэнду

Секция 3. React Native

Практика №15. Калькулятор

Практика №16. To-Do организатор

Практика №17. Мессенджер NIKITA

Лекции

Секция 1. JavaScript

Тема №1. Как создаются мобильные приложения

Тема №2. Основы JavaScript

Тема №3. Использование JavaScript в браузере

Тема №4. Node.JS, примитивные типы данных JavaScript

Тема №5. Операторы и операции в JavaScript

Тема №6. Git, GitHub

Тема №7. Ветвление в JavaScript

Тема №8. Циклы в JavaScript

Тема №9. Функции в JavaScript

Тема №10. Область видимости в JavaScript

Тема №11. Массивы и объекты в JavaScript

Тема №12. Создание сервера NodeJS. WEB 1.0 и WEB 2.0

Секция 2. React

Тема №13. Основы React

Тема №14. Работа со стилями, изображениями и файлами в React

Тема №15. Хранение и передача данных в React

Тема №16. События и Ref в React

Тема №17. Hooks в React

Тема №18. Routers в React

Тема №19. Асинхронность в JavaScript

Тема №20. Основы TypeScript

Тема №21. Типизация структур данных в TypeScript

Тема №22. Типизация в React с TypeScript

Тема №23. Запросы к API в TypeScript

Секция 3. React Native

Тема №24. Введение в React Native

Тема №25. Компоненты и стили в React Native

Тема №26. Управление состоянием в React Native

Тема №27. Навигация в React Native

Тема №28. Работа с локальным хранилищем и файлами

Тема №29. Работа с API в React Native

Тема №30. Тестирование и отладка в React Native

Тема №31. Сборка и подготовка приложения к публикации

Материалы

Заготовки под практики

react-project

zip

task_12-13_data_example

json

Как сделать

Как создавать файлы с определённым расширением

Подтемы

Дополнительные темы

Методология BEM

Спагетти в коде

Секция 1. JavaScript

Тема №1

Основные платформы мобильных приложений

Основные технологии для разработки мобильных приложений

Основные типы мобильных приложений

Тема №2

Базовое понимание синтаксиса JavaScript

Переменные в JavaScript

Правила наименования переменных в JavaScript

Что такое JavaScript, история появления

Тема №3

Базовая работа с элементами веб страницы через JavaScript

Основные понятия веб страницы

Самое простое использование JavaScript

Создание своей HTML страницы

Тема №4

Примитивные типы данных JavaScript

Установка и базовое использование Node.js

Что такое Node.js

Тема №5

Арифметические операторы JavaScript

Логические операторы JavaScript

Операторы присваивания JavaScript

Операторы работы с битами

Операторы сравнения JavaScript

Определение оператора и операнда

Приоритет операторов и ассоциативность

Тема №6

Базовые команды Git

Основные понятия Git

Работа с ветками Git

Работа с удалёнными репозиториями

Рекомендации по использованию Git

Файл .gitignore

Что такое Git

Что такое GitHub

Тема №7

Оператор else

Оператор if

Оператор switch

Сравнение if и switch

Тернарный оператор

Цепочки else if

Что такое ветвление

Тема №8

Прерывание и пропуск итераций

Цикл do...while

Цикл for...in — перебор ключей объекта

Цикл for...of — перебор значений итерируемых объектов

Цикл for

Цикл while

Циклы и производительность

Что такое цикл

Тема №9

Возвращаемое значение

Объявление функции (Function Declaration)

Параметры и аргументы

Рекурсия

Стрелочные функции (Arrow Function)

Функциональное выражение (Function Expression)

Что такое функция

Тема №10

Блочная область видимости

Вложенность областей видимости

Глобальная область видимости

Замыкания

Каррированные функции

Практические последствия (var)

Функциональная область видимости

Что такое область видимости

Тема №11

Вложенные структуры

Конструктор массива Array

Массивы

Объекты

Оператор rest

Практические рекомендации по массивам и объектам

Преобразование типов (Массивы и Объекты) через JSON

Распаковка (spread)

Тема №12

Вкратце о REST

Гидратация

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

Основы сервера на NodeJS

Отправка файлов с сервера

Разница между WEB 1.0 и WEB 2.0 в контексте NodeJS

WEB 1.0 (статический веб)

WEB 2.0 (интерактивный веб)

Секция 2. React

Тема №13

Компоненты

Создание и запуск React-проекта

Типичная структура React-приложения

Что такое React

Create React App (CRA)

JSX

Vite

Тема №14

Аудио и видео

Изображения

Импорт функций и переменных JS

Как React обрабатывает импорт файлов

Какие файлы можно импортировать

Практические ошибки и как их избежать

Работа со стилями и файлами

Что делать с файлами в папке public

Шрифты

env-файлы

JSON-файлы

SVG

Тема №15

Передача данных через props

Передача функций как props

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

Хранение данных между сессиями

Cookies в React-приложениях

localStorage и sessionStorage

Тема №16

Использование useRef для хранения значений

Использование useRef для DOM-элементов

Когда использовать Ref, а когда — State

Контролируемые компоненты

Неконтролируемые компоненты

Обработка событий в React

Ограничения и рекомендации

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

Что такое Ref

onChange

onClick

onFocus и onBlur

onSubmit

Тема №17

Пользовательские Hooks

Правила использования Hooks

Что такое Hooks

useContext

useEffect

Тема №18

Вложенные маршруты

Загрузка данных в маршрутах

Обработка несуществующих маршрутов

Основные компоненты React Router

Параметры маршрута

Программная навигация

Что такое маршрутизация

React Router — основная библиотека

Тема №19

Асинхронность и React

Коллбэки

Промисы (Promise)

Разница между await и then()

Что такое асинхронность

Async и await

Тема №20

Базовые типы в TypeScript

Вывод и явное указание типов

Настройка проекта с TypeScript

Приведение типов

Что такое TypeScript

Тема №21

Обобщённые типы (Generics)

Объединения и пересечения типов

Типизация массивов

Типизация объектов

Типизация функций

Тема №22

Типизация событий в React

Типизация состояния (useState) в TypeScript

Типизация хуков в React

Типизация props в React

Тема №22 1

Другие виды server-client API

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

Отправка запросов

Типизация ответов API

Форматы данных

Что такое API

Секция 3. React Native

Тема №24

Как работает React Native

Основные ограничения

Первое приложение

Установка среды разработки

Что такое React Native

Тема №25

Основные компоненты

Практические рекомендации

Работа с изображениями

Стилизация

Flexbox в React Native

Тема №26

Обработка асинхронного состояния

Рекомендации по управлению состоянием

useContext для глобального состояния

useReducer для сложной логики состояния

useState в мобильных приложениях

Тема №27

Заголовки и кнопки

Модальные экраны

Навигация между экранами

Настройка Stack Navigator

Типы навигаторов

Фабричные функции

Что такое React Navigation

Тема №28

Когда что использовать

Линковка нативных библиотек

Особенность локального хранилища в React Native

Работа с файлами

Типизация AsyncStorage в TypeScript

AsyncStorage

Тема №29

Запросы через fetch в React Native

Использование Axios в React Native

Обработка CORS и сетевых ошибок

Тема №30

Базовое тестирование

Логи и консоль

Отладка стилей

Dev Menu (Меню разработчика)

React Native Debugger и Flipper

Тема №31

Изменение имени приложения

Настройка метаданных

Сборка через Expo

Что происходит при сборке

Что такое сборка (build)

Файлы

Pasted image 20240923235323

png

Pasted image 20240928221620

png

Pasted image 20240928222139

png

Pasted image 20240928222237

png

Pasted image 20250912205946

png

Pasted image 20250912212732

png

Pasted image 20250912212810

png

Pasted image 20250912212840

png

Pasted image 20250912214611

png

Pasted image 20250912214624

png

Pasted image 20250912214643

png

Pasted image 20250912214649

png

Pasted image 20250912214653

png

Pasted image 20250917202240

png

Pasted image 20260207130627

png

Pasted image 20260507125922

png

qrcod_72k5

png

Дополнительные темы

index