modified: README.md
This commit is contained in:
parent
4e697a7b04
commit
ec415de724
65
README.md
65
README.md
@ -16,6 +16,9 @@
|
|||||||
- **Выбор городов**: предустановленный список российских городов
|
- **Выбор городов**: предустановленный список российских городов
|
||||||
- **Система тем**: светлая, темная и автоматическая (по системным настройкам)
|
- **Система тем**: светлая, темная и автоматическая (по системным настройкам)
|
||||||
- **Анимации**: плавные переходы и hover-эффекты
|
- **Анимации**: плавные переходы и hover-эффекты
|
||||||
|
- **PWA (Progressive Web App)**: установка как нативное приложение, оффлайн режим с кэшированием данных
|
||||||
|
- **Оффлайн поддержка**: отображение погодных данных при отсутствии интернета
|
||||||
|
- **Мобильная версия**: возможность сборки в APK для Android через Capacitor или PWABuilder
|
||||||
|
|
||||||
## Технологии
|
## Технологии
|
||||||
|
|
||||||
@ -23,6 +26,7 @@
|
|||||||
|
|
||||||
- **Node.js** v8+ (устаревшая версия, рекомендуется обновить до LTS)
|
- **Node.js** v8+ (устаревшая версия, рекомендуется обновить до LTS)
|
||||||
- **Express.js** v4.17.1 - веб-сервер
|
- **Express.js** v4.17.1 - веб-сервер
|
||||||
|
- **Service Worker** - кэширование и оффлайн поддержка
|
||||||
|
|
||||||
### Frontend
|
### Frontend
|
||||||
|
|
||||||
@ -31,6 +35,8 @@
|
|||||||
- **Tailwind CSS** v3.4.16 - утилитарный CSS фреймворк
|
- **Tailwind CSS** v3.4.16 - утилитарный CSS фреймворк
|
||||||
- **PostCSS** v8.5.6 - обработка CSS
|
- **PostCSS** v8.5.6 - обработка CSS
|
||||||
- **Autoprefixer** v10.4.21 - вендорные префиксы
|
- **Autoprefixer** v10.4.21 - вендорные префиксы
|
||||||
|
- **Capacitor** v7.4.3 - фреймворк для мобильной разработки
|
||||||
|
- **Sharp** v0.34.4 - обработка изображений и иконок
|
||||||
|
|
||||||
### Библиотеки и CDN
|
### Библиотеки и CDN
|
||||||
|
|
||||||
@ -82,12 +88,71 @@
|
|||||||
5. **Откройте браузер:**
|
5. **Откройте браузер:**
|
||||||
Перейдите по адресу http://localhost:3000
|
Перейдите по адресу http://localhost:3000
|
||||||
|
|
||||||
|
6. **Установка как PWA (опционально):**
|
||||||
|
В браузере нажмите "Установить приложение" или добавьте на домашний экран для полноэкранного режима.
|
||||||
|
|
||||||
### Доступные скрипты
|
### Доступные скрипты
|
||||||
|
|
||||||
- `npm start` - запуск сервера разработки
|
- `npm start` - запуск сервера разработки
|
||||||
- `npm run build-css` - сборка Tailwind CSS из `input.css` в `output.css`
|
- `npm run build-css` - сборка Tailwind CSS из `input.css` в `output.css`
|
||||||
- `npm run watch-css` - автоматическая пересборка CSS при изменениях
|
- `npm run watch-css` - автоматическая пересборка CSS при изменениях
|
||||||
|
|
||||||
|
## PWA и мобильная версия
|
||||||
|
|
||||||
|
### Progressive Web App (PWA)
|
||||||
|
|
||||||
|
Приложение поддерживает установку как PWA на устройствах с современными браузерами:
|
||||||
|
|
||||||
|
- **Кэширование**: приложение кэширует статические ресурсы и данные API для оффлайн доступа
|
||||||
|
- **Service Worker**: обеспечивает работу приложения в оффлайн режиме
|
||||||
|
- **Манифест**: позволяет установить приложение на домашний экран мобильных устройств
|
||||||
|
|
||||||
|
### Сборка мобильного приложения
|
||||||
|
|
||||||
|
Приложение можно собрать в нативное мобильное приложение для Android:
|
||||||
|
|
||||||
|
#### Используя Capacitor
|
||||||
|
|
||||||
|
1. **Установите Capacitor CLI** (если не установлен):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm install -g @capacitor/cli
|
||||||
|
```
|
||||||
|
|
||||||
|
2. **Добавьте платформы:**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx cap add android
|
||||||
|
```
|
||||||
|
|
||||||
|
3. **Соберите веб-ресурсы:**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run build-css
|
||||||
|
```
|
||||||
|
|
||||||
|
4. **Синхронизируйте с Capacitor:**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx cap sync android
|
||||||
|
```
|
||||||
|
|
||||||
|
5. **Откройте в Android Studio:**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx cap open android
|
||||||
|
```
|
||||||
|
|
||||||
|
6. **Соберите APK** в Android Studio или через командную строку.
|
||||||
|
|
||||||
|
Подробные инструкции см. в файле `APK_instructions_Capacitor.md`.
|
||||||
|
|
||||||
|
#### Используя PWABuilder
|
||||||
|
|
||||||
|
Онлайн-сервис PWABuilder позволяет конвертировать PWA в мобильное приложение без установки дополнительного ПО.
|
||||||
|
|
||||||
|
Подробные инструкции см. в файле `APK_instructions_PWABuilder.md`.
|
||||||
|
|
||||||
## API и внешние сервисы
|
## API и внешние сервисы
|
||||||
|
|
||||||
- **WeatherAPI.com** - источник данных о погоде
|
- **WeatherAPI.com** - источник данных о погоде
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user