Forem: Yevhen Fabizhevskyi

TypeScript GitHub Action template

Yevhen Fabizhevskyi — Sun, 07 Feb 2021 23:47:34 +0000

Intro

Hello! My name is Yevhen. At the moment when I am writing this post I already have 18 GitHub actions that I've implemented and published to the marketplace. A few of them are Docker container actions, some of them are JavaScript actions but personally I like TypeScript more than JavaScript for various reasons, so that's why most of the implemented GitHub actions are TypeScript actions.

So, after 1, 2, n implemeted TypeScript GitHub actions I found out that I do a boilerplate work again and again - I configure CI with the same pipelines and jobs, I configure tests with coverage and TypeScript, I configure npm with the commands that I usually use, etc. All this boilerplate work became a big part of the building GitHub Action itself. So, I've decided to find the way to somehow avoid doing boilerplate work and focus more on a business logic. After some investigation I found nice actions/typescript-action template that basically can help developers like me to build TypeScript GitHub Action with some preconfigured settings. This is already better than nothing but personally for my needs that wasn't enough. For example, there are some set of pipelines that I use in almost all my GitHub actions repositories (like, "Create release", "Check updates", "Security tests, "Unit tests", etc.). I always use my personal settings for linters and tests. I always use some libraries that I used to work with, like winston for logging, husky for git hooks, snyk for security testing, etc. So even though I will use actions/typescript-action template - it is not enough for me because I have to do some boilerplate work anyway.

So, I've decided to prepare my personal TypeScript GitHub Action template with the 3 main goals:

It is easy to configure.
0 boilerplate work.
It is useful for me and for other developers.

fabasoad/typescript-action

As a result I've built such template that hopefully meets all the requirements (tickets and PRs are welcome, so don't hesitate to open a ticket or PR in case you found any bug or have an idea of enhancements).

Link: fabasoad/typescript-action

Is it useful?

Yes. And I am saying that not because I wrote this template 😅 but because I've already used it for one of my action - ICQ Notify action. I configured the project in 5 minutes and then was focusing on a business logic without thinking about CI, npm, git hooks and other stuff that I usually configured manually. I already found this template super useful for myself and will be definitely using it (and improving it) in a future.

How to use

I've decided to prepare a Makefile that will do all the job for you, like preparing namings, folder structures, etc. This Makefile has the single default command and this is what you need to run:

$ make

And that's it. Just answer the question in interactive mode, enter the name of your GitHub Action, author name, etc. and in the end you will see fully configured and ready to implement GitHub action repository.

More information here.

What you will have out of the box

GitHub action file

Configured action file without any inputs or outputs. Feel free to add those if needed. More information here. - I didn't add those because it really depends on a business logic of GitHub Action, some of them might have inputs/outputs but some of them might not have, so I've decided to leave it without these fields and developer will add them if needed
The following default values:
- Branding icon is terminal.
- Branding color is gray-dark (you can check these values here).
- Runs on node12.
- name, author and description are based on your input during make run.

Source code

index.ts file with basic code. All what you need to do is to start adding your code under the // Your main code here comment.
Logging mechanism that you can use in your code. It is using winston library. Code example:

import { Logger } from 'winston'
import LoggerFactory from './LoggerFactory'

const log: Logger = LoggerFactory.create('index.ts')
log.info('Hello world!')

Output:

2021-02-07 02:48:03 [index.ts] info: Hello world!

npm

The following npm targets that you can use:

`npm` target	Description
`build`	Build your source code into bundle that is used by GitHub Action
`lint:md`	Run markdown lint checking
`lint:es`	Run `eslint` checking
`lint`	Run both `lint:md` and `lint:es` targets
`postinstall`	Install `git` hooks using `husky`
`prepare`	Run `snyk-protect` target
`security:auth`	Run authentication to `snyk` (token should be provided)
`security:test`	Run security tests using `snyk`
`snyk-protect`	Reads `.snyk` policy file to determine what patches to apply
`test`	Run unit tests using `jest`

Tests

Configured jest library with coverage threshold (80% by default).
Coverage tests folder structure with basic test as a start.

Integrations

CodeClimate shows tests coverage and maintainability for your project.
Snyk for security testing.
LGTM for tracking code quality.

CI

