kakakakakku blog

Weekly Tech Blog: Keep on Learning!

ドットインストールで「textlint 入門」を受講した

textlint はドキュメント用の Lint ツールで,日本語にも対応しているので,簡単に文法や typo などを検出できる.

textlint.github.io

ドットインストールのレッスン一覧を眺めていたら textlint のレッスンがあり,気になったので,受講してみた.

Lesson 1

Node.js をインストールした(というか既に入っていた).今回試した Mac の環境は以下の通り.

$ node -v
v10.8.0
$ npm -v
6.2.0

Lesson 2

npm で新規プロジェクトを作成し,textlint を実行できるようにした.今回は v11.0.0 になった.

$ npm init -y
$ npm install --save-dev textlint
$ ./node_modules/.bin/textlint -v
v11.0.0

Lesson 3

の個数をチェックできる textlint-rule-max-ten をインストールした.

$ npm install --save-dev textlint-rule-max-ten

次に設定ファイルとなる .textlintrc を作成し,textlint-rule-max-ten を有効にしている.

{
  "rules": {
    "max-ten": true
  }
}

github.com

Lesson 4

実際に textlint を実行し,エラーが出ることを確認した.

$ ./node_modules/.bin/textlint docs/sample.md

/Users/kakakakakku/github/sandbox-dotinstall-textlint/docs/sample.md
  1:11  error  一つの文で""3つ以上使用しています  max-ten

✖ 1 problem (1 error, 0 warnings)

Lesson 5

次に .textlintrc を変更し,デフォルトの閾値「3個」を「2個」に変更した.

{
  "rules": {
    "max-ten": {
      "max": 2
    }
  }
}

実際にエラーの閾値を変更できた.

$ ./node_modules/.bin/textlint docs/sample.md

/Users/kakakakakku/github/sandbox-dotinstall-textlint/docs/sample.md
  1:8  error  一つの文で""2つ以上使用しています  max-ten

✖ 1 problem (1 error, 0 warnings)

Lesson 6

実際に日本語の文章をチェックするときは複数のルールを組み合わせたプリセットを使うと良い.今回は textlint-rule-preset-japanese をインストールし,「助詞の個数」や「ら抜き言葉」などをチェックできるようにした.

$ npm i -D textlint-rule-preset-japanese

$ ./node_modules/.bin/textlint docs/sample.md

/Users/kakakakakku/github/sandbox-dotinstall-textlint/docs/sample.md
  1:11  error  一文に二回以上利用されている助詞 "" がみつかりました。  preset-japanese/no-doubled-joshi
  1:20  error  ら抜き言葉を使用しています。                              preset-japanese/no-dropping-the-ra

✖ 2 problems (2 errors, 0 warnings)

また,以下のようにプリセットの中で一部のルールを無効化することもできる.

{
  "rules": {
    "preset-japanese": {
      "no-dropping-the-ra": false
    }
  }
}

github.com

Lesson 7

次に文章中の表記揺れをチェックする textlint-rule-prh をインストールした.

$ npm i -D textlint-rule-prh

.textlintrc は以下のように書く.

{
  "rules": {
    "preset-japanese": {
      "no-dropping-the-ra": false
    },
    "prh": {
      "rulePaths": [
        "rules/dotinstall.yml"
      ]
    }
  }
}

Lesson 8

rules/dotinstall.yml を以下のように書くと javascript という小文字の表記揺れをチェックすることができる.

version: 1

rules:
  - pattern: javascript
    expected: JavaScript

実際に表記揺れのエラーが出た.

$ ./node_modules/.bin/textlint docs/sample.md

/Users/kakakakakku/github/sandbox-dotinstall-textlint/docs/sample.md
  1:1  ✓ error  javascript => JavaScript  prh

✖ 1 problem (1 error, 0 warnings)1 fixable problem.
Try to run: $ textlint --fix [file]

github.com

Lesson 9

さらに rules/dotinstall.yml を拡張し,複数の表記揺れを定義した.

version: 1

rules:
  - pattern:
      - javascript
      - java script
    expected: JavaScript

正規表現で書くこともできるので,表記揺れのパターンが多いときは助かる.

version: 1

rules:
  - pattern: /java\s*script/i
    expected: JavaScript

また --fix オプションを使うと自動的に文章を修正することもできる.

Lesson 10

次は複数ファイルに対して textlint を実行するコマンドを試した.

