Deploy the Hexo blog in 10 minutes with GiteeGo + OSS

preface

• Hexo is a node.js based static blogging framework that has few dependencies and is easy to install and use. It also has many plug-ins and themes, and supports Git deployment, cloud hosting, object storage, and more.

• Gitee Go is Gitee’s CI/CD(Continuous Build and Integration) service. Users can customize the build process to automate build integration.

In this practical case, we will automate the deployment and publication of the Hexo blog based on a combination of Gitee Go + Hexo + object storage.

Environment to prepare

This actual combat is based on Gitee Go + Hexo + object storage, so you need to prepare the following:

• Create a blog repository on Gitee and launch Gitee Go
• A RAM account of Aliyun or Tencent Cloud and open object storage (OSS/TOS) service. In this case, Aliyun OSS is used as an example to create object storage and subaccounts using this account and obtain the following content
  • Bucket: indicates the name of an object storage bucket
  • Region: object storage regionID (regionID)
  • SecretId: AccessKey ID of the RAM account
  • SecretKey: AccessKey Sercret of the RAM account
• A domain name has been registered through ICP

Experience and build the process

In this exercise, you can build your own Hexo site based on existing documentation and tutorials, deploy Hexo to object storage in conjunction with the Gitee Go release, or Fork the repository case by following these steps. Quickly experience the convenience of Gitee Go + Hexo blog automatic deployment.

1. Claim your build time through the Gitee Go campaign page.
2. Fork the warehouse, navigate through the warehouse”DevOpsMenu is found and openedGitee Go.
3. Configuring AliyunOSSOr tencent cloudTOSObject storage.
4. Ali Cloud or Tencent Cloud configuration relatedRAMAccount.
5. Through the warehouse”management“- >”Environment variable Management“Add environment variable content.
6. Adding and submitting any file to the repository triggers pipeline deployment of the blog.

Hexo Quick Start

Using and debugging Hexo is based on Node.js. Using NPM install -g Hexo && NPM install -g Hexo -CLI, you can install Hexo globally and invoke it on the system. You can also integrate Hexo into your current project with NPM install Hexo –save. To learn about Hexo commands, visit The Hexo Quick Start

Hexo is written using Markdown syntax and supports the common Markdown syntax.

Receive Gitee Go’s free build time

By visiting the Gitee Go campaign page, select the person/business that needs to collect the time and receive the 500 minute build time

Configuring OSS Storage

Create OSS Bucket

Create an OSS Bucket by accessing the Aliyun OSS console oss.console.aliyun.com/, entering a Bucket name and selecting a region. Obtain the corresponding RegionID from the OSS Region and Endpoint mapping table

Bucket Static page Settings

Access the corresponding OSS Bucket and choose Basic Settings > Static Page to configure the OSS Bucket to static web hosting mode. The default home page and default 404 page are set to index.html.

Bind a custom domain name

If you want to use OSS as a static site master, you need to bind an existing domain name.

Access the corresponding OSS Bucket, choose Transfer Management > Domain Name Management, and enter the domain name of the blog site. Here, my blog site Normalcoder.com is used as an example. If the domain name uses alicloud’s domain name resolution service, You can also select Automatically Add CNAME records to complete the configuration of automatically adding DNS resolution.

After the configuration is complete, you can configure more information, such as CDN acceleration and domain name SSL certificate.

After the configuration is complete, you can use nslookup to view the DNS resolution.

Configure RAM accounts and authorization

At present, the services of most cloud service vendors can be invoked in the form of API. To publish a blog to Aliyun OSS using Gitee Go, you need to open a RAM account with corresponding permissions and obtain the corresponding AccessKey and SercretKey.

By visiting ali cloud access console ram.console.aliyun.com/users RAM, create and assign a RAM account, get the corresponding AccessKey ID and the AccessKey Sercret.

Assign AliyunOSSFullAccess to obtain read and write permissions assigned to OSS.

Back to the OSS Bucket, choose Permission Management > Bucket Authorization Policy, add the corresponding RAM account to the Bucket authorization list, and grant the full control permission.

Configuring Environment Variables

Access and Fork the Hexo OSS Deploy sample repository, choose Management > Environment Variable Settings, and configure environment variables. For details, see the following table. (The variable information is used for pipeline configuration in the following context.

Open Gitee Go

Navigate to the “DevOps” menu in the repository to find and activate Gitee Go.

Go back to the repository and commit any file. Trigger the pipeline. The deployment is triggered. The deployment effect is previewed as follows:

Pipeline configuration structure and field description

In this practical case, the pipeline configuration file exists in./workfolow/deploy.yml. The specific contents and fields are described as follows:

# = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =
Example of building and deploying a Hexo static website based on Aliyun OSS/Tencent COS
Build a Hexo project through Node compilation and deploy it to OSS/COS
# = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =
name: hexo-oss-deploy                      # Define a pipeline named "HEXo Deployment (OSS)" with the unique ID hexo-OSS-deploy
displayName: 'Hexo deployment (OSS)'
triggers:                                  # Pipeline trigger configuration
  push:                                    Set the master branch to trigger PRECISE builds when code push is generated
    - matchType: PRECISE
      branch: master
commitMessage: ' '                          # Determine whether to pipeline by matching the currently committed CommitMessage
stages:                                    # Build phase configuration
  - stage:                                 # Define a stage named "deploy Stage" with an ID identifying it as deploy- Stage
      name: deploy-stage
      displayName: 'Deploy Stage'
      failFast: false                      # Allow fast failure, that is, when a task fails in the Stage, the whole Stage is directly terminated
      
      steps:                               # Build step configuration
        - step: npmbuild@1                 # Use NPM compilation environment
          name: deploy-step                # Define a phase named "deploy step" with an ID identifying it as deploy-step
          displayName: 'Deploy Step'
          inputs:                          # Build input parameter Settings
            nodeVersion: 14.15             # specify node environment version 14.15
            goals: |                       Install dependencies, configure related topics, deployment parameters, and publish the deployment
              node -v
              npm -v
              npm install
              npm run config url $SITE
              npm run config theme $THEME
              npm run config deploy.cloud $CLOUD
              npm run config deploy.bucket $BUCKET
              npm run config deploy.region $REGION
              npm run config deploy.secretId $SECRET_ID
              npm run config deploy.secretKey $SECRET_KEY
              npm run clean
              npm run deploy
Copy the code

Enclose content video tutorial: www.bilibili.com/video/BV1Xv…