File size: 2,353 Bytes
65d62a2
 
 
 
 
 
 
 
 
77e6a1a
a40ab14
 
77e6a1a
65d62a2
 
77e6a1a
65d62a2
7ec841e
65d62a2
7ec841e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
77e6a1a
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
---
title: Translator Tamagui
emoji: πŸ’»
colorFrom: green
colorTo: red
sdk: static
pinned: true
license: wtfpl
models:
- Xenova/nllb-200-distilled-600M
- huuquyet/vinai-translate-vi2en-v2
- huuquyet/vinai-translate-en2vi-v2
short_description: Translator demo App built with Transformers.js + Tamagui
---

# Translator demo App built with Transformers.js + Tamagui + Next.js

## πŸ”¦ About

This Translator app is a starter for a Transformers.js + Tamagui + Next.js

Please check out the demo site 
[![Open in Spaces](https://huggingface.co/datasets/huggingface/badges/resolve/main/open-in-hf-spaces-sm-dark.svg)](https://huggingface.co/spaces/huuquyet/translator-tamagui)
or [Vercel app](https://translator-tamagui.vercel.app/).

## πŸ“¦ Included packages

- Transformers.js
- Tamagui πŸͺ„
- Next.js

## πŸ—‚ Folder layout

The main apps are:

- `src` all the components and screens

## 🏁 Start the app

1. Clone the repo and install dependencies:

    ```bash
    git clone https://github.com/huuquyet/translator-tamagui.git
    cd translator-tamagui
    yarn install
    ```

2. Run the development server:

    ```bash
    yarn dev
    ```
    > Firefox users need to change the `dom.workers.modules.enabled` setting in `about:config` to `true` to enable Web Workers.
    > Check out [this issue](https://github.com/xenova/whisper-web/issues/8) for more details.

3. Open the link (e.g., [http://localhost:3000/](http://localhost:3000/)) in your browser.

## πŸ†• Add new dependencies

### Pure JS dependencies

If you're installing a JavaScript-only dependency that will be used across platforms, install it :

```sh
yarn add zustand
```

## Update new dependencies

### Pure JS dependencies

```sh
yarn upgrade-interactive
```

You may potentially want to have the native module transpiled for the next app. If you get error messages with `Cannot use import statement outside a module`, you may need to use `transpilePackages` in your `next.config.js` and add the module to the array there.

## Deploying to Vercel

- Install vercel cli (if not): `npm i -g vercel`
- Login to vercel: `vercel login`
- Build command to be `vercel build` (add `--prod` if wanna build production version)
- Build command: leave default setting
- Output dir: leave default setting
- Deploy to vercel: `vercel --prebuilt` (add `--prod` if wanna deploy to production)