Preparation

1. Github Account
2. Vercel Account
3. A Domain『optional』

Deploy Tutorial

Fork repository

First open this link: https://github.com/zhongfly/now-subconverter and click the fork button on the upper right corner to copy it to your own repository.

Then do the same for this link: https://github.com/zhongfly/sub-web

Modify the configuration

Find the now-subconverter repository we just forked, click the .github/workflows folder. In order to use our own subscription convert backend, we need to change some settings in main.yml and sub-web.yml.

First click the main.yml and find managed_config_prefix option on line 36, change the sub-beta.now.sh to our own domain we want to use.『If you don't have your own domain, you can get one for free on Freenom or you can use the one comes with Vercel』

Then we select sub-web.yml and modify ：

• Line 23 git clone https://github.com/zhongfly/sub-web.git to git clone [Your forked sub-web address]
• Line 48 managed_config_prefix option sub-beta.now.sh to our own domain we want to use
• Line 56 Update sub-web from zhongfly/sub-web to the message you want it to show『optional, doesn't matter』

In order to use our own frontend, we still need to change the setting in sub-web repository we just forked. We need to modify the .env and src/views/Subconverter.vue files.

First let's modify the .env file in the root folder of our repository based on our needs『Following are some config meaning』：

• VUE_APP_PROJECT：Frontend project address, the link people will go when clicking the Github icon
• VUE_APP_BOT_LINK：TG Link，the link will go when clicking the TG icon
• VUE_APP_BACKEND_RELEASE：Backend project address, no need to modify
• VUE_APP_SUBCONVERTER_REMOTE_CONFIG：Remote config address
• VUE_APP_SUBCONVERTER_DEFAULT_BACKEND：API backend address, please change it to our own domains we want to use
• VUE_APP_MYURLS_DEFAULT_BACKEND：Shorten URL backend, you can change it if you have your own
• VUE_APP_CONFIG_UPLOAD_BACKEND：Config upload backend

Then we open src/views/Subconverter.vue file，change the customBackend and backendOptions between line 266-279，add our own backend domain. If you're not sure about the syntax, I recommend you just change one of them to your own

Then we find https://sub-beta.now.sh/sub? on line 588 and modify it to our own backend address like the one I will use: https://sub.90.ms/sub?

Compile

When we finishing all our modifications, before deploy, we need to compile a newly modified sub-web to our now-subconverter repository，let's back to our now-subconveter repository and click Actions，Choose update sub-web under the All workflows tab，Click Run workflow to compile，wait few minutes for its done. If it fails, you can click the workflow to check the detailed error message and do some corrections.

Deploy

First let's open https://vercel.com/dashboard and login using our Github account. After we login, choose Import Project - Import Git Repository

Paste your own now-subconverter repository address and click Continue - Continue - Deploy

After deploy, click Open Dashboard

Choose Settings - Domains - Select the domain comes with Vercel - Choose Edit，Change it to the domains we want to use『Make sure it's same as the domain you modified in the repository』

Then we add the required CNAME record to our DNS provider as the instruction, Here I use Cloudflare, add the record as below and click the yellow cloud to change it to DNS only

When the CNAME gets resolved, back to the Vercel dashboard and wait for validation, after a while we can see our domain was successfully configured and ready for use.

Deep customization

The remote configuration, backend address, shorten URL and upload configuration, etc. all these settings show on the front page can be changed by modifying the relevant files like .env and src/views/Subconverter.vue.

You can reference the original repository and try yourself.

On this page https://github.com/zhongfly/now-subconverter/wiki ，the author of this repository also introduces how he uses IFTTT and Cloudflare to trigger automatically compile and deploy progress when new commits made to the repository. You can try for yourself if you're interested.

Video Tutorial

Youtube

Bilibili