guestincorle / news-feed Goto Github PK

Сделать приложение на 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, которое можно было побороть, но слишком большой ценой. Проще переписать всю навигацию с нуля.