https://github.com/vkcom/vk-mini-apps-examples
https://github.com/vkcom/vk-mini-apps-examples
Last synced: 8 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/vkcom/vk-mini-apps-examples
- Owner: VKCOM
- License: other
- Created: 2023-04-24T11:56:41.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-10-14T06:55:45.000Z (over 1 year ago)
- Last Synced: 2025-01-29T18:45:43.506Z (over 1 year ago)
- Language: TypeScript
- Size: 158 KB
- Stars: 19
- Watchers: 9
- Forks: 10
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Contributing: docs/CONTRIBUTING.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# mini-app-shop-boilerplate
Мини-апп онлайн магазин
## Запуск
1. Склонируйте репозиторий
```bash
git clone https://github.com/VKCOM/vk-mini-apps-examples.git
```
2. В окне командной строки перейдите в папку примера, установите зависимости и запустите веб-сервер.
```bash
cd {путь-к-папке-примера}
npm ci
npm start
```
3. Создайте мини-приложение через [портал для разработчиков](https://dev.vk.ru/) или через вкладку "Управление" в приложении ВКонтакте
4. В настройках приложения включите режим разработки и пропишите адрес вашего веб сервера по умолчанию(http://localhost:3000)
## Совместная разработка
1. Установите пакет [VK Tunnel](https://dev.vk.ru/libraries/tunnel) командой
```bash
npm install @vkontakte/vk-tunnel -g
```
2. Запустите веб-сервер приложения командой
```bash
npm start
```
3. Откройте другое окно командной строки. В нём перейдите в папку проекта-примера и запустите VK Tunnel:
```bash
cd {путь-к-папке-примера}
npm run tunnel
```
4. VK Tunnel создаст соединение (туннель) к веб-серверу, который вы запустили локально, и в окне командной строки отобразит URL для доступа к этому веб-серверу. Скопируйте этот URL.
5. Откройте настройки мини-приложения и перейдите в раздел Тестирование.
6. Создайте в этом разделе новую группу. Включите в неё нужных вам пользователей. В поле URL укажите скопированный URL. Подробнее про тестирование можно прочитать [здесь](https://dev.vk.ru/mini-apps/management/testing).
7. Когда пользователи группы будут запускать приложение, ВКонтакте будет переадресовывать вызовы на локальный веб-сервер. Пользователи будут видеть версию мини-приложения, которая находится на вашей машине. Конечно, чтобы этот подход работал, локальный веб-сервер должен быть запущен.
Подробнее о работе с утилитой — можно посмотреть [здесь](https://dev.vk.ru/libraries/tunnel).
## Результат
Можно посмотреть здесь: [мини-апп](https://vk.ru/app51654068#/)
## Документация и ресурсы
- Более подробно про мини-приложение можно прочитать [здесь](https://dev.vk.ru/mini-apps/examples/shop)
- [VK Mini Apps](https://vk.ru/vkappsdev) — сообщество разработчиков мини-приложений ВКонтакте.