OmniAICreator/Qiita-1.07M huggingface dataset:
UMASK値のUってなんだろね?

# この記事のゴール
- umask値について説明できるようになる。
- umask値のuが一体なにを表しているのか解明する。

# umask値ってなに?
一言でいうと、**ファイルとディレクトリのデフォルト権限を決めるのに使われる値**です。

# umask値のuってなんだろね?

Google検索した結果、オラクルの[Solaris関連のドキュメント](https://docs.oracle.com/cd/E19683-01/817-3814/userconcept-95347/index.html)にこんなことが書いてありました。（ほかにリソースが見当たらなかったのです。マニュアルにもなかった）

>When you create a file or directory, the default file permissions assigned to the file or directory are controlled by the user mask. The user mask is set by the umask command in a user initialization file.

これを見る限り、**どうやらumaskはuser maskの略らしいですね。**ユーザ(user)がファイルを作成するとき、ファイルのデフォルト権限を決めるのに使われるマスク(mask)だからuser mask。やったー。謎解明だー。

# umask値の使われ方
先ほどちらっと出てきたように、**umaskはマスク**です。マスクは、コーヒーフィルタのようなもので、フィルタにかかったものを弾きます。umaskで弾かれる前のピュアなファイルの権限は666で、ディレクトリの権限は777です。ですが、umaskでいくつかの権限が弾かれることによって、最終的なデフォルト権限に変化します。

- ファイルの場合

```
666 rw-rw-rw- (umaskで弾かれる前のピュアな権限)
022 ----w--w- (umask値)
 ↓      ↓
644 rw-r--r-- (デフォルト権限)
```
**umaskで、グループユーザのw(書き込み権限)と、その他ユーザのw(書き込み権限)が弾かれています。**最終的なファイルのデフォルト権限は644になり、グループユーザとその他ユーザはr(読み込み権限)のみ許可されます。

- ディレクトリの場合

```
777 rwxrwxrwx (umaskで弾かれる前のピュアな権限)
022 ----w--w- (umask値)
 ↓      ↓
755 rwxr-xr-x (デフォルト権限)
```
**umaskで、グループユーザのw(書き込み権限)と、その他ユーザのw(書き込み権限)が弾かれています。**最終的なファイルのデフォルト権限は755になり、グループユーザとその他ユーザはr(読み込み権限)とx(実行権)が許可されます。

# umaskコマンドでumask値の確認と設定ができる
umaskコマンドで、umask値の確認と設定ができます。umask値はrootユーザと一般ユーザでは異なります。rootユーザは022で、一般ユーザは002です。先ほどの説明では、rootユーザのumask値を使用しました。

- rootユーザのumask値の確認

```
# umask
0022
```

- 一般ユーザのumask値の確認

```
$ umask
0002
```

- umask値の設定

以下のコマンドでumask値を設定できるそうですが、僕は使ったことがありません。うーん、使うタイミングあるかな。

```
$ umask 設定値
```
Backlogとgitでお仕事する人のためのChromeExtension「BackLog2Git」

# BackLog2Git

Backlogとgitでお仕事する人のためのChromeExtensionです。
https://github.com/prexlab/backlog2git

下記のような環境を想定しています。

- backlogでチケット発行、githubでコード管理をしている
- ブランチ名には、backlogチケットIDをつけている（ 例：b1234_fix_hoge ）
- slackも使っていて、チケットの更新やgitのPR依頼をしている
- git には staging & masterブランチがあり、stagingにPR & Mergeしてテスト、masterにRP & Mergeしてテストというデプロイ手順をとる


# インストール

- [このリポジトリ](https://github.com/prexlab/backlog2git)をダウンロードします
- cp actions/config.sample.js actions/config.js
- config.js を適切に定義します
- DLしたディレクトリを「パッケージ化されていない拡張機能を読み込む」してください。

# 利用方法

追加されたボタンをクリックすると、現在表示しているURLから自動判別して、下記の処理を行います。

## actions/backlog/act.js

- 対象URL： `backlog.jp/view/DEV-.+`
- 動作： 現在のチケットに対応するgitブランチとPRを表示します
![スクリーンショット 2018-08-03 12.22.31.png](https://gyazo.com/0a28980cc9fdeaf003c74a7e14483a8c.png)



## actions/backlog/act.list.js

- 対象URL： `backlog.jp/find/DEV`
- 動作： チケット一覧上に、各チケットの最新コメントを表示します
![image.png](https://qiita-image-store.s3.amazonaws.com/0/255465/df229a4b-1c11-01f2-3dea-8aef8605bc13.png)



## actions/github/act.makeComment.js

- 対象URL： `github.com/.+/pull/.+`
- 動作： PRをbacklogとslackに書き込むためのコメントを生成します
![image.png](https://qiita-image-store.s3.amazonaws.com/0/255465/2235421b-a1a4-d780-1491-645eb18c6809.png)

## actions/github/act.copyMaster.js

- 対象URL： `github.com/.+/pull/.+`
- 対象条件： stagingのPRがマージされている
- 動作： stagingのPRからmasterのPRを生成します
![スクリーンショット 2018-08-03 12.24.18.png](https://gyazo.com/0ddb5226bce8ac984522ab604ce02e0d.png)

## actions/github/act.copyStaging.js

- 対象URL： `github.com/.+/compare/staging`
- 動作： stagingのPRのタイトルとコメントに、backlogの情報をコピーします
![スクリーンショット 2018-08-03 12.25.15.png](https://gyazo.com/78bef82e09dd1c26f724547cf45d0a1e.png)


# 機能追加＆編集の方法

## 基本設定の編集
- actions/config.js で個別設定を行います。

## 機能の追加編集

- actons/provider.js に動作条件を記述してください
- actions/内に追加の処理を記述してください。
- ブラウザボタンを押せば、即動作確認できます。

中身は、ただのjqueryですので、がしがし改造してください！！
ポインタ渡しと戻り値でポインタを返す場合の違い

ポインタ渡しを理解したつもりでえらい勘違いをしてたので備忘録として書いておきます。
(自分の理解が足りてないのに、システムコールのせいになんかしてました。死にたい)

#ポインタ渡し
ポインタ渡しは、渡されたアドレスをポインタとして参照して扱う。
渡されたアドレスを参照するポインタなので、その部分を留意して取り扱う。

```c:test.c
static int a;

void hoge(int** py)
{
    //pyの値(参照先) = px自身のアドレス
    //pyの参照先の値(pxの値)にaのアドレスが入った
    *py = &a;
}

void main()
{
    int* px = NULL;
    hoge(&px);
    //pxの参照先はaのアドレスに変わる
}
```
例えば、呼び出し元でポインタ自身のアドレスを渡した場合、呼び出し先でポインタのアドレスを変えると
呼び出し元の値(ポインタの指すアドレス)が変わる。

コメントでご指摘を頂いたので修正。
~~ただ、呼び出し元と同じアドレスを指しているので、呼び出し先で値を変更すると呼び出し元の値も変更される。
呼び出し先でアドレスを変えても、呼び出し元のアドレスは**変わらない**。(コピーのアドレスが変わってるだけだから)~~

#戻り値としてポインタを返す
戻り値として返すので、当然ながらアドレスをそのまま受け取れる。
アドレスを指す先が、関数内のローカル変数だったら死んでるので注意。
実務3ヶ月がクラウドソーシングで案件取ってみた

閲覧ありがとうございます。
この度、無事にクラウドソーシングで案件を受注し、納品まで漕ぎ着けたので、そのことを記事にしたいと思います。
「これから案件を取っていこう」と思っている人、「クラウドソーシング、やってみたいけど怖い」なんて思っている人の何らかの手助けになればありがたいです。

#対象
``これからクラウドソーシングで案件受注しようとしてる方々``

#開発者のスペック
``今年の4月からエンジニアになって、実務経験3ヶ月``

<br>
#
7月入ったあたりから、各種クラウドソーシングで、いろんな案件を閲覧してみて、これくらいならいけるんじゃね？
という、変な自信を持って案件に応募。
応募した案件は、**「Wordpressを使ったマッチング系のWEBサービス」**
参考用の資料も用意されており、レイアウトはクライアント（依頼者）自身がやると言うし、レイアウトに自信のなかった自分にとってはラッキーだと思ったし、DBとやりとりをWordpressでやるなどがあったけど、いけるだろうと思って応募。
金額は相場より安くしました。
クラウドソーシングのマイページには実績数が表示されているので、現時点での信用は０ですし、今回は実績＋経験作りという意味もあったので。
メッセージには、「こういうのは初めて」と「週末しか開発作業はできない」旨を記載して応募。

2日後、クライアントから連絡がきて無事契約。
相場よりだいぶ安くしたことと、こちらの実力として見せたWEBサイトが良かったみたいです。

契約後の開発作業はおいておいて、大変だったこと、重要だと思ったことは２つです。
そう、**「要件定義」**と**「クライアントとのやりとり」**です。

``要件定義``では、
・やること（実装する機能）
・やらなくていいこと（実装しない機能）
この２つは開発を始める前にしっかり決めておいてクライアントと共有しておくことが大事です。
自分ではしっかりしていたつもりでしたが、それでも開発をしている中で出戻りはあった。
「だろう」と思ったことは、クライアントに聞くことが大切でした。
細かく聞きすぎなんじゃないかって不安に思うかもしれませんが、それくらいの方がクライアントは喜んでくれます。
あと、スプレッドシートで、フローやテーブルの設計など書いて共有しておくと、安心してもらいやすいです。

``クライアントとのやりとり``では、
文章を考えるのが大変でした。
・エンジニアではない人に、いかにわかりやすく伝えるか
この１点につきます。
文章で伝えるのが苦手ってのもありますが、自分は設計の情報の共有や開発作業後の進捗報告に時間を費やしました。
専門用語は使わないこと、設計のときは、画像を添付してやりとりしました。
後になってですが、画像の添付はやってよかったと思いました。
スクショ撮ったり、文字入れしたりめんどいこともありましたが、お互いにイメージが共有できてズレなく進めました。

あと、心持ちというか気構え的なので、初心者ではありますが、一人前のプロとしてクライアントとは接しました。
オドオドしたり、変に遠慮したりしない。
それが、クライアントに安心感を与えることだと思います。

以上、今回、初受注を行なって大切だと思ったことを書かせてもらいました。
最後まで読んでいただき、ありがとうございます。
これからクラウドソーシングをしようと思っている人の手助けになれば、幸いです。

もっと突っ込んだことを聞きたいみたいな方が居りましたら、[ご連絡](https://twitter.com/gurensouen)ください。
ここには書いていないような事で、言える範囲でお答えします（笑）


###追記###
今回、クラウドソーシングで案件を取ることで得た経験ですが、経験年数とか関係ない、そして、レペルの上がり方が、自分で黙々と勉強してるより早いなって思いました。
経験年数は関係なく、案件は取れるし、取ったからにはしっかりやらざるを得ない状況になるので、プレッシャーにはなりますが、確実にレベルアップに繋がります。
人間、やらなきゃいけない環境になると確実に成長することを実感しました。
これは、あくまで自分の主観的意見なので、参考の１つに思ってもらえれば幸いです。
DiscordのBotでのファイル添付の仕方など【Python】

最近はDiscordで戯れています。
今日は基本といってもいい、
・Botに発言させる
・Botにファイルを添付させる

のしかたを紹介したいと思います。

```bot.py
import discord
import asyncio

client = discord.Client()

@client.event
async def on_ready():
    print('Logged in as')
    print(client.user.name)
    print(client.user.id)
    print('------')

@client.event
async def on_message(message):
    if message.content.startswith("はろー"):
        m = "こんにちは、" + message.author.name + "さん"
        await message.channel.send(m)

client.run('token')
```

discordのBotを作り始めたかたのコードはだいたいこうなっていると思います。

上記は誰かが「はろー」と発言したらそれに対応するコードっぽいです。

今日はこれをベースに説明していきます。

## Botに発言させるメソッド　message.channel.send

Botに発言させるためにはmessage.channel.sendというメソッドを使います。

使い方は、上のコード見て分かる通り、

```python
await message.channel.send(発言したい内容)
```

となります。発言したい内容の部分以外のところはおまじないと思って良いです。

続いてファイルを添付させる方法です。

## ファイルを添付する　message.channel.send(file=discord.File(パス))

今度はmessage.channel.sendに、fileを引数として指定します。

使い方は、

```python
await message.channel.send(file=discord.File(添付したいファイルのパス))
```

と言った形です。
基本的にはこれで使えます。

使い所としては誰が「ありがとう」って発言したら、予めサーバに保存してある、
![スクリーンショット 2018-08-14 17.42.21.png](https://qiita-image-store.s3.amazonaws.com/0/186346/819ac337-abc2-16e4-e38e-d45657d355b0.png)
といった画像を添付するとか。



注意点としてはファイルのパスはフルパスじゃないと場合によってはNGかもです。

その他補足までに、

```python
await message.channel.send(file=discord.File(添付したいファイルのパス, filename='aaa'))
```

とするとダウンロード可能な形でファイルを添付します。
<img width="581" alt="スクリーンショット 2018-08-14 17.39.56.png" src="https://qiita-image-store.s3.amazonaws.com/0/186346/cff8a0d7-331e-ce24-e5e2-4c190d5a5c1c.png">

こんな感じになります。

また、

```python
await message.channel.send('bbb', file=discord.File(添付したいファイルのパス))
```

とするとコメントも添えて添付してくれます。


上記を踏まえて出来上がるコードは、

```bot.py
import discord
import asyncio

client = discord.Client()

@client.event
async def on_ready():
    print('Logged in as')
    print(client.user.name)
    print(client.user.id)
    print('------')

@client.event
async def on_message(message):
    if message.content.startswith("はろー"):
        m = "こんにちは、" + message.author.name + "さん"
        await message.channel.send(m)

    if message.content.startswith("ありがとう"):
        filepath = '/path/to/dir/attouteki.png'
        await message.channel.send(file=discord.File(filepath))

client.run('token')
```

こんな感じになると思います。

## 以上です

まとめると

発言させる

```python
await message.channel.send(発言したい内容)
```


ファイルを添付する

```python
await message.channel.send(file=discord.File(添付したいファイルのパス))
```

です。

次回はリアクションの付け方とかについて書いたりしたいです。
Visual StudioのReact.jsで日本語が文字化けする

#Visual StudioでReact.jsを使ったWebアプリが文字化けする

Visual StudioのReact.jsで文字化けが発生した経緯と、その対応策について。

## 環境
Visual Studio Community 2017 ver 15.7.1
.NET Framework ver 4.7.03056
npm ver 5.6.0

## 文字化けが発生した経緯

Visula Studioを起動して「ファイル」－「新規作成」－「プロジェクト」から ASP.NET Core Web アプリケーションを作成する。
テンプレートに React.js を選択する。
![pic1.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/524c739c-49fd-307d-061e-2d7f257b874c.png)

ビルドをかけると下記のエラーが出た。
`Message "Cannot find module './wwwroot/dist/vendor-manifest.json'\r\nError（以下略）`

この対応策はこちら。
[Visual StudioでReactを遊んでみる。](https://qiita.com/TsJazz27Sumin/items/ccc0755d7dec46414763)
[ASP.NET Core application won't run](https://stackoverflow.com/questions/49734822/asp-net-core-application-wont-run-no-dist-folder-and-cannot-find-module-ww)
プロジェクトフォルダのnode_modulesがある場所で以下のコマンドを実行すると良い。

```
node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js
node node_modules/webpack/bin/webpack.js
```

ビルドが通り、サイトがデバッグできるようになった。
![pic2.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/0533604b-71f4-35f9-9ce9-867ba8f8a570.png)

いよいよ本題。
components.NavMenu.tsx の一部を日本語に書き換えてみる。

```
                    <Link className='navbar-brand' to={ '/' }>リアクトWebシステム</Link>
                </div>
                <div className='clearfix'></div>
                <div className='navbar-collapse collapse'>
                    <ul className='nav navbar-nav'>
                        <li>
                            <NavLink to={ '/' } exact activeClassName='active'>
                                <span className='glyphicon glyphicon-home'></span> ホーム
                            </NavLink>
                        </li>
                        <li>
                            <NavLink to={ '/counter' } activeClassName='active'>
                                <span className='glyphicon glyphicon-education'></span> カウンター
```

サイトを開くと、文字化けしてしまう。
![pic3.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/8f8faadd-b516-ad70-f8d7-02f6ab6fb858.png)

## 調査と対応策

問題が発生している箇所を絞り込みたいので、Views.Shared._Layout.cshtml の一部にも日本語を書いてみる。

```
    <title>@ViewData["Title"] - Webサイト</title>
```

こっちは文字化けしない。（ブラウザのタブに表示されている「Webサイト」の部分。）
![pic4.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/6c37d20a-24b1-69d2-4f99-524f7f59ebf3.png)

ということは NavMenu.tsx だけに問題がありそうで、このファイルの文字コードを修正してあげれば良さそう。
Visual Studio の外側で、NavMenu.tsx をテキストエディタで開く（以下の例ではエディタはMeryを使用）。
![pic5.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/689bd7d9-a016-b33a-1274-01e8c6260de0.png)

Meryはウインドウ下部のステータスバーに文字コードが表示される。
ファイルはシフトJISで保存されていることが判明。WebサイトはUTF-8で表示させたいので、文字コードの変更をする。
![pic6.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/8a9cd376-4980-a77e-b892-6dc2f0ed8f80.png)

「名前を付けて保存」から「エンコード」の選択を『UTF-8(BOM無し)』に変更して保存し、ファイルを更新する。
![pic7.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/929d7fe7-6405-234d-bab7-7e320ebcae1a.png)

サイトを開き直すと、日本語が正しく表示された。
![pic8.PNG](https://qiita-image-store.s3.amazonaws.com/0/241999/1941e600-4199-af52-30e2-8ceb326f1fdd.png)

ファイルの文字コードは一度更新すると保持されるので、エディタでこの作業を繰り返したり、Visual Studio上で特別なことをやったりする必要はない。
Linux で消せないファイルの作りかた

# 概要

スーパーユーザー(root)ですら消せないファイルの作りかたです。
ファイルアクセス権限系のテストを行う際に使えます。

# 内容

ぱっと思いつくのは `chmod 000` でアクセス権限をすべて無効化する方法ですが、これではファイルやディレクトリは何事もなく消せてしまいます。代わりに `chattr` というコマンドを使います。

※chattr コマンドが見つからない場合は `yum install -y e2fsprogs` でインストールしておきます。

消せないファイルを作るには以下のように i 属性を追加してコマンドを実行します。

```
# chattr +i ファイル名
```

i 属性を追加したファイルを削除しようとすると怒られます。

```
# touch test
# chattr +i test
# rm -f test
rm: `test' を削除できません: 許可されていない操作です
```

再び削除できるようにするには i 属性を取り除きます。

```
# chattr -i test
# rm -f test
```

chattr コマンドは ext2/ext3/ext4 ファイルシステムで利用する拡張属性を設定するためのコマンドです。
i は変更不可をあらわす属性になっています。ほかにも以下のような属性があります。

|属性|説明|
|:---|:---|
|a|書き込みの際に追加モードでしかオープンできない|
|A|ファイルにアクセスしても atime レコード(アクセス時刻)を更新しない|
|c|ファイルを圧縮する|
|d|dump(8)プログラムの起動時にバックアップしない|
|D|ディレクトリの変更時に同期的にディスクに書き込む|
|e|拡張フォーマットを使用する|
|i|内容の変更、削除、名前の変更、リンクの作成を禁止する|
|j|データをジャーナルに書き出す|
|s|ファイル削除の際に割り当てられているブロックの中身を0で初期化する|
|S|ファイルの変更時に同期的にディスクに書き込む|
|t|ファイルをマージした際にフラグメントを末尾に作らない|
|T|Orlovブロックアロケータのためのディレクトリ階層のトップとして扱う|
|u|削除を禁止する|

設定されている属性の情報を確認するには `lsattr` コマンドを使用します。

```
# touch test
# chattr +i test
# lsattr
----i----------- ./test
```

i 属性が設定されていることが確認できます。
特定ディレクトリのプログラムの行数を調べる

```
find . -name "*.swift" | xargs wc -l | sort
```

[こちら](https://qiita.com/zoe302/items/93d2445f69e2c2307a17)とほぼ同じですが、このコマンド特定ディレクトのswiftファイルの行数を調べられます。
アプリのざっくりとした規模感の把握などに使えると思います。
RundeckをDockerで超簡単に試してみる

[こちら](https://hub.docker.com/r/jordan/rundeck/)のDockerImageを使用すると簡単にDockerでテストが出来ます。

Docker imageのPull

```bash
docker pull jordan/rundeck
```

コンテナー起動

```bash
docker run -p 4440:4440 -t jordan/rundeck:latest
```

後は、 [http://localhost:4440](http://localhost:4440)へアクセスします。ユーザー名とパスワードは初期はadmin/adminに設定されています。
Unity Facebook SDKでuser_link取得

linkを取ってくるのがfacebookのグラフAPI2.系だと取れなくなって
新しく権限の申請とか必要になってハマったので軽くまとめる

そもそもログインするのにfacebookでアプリ登録していると思うが
https://developers.facebook.com/
こちらでアプリ登録などをして
<img src="https://qiita-image-store.s3.amazonaws.com/0/46444/bb083d63-f137-7f75-09b9-f2578df57797.png" width="400">
<img src="https://qiita-image-store.s3.amazonaws.com/0/46444/b0145312-1cf3-2648-5cb9-956cc2033991.png" width="400">
権限を追加して申請

許可が通ったら・・・
<img src="https://qiita-image-store.s3.amazonaws.com/0/46444/0817c094-bb66-3e68-53a4-4345dfbea438.png" width="400">


そのあとにこちらのグラフAPIエクスプローラーで取れるか確認
https://www.assetstore.unity3d.com/jp/#!/home

取れたらUnityのfacebookSDKの方へっと
FacebookのFBInitializeなどの関数でAPIのversionを3.1に。
デフォルトだとv2.6になっている。(facebook sdk 7.12.0の時点で)
これだとlinkは取得できないので注意。
```
FB.GraphApiVersion = "v3.1";
```

こうして、ログインする時にpermissionsにuser_linkを追加忘れずに。
これを追加するとアプリからログイン時にこの情報も取得するよと表示される

```
var list = new List<string> { "public_profile", "email", "user_link"};
FB.LogInWithReadPermissions (list,this.FacebookAuthCallback);
```

で、ログインできたら

```
FB.API("/me?fields=link", HttpMethod.GET, GetUserLink);
```
こんな感じでlinkを取得

```
private void GetUserLink(IResult result)
{
    Debug.LogError("link取得完了" + result.ResultDictionary["link"].ToString());
}
```

これでlinkが取れた。
他人のlinkを取得するときは
/{ユーザーのID}?fields=link で取れた。
AndroidStudioでHelloWorldするまでに躓いたこと


## 環境等
```
Android Studio : 3.0
API Level      : 26
Mac OS X       : 10.13.3
```

## Unable to find method〜が発生
```
Error:(2, 0) Unable to find method
'org.gradle.api.internal.file.DefaultSourceDirectorySet.<init>(Ljava/lang/String;Lorg/gradle/api/internal/file/FileResolver;)V'. Possible causes for this unexpected 
error include:

- Gradle's dependency cache may be corrupt (this sometimes occurs after a network connection timeout.) 
    - Re-download dependencies and sync project (requires network)
- The state of a Gradle build process (daemon) may be corrupt. Stopping all Gradle daemons may solve this problem. 
    - Stop Gradle build processes (requires restart)not compatible with the other plugins in the project or the version of Gradle requested by the project.
In the case of corrupt Gradle processes, you can also try closing the IDE and then killing all Java processes.
```
[こちら](https://stackoverflow.com/questions/44042754/android-studio-3-0-unable-to-find-method-com-android-build-gradle-internal-va)を参考に、ext.kotlin_versionを上げることで解消。
書き換え前は`ext.kotlin_version = '1.0.0'`でした。(古)
ついでにKotlinプラグインもアップデート。

## Emulatorが起動しない
> Intel HAXM is required to run this AVD. 
> /dev/kvm is not found.

HAXMはインストール済みだったが、アンインストールしてから再度インストール。
Macの　システム環境設定　>　セキュリティとプライバシー を開いて「許可」をクリック。
スクショ取り忘れたけど、[こんなイメージ](https://stackoverflow.com/questions/36812624/android-studio-emulator-dev-kvm-is-not-found)。

## おわりに
無事、Kotlinに変換してHelloWorldに成功！
つどつど似たようなエラーでハマるので残しておく。
MASM32 16進変換サンプル

```tohex.asm
comment *
        tohex.asm for MASM32
ml /c /AT /Fl tohex.asm
link16 /t tohex;
*
        .model  tiny
        .code
        org     100h
start:
        mov     di, offset hex
        mov     ch, 3
        mov     ax, 0cafeh
        call    tohex

        mov     ah, 09h
        mov     dx, offset msg
        int     21h

        mov     ax, 4c00h
        int     21h

; di=出力アドレス ch=桁数(1～4) ax=値
tohex:
        mov     bl, ch
        mov     bh, 0
        add     di, bx          ; di += ch
        mov     cl, 4           ; 回転ビット数
@@:
        mov     bx, ax
        and     bx, 0fh         ; bx = ax & 0fh
        dec     di
        mov     dl, hexstr[bx]
        mov     [di], dl
        ror     ax, cl          ; 4bit右回転
        dec     ch
        jnz     @b
        ret

hexstr  db      '0123456789ABCDEF'

msg     db      'AX=['
hex     db      3 dup (?)
        db      ']', '$'

        end     start
```
[PHP + AWS SDKでAthena] getQueryResultsの結果が扱いづらいので扱いやすくする。2018-08-14

# 概要
長くなるので割愛しますが、PHP + AWS SDKでAthenaの実行結果（[結果例](https://qiita.com/abetomo/items/63a24c60987023845854#%E5%AE%9F%E8%A1%8C%E7%B5%90%E6%9E%9C)）をgetQueryResultsで取得すると少し扱いづらいです
扱いやすい形式に変換してみます

# install
```
% composer require abetomo/convert-athena-query-results-to-array
```

# コード例
[こちらのコード例](https://qiita.com/abetomo/items/63a24c60987023845854#%E3%82%B3%E3%83%BC%E3%83%89%E4%BE%8B) から変更したところを抜粋して記載します

```php:example.php
<?php
// ... これより上は省略
// 3. 結果の取得
$getQueryResultsResponse = $athenaClient->getQueryResults([
    'QueryExecutionId' => $queryExecutionId
]);

use Abetomo\ConvertAthenaQueryResultstoArray\ConvertAthenaQueryResultstoArray;
// getQueryResultsの結果を
// ConvertAthenaQueryResultstoArray::convert()
// で変換します
print_r(ConvertAthenaQueryResultstoArray::convert($getQueryResultsResponse->get('ResultSet')));
```

# 実行結果
```
string(36) "QueryExecutionId-XXXXX"
[waitForSucceeded] State=RUNNING
[waitForSucceeded] State=RUNNING
[waitForSucceeded] State=SUCCEEDED
Array
(
    [0] => Array
        (
            [account_id] => id1
        )

    [1] => Array
        (
            [account_id] => id2
        )

    [2] => Array
        (
            [account_id] => id3
        )

)
```

[こちらの結果](https://qiita.com/abetomo/items/63a24c60987023845854#%E5%AE%9F%E8%A1%8C%E7%B5%90%E6%9E%9C) と比較するとシンプルな配列になりました

# まとめ
PHP + AWS SDKでAthenaの実行結果をシンプルな配列に変換して扱いやすくしました
ゆっくり実況的なものの声のまとめ

#動画作成支援・音声生成支援
音声入力→ゆかりねっと→Softalk＋唄詠→出力
により、「自分の喋った内容がUTAU音源で出力される（疑似HANASU）」＋「音声と連動して動画に字幕が挿入される（ゆっくり動画作成）」が実現される（はず）。
##ゆっくり動画作成支援
ゆっくりMovieMaker＋AviUtl
https://manjubox.net/ymm3/tutorial/editing/h201341985754115/
設定すれば原稿Textファイルを入力するだけで、字幕と声を連動させられます。
口パクも含めた2Dキャラ素材との連携ができるようなので、（Vカツなどから作成した立ち絵を用いて）2Dの省エネ動画作成したい場合に向いていそうです。（※キャラ素材の作成法は未確認）

公式ドキュメント曰く、唄詠に対応しているようです。稼働させるの楽しみ。
→（20180815追記）唄詠を使って疑似HANASU＆字幕自動表示に成功しました。

立ち絵コンバータ

##音声入力→ゆっくり音声生成支援
ゆかりねっと＋Softalk
ゆかりねっと＋棒読みちゃん

##音声生成ソフト
唄詠（SoftalkでUTAU音源がつかえる）
http://www.nicovideo.jp/watch/sm26525344
※「#唄詠使用支援中」ハッシュタグの使用推奨
> 注意事項：『唄詠』でUTAU音源を使用したい方へ
別キャラクターに声をあてる場合は【CV：音源名】を明記する
本来、UTAU音源は付属のキャラクターが存在していることが多いです。
別のキャラクターに声をあてる（例：東方キャラの音声としてUTAU音源を使用する）場合は、クレジットや動画説明文などに【CV：音源名】を明記するようにしましょう。

↑http://utiest.web.fc2.com/utayomi/
より

※前述の、音声入力→ゆっくり音声生成支援の方法と併用可能

##唄詠使用可能なUTAU音源リスト
###唱地ヨエ
https://kawatoro.jimdo.com/%E5%94%B1%E5%9C%B0%E3%83%A8%E3%82%A8/
他キャラクターへの声当て：【CV:唱地ヨエ】の表記があれば使用可能

###春歌ナナ
http://confetto.chu.jp/haruka/download.html
他キャラクターへの声当て：※未確認※

###天月りよん
http://amatukiseries.esy.es/%e5%a4%a9%e6%9c%88%e3%82%8a%e3%82%88%e3%82%93-character/
> 「天月りよん」のイメージを損なう表現
は禁止

他キャラクターへの声当て：※未確認※

###蒼湖マウ
http://amatukiseries.esy.es/%e5%a4%a9%e6%9c%88%e3%82%8a%e3%82%88%e3%82%93-character/
ほかキャラクターへの声当て：△明確な記載がないが微妙
利用規約の「禁止事項」に
> ・本音源の著作情報を偽ること。
・本音源を使用し、「蒼湖マウ」に全く別の名前＋容姿を与え
　別音源として無断で公開、配布する行為及びそれに順ずる行為。
　（ｇ変えキャラ・ちびキャラ等は別音源として無断で配布しない場合に限り、
　　これに当てはまらないものとします。） 

とあります。

###玲縹
http://arcieler.wixsite.com/tamahanadautau
ほかキャラクターへの声当て：△明確な記載がないが可能？
> UTAU以外のツールで使うこと。（動作は保証外です）

が可能で、
>自作発言・データを流用して別キャラクターとして配布すること。
音源などの著作情報を偽ること。

が不可能とあります。

###葉楼ナツノ・霜月エマ
http://helloandgoodbye.shimo-yake.com/ki.htm
別キャラクターへの声当て：○音源名表記必須の上で可能

###黒堵ビスク
https://biscuitxxx.tumblr.com/policy
別キャラクターへの声当て：△明確な記載がない

#追記：
https://wikiwiki.jp/voirosozai/%E4%BE%BF%E5%88%A9%E3%83%84%E3%83%BC%E3%83%AB
インスタンス変数について

# はじめに
上京したてで、筋トレと日サロが友達。友達探している系エンジニアのギノキンです。（エンジニアではない。m(_ _)m）

# インスタンス変数について
### インスタンス変数とは
@ を先頭に持って来て定義する
クラス内であれば全メゾットで使用することができる

下記に通常使っている省略した定義文を記載します。

```
def Menu
  attr_accessor :name 

#　：nameはインスタンス変数です。
```
通常この　attr_accessor :（インスタンス変数）で省略した形で定義します。

それでは、今回は
このattr_accessor :（インスタンス変数）の中身を確認します。

```
class Menu

 def name　　　　　　　　　　　　　　　　　　　　#nameの箱のメソッド
  @name
 end
  
 def name=(name)　　　　　　#nameの中身のメソッド
  @name = name
 end

end

menu = Menu.new　　　　　　　　#menuインスタンスを生成（nameの箱のことをmenuと名付ける）
menu.name=("ピザ")  #nameの中身メソッドに”ピザ”を代入する


puts menu.name　　　　　　　　　　#nameの出力文（menuの箱の中のnameを出力してください）
=> ピザ

```

しつこいくらい説明文を織り込んでおりますが、中身はこのようになっております。

一つのインスタンス変数を定義するだけで、これだけのプログラムをかかなければなりません。

一つだけでならいいですが、いくつものインスタンス変数を定義するとなると、書くプログラムも膨大になり、
デバック時にわかりづらいプログラムになってしますので、

省略されるような形が用意されております。

省略形　attr_accessor :(インスタンス変数)について理解のお助けになれば幸いです。

#おわりに
独学で勉強しているため、間違った情報等ありましたら、ご教示お願い致します。
勉強会などあれば参加してみたい。＼(^o^)／
UbuntuへのAzCopyのインストール

# 概要

LinuxへのAzCopyのインストール方法は「[AzCopy on Linux で Azure Storage にデータをコピーまたは移動する | Microsoft Docs](https://docs.microsoft.com/ja-jp/azure/storage/common/storage-use-azcopy-linux)」に従います。ここでは、これをUbuntuに対して行う場合の手順（実際にはBash on Ubuntu on Windowsに行った手順）をメモしておきます。

# インストール手順

(1)[Ubuntuのバージョンを確認](https://qiita.com/glires/items/a2a07565207509af0e83)する。

    cat /etc/os-release

(2)「[Linux における .NET Core の前提条件](https://docs.microsoft.com/ja-jp/dotnet/core/linux-prerequisites?tabs=netcore2x#install-net-core-for-supported-ubuntu-and-linux-mint-distributionsversions-64-bit)」からリンクされている該当Ubuntuバージョンのドキュメントを確認し、まずMSのキーとフィードを登録する。


    wget -q https://packages.microsoft.com/config/ubuntu/16.04/packages-microsoft-prod.deb
    sudo dpkg -i packages-microsoft-prod.deb

(3)続いて.NET SDKをインストールする。

    sudo apt-get install apt-transport-https
    sudo apt-get update
    sudo apt-get install dotnet-hosting-2.0.8

(4)「[AzCopy のダウンロードとインストール](https://docs.microsoft.com/ja-jp/azure/storage/common/storage-use-azcopy-linux#download-and-install-azcopy)」の「その他すべての Linux ディストリビューション」を確認し、AzCopyをインストールする。

    wget -O azcopy.tar.gz https://aka.ms/downloadazcopylinux64
    tar -xf azcopy.tar.gz
    sudo ./install.sh

最後のインストールは、「[Ubuntu のバージョンごとのインストール方法](https://docs.microsoft.com/ja-jp/azure/storage/common/storage-use-azcopy-linux#alternative-installation-on-ubuntu)」に記載されたバージョン（14.04および16.04）であれば、記載内容に従ってapt-getでインストールしてもよい。

# 参照

* [AzCopy on Linux で Azure Storage にデータをコピーまたは移動する | Microsoft Docs](https://docs.microsoft.com/ja-jp/azure/storage/common/storage-use-azcopy-linux)
* [Linux における .NET Core の前提条件 | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/core/linux-prerequisites)
    * [Install .NET Core 2.0 Runtime on Linux Ubuntu 16.04](https://www.microsoft.com/net/download/linux-package-manager/ubuntu16-04/runtime-2.0.8)
* [Ubuntuのバージョン確認 - Qiita](https://qiita.com/glires/items/a2a07565207509af0e83)

----

本ページ内容は筆者が参照の便のためにある時点でまとめた個人的なメモです。内容を保証するものではなく、また筆者の所属組織等とは一切かかわりがありません。
Javascript 簡介 By 彭彭

1. Javascript 簡介 By 彭彭
a. 現代網頁的必需品
b. java v.s JavaScript

```ruby:qiita.rb
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"></meta>
	<title>Javascript</title>
	<!-- 測試 test -->
	<script type="text/javascript">
		alert("hello world");
		alert("hello florence");
	</script>
</head>
<body>
</body>
</html>
```

2. Javascript 變數與運算子 By 彭彭
a. 資料 數字。字串。布林值。物件
b. 變數 可存放資料做操作的符號
c. 運算子 可對資料做操作的符號

```ruby:qitta.rb
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"></meta>
	<title>Javascript</title>
	<!-- 測試 test -->
	<script type="text/javascript">
	// 單行注解
	/* 多行注解 */
	// 資料
	/*
	1127;
	8.25;
	"i love florence kwok"
	true;
	false;
	// 變數 用來裝東西的箱子
	var x;
	x = 15;
	alert(x);
	x = "i am little white"
	alert(x);
	var y = true;
	// 運算子

	15 + 20;
	alert(15+20); //35
	
	var result = 15*15;
	alert(result); //225
	
	result++;
	alert(result); //226
	
	result = result + 1; //result++;
	alert(result);
	*/
	/* 比較運算	
	4 > 3;
	result = 4 > 3;
		alert(result); //true

	result = 4 < 3;
		alert(result); //false
		
	result = 4 >= 3;
		alert(result); //true
		
	result = 4 == 3;
		alert(result); //false
	
	
	var data = 3;
	result = data * data;
	alert(result);
	alert(data);
	*/
	
	// 範例 
	// 輸入 prompt(提示語,預設值) > 程序運算 > 輸出 alert（資料）
	var n1 = prompt("請輸入數字","1");
	var n2 = prompt("請輸入數字","1");
	var result = n1*n2;
	alert(result);
	</script>
</head>
<body>
</body>
</html>
```

3. Javascript 流程控制 - 判斷式 By 彭彭
a. 判斷式
b. 回圈

```ruby:qitta.rb
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"></meta>
	<title>Javascript</title>
	<script type="text/javascript">
	/*
		if(判斷){
			若判斷的結果是正確的(true),則執行大括號區塊中的程式碼.
			反之(false),則忽略此區塊.
		}
	*/
	/*
	var money = prompt("要提多少錢","");
	if(money > 300){
		alert("no");
	}
	*/
	/*
		if(判斷){
			若判斷的結果是正確的(true),則執行大括號區塊中的程式碼.
		}else{
			若判斷的結果是錯誤的(false),則執行 else 大括號區塊中的程式碼.
		}
	*/
	/*
	var money = prompt("要提多少錢","");
	if(money > 300){
		alert("no no");
	}else{
		alert("congratulation");
	}
	*/
	/*
		if(判斷){
			若判斷的結果是正確的(true),則執行大括號區塊中的程式碼.
		}else{
			若判斷的結果是錯誤的(false),則執行 else 大括號區塊中的程式碼.
		}
	*/
	/*
	var n = prompt("請輸入數字","");
	if(n > 500){
		alert(n + " > 500");
	}else if(n > 300){
		alert(n + " < 300");
	}else{
		alert(n + " <= 300");
	}
	*/
	// 範例
	var n1 = prompt("請輸入數字","");
	var n2 = prompt("請輸入數字","");
	// 資料型態的轉換： 把字符串→數字
	n1 = Number(n1); //字符串轉換成數字
	n2 = Number(n2);
	var op = prompt("請輸入運算符號: +,-,*,/","");
	var result;
	if(op == "+"){
		result = n1 + n2;
	}else if(op == "-"){
		result = n1 - n2;
	}else if(op == "*"){
		result = n1 * n2;
	}else if(op == "/"){
		result = n1 / n2;
	}else{
		result = "不合法的運算符號";
	}
	alert(result);
	</script>
</head>
<body>
</body>
</html>
```
pycharm で conda 環境を構築 (windows 版)

# 目的
windowsターミナルのpython環境と同じようにするための操作。

# windowsターミナルからpythonバージョンを調査
```
C:\Users\to>python
Python 3.6.4 |Anaconda custom (64-bit)| (default, Jan 16 2018, 10:22:32) [MSC v.1900 64 bit (AMD64)] on win32
Type "help", "copyright", "credits" or "license" for more information.
>>> import os
>>> import sys
>>> sys.executable
'C:\\Users\\to\\Anaconda3\\python.exe'
```
# pycharm で conda 環境を追加
GUIの提示に従って、上記python.exeのパスを追加すればOK!
![image.png](https://qiita-image-store.s3.amazonaws.com/0/157710/e1785fb0-8d0c-6f9c-77ed-f57331a7a197.png)
VCSA を落としてしもーたら

# うっかり VCSA を落としてしもーた

vSphere の Web Client から何もできなくなる。焦る。

# 環境・状況を確認する

- ESXi 6.5
- VM はちゃんと動いているっぽい。よかった。
- Web Client のブラウザタブはそのままにしておく。クラスタ名・VM 名くらいは見れたりするので。

# VCSA を起動して復旧する

ESXi ホストに ssh でログインする。

```bash
$ ssh root@esxi
```

次のコマンドで VM の一覧が出力されるので、VCSA の名前を探す。なかったら次の ESXi ホストでやり直し。ローラー作戦。

```bash
[root@esxi:~] vim-cmd vmsvc/getallvms
```

(オプション) まぁ止まってるんだろうけど、VCSA の状態を確認してみる。`<vmid>` には先のコマンドで見つけた VCSA の VMID を指定する。

```bash
[root@esxi:~] vim-cmd vmsvc/power.getstate <vmid>
Retrieved runtime info
Powered off
```

VCSA を起動する。

```bash
[root@esxi:~] vim-cmd vmsvc/power.on <vmid>
```

しばし待つ。再ログインして Web Client が使えるようになる。ほっ。

# 参考文献

1. [Powering on a virtual machine from the command line when the host cannot be managed using vSphere Client (1038043)](https://kb.vmware.com/s/article/1038043)
７分でDiscordで動くbotをPythonで作る

discordっていうSkype以上、Slack未満なチャットツールがあります。

こないだソシャゲのクランの方々に言われてdiscordを導入したらわりといい感じでして。
いろいろ触ってみて、「もしや？」と思ったら案の定botが作れるではありませんか。

で、作ってみたところ結構クランのみんなから好評で楽しかったので導入の仕方的なのを書いてみたいと思います。


## discord側での作業

### discordアカウント作成
すでにある場合は大丈夫です。

手順は割愛。

### Botの作成、およびトークン作成

https://discordapp.com/developers

にアクセスしてログイン。

![disbot.png](https://qiita-image-store.s3.amazonaws.com/0/186346/c86d4cd4-e59d-9274-a00a-3884ba382e2e.png)

なんかでてますがｗ
右側の【Create an Application】をクリック

次の画面で、
![disbot2.png](https://qiita-image-store.s3.amazonaws.com/0/186346/3cc62e8d-945e-bb52-918d-d5d0dd77d456.png)

と出てくるので、
【Name】のところに好きな名前を入れて右下にある【Save Changes】をクリック。
これでアプリケーションが登録されました。

続いてBotを作成します。

![スクリーンショット 2018-08-13 21.44.17.png](https://qiita-image-store.s3.amazonaws.com/0/186346/d4ff9ade-b14f-9f30-29aa-2b37c17b648b.png)

左ペインに【Bot】という項目があるのでこいつをクリックすると上記の画面のようになります。
ここで、【Add Bot】をクリックします。

すると、

![disbot3.png](https://qiita-image-store.s3.amazonaws.com/0/186346/39a18a37-499b-38a4-c48a-f7bbcbaf8c1c.png)

こうなります。
とりあえずこうなっていればOKです。

で、
　【Click to Reveal Token】
という項目があるのでこいつをクリックして、でてきた文字列をコピーしておいてください。
Botを作るにおいて大事なやつです。

で、次に左ペインの、【OAuth2】というところをクリックして、
![disbot4.png](https://qiita-image-store.s3.amazonaws.com/0/186346/4f84f72a-ac2d-fc21-94ee-caf124c147dc.png)

【Bot】にチェック、して【Copy】をクリック。

これでクリップボードに招待用URLが保存されました。

保存されたURLをブラウザのURL欄に貼り付けると招待ページに飛べます。


招待ページで追加したいサーバを選択。

### 招待するサーバを選択するときの注意

自分が管理者権限なり、ユーザを招待する権限を持っていないとそのページに飛んでもサーバが選択できないです。
なので、もしサーバがでてこないといった場合は、権限周り疑って、サーバを作った人に「権限くれ」ってお願いしましょう。

とりあえずここまでで、サーバにBotを追加、招待できました。

ただしまだ、ステータスがオフラインになっていると思います。

これから実際にプログラムを書いて、Botを起動させることでオンラインになっていきます。

## Botの起動

まずはdiscord.pyをインストールします。
自分はMacでやりましたが、レンタルサーバなりでもコマンドは変わらないと思います。（windowsはちょっとわからない・・・）

https://github.com/Rapptz/discord.py
にかかれているとおりにやれば入ります。

```console
# Mac
python3 -m pip install -U discord.py

# windows
py -3 -m pip install -U discord.py
```

※よしなに、
`pip install discord`
とかやっても問題はないです。

無事インストールできたら、プログラムを書いていきます。

```bot.py
import discord
import asyncio

client = discord.Client()

@client.event
async def on_ready():
    print('Logged in as')
    print(client.user.name)
    print(client.user.id)
    print('------')

@client.event
async def on_message(message):
    if message.content.startswith("はろー"):
        m = "こんにちは、" + message.author.name + "さん"
        await client.send_message(message.channel,m)

client.run('token')
```

これでとりあえずは動くはずです。

`client.run('token')`
tokenのところは、
さきほどdiscordで【Click to Reveal Token】をクリックしてコピーして文字列を埋め込んでください。


この状態で、

```console

python bot.py

```

で実行してみます。
すると作成したbotがオンラインになるのでそのチャンネルで、
はろー
とつぶやくと「こんにちは ○○　さん」といった形で返してくれるはずです。

## 以上です

とりあえずBotが動くところまではできました。
ただこのままだとまだ実用的ではないのでおいおいにきちんとデプロイするところまで書いていきたいと思います。
オンプレミスとインスタンスの接続が突然スローダウンする


オンプレミスとインスタンスの接続が突然スローダウンする現象が発生。Direct Connect 経由。１時間くらいで急に遅くなる。

原因は全くつかめず。オンプレ側のサーバは問題ないようにみえる。現象が発生したらセッションを一度切って再接続することで、運用で回避中。

もともと両方ともオンプレで動いていたので問題ないはず。

これがあるからクラウドも怖い。
(Dockerで) 独自ドメイン + HTTPS 対応 な WordPress を一瞬で作る

自動で SSL 証明書を発行・管理しながら HTTPS リクエストをプロキシする Docker イメージ「CertFront」を作った。

GitHub: https://github.com/hoto17296/docker-certfront
DockerHub: https://hub.docker.com/r/hoto17296/certfront/

## CertFront について
これを使うと何が出来るかと言うと、Web アプリを簡単に HTTPS 対応して公開できる。

![certfront.png](https://qiita-image-store.s3.amazonaws.com/0/16369/9177f34a-38d4-3751-d888-01514e294f10.png)

中でやっていることは単純で、

- Certbot (Let's Encrypt) で証明書を管理する
    - 起動時に証明書が無ければ新たに発行する
    - 起動時に証明書の有効期限が切れていたら更新する
    - 定期的に証明書の有効期限をチェックする
- Nginx で HTTPS リクエストをリバースプロキシする
    - HTTPS リクエストを受け取ったら HTTP に変換して Web アプリに流す
    - HTTP リクエストを受け取ったら HTTPS の URL にリダイレクトする

これだけ。

使い所としては「ロードバランサを使うほどでもない趣味 Web アプリだけど HTTPS 対応したい」場合。

例えば AWS の場合、EC2 で動いている Web アプリを HTTPS 対応する場合の選択肢は以下の三択になる。

- ACM + ELB を使う
    - 設定は簡単
    - EC2 (t2.micro) よりも ELB の方が料金が高い
    - EC2 一台しか動いてないのに LB 使うの気が引ける (？)
- ACM + CloudFront を使う
    - (趣味アプリではこれが最適解っぽい)
    - 安い
    - 設定でハマる部分が多く、慣れるまでが大変
- EC2 内で自前で証明書を管理する
    - Let's Encrypt 使えば無料
    - 設定が面倒くさい

どれもデメリットがあるので、ここで CertFront を使うという選択肢を増やしたい。

## WordPress を動かす例
試しに WordPress を HTTPS 対応してみる。

### あらかじめ用意しておくもの
- サーバ
    - Docker と Docker Compose が動くこと
    - インターネット上からポート 80, 443 にアクセスできること
- ドメイン
    - A レコードが上記サーバの Global IP を向いていること

### docker-compose.yml の準備
``` yml:docker-compose.yml
version: '3'

services:

  certfront:
    image: hoto17296/certfront
    ports:
      - 80:80
      - 443:443
    environment:
      DOMAIN: blog.example.com  # modify this to your domain
      EMAIL: mail@example.com  # modify this to your email
      APP_HOST: wordpress
    volumes:
      - certs:/etc/letsencrypt
    depends_on:
      - wordpress

  wordpress:
    image: wordpress:4
    environment:
      WORDPRESS_DB_HOST: mysql
    volumes:
      - app:/var/www/html
    depends_on:
      - mysql

  mysql:
    image: mysql:5
    environment:
      MYSQL_ALLOW_EMPTY_PASSWORD: 'yes'
    volumes:
      - data:/var/lib/mysql

volumes:

  # The certificate and private key are stored on this volume
  certs:
    driver: local

  app:
    driver: local

  data:
    driver: local
```

certfront と wordpress と mysql の３つのサービスが起動するように設定した。

また、永続化したいデータは volume に保存するようにした。

### 起動する
あとは起動するだけ。

``` console
$ docker-compose up
```

バックグラウンドで起動させる場合は `-d` オプションを付ける。

初回起動時には、CertFront コンテナ内の Certbot が証明書を発行する処理を行う。

少し待ってから、自分の設定したドメインにブラウザからアクセスしてみると、WordPress の初期設定画面が表示されると思う。

## まとめ
「ロードバランサを使うほどでもない趣味 Web アプリだけど HTTPS 対応したい」ときがあったらぜひ CertFront 使ってください。

もしアクセスが増えてきたら冗長構成にしてロードバランサに切り替えればいいので。
laravel5.4のViewComposerで複数のViewで使用するデータをまとめる

#やりたいこと
複数のViewで使うデータを一箇所でまとめて処理してViewに渡したい


#手順
ViewComposerの説明は[こちら](https://readouble.com/laravel/5.4/ja/views.html)の中程にあります。
ViewComposerはViewがレンダーされる時に呼び出されるので、それに情報を結合することができます。

##ServiceProviderの作成

まずは以下のコマンドでServiceProviderを作成します。

```
php artisan make:provider ComposerSeriviceProvider
```

するとApp\ProvidersにComposerSeriviceProvider.phpができます。

```App\Providers\ComposerSeriviceProvider.php
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;

class ComposerSeriviceProvider extends ServiceProvider
{
    /**
     * Bootstrap the application services.
     *
     * @return void
     */
    public function boot()
    {
        //
    }

    /**
     * Register the application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}
```
##config\app.phpへ登録

作成したServiceProviderをconfig\app.phpの`'providers'`へ追記します。

```app.php
'providers' => [
        App\Providers\ComposerSeriviceProvider::class,
],
```

##ViewComposerの作成

app/HttpにViewComposersディレクトリを作成し、そこにViewComposerを作成します。
ここに行いたい処理を書きます。

```App\Http\ViewComposers\NameComposer.php
<?php

namespace App\Http\ViewComposers;

use Illuminate\Contracts\View\View;

class NameComposer {
    
    protected $name;
    
    public function __construct()
    {
        $this->name = 'bubbles';
    }
    
    /**
     * Bind data to the view.
     */
    public function compose(View $view)
    {
        $view->with('name',$this->name);
    }
}
```

##ViewComposerを適用したいテンプレートの指定

最後にComposerSeriviceProvider.phpを以下のように書き換えます。
今回はpage配下の全てのファイルを指定します。

```App\Providers\ComposerSeriviceProvider.php
<?php

namespace App\Providers;

use Illuminate\Support\Facades\View;
use Illuminate\Support\ServiceProvider;
use App\Http\ViewComposers\NameComposer;

class ComposerSeriviceProvider extends ServiceProvider
{
    /**
     * Bootstrap the application services.
     *
     * @return void
     */
    public function boot()
    {
        View::composers([
            NameComposer::class => [
              'page.*',
          ]
        ]);
    }

    /**
     * Register the application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

```
適用したいテンプレートが増えたら追記していけばOKです。
手順は以上です。

#:writing_hand_tone1:('v')
ヘッダーやフッターやサイドバーで使用するデータといった、全ページまたは多くのページで共通して使用するデータは、ViewComposerでまとめるとコントローラーがすっきりして良いですね。
YouTubeの動画から抜き出した自動生成字幕を読みやすくする

# 概要
仕事柄、YouTubeで使われている英語の字幕を手元で見られるようにしておきたい時があります。手作業で付けられた字幕であれば様々なやり方があり、割と簡単に保存できるのですが、YouTube側が自動生成した字幕にはその多くが対応していません。

試行錯誤した結果、外部サイトとメモ帳とPythonの三者を併用したキメラ的な手法を思いつきました。私と同じレベルの初心者プログラマーを対象に書いていますので、多少回りくどい表現が多くなってしまうと思います。ご了承下さい。

## 手法
1.)海外サイト[Downsub.com](https://downsub.com/)から字幕をsrtファイル形式でダウンロードする
2.)該当ファイルとメモ帳の関連付けを行い、txtファイルに変換する
3.)正規表現モジュールreのsubメソッドを使い、htmlタグを取り除く

### 1.)海外サイト[Downsub.com](https://downsub.com/)から字幕をSrtファイル形式でダウンロードする
当該サイトにアクセスすると、一番上に動画のURLを入力する場所が出てくると思います。そこに自動生成字幕をダウンロードしたい動画のURLをコピペしてもらって、何度かダウンロードボタンを押して下さい。最初は別タブで広告が出ますが、そこはさっさと消してもらって大丈夫です。
うまく変換できれば、以下の画像のような結果が出ると思われます。
![downsub sample.png](https://qiita-image-store.s3.amazonaws.com/0/278439/91294d10-60a0-5055-48a3-c4c592154b51.png)

その中にある>>Download<< English(auto-generated)を選択し、ダウンロードしてください。ダウンロードしたsrtファイルはこれから作業を行うフォルダに入れておいて下さい。適当に名前を変えておくことをオススメします。

### 2.)該当ファイルとメモ帳の関連付けを行う
これは既に行われている方は飛ばしてもらって大丈夫です。拡張子を表示している方であればファイル名の変更で対応出来るでしょうし、そうでない方は以下を参考に関連付けを行って下さい
(参照:[Windows 10で、アプリと拡張子の関連付けを変更する方法について教えてください。](https://121ware.com/qasearch/1007/app/servlet/relatedqa?QID=018054)）

以下の説明では、srtファイルをtxtファイルに変換したものをsample.txtという名前で扱っていきます。

### 3.)正規表現モジュールreのsubメソッドを使い、htmlタグを取り除く
ディレクトリ移動の手間暇を省くため、先ほど保存したテキストファイルと同じ場所にPythonのファイルを作っていきます。実際のコードは以下のような感じになると思います。

```python:youtube_caption.py
import re

with open("sample.txt", "r") as s:#読み込みモードで開く
    text = s.read()

new_text = re.sub("<.*?>", "", text)

with open("new_sample.txt", "w") as n:#書き込みモードでファイル作成
    n.write(new_text)

```
組み込み関数のopenを使って、読み込みと書き出しを行っています。今回はsample.txtという名前のファイルを読み込んで、変数textに保存。タグ除去後のnew_textをnew_sample.txtという名前で出力しています。
少々手間はかかりますが、メモ帳からコピーしたテキストを変数に直接文字列として保存しても同じ結果になります。

また、reモジュールのsubメソッドを使って不要なhtmlタグを削除しています。subメソッドは本来置換用のメソッドなのですが、第二引数を上記のように与えれば削除することが出来ます。正規表現の<.*?>を使うことにより、<>で囲まれた文字列を非貪欲に指定しています。

open関数の使い方や正規表現については以下を参考にして下さい。
(参照:[Pythonでファイルの読み込み、書き込み（作成・追記）](https://note.nkmk.me/python-file-io-open-with/))
(参照:[正規表現ってなんぞや](https://qiita.com/nknkt/items/4c0e1adcbc131e2b0c6e))

## まとめ
おそらくFlaskなんかを使ってやれば全てをPython内で出来る気がしなくはないのですが、私の現在の技術力では無理でした。ゆくゆくはもっとコンパクトにしたいと思っています。
InstallShield でインストール処理だけで使うモジュールを呼び出す方法

# 概要

InstallShield には組み込み関数がいくつか用意されていますが、基本的な機能しか提供されていないため少し高度なことを実現しようとすると外部のモジュールやコマンドなどに頼る必要が出てきます。
しかし、InstallShield のアプリケーションデータに呼び出したいモジュールを配置してしまうとインストール処理だけで必要なモジュールを呼び出すことはできますが、インストール先に余分なモジュールとして含まれてしまいます。さらに、インストールの後処理で余分なモジュールを削除する処理も必要になってしまいます。

ここでは InstallShield でインストール処理だけで使うモジュールを呼び出す方法について記載します。

# 対応方法

InstallShield に関する情報があまり出回っていないので今まで知りませんでしたが、 **動作とロジック** にある **サポートファイル/ビルボード** にインストール処理だけでつかうモジュールを配置することで対応できます。

![is.png](https://qiita-image-store.s3.amazonaws.com/0/278145/169a103d-c11c-18a7-52d4-cb372f2373ce.png)

ここでは **アドバンスファイル** の **Disk1** へ任意のモジュールを配置します。
ここへ配置したモジュールはインストール時に C:/Users/(ユーザー名)/AppData/Local/Temp/(GUID) 以下に一時ファイルとして配置されます。あとは、InstallScript から **SRCDIR** 変数を使用することで該当のモジュールのパスを得られるため、フルパス指定で任意のモジュールを呼び出すことができます。

```
LaunchAppAndWait(SRCDIR ^ "module.exe", "", LAAW_OPTION_WAIT | LAAW_OPTION_HIDDEN);
```

上記のコードではサポートファイルとして配置した module.exe がインストール処理だけで使用するモジュールとして呼び出されます。
MacでThe CXX compiler identification is unknown や CMAKE_CXX_COMPILER could be foundが出たときの対応

Karabiner-Elementsのmake中にエラーが出てしまった。

```
% cd ~/Downloads/Karabiner-Elements-version_12.1.0
% make

make -C ../lib/KarabinerKit
make -C ../../../lib/libkrbn
mkdir -p build_xcode \
		&& cd build_xcode \
		&& cmake -G Xcode .. \
		&& xcodebuild -configuration Release SYMROOT="/Users/cd0054/Downloads/Karabiner-Elements/src/lib/libkrbn/build_xcode/build"
-- The C compiler identification is unknown
-- The CXX compiler identification is unknown
CMake Error at CMakeLists.txt:5 (project):
  No CMAKE_C_COMPILER could be found.



CMake Error at CMakeLists.txt:5 (project):
  No CMAKE_CXX_COMPILER could be found.



-- Configuring incomplete, errors occurred!
```

Xcode Commandline Toolsのパス解決がおかしかったようで、下記コマンドを実行後、makeが通るようになった。

```
sudo xcode-select --reset
```
ASP.NETでダウングレードをした後に起こるエラーについて(見つかったアセンブリのマニフェスト定義はアセンブリ参照に一致しません。 )

依存関係が複雑なパッケージを複数使って開発をしていると、よく依存関係の問題が発生します。そのような問題についての対処についてです。
# 前提
ASP.NETで、NuGetを用いてパッケージ管理をしている。

# まず確かめること
　依存関係が壊れてしまった場合は、パッケージを全て再インストールしてみると治ることが多々あります。特にNuGetを使ってる際はとても簡易的に可能です。
　パッケージファイル(/package)とバイナリファイル(/project/bin)を削除し、[公式の手順](https://docs.microsoft.com/ja-jp/nuget/consume-packages/reinstalling-and-updating-packages)に従って再インストールを試みてください。


# メソッドやプロパティが発見できない
　後方互換性が無い・意図せず消失してしまったなどの場合は、やむを得ずダウングレードが必須になってくる場合があります。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/216639/c55eab07-db5d-10d4-81c2-d3ff8a2f5edb.png)
NuGetのパッケージ
ダウングレードした後、「ファイルまたはアセンブリ (パッケージ名)、またはその依存関係の 1 つが読み込めませんでした。見つかったアセンブリのマニフェスト定義はアセンブリ参照に一致しません。」などのエラーメッセージが見られる場合があります。この場合は、web.configで指定しているパッケージのリダイレクトが上手く修正できていないことが多いです。

```xml:Web.config
<configuration>
  <runtime>
    <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
      <dependentAssembly>
        <assemblyIdentity name="Newtonsoft.Json" culture="neutral" publicKeyToken="30ad4fe6b2a6aeed" />
        <bindingRedirect oldVersion="0.0.0.0-11.0.0.0" newVersion="11.0.0.0" />
      </dependentAssembly>
    </assemblyBinding>
  </runtime>
</configuration>
```

としていた場合、古いバージョンはバージョン11.0.0にリダイレクトされます。ダウングレードしていた場合は当然11.0.0のDLLは存在しないため、エラーが発生します。
　リダイレクトを指定する部分をインストールしたバージョンに指定してあげることでこれは回避することができます。

```xml:Web.config
<configuration>
  <runtime>
    <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
      <dependentAssembly>
        <assemblyIdentity name="Newtonsoft.Json" culture="neutral" publicKeyToken="30ad4fe6b2a6aeed" />
        <bindingRedirect oldVersion="0.0.0.0-9.0.1.0" newVersion="9.0.1.0" />
      </dependentAssembly>
    </assemblyBinding>
  </runtime>
</configuration>
```
Swiftのエラー4分類を概要だけまとめる

[Swiftのエラー4分類が素晴らしすぎるのでみんなに知ってほしい](https://qiita.com/koher/items/a7a12e7e18d2bb7d8c77)という記事が素晴らし過ぎるのですが、4分類の概要だけを簡潔に知りたい時があったので、かいつまんでまとめました。

# Simple Domain Error
> 原因は明白なんだから、**エラーが起こったかどうかさえわかればいいんだ**、と考える場合に採用します。エラーが発生したことだけを伝え、**その原因についての情報は伝えません。**

Swiftなら、キャスト失敗でnilになるなど。

# Recoverable error
> **原因によって処理の方法が異なるだろう**、と考える場合に採用します。

`do try catch`

# Universal error
> **エラー処理をする必要はないと、考える場合に採用します。**

`fatalError`

# Logic failure
> **バグだ、コードを修正する必要がある、と考える場合に採用します。** Logic failure は実行時に起こってはいけないので、起こった場合の挙動は未定義です。

`precondition` とか `assertionFailure`

# `try!` と `!`の捉え方
**try!:** Recoverable ErrorからLogic failureへの変換
**!:** Simple Domain Error からLogic failureへの変換
クロスブラウザのE2EテストシナリオをTestCafe Studioで自動記録する

## はじめに

WebアプリケーションのE2Eテストフレームワーク、`TestCafe`に専用のGUIツール`TestCafe Studio`が登場したので試してみました。本記事を執筆している2018/08/14時点ではPreview版としての公開です。

TestCafe (https://github.com/DevExpress/testcafe) についてざっくり説明しておくと、[Cypress](https://www.cypress.io/)などと同様WebDriverを使わないタイプのフレームワークです。クロスブラウザやリモートブラウザでの実行など、他のフレームワークであまりカバーしない機能が多いことが特徴です。それらの特徴の他、ES6やTypescriptにも対応しており、モダンな開発スタイルにもマッチしやすい点が気に入っています。

現在、コアとなるテストランナー部分はOSSとなっており、今回公開されたのはテストシナリオを自動記録するためのGUIツールのようです。現在はPublic Previewですので無償で利用できます。

なお、本記事を執筆している2018/08/14時点で、[公式ドキュメント](https://testcafe-studio.devexpress.com/documentation/overview/)はビルドに失敗したのか真っ白になっています。[Githubでドキュメントのソースが公開されている](https://github.com/DevExpress/testcafe-studio-docs/tree/master/documentation/getting-started)ので、こちらを参照しましょう。

## ダウンロード〜インストール

https://testcafe-studio.devexpress.com/ からダウンロードします。`Download TestCafe Studio` から各OS向けにダウンロードできます。2018/08時点で以下OSに対応しています。

- Windows
- Mac OS
- Linux x86 / x64 

各OSごとのインストール方法は https://github.com/DevExpress/testcafe-studio-docs/blob/master/documentation/guides/installation.md に書いてありますが、Windows/Macはインストーラが用意されているようです。
Linuxの場合はダウンロードしたZipファイルを任意の場所に展開し、実行します。

ちなみに、TestCafe本体を別途インストールする必要はなく、TestCafe Studio単体で動作するようです。


## 実行

初回起動時にはウェルカムページが出てきます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/99dc0ef3-690f-bc2a-1918-5724dcae5e09.png)

ウェルカムページにURLを入力すると、そのURLに対してのテストの自動記録を開始してくれます。上記の例では、TestCafeが用意してくれているExampleページ(http://devexpress.github.io/testcafe/example/) のURLを入力しています。
　　
FireFoxが起動し……

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/e47b7273-ac69-9e95-baad-8ca07a3356ec.png)

入力したURLが開きます

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/82f1bd2c-2777-fb31-1e28-c92aceaf7a86.png)

適当に入力していきましょう

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/587fbd30-37a6-91ac-e92f-fe9ca2007c6f.png)

入力が終わったら　、左下の`Stop Recording`を押します
![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/4bc55139-1e0b-40d7-ee54-2d71838de5e5.png)

操作が記録されていますね

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/dcf73db8-6815-3c9b-08b5-d2e8970b4de4.png)

そして右上の再生ボタンをクリックすると、記録したテストケースを再生してくれるのですが……

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/2eed56de-8777-0b21-7bfc-d02b1690111b.png)

なんと再生する項目の中に `All` があるではありませんか！これがTestCafeのすごいところで、インストールされているブラウザそれぞれで同時にテストを実行することができます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/112393/64e70357-39e7-2223-4ef5-dc346069dd13.png)

なお、残念ながら、現時点ではネイティブダイアログ記録が上手く行っていないようなので、例えば`alert()`などが自動記録できず、テストケースを再生した際にエラーになることがあるようです。TestCafe自体はネイティブダイアログの操作に対応しているので、 http://devexpress.github.io/testcafe/documentation/test-api/handling-native-dialogs.html などを参考に自前で書き足す必要がありそうです。

## おわりに

今回はGUIツール部分の説明でしたが、コアとなるTestCafe (https://github.com/DevExpress/testcafe) 自体、単独で利用しても非常に便利なツールです。特に、WebDriver非依存でクロスブラウザテストが出来るフレームワークは非常に珍しいので(Cypressも今後FireFox対応を進めるようですが）、Selenium以外のクロスブラウザテスト自動化の選択肢として今後も発展していってほしいですね。
TestCafe Studioの登場で、土台となるテストシナリオをGUIツールでササッと作成し、必要に応じてPageObject Patternを用いた形にリファクタリングするなどの方法でE2Eテスト開発を効率化できそうです。
rails sでのサーバー起動時にstack level too deepエラーとなる時の対処法

また例によって自分なりの解決法を記述します。

# 対象
- 主に古いソースを引き継いで、それを実行しようとしている人向け
- 古いRubyでもとりあえず問題ない人向け

# 手順
## Rubyを複数バージョンインストール

筆者の場合は既にインストールされている2.5.1に加え、2.2.6をインストールしました。

```console:console
[vagrant@localhost ~]$ rbenv install 2.2.6
Downloading ruby-2.2.6.tar.bz2...
-> https://cache.ruby-lang.org/pub/ruby/2.2/ruby-2.2.6.tar.bz2
Installing ruby-2.2.6...

WARNING: ruby-2.2.6 is past its end of life and is now unsupported.
It no longer receives bug fixes or critical security updates.

Installed ruby-2.2.6 to /home/vagrant/.rbenv/versions/2.2.6

[vagrant@localhost ~]$ rbenv global 2.2.6
[vagrant@localhost ~]$ rbenv versions
* 2.2.6 (set by /home/vagrant/.rbenv/version)
  2.5.1

```

## .ruby_version修正

```console:console
2.2.6
```

これで動くかと思いきや「The `rails' command exists in these Ruby versions:」などと言われるので諸々インストールします。

## Ruby2.2.6用に諸々インストール
bundler

```console:console
[vagrant@localhost ~]$ rbenv exec gem install bundler
Fetching: bundler-1.16.3.gem (100%)
Successfully installed bundler-1.16.3
Parsing documentation for bundler-1.16.3
Installing ri documentation for bundler-1.16.3
Done installing documentation for bundler after 4 seconds
1 gem installed
```

rails

```console:console
[vagrant@localhost ~]$ gem install rails
（中略）
Done installing documentation for concurrent-ruby, thread_safe, （中略） rails after 60 seconds
38 gems installed
```

プロジェクトのパッケージも再インストール

```console:console
[vagrant@localhost ~]$ bundle install
（中略）
  ================================================================================

  Rails 2.x
  ---------
  If you are using Seedbank with Rails 2.x you will need to place the following at
  the end of your Rakefile so Rubygems can load the seedbank tasks;

    require 'seedbank'
    Seedbank.load_tasks if defined?(Seedbank)

  Rails 3.x and 4.x
  ---------
  Your work here is done!

  ================================================================================
```

## マイグレーション
必要あれば

```console:console
$ rake db:migrate
```

# 参考
https://qiita.com/toshiro3/items/6f2ee61f552fc4885317
https://qiita.com/ironsand/items/8617ba82767884528246
http://shiro-16.hatenablog.com/entry/2014/07/01/003435
Slimerjs で 画面キャプチャ

Slimerjs を使うには、Firefox 59 が必要です。

1) Firefox 59 のダウンロード

```bash
wget https://ftp.mozilla.org/pub/firefox/releases/59.0/linux-x86_64/ja/firefox-59.0.tar.bz2
```

2) Slimerjs のダウンロード

```bash
wget https://download.slimerjs.org/releases/1.0.0/slimerjs-1.0.0.tar.bz2
```

3) Slimerjs のサンプルプログラム

```js:display_page.js
// ---------------------------------------------------------------
//
//	display_page.js
//
//					Aug/14/2018
// ---------------------------------------------------------------
var page = require("webpage").create()
const url_target="https://ekzemplaro.org/storytelling"
page.open(url_target,function (status){
	page.viewportSize = { width:1024, height:768 }
	page.render('screenshot.png')
})
// ---------------------------------------------------------------
```

4) 実行方法

```bash
export SLIMERJSLAUNCHER=/home/uchida/cdrom/firefox/firefox/firefox
#
/home/uchida/cdrom/slimerjs/slimerjs-1.0.0/slimerjs display_page.js
```

5) 実行結果の次の２つの画面が現れます。