preface

GitHub Actions GitHub Actions is a CI/CD tool provided by GitHub to automate development processes.

This article will show you how to use Github Actions in conjunction with Node.js to send fashion advice emails at regular times each day.

Making Actions profile

We can compare Github Actions to the common event listening on the front end.

When we need to click a button and do something, we do two things:

  1. Listen for the button’s click event.

  2. Once the click event is triggered, the corresponding function is executed.

The same goes for Github Actions. The events that Github Actions listen for are common Github Actions, including push, pull, fork, etc. Once we trigger these events, we perform the preset task. These tasks include testing, packaging, publishing, calling third-party services, etc.

GitHub refers to the entire process as a workflow and has a dedicated configuration file to configure the workflow.

Let’s create a new configuration file together.

Creating a Configuration File

First, we need to select New Workflow in the Actions bar of the repository.

This will take us to the configuration file template page. We can choose to use these templates or write our own.

The configuration files are in YAML format, ending with the.yml suffix. Here is an example configuration file.

name: Build and Deploy
# the trigger
on: 
  push:
# task
jobs:
  build-and-deploy:
  	# environment
    runs-on: ubuntu-latest
    steps:
    - name: Checkout 
      uses: The actions/[email protected]
      
    - name: Install node
      uses: actions/setup-node@v2
      with:
        node-version: '14'

    - name: Add packages
      run: npm install
Copy the code

The purpose of this configuration file is to listen for the push operation, and once we push the code, this workflow will be triggered. GitHub Actions provides the entire server environment, which reads the repository code, installs the Node.js environment and executes the NPM install command.

Following our previous analogy, in this configuration file, ON represents the events to be listened on and Jobs represents the tasks to be performed. Jobs usually contain a lot of content and need to be done in steps. The Steps that make up Jobs are called Steps. Steps can be composed of several separate commands, collectively known as Actions.

In addition to creating your own Actions, Github Actions also supports referencing Actions published by other developers. Published Actions can be found in GitHub’s Marketplace. This means that common functions can be used on wheels, so you don’t have to write them yourself. This is convenient for developers and also reduces our learning costs.

There are also ready-made Actions for sending emails, which will be covered later.

After editing the YAML file, select Commit New File to create a new YAML file. This file is located in the.github/ Workflow directory.

Now that we’ve created a new configuration file, we can use Github Actions to perform some automation. Then you have to think about how to send the email.

Procedure and precautions for sending emails

First we need to consider two things:

  1. How to useGithub ActionsSend an email.
  2. How to get clothing advice and weather information that needs to be sent.

On the first point, there are ready-made Actions to call.

- name: Send mail
  uses: dawidd6/action-send-mail@v2
  with:
  	# SMTP server address
    server_address: smtp.gmail.com
    server_port: 465
    # Password
    username: ${{secrets.MAIL_USERNAME}}
    password: ${{secrets.MAIL_PASSWORD}}
    # titles
    subject: Github Actions job result
    # Sent content
    body: file://README.md
    # Target email
    to: [email protected],[email protected]
    from: Luke Skywalker # <[email protected]>
    content_type: text/html
Copy the code

This Actions uses the SMTP service provided by the software provider. SMTP stands for simple mail delivery protocol, which allows us to send mail to a specified mail server. Tencent, netease and other mail service providers generally provide this service. We can search online for the SMTP server address provided by these software providers and configure it in the Actions. The account and password here are the account and password of the software service provider you use (netease is mailbox 163, Tencent is mailbox QQ). To avoid the embarrassment of exposing such sensitive information in the code, we can write the information in the secrets of the warehouse. It can be configured as shown in the following figure. Once everything is configured, we can send the email.

On the second point, there are two potholes to note.

The first is to send HTML content by mail, called HTML mail, so that the HTML files that are sent are stripped of script tags, which means that all JavaScript code is banned. To get around this limitation, we need to fetch the data on the server and return a static page (SSR). Here I use Node.js as the server language.

The second is that there are few domestic apis that can provide free advice on dressing. The only free API I found is the API of Wind weather. However, in the server environment provided by Github Actions, the API for calling Zephyr weather returns an error (possibly due to network reasons). To get around this, I chose to crawl the information directly from the China Weather Website, which is supposed to be accurate and reliable. We can check the weather information and dressing suggestions of various cities on The Website of China Weather. The content in the red box below is the weather information and dressing index of a certain day in Chengdu, which is also the data we need to obtain.

To get this data, we first need to get the source code of the web page. We can request the URL of the page via an HTTP library such as Axios to get the source code, which is an HTML string.

Once we have the source code, we need to analyze whether the weather information and clothing index are already in the source code. If not, the data should be retrieved by calling the interface. We need to find these interfaces in Chrome’s developer tools and request them for data. The specific data acquisition code can be viewed here.

That way, all the problems are solved. The following is a fully functional YAML file.

name: Build and Deploy
on: 
  push:
  The timer can specify a time to trigger the workflow
  There are some examples for reference # https://crontab.guru/examples.html
  schedule: 
    - cron: '0 22 * * *'
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
    - name: Checkout 🛎 ️
      uses: The actions/[email protected]

    - name: Install node
      uses: actions/setup-node@v2
      with:
        node-version: '12'
	# Trigger the node command
    - name: Get suggestion
      run: npm install && npm run suggestion

    - name: Send mail ✉ ️
      uses: dawidd6/action-send-mail@v2
      with:
      	# SMTP server address
        server_address: smtp.163.com
        # SMTP server port
        server_port: 465
        username: ${{secrets.MAIL_USERNAME}}
        password: ${{secrets.MAIL_PASSWORD}}
        subject: What to wear today
        body: file://index.html
        to: 598777720@qq.com
        from: hgwxxdd
        content_type: text/html
        convert_markdown: true
Copy the code

The workstream calls the NPM run suggestion command every morning, gets the information from The China Weather Network, uses the Fs module of Node.js, and outputs the information to index.html. Then we will call THE STMP service of netease and send the index. HTML as the email content to the mailbox designated by us. And with that, our goal is complete.

conclusion

This is an overview of how to use Github Actions and Node.js to regularly send out clothing advice emails. The complete code is here.

If this article has been helpful or enlightening to you, stay tuned! Thumb up! Everyone’s support and recognition, is the biggest power of my writing 😊