Я попробовал TANSTACK с конденсатором для мобильных устройств, и вот что получилось

TANSTACK и Capacitor НАКОНЕЦ-ТО работают вместе, Fullstack Mobile Apps

Хотите запустить TanStack Start на мобильном устройстве с Capacitor? Это краткое руководство покажет вам несколько простых изменений конфигурации, которые обеспечивают работоспособность приложения, а также демонстрацию успешных и неуспешных вариантов.

Готовы превратить своё веб-приложение в нативное мобильное? Это подробное руководство покажет вам, как создать полнофункциональное мобильное приложение, используя TanStack Start для фронтенда и бэкенда, а также Capacitor для упаковки приложения для iOS и Android.
Я проведу вас через весь процесс, от инициализации проекта и интеграции Capacitor до критически важных изменений конфигурации в Vite, необходимых для его работы. Мы рассмотрим, как обрабатывать вызовы API с мобильного устройства к бэкенду TanStack с помощью переменных окружения и устранять распространённые проблемы CORS.
И самое главное, я продемонстрирую ключевое ограничение серверных функций TanStack в мобильной среде и объясню, почему они не работают, чтобы вы могли уверенно разрабатывать своё приложение. В итоге у вас будет полностью функциональное мобильное приложение, полностью созданное с использованием современного веб-стека.

Полный исходный код и подробную запись в блоге можно найти здесь: https://github.com/aaronksaunders/tan...

Главы
---------------
0:00 — Введение: Лучший стек мобильных приложений?
1:26 — Демонстрация: Что работает, а что не работает
2:29 — Шаг 1: Инициализация проекта TanStack
3:03 — Шаг 2: Интеграция конденсатора для мобильных устройств
4:12 — Важный шаг: Настройка конденсатора для TanStack
5:22 — Шаг 3: Изменение конфигурации Vite (SPA и CORS)
7:28 — Шаг 4: Обновление package.json для внутреннего сервера
8:15 — Шаг 5: Использование переменных окружения для вызовов API
10:42 — Как TanStack извлекает данные (маршруты API и загрузчики)
12:44 — «Подвох»: Почему серверные функции не работают Мобильные устройства
14:24 — Сборка и развёртывание в iOS Simulator
16:50 — Финальный результат и отладка ошибки серверной функции
17:48 — Заключение: стоит ли этот стек своих денег?
20:06 — Заключение и ресурсы

Ресурсы
-----------------
Tanstack Start — https://tanstack.com/start/latest
Capacitor — https://capacitorjs.com/

Мои соцсети
------------------
🎥 [Канал YouTube](   / @aaronsaundersci  )
🐦 [Twitter](https://x.com/aaronksaunders)
💼 [LinkedIn](  / aaronksaunders  )
🌐 [GitHub](https://github.com/aaronksaunders)

Давайте работать вместе
------------------------------
Двухнедельный ИИ-спринт - https://www.clearlyinnovative.com/ai-mvp
Проект MVP - https://www.clearlyinnovative.com/val...

#Tanstack #fullstack #React #Capacitor #MobileApp #Vite #JavaScript #WebApp #HybridApp #codingtutorial