$ ./node_modules/.bin/textlint docs/*.md

/Users/kakakakakku/github/sandbox-dotinstall-textlint/docs/sample.md
  1:13  ✓ error  Javascript => JavaScript  prh
  1:27  ✓ error  JAVAScript => JavaScript  prh

✖ 2 problems (2 errors, 0 warnings)2 fixable problems.
Try to run: $ textlint --fix [file]

Lesson 11

Atom + textlint を試すレッスンだったけど,僕は Atom を使っていないので,スキップした.実はブログ記事を書くときに VS Code で textlint を使っているので,vscode-textlint で textlint を動かしたキャプチャを貼っておこうと思う.

f:id:kakku22:20180828180506p:plain

marketplace.visualstudio.com

まとめ

  • ドットインストールに textlint のレッスンが追加されていて素晴らしい
  • textlint-rule-preset-japanesetextlint-rule-prh など,よく使うルールが紹介されていて良かった

試した内容は Lesson ごとに commit している.

github.com

CircleCI の Auto-cancel redundant builds が Workflows にも対応した

CircleCI には便利な Auto-cancel redundant builds があり,有効にしておくと,同じブランチに対して複数回ビルドがトリガーされた場合に,自動的に過去のビルドがキャンセルされる.繰り返し git push をして,さらに CI 時間が長いような場合には,無駄な待ち時間を減らせたり,ジョブの詰まりを減らせたりする.この機能は CircleCI 1.0 時代からあったけど,もしかしたらあまり知られていないかも?

Auto-cancel redundant builds with Workflows

最近のリリースで Auto-cancel redundant builds を Workflows でも使えるようになった(とのこと).一部注意点はあるものの,公式ドキュメントにも手順が載っていた.

  • Auto Cancelling a Redundant Build
    • Steps to Enable Auto-Cancel for New Builds Triggered by Pushes to GitHub without Worklfows
    • Steps to Enable Auto-Cancel for Workflows Triggered by Pushes to GitHub or the API

circleci.com

試してみた

まず Auto-cancel redundant builds を無効にした状態で,単純に sleep するだけの CI ジョブを作成し,複数回ビルドをトリガーしてみた.すると,以下のように RUNNING が多く並んだ.こうなってしまうと,ジョブが詰まってしまうので,開発効率も下がってしまう.

f:id:kakku22:20180822214033p:plain

次にプロジェクト設定を変更する.Auto-cancel redundant buildsEnable build processing (preview) を有効にした.

  • Advanced Settings
    • Auto-cancel redundant builds
      • OffOn
    • Enable build processing (preview)
      • OffOn

f:id:kakku22:20180822214042p:plain

この状態で,複数回ビルドをトリガーしてみた.すると,詰まっているビルドが自動的に CANCELED になった.便利!

f:id:kakku22:20180822214051p:plain

注意点 : デフォルトブランチは対象外になる

公式ドキュメントに書いてある通り,デフォルトブランチは対象外になる.これは適切な挙動だと思っていて,特に master などは,リリースプロセスに使うため,必ずビルドをしてあげる必要がある.

Projects for which auto-cancel is enabled in the Advanced Settings will have workflows on non-default branches cancelled when a newer build is triggered on that same branch.

注意点 : キャンセルされて良いかを考える

公式ドキュメントに書いてある通り,Auto-cancel redundant builds を有効にする前にビルドのユースケースを考える必要がある.例えば lint 系だけではなく,デプロイもビルドで行っている場合など,自動キャンセルによって不整合などが起きないようになっている必要がありそう.

Notes: It is important to carefully consider the impact of enabling the auto-cancel feature, for example, if you have configured automated deployment jobs on non-default branches. Auto-cancelling workflows requires enabling the preview build processing feature.

まとめ

  • CircleCI の Auto-cancel redundant builds は便利
  • 最近のリリースで Workflows でも使えるようになった(とのこと)
  • 実際に試してみた

小さすぎて失敗すらできないステップを毎日繰り返そう /「小さな習慣」を読んだ

「アウトプットを習慣化する」というスローガンを掲げて,これまで5年間以上,継続をしてきた.自分のノウハウを共有するために,イベントで「アウトプット」をテーマに登壇したこともある.

kakakakakku.hatenablog.com

kakakakakku.hatenablog.com

また,去年末から取り組んでいる「ブログメンター(アウトプットメンター)」という活動も,根源的なモチベーションは「習慣化に困っている人をサポートしたい」と言える.一部の人は「習慣化」を「気合で乗り切る」といった感覚で理解しているが,実際は「うまく目標設定をすること」が重要で,その「うまく」という表現は「小さく,定量的に,達成可能なレベルに」とも言い換えられる.目標設定の文脈でよく出てくる「SMART Goals (Specific / Measurable / Achievable / Relevant / Time bound)」に似ている.

小さな習慣

そんな「習慣化」をテーマにした書籍「小さな習慣」を読んだ.もともとは洋書で「Mini Habits: Smaller Habits, Bigger Results」というタイトルで2013年に発売されている.内容は比較的シンプルながら,習慣化を実現するためのノウハウが詰まっている.また,個人的に刺さるキーフレーズも出ていたので,紹介したいと思う.習慣化をしようとしても三日坊主になってしまう人などにオススメできる.

小さな習慣

小さな習慣

小さな習慣とは?

まずタイトルにある「小さな習慣」って「どこまで小さいの?」という疑問が出ると思う.本書には,最初に以下のような具体例があり,驚くほどに小さかった.確かに続けられそう.

  • 毎日,本書を「2ページ」読む
  • 毎日,腕立て伏せを「1回」やる
  • 毎日,記事を「50文字」書く

本書で繰り返し出てくるキーフレーズの中で,個人的に刺さったものを紹介する.本当に「小さい」からこそ,失敗しないというロジックはその通りで,確かに腕立て伏せ「1回」なら10秒あればできる.

  • 小さすぎて失敗すらできない
  • 失敗する方が難しい
  • (ジムに行くのではなく)トレーニングウェアをクローゼットから出す

Mini Habit Ideas

Hini Habits 公式サイトに,具体的な「小さな習慣」のサンプルが公開されている.

  • Mental Fitness, Knowledge, & Intelligence
  • Physical Fitness
  • Health, Diet, & Well-Being
  • Happiness
  • Business
  • Productivity

例えば「Drink 1 glass of water(水をコップ1杯飲む)」「Laugh once(1度笑う)」など,小ささの粒度として参考になる.「Write 50 words (for blog)(ブログ用に50文字書く)」などもあり,最初から「1記事」書こうとするから大きく感じるのであって,まずは「50文字」から書き始めるというのは,素晴らしい取り組みだと思う.

1歩を踏み出すこと

本書を読んでいて「1歩を踏み出すこと」の難しさが,習慣化できない理由に繋がっていると感じた.言い換えると「腰が重い」とも言える.本書にも「最初のアクションが1番難しい」という話があり「ニュートンの運動の法則」に例えられていた.ダラダラと1日を過ごしてしまうと,区切りがなくなってしまうので,うまく区切りを作って,1歩を踏み出せば,あとは「なるようになる」ことは改めて意識したいと思う.前にツイートした内容も本書の内容と似ている.

ツール

本書では,目標を管理するツールとして,大きなカレンダーを部屋に貼る方法だけではなく,スマホアプリ,デスクトップアプリなども紹介されていた.詳しくは Hini Habits 公式サイトに載っている.

現在,僕は「ループ習慣トラッカー (Loop - Habit Tracker)」「習慣の目標 (Habit Tracker)」の2アプリをインストールして,試用している.1ヶ月ほど使ってみて,好きなアプリに決めたいと思う.

play.google.com

play.google.com

個人スプリントと組み合わせる

「アウトプット駆動学習を習慣化する」という登壇資料にも書いている通り,僕はタイムボックスを1週間に設定した「個人スプリント」を数年間ずっと回している.タスク管理に使っているツールは Trello で,毎週タスクを Done にするために頑張っている.ただし,これはあくまでタイムボックスが1週間なので,1週間で終わらせる(帳尻を合わせる)ようなルールになっている.そこで,今回から「毎日の小さな習慣」も組み合わせることにした.組み合わせる負荷は気にする必要はなく,理由は「小さすぎて失敗すらできない」からと言える.中長期的に運用してみて,どこかで結果をまとめたいと思う.

f:id:kakku22:20180819133149j:plain

まとめ

  • 「小さな習慣」は習慣化に悩んでいる人にオススメできる
  • 「小ささ」の粒度は本当に小さく,失敗すらできない
  • Hini Habits 公式サイトを参考に,自分の「小さな習慣」を決めて,まずは1歩を踏み出そう!

小さな習慣

小さな習慣

GitHub の README.md をバッジでオシャレにできる Shields.io と dockeri.co

最近 GitHub リポジトリに「バッジ」を設定するため「Shields.io」というサービスを使った.README.md をオシャレにできて,とても便利だったので紹介しようと思う.ただ数年前からあったサービスらしく,今まで使ったことがなかった!

shields.io

バッジの種類の多さ

Shields.io の特徴は「バッジの種類の多さ」で,ウェブサイトを見ると,ザッと数えて 350 個以上ある.代表的なものを挙げてみた.

  • ビルド結果 ( CircleCI / Travis / Codeship / Wercker / Shippable / AppVeyor など )
  • ダウンロード回数 ( npm / Gem など )
  • ライセンス関連 ( GPL / MIT など )
  • GitHub ( issues / pull requests など )
  • Docker 関連 ( Pulls / Automated build / Build Status など )

仕組み

「Shields.io」から生成した URL にアクセスすると,SVG 形式の画像がオンデマンドに生成される.以下の例は指定した GitHub リポジトリの Star 数をバッジにしている.

https://img.shields.io/github/stars/kakakakakku/redash-hands-on.svg

バッジスタイルを選べる

?style=for-the-badge のようにパラメータを指定することで,バッジスタイルを変更することができる.バッジスタイルは7種類から選ぶことができ,デフォルトは style=flat になっている.

  • style=plastic badge
  • style=flat badge
  • style=flat-square badge
  • style=for-the-badge badge
  • style=popout badge
  • style=popout-square badge
  • style=social badge

カスタムバッジを作れる

以下の URL パターンで値を設定すると,カスタムバッジを作ることもできる.

  • SUBJECT ... タイトル
  • STATUS ... ステータス
  • COLOR ... 色(名前 or コード)
https://img.shields.io/badge/<SUBJECT>-<STATUS>-<COLOR>.svg

サンプルとして,以下のようなバッジが作れる.

https://img.shields.io/badge/redash-v4.0.1-ff7964.svg?style=for-the-badge
https://img.shields.io/badge/kakakakakku-blog--is--my--life-232f3e.svg?style=for-the-badge

badge

badge

GitHub リポジトリに設定した

実際に「GitHub / Docker / カスタム」を設定した.良さ!

f:id:kakku22:20180808190355p:plain

確認する場合は以下のリポジトリにある.

github.com

github.com

Docker イメージなら「dockeri.co」も良い

Docker イメージなら「dockeri.co」も良かった.以下の URL パターンで Docker Hub のイメージ名を設定すると,大きめのバッジを作ることができる.

http://dockeri.co/image/kakakakakku/rubocop.co

dockeri.co

「dockeri.co」の実装は以下にある.

github.com

まとめ

  • 「バッジ」を使えば GitHub の README.md をよりオシャレに表現することができる
  • 「Shields.io」がとても便利だった
  • Docker イメージなら「dockeri.co」も良かった

CircleCI + misspell で typo の検出を CI する

「misspell」は,Go で実装された typo 検出ライブラリで,手軽に実行できるので,英語のドキュメントに対してよく使っている.例えば,以下のようにワンライナーで "World" の typo を検知することができる.

$ echo 'Hello Worls!' | misspell
stdin:1:6: "Worls" is a misspelling of "World"

機能は他にもいろいろある.ディレクトリに対して実行することができたり,オートコレクトができたり,検知した結果を CSV 形式で出力することもできる.また,実際に使うときに必要になる除外リストの指定もできる.もし Go の lint で gometalinter を使っている場合,gometalinter から misspell を呼び出すこともできる.

github.com

CircleCI + misspell

今回紹介したいのは,CircleCI と misspell の組み合わせで,GitHub のリポジトリに対して misspell を実行することで,ドキュメントとコードの typo 検出を CI することができる.すごく便利で,個人的なリポジトリで使っている.既に Docker Hub にイメージが公開されているので,CircleCI の設定 .circleci/config.yml も簡単で,以下のように書ける.ポイントは -error オプションで,これを付けないと,エラーが出てもリターンコードが 0 になってしまう.

version: 2

jobs:
  misspell:
    docker:
      - image: nickg/misspell
    steps:
      - checkout
      - run: misspell -error .

workflows:
  version: 2
  ci:
    jobs:
      - misspell

以下に,サンプルでリポジトリを作った.README.mdmain.go にある "World" の typo を検知している.

README.md:3:6: "Worls" is a misspelling of "World"
main.go:6:19: "worls" is a misspelling of "world"
Exited with code 2

github.com

f:id:kakku22:20180803085334p:plain

まとめ

CircleCI + misspell の組み合わせを活用して,自動的に検知できる typo は減らしていきましょ!