86 lines
2.4 KiB
Markdown
86 lines
2.4 KiB
Markdown
# Zalo Mini App
|
|
|
|
## Development
|
|
|
|
### Using Zalo Mini App Extension
|
|
|
|
1. Install [Visual Studio Code](https://code.visualstudio.com/download) and [Zalo Mini App Extension](https://mini.zalo.me/docs/dev-tools).
|
|
1. In the **Home** tab, process **Config App ID** and **Install Dependencies**.
|
|
1. Navigate to the **Run** tab, select the suitable launcher, and click **Start**.
|
|
|
|
### Using Zalo Mini App CLI
|
|
|
|
1. [Install Node JS](https://nodejs.org/en/download/).
|
|
1. [Install Zalo Mini App CLI](https://mini.zalo.me/docs/dev-tools/cli/intro/).
|
|
1. **Install dependencies**:
|
|
```bash
|
|
npm install
|
|
```
|
|
1. **Start** the dev server:
|
|
```bash
|
|
zmp start
|
|
```
|
|
1. **Open** `localhost:3000` in your browser.
|
|
|
|
## Deployment
|
|
|
|
1. **Create** a mini program. For instructions on how to create a mini program, please refer to the [Coffee Shop Tutorial](https://mini.zalo.me/tutorial/coffee-shop/step-1/)
|
|
|
|
1. **Deploy** your mini program to Zalo using the mini app ID created.
|
|
|
|
- **Using Zalo Mini App Extension**: navigate to the **Deploy** panel > **Login** > **Deploy**.
|
|
- **Using Zalo Mini App CLI**:
|
|
```bash
|
|
zmp login
|
|
zmp deploy
|
|
```
|
|
|
|
1. Open the mini app in Zalo by scanning the QR code.
|
|
|
|
## Resources
|
|
|
|
- [Zalo Mini App Official Website](https://mini.zalo.me/)
|
|
- [ZaUI Documentation](https://mini.zalo.me/documents/zaui/)
|
|
- [ZMP SDK Documentation](https://mini.zalo.me/documents/api/)
|
|
- [DevTools Documentation](https://mini.zalo.me/docs/dev-tools/)
|
|
- [Ready-made Mini App Templates](https://mini.zalo.me/zaui-templates)
|
|
- [Community Support](https://mini.zalo.me/community)
|
|
|
|
# Unity Game
|
|
|
|
## Getting started
|
|
|
|
1. **Install dependencies**:
|
|
|
|
```bash
|
|
npm install promogame-player
|
|
```
|
|
or
|
|
```bash
|
|
pnpm install promogame-player
|
|
```
|
|
or
|
|
```bash
|
|
yarn install promogame-player
|
|
```
|
|
|
|
1. **Import** and use it anywhere:
|
|
|
|
|
|
```tsx
|
|
export default function MainApp() {
|
|
const Loading = ({ progress }: { progress: number }) => {
|
|
return (
|
|
<div className={'h-full w-full items-center justify-center text-center'}>
|
|
Loading {progress * 100}%
|
|
</div>
|
|
);
|
|
};
|
|
|
|
return (
|
|
<div className={'flex h-dvh w-screen flex-col items-center justify-center'}>
|
|
<PromogameGame loadingComponent={Loading} className={'h-full w-full'} apiUrl={import.meta.env.VITE_API_URL} />
|
|
</div>
|
|
);
|
|
}
|
|
``` |