Setup Droplet (VPS)

System Require:

OS: Ubuntu 24.04 LTS
CPU: 2+ cores recommended
RAM: 1GB minimum (2GB+ recommended)
Storage: 10GB free disk space
Network: Internet connection
↓Auto-detect
Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
Go
HTML, XML
HTTP
JSON
Java
JavaScript
Kotlin
Less
Lua
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Properties
Python
Ruby
Rust
SCSS
SQL
Shell Session
Swift
TOML, also INI
TypeScript
YAML
Plaintext

https://www.youtube.com/watch?v=g1-nQ9pvbxc&ab_channel=DigitalOcean

Video tutorial how to create VPS on Digital Ocean

Install CMS Admin & API for Pro

Github: https://github.com/witwork/mixxai

Install CMS Admin & API for Beginner

1. Access to Droplet on Digital Ocean

(note: you need to go to Digital Ocean and click on the details of the server droplet, then select the Access menu to login to the server for easier installation)

Digital Ocean Dashboard

Select an Image

Launch Droplet Console

Select an Image

2. Install By Bash Script

(note: After you access the Droplet, copy the command below to install mixxai server and admin. This script is developed based on github: https://github.com/witwork/mixxai, it's completely public and free)

wget -O mixxai.sh https://raw.githubusercontent.com/witwork/mixxai/main/mixxai.sh && sudo bash mixxai.shwget -O mixxai.sh https://raw.githubusercontent.com/witwork/mixxai/main/mixxai.sh && sudo bash mixxai.shwget -O mixxai.sh https://raw.githubusercontent.com/witwork/mixxai/main/mixxai.sh && sudo bash mixxai.sh
↓Auto-detect
Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
Go
HTML, XML
HTTP
JSON
Java
JavaScript
Kotlin
Less
Lua
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Properties
Python
Ruby
Rust
SCSS
SQL
Shell Session
Swift
TOML, also INI
TypeScript
YAML
Plaintext

Bash script

Select an Image

3. Setup SMTP & App-Specific Shared Secret

Select an Image

- SMTP is the method for sending login OTP emails to users, in our current app, SMTP is required for users to login. You can refer to this guide to set up Gmail for SMTP:

https://www.youtube.com/watch?v=ZfEK3WP73eY

Tutorial SMTP

- App-Specific Share Secret is the key we use to verify receipts from iOS users when they have paid through Apple's Subscription payment system. You can refer to this guide to generate the key:

App-Specific Share Secret

Select an Image

Note: We will move SMTP and App-Specific Share Secret into the CMS Admin in upcoming updates.

4. Final & Result

- After you have installed successfully, it will display like this, strapi started successfully. If you don't see this line, please contact us so we can help you with the setup.

Final

Select an Image

- After you see the line strapi started successfully, it means the installation is complete. You should take a few more seconds to scroll to the top where the outputs will be displayed, such as the api and admin links.

Result

Select an Image

Signup to Strapi & Manage Content

1. Signup

-  After you have all the information, you will see the admin page printed out. Then you copy it and paste it into your web browser to start creating an admin account and manage content from there. For example, in my case it's http://143.110.239.9:1337/admin. Note: 143.110.239.9 is your Droplet's IP, 1337 is your Droplet's PORT, so it might be different, not the same as in the image. After you log in to the admin, it will look like this

CMS Admin

Select an Image

- You must fill in all the information above and register by clicking the Let's start button. Note that you need to set email and password that meet the requirements, otherwise an error will appear and you will have to re-enter the information

2. Manage Content: AI Model

- After logging in, go to the menu on the left and select Content Manager. Here I will guide you to create an API Model, which allows users to select a model and chat on the Home screen in the client side, such as the Mobile app. After you access the AI Model, select Create new entry to create a new model

Content Manager

Select an Image

- After entering the create AI Model page, you will fill in the necessary information such as:

Select an Image

1. title: you can set it as you wish

2. short_description: you can set it as you wish

3. is_premium: this field is used to determine free or premium status. If you enable this field, users must be premium through subscription on iOS/Android to select this model

4. llm: This is the field where you will select openai or gemini. Currently, we basically support these two platforms, and you can request us to create a custom llm if needed (we will provide pricing information if you request us to customize llm)

5. api_key: This api key is the field that you will need to fill in, taken from the keys of the corresponding platforms such as openai or gemini

Note: you can get the api_key from your account here:

a. openai: https://help.openai.com/en/articles/4936850-where-do-i-find-my-openai-api-key

b. gemini: https://ai.google.dev/gemini-api/docs/api-key

After you fill in all the information, click Save and Publish, so users will see the AI Model you have created

Result

Select an Image

2. Manage Content: Subscription Plan

Subscription Plan

Select an Image

1. name: you can set it as you wish.

2. bundleId: this is the subscription id created on Appstore Connect. You can refer to how to create it here: https://developer.apple.com/videos/play/tech-talks/110350/. Here I have already created it on appstore connect, you can refer to the image below

Subscription

Select an Image

3. platform: you will select iOS or Android. Currently I've selected iOS, I will guide you on creating it on Android in future versions

After you fill in all the information, click Save and Publish, so users will see the Subscription Plan you have created

Result

Select an Image

SETUP Flutter iOS & Android

1. Install Flutter

- Please download flutter and install it according to the instructions at the following link: https://docs.flutter.dev/get-started/install. If you encounter difficulties setting up flutter, please contact us for assistance.

2. Setup Project

- Open the project and run the following commands to set up the project:

 flutter pub get
↓Auto-detect
Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
Go
HTML, XML
HTTP
JSON
Java
JavaScript
Kotlin
Less
Lua
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Properties
Python
Ruby
Rust
SCSS
SQL
Shell Session
Swift
TOML, also INI
TypeScript
YAML
Plaintext

flutter pub get

Select an Image

cd ios && pod install
↓Auto-detect
Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
Go
HTML, XML
HTTP
JSON
Java
JavaScript
Kotlin
Less
Lua
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Properties
Python
Ruby
Rust
SCSS
SQL
Shell Session
Swift
TOML, also INI
TypeScript
YAML
Plaintext

cd ios && pod install

Select an Image

3. Setup baseURL

- You will look for the main.dart file and find the line static const String baseURL = and replace it with the API. You can get the API from the Final & Result step. In my case, it will be: http://192.168.1.100:1337/api/

static const String baseURL = 'http://192.168.1.100:1337/api/';

Select an Image

4. Run Project

- Run flutter run to run the project with a simulator.

flutter run
↓Auto-detect
Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
Go
HTML, XML
HTTP
JSON
Java
JavaScript
Kotlin
Less
Lua
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Properties
Python
Ruby
Rust
SCSS
SQL
Shell Session
Swift
TOML, also INI
TypeScript
YAML
Plaintext

flutter run

Select an Image

Contact Us

  
    Technical Support
    
      Email: hello@witworkapp.com

      Working Hours: Monday to Friday, 9 AM - 11 PM (GMT+7)
    
    Social Media
    
      Twitter: @witworkapp | Facebook: @witworkapp

      Thread: @witworkapp | Tiktok: @wit_work_app

      Instagram: @witworkapp
    
    Our Website
    https://witworkapp.com
  
    Resources
    https://github.com/witwork/mixxai

Technical Support	Email: hello@witworkapp.com Working Hours: Monday to Friday, 9 AM - 11 PM (GMT+7)
Social Media	Twitter: @witworkapp \| Facebook: @witworkapp Thread: @witworkapp \| Tiktok: @wit_work_app Instagram: @witworkapp
Our Website	https://witworkapp.com
Resources	https://github.com/witwork/mixxai