Vue.jsで書いたソースコードをGitHubにPushすると、自動でNetlifyにDeployされる世の中

久々に少し週末に時間の余裕ができた。以前から気にはなっていたNetlifyを試してみるかと思った。

以前、お試しで書いていたVue.jsのソースコードGitHubにPushして、Netlify側でポチポチやるだけで、すぐに自動でBuildが走って、Deployされる。 普段のExcelと格闘しているお仕事を考えると別世界感がすごい。ちょっとでもいいから勉強を日々つづけないといけない。

その他雑記

余談

GitHub Pagesも試そうかと思ったが、あれはどちらかというとOSSのドキュメントをホストするためのサービスで、自分で書いたページのホスティングには向かないような気がした。※リポジトリにビルド結果を突っ込むというのは、なんというか気持ち悪い。

PowershellでExcelファイルの印刷ページ数を取得する

Excelファイルを印刷したときのページ数を複数のファイルについて調べる必要があった。*1 手動でやるのはつらいのでPowershellで実装するやり方を調べた。

以下のようにCOM経由でExcelにアクセスしたあと、各ワークシートの印刷設定(PageSetup)から、ページ枚数(Pages.Count)を取得できるので、それを合算してファイル毎のページ数を求めることができた。 残念ながら、Workbook単位でページ数の情報は持っていないようだ。

# 初期化
$excel = New-Object -ComObject Excel.Application
$excel.Visible = $false
$excel.DisplayAlerts = $false

# 対象のファイルパス
$ExcelPath="C:\hoge.xlsx"

# ページ数の取得と出力
$book = $excel.Workbooks.Open($ExcelPath)
$book.WorkSheets | ForEach-Object { $_.PageSetup.Pages.Count } | Measure-Object -sum 

# 後処理
[void][System.Runtime.Interopservices.Marshal]::ReleaseComObject($book)
[void]$excel.Quit()
[void][System.Runtime.Interopservices.Marshal]::ReleaseComObject($excel)

もう少し使いやすくfunctionにするなりすれば、十分使えるだろう。

参考

*1:そもそもページ数管理でいいのか、とか、Excelを資料印刷に使うのか、とか言いたいことはたくさんあるけれど、ひとまず置いておく

PythonとPILでPNG画像をグレースケールにする

PythonとPILでPNG画像をグレースケールにしたときのメモ

Pythonスクリプト

以下のページのほぼコピー。ガンマ補正は不要なので割愛。 Python でグレースケール(grayscale)化 - Qiita

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
# 画像のグレースケール変換(透過PNG)

from PIL import Image
import sys

_, infile, outfile = sys.argv

img = Image.open(infile)
img_gray = img.convert("LA")  # グレースケール変換(透過pngを対象とするためアルファチャンネルも扱う)
img_gray.save(outfile)

使い方(Powershellから呼び出す)

# png画像だけが格納されたディレクトリの中身の画像それぞれをグレースケールにした画像を生成し、同じディレクトリに「元の名前+_grey.png」で保存する
Set-Variable dir hogehoge
ls $dir | %{python .\grayscaler.py $_.FullName ($dir + "/" + $_.BaseName + "_gray.png")}

Vueでプロジェクトを作る

Windows10のローカルな環境にVue.js+Vuetifyなプロジェクトを作る覚書。

前提環境

Windows 10 を前提とする。

やること

node.jsはnode.jsを更新する on windows - mk_55's diaryの通りインストーラーを使って最新化しておく。

以下のようにコマンドでnpmを最新化したあと、vue-cliを使って用意を進める。

# npmの最新化
npm update -g npm

#  vue-cliのインストールとプロジェクト作成
npm install -g @vue/cli

vue create my-app

cd my-app

# Vuetifyの導入
vue add vuetify

# 起動
npm run serve

# 起動確認 (200が返ってくればOK)
curl http://localhost:8080/

まあ基本はQuick start — Vuetify.jsの手順の通り。

PowershellでWindowsのCapsLockキーをWindowsキーに変更する

Windowsキーのないキーボードを使っていたが、Windowsキーが欲しくなったので、既存キーをPowershellで割り当てる。

# CapsLock(00 1D)を左Win(E0 5B)のキーへ変更

Set-ItemProperty `
"Registry::HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Keyboard Layout" `
-name "Scancode Map" -value (`
0x00,0x00,0x00,0x00,`
0x00,0x00,0x00,0x00,`
0x02,0x00,0x00,0x00,`
0x5B,0xE0,0x3A,0x00,`
0x00,0x00,0x00,0x00 `
) -type binary

 # バイトの意味は上から以下の通り
 # header version[4byte] 
 # flags[4byte]
 # エントリ数(terminateを含んだ数)
 # CapsLock(00 3A)をWindows(E0 5B)のキーへ変更(変更後→変更前の順で指定)
 # terminate (終了)

参考

Microsoft Flow で文字列中の改行を置換する

Microsoft Flow の文字列を置換するには replace 関数を使うのだが、replace 関数で改行文字(\n)を直接は扱えない。このため、改行を事前に文字列の変数にしておくとよい。

まずは、以下のように改行だけを入力した変数を作成する。

f:id:mk_55:20190911214208p:plain
LFの変数化

そのあと、以下のような式を使うと、改行を置換できる。 ※この場合は空文字で置換しているので、改行を除去した、'置換したい文字列'が出力になる。

replace("置換したい\n 文字列", variables("LF"), "");

上記にたどりつくまで

以下は備忘録。

エスケープすればいけるだろ、とやってみるが上手くいかない

#一般的なエスケープ
replace('置換したい\n 文字列' ,'\n', '')

#Powershell 風
replace('置換したい\n 文字列' ,'`n', '')

#VBA 風
replace('置換したい\n 文字列' ,char(10), '')

uriComponent を利用した置換は冗長

軽くググると以下のようなページがヒットする。

uriComponent で\nをパーセントエンコーディングしたあと置換する、という手法。 ただ、以下の引用のように式が長くなるし、やっていることが一目でわからなくなるのでやめた。

uriComponentToString(replace(uriComponent('置換したい\n 文字列'),'%0A',''))

視点を変えてググる

結局は置換から離れて、Flow で改行をどう扱うべきかを調べて、下記のページにたどり着く。 下記のページと同じようにいったん変数にして扱うことで解決を図った。

Microsoft Flow 上で複数行文字列を改行で分割する - Qiita