🤖 Learning GitHub Actions: Creating Beautiful PR Comments
Tags: showdev, github, productivity, tutorial
Published: 2020-08-11 02:14:18

---
title: 🤖 Learning GitHub Actions: Creating Beautiful PR Comments
published: true
description: In a few lines of code we'll see how to use CML.dev tool to create a GitHub Action that publishes its results as a beautiful comment
tags: showdev,github,productivity,tutorial
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/b96o1uz95krqr3z1ag6l.png
---

You've probably seen the services that automatically generate **GitHub [PR](https://guides.github.com/activities/hello-world/#pr) comments with tables, images, links**? Something like these two:

| <a target="_blank" href="https://dev-to-uploads.s3.amazonaws.com/i/a8hyqrhycqdxt6y9rjgy.png">🔎 Codecov report</a> | <a target="_blank" href="https://dev-to-uploads.s3.amazonaws.com/i/ft842twc81t7tevz735s.png">🔎 Calibre report</a> |
|---|---|
| ![Codecov Github Comment](https://dev-to-uploads.s3.amazonaws.com/i/a8hyqrhycqdxt6y9rjgy.png) | ![Web Perfomance Comment](https://dev-to-uploads.s3.amazonaws.com/i/ft842twc81t7tevz735s.png) |

<figcaption><a href="https://codecov.io/">Codecov</a> and <a href=" https://calibreapp.com/">Calibre</a> reports</figcaption>

Magic, right ✨? Let's see how it can be done. We won't even need to use command line or offline editors this time!. This post covers:

- How to create a "Hello world!" GitHub action online
- Use [CML](https://cml.dev) scripts to generate comments with a custom Markdown that includes a picture 🖼.

> _Read more about [CML](https://github.com/iterative/cml). Besides GitHub comments, it can do the same for GitLab. Also, it's important that it was built with Machine Learning workflow in mind and automates a lot of tedious tasks in ML._ besides simple reports.

<hr/>

# Step 1: Create Action File

You can do this using GitHub online UI! **Add the file `.github/workflows/cml.yaml` to your repo** like this:

> _Btw, I've forked the [DVC example get started](https://github.com/iterative/example-get-started) repo to play with actions in this tutorial - feel free to do the same_ 😊

![Create GitHub Action](https://dev-to-uploads.s3.amazonaws.com/i/ahsucwz0nt1kmo7bb22x.gif)

<hr/>

# Step 2: Add "Hello world!" Action

Feel free to copy-paste it from this [gist](https://gist.github.com/shcheklein/95592fd64b181332214d259c081486e3#file-cml-yaml): 

![Hello World Action](https://dev-to-uploads.s3.amazonaws.com/i/qklinbnxwd0t5nulfb5x.gif)

<hr/>

# Step 3: Add Images 🖼️

That's where the the magic ✨ happens! Let's update a few lines of code like this (copy-paste from this [gist](https://gist.github.com/shcheklein/774eeed7280a1bcc86d52cd2d680de72)): 

![Magic](https://dev-to-uploads.s3.amazonaws.com/i/9reewdur4tmzbc9843hc.gif)

```console
cml-publish prc.svg --md >> report.md
cml-send-comment report.md
```

That's pretty all you need if you use the [CML](cml.dev) docker to run the action! 

> _We specifically don't focus on the other three lines of the action, those that generate the image. It's out of scope of this post and it's specific to the repository. We definitely recommend reading it and [DVC](https://dvc.org) docs if you are machine learning practitioner._

**`cml-publish`** - saves an image and creates an `![Image](link)` entry in the Markdown file `report.md`

**`cml-send-comment`** - sends the comment to GitHub to get the result 👇

# Step 4: Profit 💥

![Profit](https://dev-to-uploads.s3.amazonaws.com/i/c3ydclp12l6yupf0lruv.gif)

The result looks like this:

![Result](https://dev-to-uploads.s3.amazonaws.com/i/3p50ao7ptl43oql4trmz.png)

In this case it includes a [precision-recall curve](https://scikit-learn.org/stable/auto_examples/model_selection/plot_precision_recall.html#plot-the-precision-recall-curve) which is a fundamental and useful characteristic for a binary classifier. **But you can include any images, any text using Markdown markup to create your own unique and useful report!**

<hr/>

That's it for today 👌 

We've just barely scratched the surface of the GitHub actions and CML capabilities! We definitely recommend taking a look at the actions [marketplace](https://github.com/marketplace).

And of course, read more about [CML](https://github.com/iterative/cml). Besides GitHub comments, it can do the same for GitLab. It was built with Machine Learning workflow in mind and automates a lot of tedious tasks in ML - like running training remotely.