How I Use GitHub Actions to Keep My Resume Up to date Using Scheduled Events
Tags: python, github, javascript, tutorial
Published: 2020-08-12 12:36:31

### GitHub Actions (Scheduled Events)

GitHub Actions lets you run your workflows on a schedule.
If you add the example code below in your GitHub Workflow you will see that your workflow will run every 15 minutes.

```yaml
on:
  schedule:
    # * is a special character in YAML so you have to quote this string
    - cron:  '*/15 * * * *'
```
***i.e:*** The shortest interval you can run scheduled workflows is once every 5 minutes.
***more details on scheduled events here:***
https://docs.github.com/en/actions/reference/events-that-trigger-workflows#scheduled-events



### Setup GitHub Actions:

Create a ``.yaml`` file here ``<project_dir>/.github/workflows/update_resume.yaml``

paste this code in the created file:

```yaml
name: Update My Resume

on:
  push:
    branches:
      - master
  schedule:
    - cron:  '0 */15 * * *'

jobs:

  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Code
        uses: actions/checkout@v2

      - name: Setup Python Environment
        uses: actions/setup-python@v2
        with:
          python-version: 3.7

      - name: Install Requirements
        run: pip install -r requirements.txt

      - name: Execute Python script
        run: |
          python scripts/update.py

      - name: setup git config
        run: |
          git config user.name ${{ secrets.USERNAME }}
          git config user.email ${{ secrets.EMAIL }}

      - name: commit changes
        run: |
          chmod +x ./scripts/commit.sh
          ./scripts/commit.sh
```

Here the workflow will run on ``push`` events and also run automatically in every 15 minutes.

We are running the workflow on ``ubuntu-latest`` image.

In the first step github will checkout the code

```yaml
 - name: Checkout Code
   uses: actions/checkout@v2
```

In the second step github will setup python 3.7

```yaml
 - name: Setup Python Environment
   uses: actions/setup-python@v2
   with:
     python-version: 3.7
```

In the third step github will install the requirements using ``pip``
I'm using the ``requests`` package on send request to the GitHub API.
If you don't need any external packages you can skip this.

```yaml
 - name: Install Requirements
   run: pip install -r requirements.txt
```

In this step github will execute ``scripts/update.py``.
Don't worry we haven't created the python script yet. More on this later.

```yaml
 - name: Execute Python script
   run: |
     python scripts/update.py
```

In this step github will setup the git config. you can go to ``https://github.com/<your_username>/<your_repository_name>/settings/secrets/new`` to create secrets (``USERNAME``, ``EMAIL``). 
This username and email will be used on the git commit.

```yaml
 - name: setup git config
   run: |
     git config user.name ${{ secrets.USERNAME }}
     git config user.email ${{ secrets.EMAIL }}
```

In this step github will commit the changes to your repository.
We will create the ``/scripts/commit.sh`` file in the next step.

```yaml
 - name: commit changes
   run: |
     chmod +x ./scripts/commit.sh
     ./scripts/commit.sh
```


### Create Commit Script:

Create a file here ``<project_dir>/scripts/commit.sh``

paste this code in the created file:

```shell
#!/bin/bash

git add . 
git commit -m "Updated Repository data"
git push origin master
```
This is just a shell script which will push a new commit to your repository.

### Create Json File:

this Json file will be updated using the ``update.py`` file that we will create later.

Create a file here ``<project_dir>/repo_data.json``

paste this code in the created file:

```json
[
    {
        "full_name": "readthedocs/readthedocs.org",
        "url": "https://github.com/readthedocs/readthedocs.org"
    },
    {
        "full_name": "saadmk11/banking-system",
        "url": "https://github.com/saadmk11/banking-system"
    }
]
```
Here I adding the open source projects that I have contributed to. We will update this file to 
to show the correct number of starts, forks, watchers for each repository and update the description of the repository.

### Create Python Script:

Create a file here ``<project_dir>/scripts/update.py``

paste this code in the created file:

```python
import json

import requests


def get_repositories_data(data):
    new_data = []

    for repo in data:

        repo_name = repo['full_name']

        url = f'https://api.github.com/repos/{repo_name}'
        response = requests.get(url)

        response_data = response.json()

        repo.update({
            "short_description": response_data['description'],
            "stars": response_data['stargazers_count'],
            "forks": response_data['forks_count'],
            "watchers": response_data['watchers_count']
        })
        new_data.append(repo)

    return new_data


def update_json_file():
    with open('repo_data.json', 'r') as json_file:
        data = json.load(json_file)
        updated_data = get_repositories_data(data)

    with open('repo_data.json', 'w') as json_file:
        json_file.write(json.dumps(updated_data, indent=4))


if __name__ == '__main__':
    update_json_file()
```

This script will send ``GET`` request to the GitHub API and get the latest updates of the repositories that I listed in the Json file and update the ``repo_data.json`` file to show the current number of starts, watchers and forks and update the description.

Create the ``requirements.txt`` file here ``<project_dir>/requirements.txt`` and add ``requests==2.24.0`` in it.


### Create ``HTML`` and ``JS`` File to Load The JSON Data:

Create a file here ``<project_dir>/index.html``

Add this code in the created file:

```html
<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>My Resume</title>
    </head>
    <body>
        <div id="openSourceRepos"></div>
        <script src="main.js"></script>
    </body>
</html>
```
** This is just to show the example you can style and design your resume any way you like.

Create a file here ``<project_dir>/main.js``

Add this code in the created file:

```javascript
function getJSON(url, callbackFunction) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            try {
                var responseData = JSON.parse(xmlhttp.responseText);
            } catch(error) {
                return;
            }
            callbackFunction(responseData);
        }
    };

    xmlhttp.open("GET", url, true);
    xmlhttp.send();
}


document.addEventListener('DOMContentLoaded', (event) => {
    var container = document.getElementById("openSourceRepos");

    getJSON('repo_data.json', function(data) {
        data.forEach(function (repo) {
            var child = `
                <div>
                  <h2>
                      <a href='${repo.url}'>${repo.full_name}</a>
                  </h2>
                   <p>${repo.short_description}</p>
                   <ul>
                       <li>${repo.stars}</li>
                       <li>${repo.forks}</li>
                       <li>${repo.watchers}</li>
                   </ul>
                </div>
            `;
            container.insertAdjacentHTML('beforeend', child);
        });
    });
});
```
This JavaScript File will load the repository data from the Json file and display it on the html. Here I have used ``XMLHttpRequest`` but you can use ``Fetch API`` or ``JQuery`` to load the Json File.


After all the steps are done your project repository tree should look like this
```
project_dir
│   index.html
│   main.js
│   requirements.txt
│   repo_data.json    
│
└───scripts
│   │   commit.sh
│   │   update.py
│   
└───.github
|    |
│    └───workflows
|        |   update_resume.yaml
|
```


### Setup GitHub Pages:

I use GitHub Pages to host my Resume.
[You can learn more about How to setup GitHub Pages Here](https://pages.github.com/)

After your setup is Done. GitHub will run your workflow every 15 minutes and if there is any change in the 
repositories listed in the json file the python script will update it and the changed file will be committed
to your repository. So, the repositories you have listed in your resume will always be up to date.


### Conclusion

I showed a small thing you can do with ``schedules`` on GitHub Actions.
But you can do a lot of more complex things using this.
You can automate many things on your website.
If you read this post and make something using it please feel free to share
with me on [twitter](https://twitter.com/saad_mk11) or in the comments.

This is my first post! :)