Security tests using Snyk and CodeQL.
Check updates pipeline twice a month checks npm updates and creates PR automatically in case of any new versions are exist.
Create release pipeline that will create a new release when you merge your MR into main branch.
Unit tests pipeline that will run lint and test commands on each push to main, feature/* or bugfix/* branches.
Lint pipeline that has 2 jobs - YAML Lint and Markdown Lint. Both are running on each push to any branch.

GitHub files

PR, Bug report and Feature request GitHub templates.
README, LICENSE and Contributing documentation files. - Default LICENSE is MIT. If you need different license please choose the one that you need and replace the LICENSE file

git

git hooks:
- checking that you're not committing into main branch.
- checking that you're not committing any sensitive information.
- running lint and test commands on each git push.
- building bundle (dist/index.js) file (that is used as a main file for GitHub Action) on each git commit. So don't worry if you forget to build a bundle on top of your latest changes - this hook will do that for you.
.gitignore file with basic patterns.

IDE settings

VS Code settings file that have some basic settings for easier development.

Badges in README

10 badges that shows the latest release, result of passing pipelines and results from integrations.

More information here.

Finalizing

This project has wiki with the detailed explanations of benefits and how to use it. Also, it has discussions section, so feel free to open discussions. Contributions are also welcome! So, either it's bug report, feature request or PR, I would be happy to see your activities there. I hope someone will find fabasoad/typescript-action template useful as well.

Thank you for reading and happy coding!

Introducing GitHub Actions Check Updates

Yevhen Fabizhevskyi — Thu, 30 Apr 2020 09:08:57 +0000

Introduction

Working on a project it's important to have all your dependencies up-to-date. New versions have new features, bug fixes and many other improvements.

There are a lot of tools that helps us to keep all dependencies up-to-date. For maven projects we have Versions Maven Plugin, where we can run

mvn versions:display-dependency-updates

and see something like:

[INFO] --- versions-maven-plugin:2.7:display-dependency-updates (default-cli) @ poe-runner ---
[INFO] The following dependencies in Dependency Management have newer versions:
[INFO]   com.github.fabasoad:commons-lang ...................... 0.2.3 -> 0.4.5
[INFO]   com.google.guava:guava .............................. 19.0 -> 29.0-jre
[INFO]   commons-cli:commons-cli ................................... 1.2 -> 1.4

For npm projects there are many other tools like npm-check or npm-check-updates, where we can run ncu and see something like this:

PS C:\Projects\MyProject> ncu
Checking C:\Projects\MyProject\package.json
[====================] 42/42 100%

 @babel/core           7.8.7  →  7.9.0 
 @babel/preset-env     7.8.7  →  7.9.5 
 @babel/preset-react   7.8.3  →  7.9.4 
 babel-loader          8.0.6  →  8.1.0 
 firebase             7.10.0  →  7.14.2

Run ncu -u to upgrade package.json

All such tools help us to keep our projects "healthy". But what about GitHub Actions? What if you have many workflow files with many GitHub Actions used there. It would be difficult to track all the versions manually. And here GitHub Actions Check Updates comes to help you 😉

GHACU

GitHub Actions Check Updates (GHACU) is a tool that helps you to keep versions of configured GitHub Actions up-to-date. Here is how it looks like in action:

PS C:\Projects\linguist-action> ghacu
> Dockerfile Lint (.github\workflows\dockerfile-lint.yml)
actions/checkout               v2.0.0  »  v2.1.0
burdzwastaken/hadolint-action  master  »   1.1.0

> Shell Lint (.github\workflows\shell-lint.yml)
actions/checkout                v1  »  v2.1.0
bewuethr/shellcheck-action  v2.0.1  »  v2.0.2

> YAML Lint (.github\workflows\yaml-lint.yml)
ibiqlik/action-yamllint  v0.0.2  »  v1.0.0

Run ghacu -u to upgrade actions.

Installation

All what you need to do is to go to Releases page and download latest release based on OS that you have. It supports MacOS, Linux and Windows.

MacOS and Linux

# MacOS: ghacu-1.1.3-osx-x64.tgz
cd ~ && wget https://github.com/fabasoad/ghacu/releases/download/v1.1.3/ghacu-1.1.3-linux-x64.tgz
tar -xvf ghacu-1.1.3-linux-x64.tgz
cd ghacu-1.1.3-linux-x64
chmod 755 ghacu
PATH=$PATH:~/ghacu-1.1.3-linux-x64

Windows

There are 2 options to install it on Windows:

Install it in the same way as for Linux/MacOS - download package, unpack it and add path to PATH environment variable.
Download executable file and just run it. Then add path to PATH environment variable.

Usage

Once you install the tool, open your favourite console and run the command below. You should see installed version if you installed it correctly:

PS C:\Projects\MyProject> ghacu --version
ghacu 1.1.3

At this moment it supports two options:

PS C:\Projects\MyProject> ghacu --help
ghacu 1.1.3
Copyright (C) 2020 ghacu

  -r, --repository    Path to the root of a project.

  -u, --upgrade       Upgrade versions to the latest one.

  --help              Display this help screen.

  --version           Display version information.

`-r`, `--repository`

It's a path to the project that has .github/workflows folder inside, e.g. C:\Projects\MyProject. If you do not define it, path will be the current path where you run ghacu. Result is the same in examples below.

PS C:\Projects\MyProject> ghacu
> CI (latest) (.github\workflows\ci-latest.yml)
actions/checkout  master  »  v2.1.0

> YAML Lint (.github\workflows\yaml-lint.yml)
ibiqlik/action-yamllint  v0.0.2  »  v1.0.0

Run ghacu -u to upgrade actions.

PS C:\> ghacu -r "C:\Projects\MyProject"
> CI (latest) (.github\workflows\ci-latest.yml)
actions/checkout  master  »  v2.1.0

> YAML Lint (.github\workflows\yaml-lint.yml)
ibiqlik/action-yamllint  v0.0.2  »  v1.0.0

Run ghacu -u to upgrade actions.

`-u`, `--upgrade`

Use this option if you want to update your actions to the newer versions. At first I propose you to run ghacu command without this option to see if newer versions look good to you and then run ghacu -u.

PS C:\Projects\MyProject> ghacu -u
> CI (latest) (.github\workflows\ci-latest.yml)
actions/checkout  master  »  v2.1.0

> YAML Lint (.github\workflows\yaml-lint.yml)
ibiqlik/action-yamllint  v0.0.2  »  v1.0.0
PS C:\Projects\MyProject> ghacu
All GitHub Actions match the latest versions.

Conclusion

I hope you will enjoy using this tool. As for me, I started using it from the beta version and enjoy using it as well as improving it. Feel free to post any feature requests or bug reports to the Issues page, it will help me to keep making this tool better and better.

Future

There are a lot of ideas to implement:

Create choco, brew, apt-get, apk packages for easy installation.
Add progress indicator, like:

[=================---] 38/42 86%

Add support of --revert, --parallel and many other features.
Add installation path to PATH environment variable automatically after installation.
Support different colors in console output text.
Many others.

It's written in C# .NET Core and if you are interested in contribution, you are very welcome to fork the repo and help to improve it 💻

Repository:
https://github.com/fabasoad/ghacu

Introducing JSONBin GitHub Action

Yevhen Fabizhevskyi — Wed, 08 Apr 2020 05:32:51 +0000

Hi guys, I would like to introduce one of the GitHub Actions that I have implemented during GitHub Actions Hackathon. BTW, I've received today an email that I have qualified for a GitHub Hackathon prize, so just sent them my post address and will see what I get :)

Briefly about what all these words in a title mean (if you don't know yet):

GitHub Actions is really powerful tool that can be used as a CI/CD (but not limited to, actually you can do anything you want with it) and if you're still not aware of it I recommend you to know more here, and here, and here.
JSONBin is a service where you can store your own bins. Bin means actually URL that returns anything you want. For example, I need some URL that will return {"greetings":"Hello dev.to!"}, so I can sign up to JSONBin and create a bin with this response. It will generate URL for me that might look like this - https://api.jsonbin.io/b/5e8d473dab2e011ba969a6db and I can use it for any purpose I need and even share with someone (if I make it public). It can be used to test something in your app or even to store some data there, e.g. work experience or skills that can be used in your portfolio application. Also, JSONBin works with collections, GeoIP, Schema docs, etc. You can find full API Docs here.

The main idea of this action is to have URL that will return any response you want in JSON format. You can store job information in your bins for future usage or even use this URL in your CI pipeline.

How to configure

So, let's start from the beginning and configure this action in your repository.

Prerequisites

Repository in GitHub
Account in JSONBin.io

Configuration

Go to API Keys page at JSONBin.io and create a new key.
Go to your repository in GitHub and create a new secret with the name API_KEY. Here you can find an information on how to create a secret in your GitHub repository.
Go to the root of your repo and create jsonbin.yml in .github/workflows folder with the following content:

name: JSONbin

on: push

jobs:
  jsonbin:
    name: Test JSONbin
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - uses: fabasoad/jsonbin-action@v1.0.1
        id: jsonbin
        with:
          body: '{"workflow": "${{ github.workflow }}", "author": "${{ github.actor }}", "number": "${{ github.run_number }}"}'
          method: 'CREATE'
          api_key: ${{ secrets.API_KEY }}
      - name: Check bin_id
        run: |
          echo "Bin ID = ${{ steps.jsonbin.outputs.bin_id }}"
          echo "URL = ${{ steps.jsonbin.outputs.url }}"

Now push your changes, go to Actions tab of GitHub repository and wait till job is finished. Take a look at job output to find the generated result:

Here is the result of generated link call:

So it returns exactly what we expect. In this example I use CREATE method but you can also UPDATE and DELETE created bin if needed. All documentation you can find in README of the repository.

Link

JSONBin GitHub Action

Please feel free to create any issue (either bug report or feature request), pull request or just leave a comment with the proposition. I would love to hear any feedback. Also, don't forget to star this action ;) Thank you.