This template can quickly deploy a full-stack serverless application based on Vue + Express + PostgreSQL. It mainly contains the following components:
Use npm to install Serverless Framework globally:
npm install -g serverless
If you have already installed Serverless Framework, you can run the following command to upgrade it to the latest version:
npm update -g serverless
After the installation is completed, run the serverless -v
command to view the version information of Serverless Framework and make sure that the version information is as follows or displays higher versions. The returned result is as shown below:
$ serverless –v
Framework Core: 1.74.1 (standalone)
Plugin: 3.6.14
SDK: 2.3.1
Components: 2.31.6
Create a local folder and run the serverless init
command to download the relevant template.
serverless init fullstack
Create a .env
file in the project root directory and configure the corresponding Tencent Cloud SecretId
, SecretKey
, region, and AZ information in it.
# .env
TENCENT_SECRET_ID=xxx // `SecretId` of your account
TENCENT_SECRET_KEY=xxx // `SecretKey` of your account
# Region and AZ configuration
REGION=ap-guangzhou // Resource deployment region, which refers to the region where the function and static webpage are deployed
ZONE=ap-guangzhou-2 // Resource deployment AZ, which refers to the AZ where the database is deployed
Note:
- If you don't have a Tencent Cloud account yet, please sign up first.
- If you already have a Tencent Cloud account, please make sure that your account has been granted the
AdministratorAccess
permission. In addition, you can getSecretId
andSecretKey
in API Key Management.ZONE
currently can only beap-beijing-3
,ap-guangzhou-2
, orap-shanghai-2
.
Install the required dependencies by running the following command:
npm run bootstrap
Deploy by running sls deploy --all
. The returned information is as follows:
$ sls deploy --all
serverless ⚡ framework
serverlessVpc:
region: ap-guangzhou
zone: ap-guangzhou-2
vpcId: vpc-xxx
vpcName: serverless
subnetId: subnet-xxx
subnetName: serverless
fullstackDB:
region: ap-guangzhou
zone: ap-guangzhou-2
vpcConfig:
subnetId: subnet-100000
vpcId: vpc-1000000
dBInstanceName: fullstackDB
dBInstanceId: postgres-100000
private:
connectionString: postgresql://tencentdb_100000xxxxxxxxxxxxx@172.16.250.15:5432/tencentdb_1000000
host: 172.16.250.15
port: 5432
user: tencentdb_100000
password: xxxxxxxx
dbname: tencentdb_100000
fullstack-api:
region: ap-guangzhou
apigw:
serviceId: service-100000
subDomain: service-100000-123456789.gz.apigw.tencentcs.com
environment: release
url: https://service-100000-123456789.gz.apigw.tencentcs.com/release/
scf:
functionName: fullstack-api
runtime: Nodejs10.15
namespace: default
fullstack-frontend:
website: https://fullstack-serverless-db-123456789.cos-website.ap-guangzhou.myqcloud.com
50s › tencent-fullstack › Success
After the deployment succeeds, you can use a browser to access the website link generated by the project to view the generated website.
Note:
The function in this project cannot directly access the public network due to VPC. If you need public network access, please see Network Configuration Management.
Run npm run info
to view the deployment information, which includes vpc
, db
, api
, and frontend
(frontend website) for this project. The returned information is as follows:
$ npm run info
> tencent-fullstack@1.1.0 info /root/tencent-fullstack
> npm run info:vpc && npm run info:db && npm run info:api && npm run info:frontend
> tencent-fullstack@1.1.0 info:vpc /Users/yugasun/Desktop/Develop/@yugasun/tencent-fullstack
> sls info --target=./vpc
serverless ⚡ framework
Status: active
Last Action: deploy (5 minutes ago)
Deployments: 1
region: ap-guangzhou
zone: ap-guangzhou-2
vpcId: vpc-xxx
vpcName: serverless
subnetId: subnet-xxx
subnetName: serverless
serverlessVpc › Info successfully loaded
> tencent-fullstack@1.1.0 info:db /root/tencent-fullstack
> sls info --target=./db
serverless ⚡ framework
Status: active
Last Action: deploy (3 minutes ago)
Deployments: 18
region: ap-guangzhou
zone: ap-guangzhou-2
vpcConfig:
subnetId: subnet-100000
vpcId: vpc-1000000
dBInstanceName: fullstackDB
dBInstanceId: postgres-100000
private:
connectionString: postgresql://tencentdb_100000xxxxxxxxxxxxxxxxxxx@172.16.250.15:5432/tencentdb_100000
host: 172.16.250.15
port: 5432
user: tencentdb_1000000
password: xxxxxxxxx
dbname: tencentdb_1000000
fullstackDB › Info successfully loaded
> tencent-fullstack@1.1.0 info:api /root/tencent-fullstack
> sls info --target=./api
serverless ⚡ framework
Status: active
Last Action: deploy (2 minutes ago)
Deployments: 10
region: ap-guangzhou
apigw:
serviceId: service-1000000
subDomain: service-1000000-123456789.gz.apigw.tencentcs.com
environment: release
url: https://service-1000000-123456789.gz.apigw.tencentcs.com/release/
scf:
functionName: fullstack-api
runtime: Nodejs10.15
namespace: default
fullstack-api › Info successfully loaded
> tencent-fullstack@1.1.0 info:frontend /root/tencent-fullstack
> sls info --target=./frontend
serverless ⚡ framework
Status: active
Last Action: deploy (2 minutes ago)
Deployments: 9
website: https://fullstack-serverless-db-123456789.cos-website.ap-guangzhou.myqcloud.com
fullstack-frontend › Info successfully loaded
sls remove --all
to remove the project. The returned information is as follows:$ sls remove --all
serverless ⚡ framework
38s › tencent-fullstack › Success
Was this page helpful?