Personal blog site deployment

precondition

Dear friends, if you do not know how to develop a personal blog static website, then read the author’s last article personal blog website construction

Start by creating your own personal blog project, we are going to talk about how to publish your personal blog site.

To prepare

Because of the need to host code to the appropriate code repository and the ability to provide static web site deployment, the following platforms can do code hosting, of course, their own cloud servers need to be deployed in a different way.

The following account or server, friends to choose a line.

Making account

GitHub is one of the most popular gay networking sites in the world. If you don’t already have a Github account, you need to rethink yourself.

GitHub addresses are registered on their own, so I won’t go into details here.

GitLab account

GitLab is an MIT licensed web-based Git repository management tool developed by GitLabInc., with wiki and issue tracking features. Using Git as a code management tool, and built on the basis of web services.

GitLab was developed by Ukrainian programmers DmitriyZaporozhets and ValerySizov and is written in Ruby. Later, some parts were rewritten in Go. As of May 2018, the company has approximately 290 team members and more than 2,000 open source contributors. GitLab is used by IBM, Sony, JulichResearchCenter, NASA, Alibaba, Invincea, O ‘reilly media, leibniz-rechenzentrum (LRZ), CERN, SpaceX and other organizations

GitLab website addresses are registered by themselves, which will not be described here.

Coding account

Coding is a software development platform based on cloud computing technology, integrating project management, code hosting, operating space, and quality control. In the era of cloud computing, Coding pushes software development to the cloud, enabling developers to do all aspects of their development in a single browser. Developers can focus on building solutions to business problems rather than managing operations or release stacks, ensuring applications meet product-level target service levels, and providing channels and standards for code quality inspection and project quality control for enterprise-level project applications. In addition to ensuring the data security and stability of private projects, Coding also combines a series of social collaboration features, such as bubbling and commenting, public project publishing and discussion, to create a tech-supported developer community.

Coding website address is registered by itself, which will not be described here.

A Cloud Server

If you already have a server, install Nginx on the server and drop the static files of your website project into an Nginx directory to be accessed.

A domain name

Whether you need a domain name, you can go to Ali Cloud, Huawei cloud, Tencent cloud and other cloud platforms for domain name registration.

Alibaba Cloud Huawei Cloud Tencent cloud

How to register a domain name: How to register your own domain name

The deployment of

After the above preparations are ready, deploy them. Since I use coding and Github to deploy, other deployment methods do not expand too much. Why conding for deployment? As it is a domestic platform, the access speed is much faster than that of GitHub and GitLab.

GitHub Pages

  • First, you need to prepare a Github repository

Name must be your username. Making. IO such as making my address is: https://github.com/triumphxx so my warehouse name must be: triumphxx. Making. IO

  • Prepare release documentsdeploy.sh

Create the deploy.sh file in the root directory of your own project with the following contents:

  #! /usr/bin/env sh
  #Make sure the script throws any errors it encounters
  set -e
  
 #Generating static files
 npm run build   #Go to the generated folder  cd docs/.vuepress/dist   #If it is published to a custom domain name  echo 'github.blog.triumphxx.com.cn' > CNAME   git init  git add -A Git commit -m  git push -f https://github.com/triumphxx/triumphxx.github.io master   cd - Copy the code

❝

Description: echo ‘github.blog.triumphxx.com.cn’ > CNAME, this script mean, bind your private domain, under your own domain name management, resolve domain name to triumphxx. The dead simple. IO as shown in the figure below:

❞


Domain name resolution not yet? Teach you by the hand

  • Then execute deploy.sh on the console, and when it’s done, the project is published online.

  • Browser input domain name: http://github.blog.triumphxx.com.cn


Congratulations, github Pages deployment is successful

GitLab CI

  • Set the correct base in docs/.vuepress/config.js.

    If you’re going to post to https://.gitlab.io/, you can skip this step because base defaults to “/”.

    If you intend to publish to https://.gitlab.io// (i.e. your repository is at https://gitlab.com//), set base to “//”.

    Set dest to public in.vuepress/config.js.

    Create a.gitlab-ci.yml file at the root of your project that will help you automatically build and deploy whenever you commit changes

    Image: node: 12.16.1  
  pages:
   cache:
     paths:
 - node_modules/   script:  - yarn install # npm install  - yarn docs:build # npm run docs:build  artifacts:  paths:  - public  only:  - master Copy the code

The server

Install Nginx on your server. Throw the static files of your website project into the Nginx directory and you have successfully deployed.

Coding deployment

  • The author focuses on the introduction based oncodingIn the friends havecodingUnder the premise of account (no please register:Coding websiteLogin)condingWebsite, to register

  • Once registered, log in to your conding website at https:// team name.coding.net/

  • Create your repository, project –> Create Project –> Code managed Project for example, create your blog project as Blogs


  • After creating the project, go to your home page and findDeployment console

  • Click Create App and fill in the information

  • Create the deployment process and create

  • Related projects


  • Generating an SSH Public Key

Generate your SSH public key Reference: conding Generate SSH public key

  • Editing a Configuration File

SSH public key directory: SSH public key directory: SSH public key directory

   #Write a name for Host without Chinese characters
   Host TriumpHxx
   #Here is the website address
   HostName e.coding.net
 #Use the git
 User git  #The private key corresponding to coding SSH/Private key nameCopy the code

❝

Note: a name for Host is good, the role is to use this name, pointing to the HostName site address, so that your warehouse address can be abbreviated. Such as: [email protected]: triumphxx/blogs/blogs. The git can be abbreviated to git @ triumphxx: triumphxx/blogs/blogs. Git

❞

  • Writing release scripts

Under your project, create the deploy.sh script file with the following contents

   #! /usr/bin/env sh
   
   #Make sure the script throws any errors it encounters
   set -e
   
 #Generating static files  npm run build   #Go to the generated folder  cd docs/.vuepress/dist   #If it is published to a custom domain name  echo 'blogs.triumphxx.com.cn' > CNAME    git init Git config user.name git config user.nameGit config user.email git add -A  git commit -m 'deploy-coding'   git push -f git@TriumpHxx:triumphxx/blogs/blogs.git master  cd - Copy the code

  • Execute the script to publish

    Run the following command on your terminal:

    sh deploy.sh
Copy the code

  • Configure the continuous deployment module

    After publishing, log into your conding into the repository and see the compiled file. At this point, you need to configure your project to continuously deploy functional modules. Click the lower right corner of the project Settings, function switch button, will continue to deploy open.



  • Continuous configuration publishing

    After enabling the continuous deployment function, return to the project management interface, click Continuous Deployment -> Static Website, click Publish static website now, fill in the basic information, and select Push to the Master branch to trigger construction. Click Save.


  • Immediately deploy

    After the configuration is complete, the system will assign you a temporary domain name. Click Deploy Now. Friends, if you have your own domain name to your domain name center configuration can.


  • Configuration of the domain name

    Friends, if you have your own domain name, go to your domain name center to configure, click the Settings button in the upper right corner, enter the Settings page, set the domain name to bind. Cname is the domain name temporarily assigned to you. Domain name resolution not yet? Teach you by the hand


  • For a visit

    Enter your bound domain name for access


summary

GitHub Pages and Conding are the two deployment modes, with the focus on Conding. More exciting content, welcome to scan code.