ShortUrl
A serverless URL shortening service based on Vercel.
本页还提供:简体中文版
🎉 Features
- serverless
- Automatically prevent duplicate short URLs from being generated
- Background management page
- Add short URL
- list of short urls
- remove short url
- Companion API
- Secondary development possible
😎 Demo
😜 deploy
First part
Apply for Mongodb database
Video version: The first chapter on Youtube/Bilibili
Because the short link service needs to store URL data, it is necessary to apply for a free Mongodb database from Mongodb.com for data storage.
In this section, you will get a Mongodb url, please save it, we will use it in the next section.
Open https://account.mongodb.com/account/register to register an account




Create a database account and record the password of the account
Authorize all IP connections
create
Click this option Copy the connection URL Replace the "" in the URL with the password you just setThe second part
Video version: The second chapter on Youtube/Bilibili
1. Deploy the repository to Vercel:
You need to click the button below to go to the Vercel deployment page
If you have not logged in or registered Vercel, please click the deployment button above again after registering/logging in according to the page.
If everything is ready, you will see the following page after clicking the button:

You need to give your project a name, fill it in the "Repository Name" input box, and click the "Create" button,
At that time Vercel will automatically create a repository with the same name in your Github and pull the code of this project.
After the pull is complete, Vercel will start project deployment, which is also automatic.
When you see this page, the project has been deployed successfully.

2. Add environment variables
After the deployment is complete, you need to click the "Continue to Dashboard" button located in the upper right corner of the page

If you accidentally close this button, you only need to open the item on the homepage.
In the new page, click the "Settings" button in the menu bar

Click the "Environment Variables" button to open the environment variable settings page

On the environment variable setting page, create new environment variables named "AdminSession" and "mongodbUrl" according to the figure below, and write the administrator login credentials and mongodbUrl (obtained in step 1) respectively.
Also check the "Production", "Preview" and "Development" options below.
Finally click the "Save" button to save

We need to click the "Deployments" button in the navigation bar to open the deployment tab

Click the "Redeploy" button in the "..." button to the right of the first record to redeploy the project

Check "Redeploy with existing Build Cache." and click the "REDEPLOY" button to redeploy

When you see this page, the service has been successfully deployed

You can access the domain name +/admin to access the management page, and the login password is the value of "AdminSession" in the environment variable you set.

If you need a custom domain name, you can bind it yourself on the settings page










