React Native
Курс мобільної розробки на React Native для тих, хто вже знає React, Redux і TypeScript
React Native
Курс проводить від знайомого web React до production-ready мобільних застосунків на iOS і Android.
Для кого цей курс
- Ви вже пишете на React, TypeScript і Redux (Toolkit).
- Ви хочете системно опанувати React Native, а не зібрати «hello world» з випадкових туторіалів.
- Вам потрібен шлях Expo → реальні фічі → stores → React Native CLI / bare.
Що буде далі
Основний навчальний застосунок курсу — Nomad (щоденник подорожей, український UI). Код: https://github.com/arakviel/nomad. Кожна стаття містить теорію, міні-проєкт «від А до Я» і крок інтеграції в Nomad.
1. Навіщо React Native
Навіщо потрібен мобільний застосунок, чим він відрізняється від сайту, і коли обирати React Native.
2. Архітектура runtime
Як код на TypeScript доходить до кнопок на екрані: логіка, малювання, Metro, Hermes, шлях натискання.
3. Expo і CLI
Два способи вести React Native-проєкт: Expo й класичний CLI — що обрати і як побудований курс.
4. Середовище Expo
Node.js, create-expo-app, Metro, Expo Go та симулятори — перший запуск і ініціалізація Nomad.
5. Структура проєкту
app vs src, design tokens, Screen / AppText / Button, псевдоніми @/, платформні суфікси.
6. Базові компоненти
View, Text, Image, Pressable, ScrollView, Safe Area, Platform — mock-картки поїздок у Nomad.
7. Flexbox і layout
Колонка за замовчуванням, align/justify, gap, sticky CTA, safe area, клавіатура — shell стрічки поїздок.
8. StyleSheet і теми
StyleSheet, семантичні токени, light/dark, useColorScheme — ThemeProvider у Nomad.
9. Списки та віртуалізація
FlatList, SectionList, FlashList, pull-to-refresh, empty/error — стрічки поїздок і місць у Nomad.
10. Форми та валідація
TextInput, Switch, Checkbox, Slider, Picker, Pressable, date picker, RHF + Zod — форма поїздки в Nomad.
11. Основи Expo Router
app/, layout, Tabs і Stack, Link і useRouter, назад, typed routes — оболонка навігації Nomad.
12. Вкладені навігатори й модалки
Stack у Tabs, presentation modal, auth-групи, guard на back — деталі поїздки в Nomad.