Сделать приложение на react-native под web/android/ios с минимальным функционалом и одной кодовой базой.
сделать роут из двух страниц. на первой странице будет список новостей, на второй будет страица самой новости. на web-e страница новость должна открываться роутом в виде модалки, в мобильных платформах как отдельная страница. набор новостей можно рандомно сгенерить с рандомным текстом и картинкой. добавить функционал, который присылает новость с "облака". при запуске приложения - срабатывает таймаут на 10 секунд после которого прилетает push notification с картинкой и заголовком новости. при клике на него - нужно переходить на соответветсвующую страницу новости внутри приложения.
Установить Expo CLI.
npm i -g expo-cli
Установить зависимости.
yarn
Локальный сервер запускается на порту 5000.
expo build:web && npx serve -s web-build
Чтобы открыть веб-приложение на телефоне с Android, нужно подключить устройство по USB, пробросить порт 5000
и перейти на страницу http://localhost:5000
.
В таком случае браузер телефона посчитает контекст безопасным и запустит Service Worker без HTTPS.
adb reverse tcp:5000 tcp:5000
Я проклял тот день, когда выбрал react-navigation
для этого мини-проекта. Я думал сэкономить таким образом время. Глупец.
Для упрощения задачи в уведомлениях не показываются изображения. В противном случае пришлось бы лезть в нативную часть Android и iOS, потому что публичные пакеты не поддерживают изображения внутри локальных уведомлений. В вебе было просто лень пробрасывать базу данных в Service Worker при помощи postMessage/onmessage, а это необходимо для того, чтобы иметь доступ к сгенерированным путям изображений.
Если в веб-приложении перейти на статью по ссылке, а не кликом на статью с главного экрана, то будет отображён экран статьи, как в нативном приложении, а не модальное окно, как в вебе.
Это ограничение вызвано зависимостью react-navigation
, которое можно было побороть, но слишком большой ценой. Проще переписать всю навигацию с нуля.