OmniAICreator/Qiita-1.07M huggingface dataset:
阿部寛のサイトをモダンなhtmlにする

最近話題になってる[阿部寛のサイト](http://abehiroshi.la.coocan.jp/)ですが、htmlも古いスタイルで、見てると手を入れたくなります。ここでは、トップページの脱フレーム化と、脱テーブルレイアウトをやってみたいと思います。

## 脱フレーム化
フレームを使ってるため、最初にリクエストするhtmlを読み込んでから、メニューとコンテンツのhtmlをリクエストしているため、これらのhtmlを一つにまとめるだけでも大幅な速度の改善が見込まれます。

### 元のhtml

```html:index.htm
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">
<title>阿部寛のホームページ</title>
</head>
<frameset cols=18,82>
  <frame src=menu.htm marginheight=0 marginwidth=0 scrolling=auto name=left>
  <frame src=top.htm marginheight=0 marginwidth=0 scrolling=auto name=right>
</frameset><noframes></noframes>
```
```html:menu.htm
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">
<TITLE>メニュー</TITLE>
</HEAD>
<BODY bgcolor="#F0F0FF">
<!--長いので省略-->
</HTML>
```
```html:top.htm
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta name="GENERATOR" content="JustSystems Homepage Builder Version 16.0.0.2 Trial for Windows">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>阿部 寛のホームページ</title>

<style type="text/css">
<!--
.style1 {color: #FF0000}
-->
</style>
</head>


<body background="image/abehiroshi.jpg">
<br>
<h1 align="center">阿部 寛のホームページ</h1>
<!--長いので省略-->
</body>
</html>
```

### 脱フレーム化して一つにまとめたhtml

```html:index.htm
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">
<title>阿部寛のホームページ</title>
<style>
html, body {
  margin: 0;
  height: 100%;
}
.frame {
  display: flex;
  height: 100%;
}
.frame-left {
  width: 18%;
  height: 100%;
  overflow: auto;
  background: #F0F0FF;
}
.frame-right {
  width: 82%;
  height: 100%;
  overflow: auto;
  background: url(image/abehiroshi.jpg);
}

.style1 {color: #FF0000}
</style>
</head>
<body>
<div class="frame">
  <div class="frame-left">
    <!--menu.htmのbody内のhtmlが入ります-->
  </div>
  <div class="frame-right">
    <!--top.htmのbody内のhtmlが入ります-->
  </div>
</div>
</body>
</html>
```

### 結果
合計のファイルサイズ自体はほとんど変化ありませんが、htmlの読み込み完了が250ms → 120msになりました。体感的にはフレームの方は最初に一瞬真っ白になってから描画されるのに対し、一つにまとめた方は最初から描画されてる感じになります。

当たり前っちゃ当たり前ですが、この点は大事なことで、最初のリクエストで描画する素材が揃ってると圧倒的に早く感じます。爆速と話題の[dev.to](https://dev.to/)もcssを別ファイルにしないでhtmlファイルに埋め込み、コンテンツのhtmlも書き出してることが、体感速度をぐっと上げてると思います。

## 脱テーブルレイアウト化
テーブルレイアウトをやめたり、冗長なhtmlを整理したら、ファイルサイズがだいたい7KB → 4KBになりましたが、別にこのくらいでは速度的には特に顕著な差は見られませんし、スマホ最適化とかもしようとしたけど、ここらへんで僕のモチベーションも尽きました。
go get時の ... の意味

自分用のメモに。詳しい人補足などあればご教授くださるとありがたいです。。。  

## 意味
サブパッケージの依存パッケージもとってきてくれるみたいです。

## 詳細を知りたい時は...
- `go help packages`

## reference
- [What does the `…` mean in go get](https://stackoverflow.com/questions/31938346/what-does-the-mean-in-go-get)
MacOSXを使ってmicroSDにRaspbian(Stretch Lite)を書き込む

[MacOSXを使ってmicroSDにRaspbianを書き込む](https://qiita.com/or2/items/2e90056cdd13edfa8a4a)の焼き直し

## Raspbian Stretch Liteをダウンロードする
https://downloads.raspberrypi.org/raspbian_lite_latest
ダウンロードしたzipアーカイブは[The Unarchiver](https://theunarchiver.com/)を利用して解凍してimgファイルを取り出しておく

## Raspbianを書き込む先になるmicroSDを特定する
今回は転がっていたmicroSDを再利用することにした

```:MacOSX
$ diskutil list
/dev/disk4 (external, physical):
   #:                       TYPE NAME                    SIZE       IDENTIFIER
   0:     FDisk_partition_scheme                        *15.6 GB    disk4
   1:             Windows_FAT_32 boot                    43.8 MB    disk4s1
   2:                      Linux                         15.5 GB    disk4s2
```
※今回は/dev/disk4でmicroSDが認識されていた

## RaspbianのOSイメージを書き込むためmicroSDをアンマウントする

```:MacOSX
$ sudo diskutil unmountDisk /dev/disk4`
Password:
Unmount of all volumes on disk4 was successful
```

## RaspbianのOSイメージをmicroSDに書き込む

```:MacOSX
$ sudo dd bs=1m if=~/Downloads/2017-09-07-raspbian-stretch-lite.img of=/dev/disk4
1768+1 records in
1768+1 records out
1854590976 bytes transferred in 1144.485245 secs (1620459 bytes/sec)
```

## ssh接続を有効にしておく
bootとしてマウントされているWindows_FAT_32パーティションにsshという空ファイルを作成しておく

```:MacOSX
$ diskutil list
/dev/disk4 (external, physical):
   #:                       TYPE NAME                    SIZE       IDENTIFIER
   0:     FDisk_partition_scheme                        *15.6 GB    disk4
   1:             Windows_FAT_32 boot                    43.8 MB    disk4s1
   2:                      Linux                         1.8 GB     disk4s2

$ touch /Volumes/boot/ssh
```

## 取り外したmicroSDをRaspberry Piに取り付けて起動する

```:MacOSX
$ sudo diskutil unmountDisk /dev/disk4
Password:
Unmount of all volumes on disk4 was successful
```

## RaspberryPiに接続する

```:MacOSX
$ ssh pi@raspberrypi.local
```
初期パスワード：raspberry

## RaspberryPiに接続できたらとりあえずやっておくこと
### パスワードの変更
```:raspbian
$ passwd
Changing password for pi.
(current) UNIX password:
Enter new UNIX password:
Retype new UNIX password:
passwd: password updated successfully
```
### 最新にアップデート
```:raspbian
$ sudo apt-get update
$ sudo apt-get -y upgrade
$ sudo apt-get dist-upgrade
$ sudo rpi-update
```

### GPUメモリ割り当て変更
```:raspbian
$ sudo raspi-config nonint do_memory_split 16
```

### TimeZoneの設定
```:raspbian
$ sudo timedatectl set-timezone Asia/Tokyo
$ sudo dpkg-reconfigure -f noninteractive tzdata 
```

### Localeを追加・変更
```:raspbian
$ sudo perl -pe 's/^# (ja_JP.UTF-8 UTF-8)/$1/g' -i /etc/locale.gen
$ sudo locale-gen
$ sudo update-locale LANG=ja_JP.UTF-8
$ sudo dpkg-reconfigure -f noninteractive locales
```

### swapを使わない
```:raspbian
$ sudo systemctl disable dphys-swapfile
$ sudo dphys-swapfile swapoff
$ sudo apt-get -y remove dphys-swapfile
```

### Host名を変更する
```:raspbian
$ sudo raspi-config nonint do_hostname raspi2
```

### IPv6を無効化
```:raspbian
$ sudo bash -c "echo net.ipv6.conf.all.disable_ipv6 = 1 >> /etc/sysctl.conf"
```
JQuery JavaScript チェックボックスでチェックが入っているものだけ処理

チェックされているもののみ処理がしたいときって結構あるやん？

どうやってeach回せばいいか、どうやってチェック済みのものだけ処理するかたまにわからんなるよね。
という話

```js
// こうやるか
$('[name="cbox"]:checked').each(function(){
  alert($(this).val() + '<-チェック入ってる');
});

// はたまたこうやるか
$('[name="cbox"]').each(function(){
  if($(this).is(':checked')) {
    alert($(this).val() + '<-チェック入ってる');
  }
});
```


``$('[name="cbox"]:unchecked')``みたいなのないんですかね？
AWS上のUbuntu 16.04 LTSにAWS CLIをインストールし、configureする

AWS上のUbuntu 16.04 LTSにAWS CLIをインストールし、configureしました。
前提条件は、
・pipがインストールされていること
 https://qiita.com/TKYK38/items/2a73696a9d8f1f856f68
です。


#### rootになる
※事前に  $ sudo passwd root  でrootに入れるようにしておく。

```shell-session
$ su
Password:
#
```

#### awscliのインストール
```shell-session
# pip install awscli
...(log)...
# aws --version
aws-cli/1.11.189 Python/3.6.3 Linux/4.4.0-1039-aws botocore/1.7.47
# exit
```

#### aws configure
```shell-session
$ aws configure
AWS Access Key ID [None]: XXXXXXXXXX
AWS Secret Access Key [None]: YYYYYYYYYY
Default region name [None]: ap-northeast-1
Default output format [None]: json
```
ExifTool メモ

自分用メモ。
バックアップを取って作業しましょう。

## インストール

macOSの場合

```bash
brew install exiftool
```

## 撮影日時を指定した日時へ変更

`-overwrite_original_in_place` オプションにより元ファイルを直接変更します。 
(デフォルト => 自動的にバックアップファイルを作成)

```bash
exiftool -overwrite_original_in_place \
  -d "%Y/%m/%d %H:%M:%S" -datetimeoriginal="2014/03/22 17:40:00" *
```

## 生成日時とファイル変更日時を撮影日時へ変更

```bash
exiftool -overwrite_original_in_place -d "%Y-%m-%d %H:%M:%S" \
  "-filemodifydate<datetimeoriginal" "-createdate<datetimeoriginal" *
```

## 日時系項目 (`DateTimeOriginal`, `CreateDate`, `ModifyDate`) を親ディレクトリ名 (フォーマット: `Y-m-d`) から取得して、無理やり変更

変更後の時間は `00:00:00` 固定

```bash
exiftool -d "%Y-%m-%d %H:%M:%S" -overwrite_original_in_place \
  '-alldates<${directory;s/.*\/(.*)/$1/} 00:00:00' *
```

[Advanced formatting feature](https://sno.phy.queensu.ca/~phil/exiftool/exiftool_pod.html#Advanced-formatting-feature)

## Exifに記載されている日付通りのディレクトリ (例: 2017/2017-11-19) へ移動

[ExifTool evaluates the command\-line arguments left to right, and latter assignments to the same tag override earlier ones](https://sno.phy.queensu.ca/~phil/exiftool/filename.html)

```bash
exiftool -d %Y/%Y-%m-%d \
  "-directory<filemodifydate" "-directory<createdate" "-directory<datetimeoriginal" *
```

## ファイル名、ディレクトリ名、日付系項目をCSV出力

```bash
exiftool -csv -d '%Y-%m-%d %H:%M:%S' \
  -Filename -Directory -DateTimeOriginal -CreateDate \
  -ModifyDate -FileModifyDate * | tee /tmp/exiftool.csv
```
【C#】縦持ちのデータを集計して横持ちにする【LINQ】

# SQLと同じことができるのなら、LINQでデータ分析だってできるはず！

いわゆるピボットテーブルですが、集計後の形が思ったようにならない！
もっとLinqで完結してコントロールできるのでは？
以下、LinqPadで検証します。

データ構造

```cs
public class Employee
{
    public int Group { set; get; }
    public string Name { set; get; }
}
```

仮データ

```cs
var employees = new List<Employee>()
{
    new Employee {Group = 1, Name = "A" },
    new Employee {Group = 2, Name = "B" },
    new Employee {Group = 1, Name = "C" },
    new Employee {Group = 3, Name = "D" },
};
```

# とりあえず Linq Pivot で検索して出てくる形

```cs
var q = employees
		.GroupBy(c => c.Group)
		.Select(g => new {
			Group = g.Key,
			i1 = g.Where(c => c.Group == 1).Count(),
			i2 = g.Where(c => c.Group == 2).Count(),
			i3 = g.Where(c => c.Group == 3).Count()
    });
    
q.Dump();
```

結果

![img1.PNG](https://qiita-image-store.s3.amazonaws.com/0/39673/766666ae-694a-1702-dcf3-dfbf46377840.png)

横持ちに。あとはMAXで一通りにすればいい。。。が、ぐぐっても出てこないので、試行錯誤しました。

# GroupByするキーがない
ないなら追加すれば

```cs
var q = employees
		.GroupBy(c => c.Group)
		.Select(g => new {
			//Group = g.Key,
			i0 = 1,
			i1 = g.Where(c => c.Group == 1).Count(),
			i2 = g.Where(c => c.Group == 2).Count(),
			i3 = g.Where(c => c.Group == 3).Count()
		})
		.GroupBy(t => t.i0)
		.Select(s => new {
			m1 = s.Max(t => t.i1),
			m2 = s.Max(t => t.i2),
			m3 = s.Max(t => t.i3)
		});

q.Dump();
```
結果

![img2.PNG](https://qiita-image-store.s3.amazonaws.com/0/39673/97b3576b-10d0-2578-8c2b-0e7ab8bac5db.png)


ダミーのキー（i0 = 1）をつくり、このキーで集計（GroupBy(t => t.i0)）することで一通りに。

ちなみにデータが0件だったらどうなるのかを調べると

```cs
var employees = new List<Employee>()
{
    new Employee {Group = 1, Name = "A" },
    new Employee {Group = 1, Name = "B" },
    new Employee {Group = 1, Name = "C" },
    new Employee {Group = 3, Name = "D" },
};
```
(Group = 2 が0件)

結果

![img3.PNG](https://qiita-image-store.s3.amazonaws.com/0/39673/a1152488-f4a3-0637-2a53-9949b60bfb22.png)


０件として列が入ります。
Where句を差しておけば、出力の形式が崩れないことがわかりました。

# 以下全文

```cs
void Main()
{
    var employees = new List<Employee>()
    {
        new Employee {Group = 1, Name = "A" },
        new Employee {Group = 2, Name = "B" },
		new Employee {Group = 1, Name = "C" },
        new Employee {Group = 3, Name = "D" },
    };
	
	var q = employees
			.GroupBy(c => c.Group)
			.Select(g => new {
				//Group = g.Key,
				i0 = 1,
				i1 = g.Where(c => c.Group == 1).Count(),
				i2 = g.Where(c => c.Group == 2).Count(),
				i3 = g.Where(c => c.Group == 3).Count()
			})
			.GroupBy(t => t.i0)
			.Select(s => new {
				m1 = s.Max(t => t.i1),
				m2 = s.Max(t => t.i2),
				m3 = s.Max(t => t.i3)
			});

	q.Dump();
}

// Define other methods and classes here
public class Employee
{
    public int Group { set; get; }
    public string Name { set; get; }
}
```
AWS上のUbuntu 16.04 LTSにpipやPython3.6をインストール

AWS上のUbuntu 16.04 LTSにpip、Python3.6をインストールしました。

#### rootになる（sudo実行でもよいけど）
※事前に  $ sudo passwd root  でrootに入れるようにしておく。

```shell-session
$ su
Password:
#
```

#### pip3のインストール
```shell-session
# pip3 -V
The program 'pip3' is currently not installed. You can install it by typing:
apt install python3-pip
# apt install python3-pip
Reading package lists... Done
Building dependency tree
Reading state information... Done
E: Unable to locate package python3-pip
# apt update
...(log)...
# apt install python3-pip
...(log)...
Do you want to continue? [Y/n] Y
...(log)...
# pip3 -V
pip 8.1.1 from /usr/lib/python3/dist-packages (python 3.5)
```

#### pip2のインストール
```shell-session
# pip2 -V
The program 'pip2' is currently not installed. You can install it by typing:
apt install python-pip
# apt install python-pip
...(log)...
# pip2 -V
pip 8.1.1 from /usr/lib/python2.7/dist-packages (python 2.7)
```

#### python3.6のインストール（pipとpython3.6-devも）
```shell-session
# add-apt-repository ppa:jonathonf/python-3.6
...(log)...
# apt-get update
...(log)...
# apt-get install python3.6 python3.6-dev
...(log)...
# wget https://bootstrap.pypa.io/get-pip.py
...(log)...
# pip3 -V
pip 8.1.1 from /usr/lib/python3/dist-packages (python 3.5)
# python3.6 get-pip.py
Collecting pip
  Downloading pip-9.0.1-py2.py3-none-any.whl (1.3MB)
    100% |????????????????????????????????| 1.3MB 1.2MB/s
Installing collected packages: pip
  Found existing installation: pip 8.1.1
    Uninstalling pip-8.1.1:
      Successfully uninstalled pip-8.1.1
Successfully installed pip-9.0.1
# pip3 -V
bash: /usr/bin/pip3: No such file or directory
# pip -V
bash: /usr/bin/pip: No such file or directory
# /usr/local/bin/pip -V
pip 9.0.1 from /usr/local/lib/python3.6/dist-packages (python 3.6)
```
※上記の通り、get-pip.py を実行すると、以前インストールしたpipはアンインストールされます。

#### 参考URL
https://www.python.jp/install/ubuntu/index.html
WordPress 便利plungin一覧

オリジナルテーマを初期構築するのに役立つと思われる便利プラグインを紹介していきます。

##有料版プラグイン
###■[ACF Pro](https://www.advancedcustomfields.com/pro/)
オリジナルのカスタムフィールドを設定できます。
![Screenshot(4).png](https://qiita-image-store.s3.amazonaws.com/0/142782/51c67410-a103-ba9d-4ac6-8667a2cb7af7.png)

###■[Admin Menu Editor Pro](https://adminmenueditor.com/)
【管理者】【投稿者】【購読者】など権限別に管理画面内のメニューを変更することが出来る
![Screenshot(4).png](https://qiita-image-store.s3.amazonaws.com/0/142782/a9ff955e-67c7-6833-b02f-e8fdc9bcc716.png)


##無料版プラグイン
###■[Regenerate Thumbnails](https://ja.wordpress.org/plugins/regenerate-thumbnails/)
メディア内にすでに登録されていた画像サイズをリサイズするためのプラグイン
![banner-772x250.jpg](https://qiita-image-store.s3.amazonaws.com/0/142782/3f32b188-e595-c8f0-7e8f-4e24b416ff3b.jpeg)


###■[Breadcrumb NavXT](https://ja.wordpress.org/plugins/breadcrumb-navxt/)
パンくず作成
![banner-772x250.jpg](https://qiita-image-store.s3.amazonaws.com/0/142782/1b050ae2-dd75-52d1-15d2-e915b66c0866.jpeg)

###■[Show Current Template](https://ja.wordpress.org/plugins/show-current-template/)
現在の使用テーマファイル名を明記してくれる

###■[Yoast SEO](https://ja.wordpress.org/plugins/wordpress-seo/)
title、ディスクリプションなどを個別ページで更新できるようにする。
![banner-772x250.png](https://qiita-image-store.s3.amazonaws.com/0/142782/dba7fe82-0386-8b33-0cde-1661b4bcad1b.png)

###■[Revision Control](https://ja.wordpress.org/plugins/revision-control/)　
各記事のリビジョン数に制限をつけるプラグイン。リビジョン数がたまると負荷がかかりますので是非設定しておきたいところ

###■[EWWW Image Optimizer](https://ja.wordpress.org/plugins/ewww-image-optimizer/)
メディアにアップロードする際に、画像の容量を削減するプラグインです。
![banner-772x250.jpg](https://qiita-image-store.s3.amazonaws.com/0/142782/1ff471c0-81da-74e6-3636-2cca07d93a7b.jpeg)

###■[WP-PageNavi](https://ja.wordpress.org/plugins/wp-pagenavi/)
投稿（またはカスタム投稿）のアーカイブページでページングを設定してくれるプラグイン
[macOS][iOS]iCloudドキュメント・ストレージに書き込む

<p>CloudKitは日記アプリのモデルを格納する場所には向いていないということで、iCloudドキュメントを試してみた。</p>

<p>iCloudコンテナ・ディレクトリにファイルを格納するのだが、このコンテナ、CloudKitで出てきたコンテナと同じ識別子で指す物のようだ。ただ、識別子は同じでも、領域は異なるのだと思う。</p>

<p>以下がファイルに書き込むコードだ。</p>

<pre><code>let containerURL = FileManager.default.url(forUbiquityContainerIdentifier: "iCloud.com.example.KeepADiary")
let documentsURL = containerURL?.appendingPathComponent("Documents")
let fileURL = documentsURL?.appendingPathComponent("my.diary")
 
/* write */
let todayText = Date().description
do {
    try todayText.write(to: fileURL!, atomically: true, encoding: .utf8)
}
catch {
    print("write error")
}
</code></pre>

<p>このコードは、macOSとiOSで動作するが、macOSで実行した際のfileURLの内容は以下のとおり。</p>

<pre><code>file:///Users/yukio/Library/Mobile%20Documents/iCloud~com~example~KeepADiary/Documents/my.diary
</code></pre>

<p>このディレクトリでファイルを確認すると以下のとおり。</p>

<pre><code>$ pwd
/Users/yukio/Library/Mobile Documents/iCloud~com~example~KeepADiary/Documents
$ ls
my 3.diary	my 4.diary	my 5.diary	my 6.diary	my 7.diary
</code></pre>

<p>ファイル書き込み時に、このディレクトリのファイルを確認したところ、my.diary という名前のファイルが作成されるが、しばらくすると、my 8.diary という風にファイル名が変更される。何故だ！ファイルの上書き防止機能？版管理機能？</p>

ソースコード
GitHubからどうぞ。<br />
<a href="https://github.com/murakami/KeepADiary">https://github.com/murakami/KeepADiary</a> - GitHub<br />

関連情報
<a href="https://www.slideshare.net/yukiomurakami/ss-82298685">日記アプリのデータ管理</a><br />
<a href="https://cocoa-kanto.connpass.com">Cocoa勉強会 BUKURO.swift (connpass)</a><br />
<a href="https://atnd.org/groups/cocoa-study">Cocoa勉強会 BUKURO.swift (ATND)</a><br />
<a href="http://cocoa-study.peatix.com">Cocoa勉強会 BUKURO.swift (Peatix)</a><br />

【Cocoa練習帳】
<a href="http://www.bitz.co.jp/weblog/">http://www.bitz.co.jp/weblog/</a><br />
<a href="http://ameblo.jp/bitz/">http://ameblo.jp/bitz/</a>（ミラー・サイト）<br />
<a href="https://t.co/6P3h2jtbRk>note</a><br />
<a href="https://qiita.com/m_yukio>Qiita</a><br />
[Blender] BGL(OpenGL)でオフスクリーンで描いた図形を画像として出力する

`gpu` モジュールの `gpu.offscreen` を通すことでオフスクリーンでのBGL(OpenGL)での描画結果を利用できるようです。[^1]
以下のコードではオフスクリーンでBGLを走らせた後、それの結果をBlenderの画像スロットに保存しています：

```py
import bpy
import bgl
import gpu

def main():
    width = 256
    height = 256

    gos = gpu.offscreen.new(width,height)
    gos.bind(True)
    try:
        bgl.glMatrixMode(bgl.GL_PROJECTION)
        bgl.glLoadIdentity()

        bgl.glBegin(bgl.GL_QUADS)
        bgl.glColor4f( 0,0,1,1 )
        for p in [(0,0), (.5,0), (.5,.5), (0,.5)]:
            bgl.glVertex2f(*p)
        bgl.glEnd()
        
        bgl.glBegin(bgl.GL_QUADS)
        bgl.glColor4f( 1,0,0,1 )
        for p in [(0,0), (-1,0), (-1,-1), (0,-1)]:
            bgl.glVertex2f(*p)
        bgl.glEnd()

        buffer = bgl.Buffer(bgl.GL_FLOAT, width * height * 4)
        x,y = 0,0
        bgl.glReadPixels(x, y, width, height , bgl.GL_RGBA, bgl.GL_FLOAT, buffer)

        out = prepare_blimage(width, height)
        out.pixels = buffer[:]
    finally:
        gos.unbind(True)

def prepare_blimage(width, height, name='output'):
    if name in bpy.data.images:
        img = bpy.data.images[name]
        if img.size[:] != (width,height):
            img.scale(width,height)
    else:
        img = bpy.data.images.new(name, width, height)
    return img


main()

```

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/152179/15b22b21-5e4d-c08e-3039-9dfaf5b9c391.jpeg)

上記のコード中ではBGL上での`-1～1`の範囲が画像での`0～width,height`の範囲に対応しています。

また参考先のページ[^1]では `.draw_view3d()` メソッドを利用してビューポートの内容をオフスクリーンレンダリングする例も紹介されています。

---

## 参考

[^1]: GPU Off-Screen Buffer (gpu.offscreen) — Blender 2.79.0 855d2955c49 - API documentation
  https://docs.blender.org/api/2.79/gpu.offscreen.html
【小ネタ】気軽にChatWorkのCEOとチャットする方法

## 方法
ChatWorkの[メッセージ記法](http://developer.chatwork.com/ja/messagenotation.html)を勉強しているときに不意に打ってみて発見した。
方法は以下を入力するだけ。ChatWorkの記法で`[To:{account_id}]`で相手を指名してメッセージを送ることができる。

```
[To:1]
```
マイチャットで上記を入力したらわかるが、誰かわからないが顔写真が出て来る。
この方のプロフィールをのぞいて見ると、、、
<img width="891" alt="スクリーンショット 2017-11-19 18.48.31.png" src="https://qiita-image-store.s3.amazonaws.com/0/142791/667cb401-429a-ce6f-5907-0c29a73a9539.png">

ChatWorkCEOの山本さんでした。。これはチャットしてもいいのだろうか。。

## 参考
https://go.chatwork.com/ja/
webpackでのTypeScriptビルドが遅い件　リンク集

webpackでTypeScriptのビルドが遅い件　リンク集（個人的メモ）

- 対策
    - https://hackernoon.com/optimising-your-application-bundle-size-with-webpack-e85b00bab579
        - bundle analyzerというツールで視覚的にbundle内の状況を調べ対策
    - https://qiita.com/pegass85/items/ebd67fe32ed88642bf86
        - `cache:true`に設定
- 問題報告
    - https://github.com/Microsoft/TypeScript/issues/10018
【ansible】 サーバの初期設定を自動化する


## はじめに
新しくサーバを建てたとき、毎回行っている作業をansibleを使って自動化していきます。
今回行う設定は[【CentOS7】サーバの初期設定](https://qiita.com/syaato/items/3c98f6ce4c412689e687)と同じ内容になっています。

### 実行環境
- CentOS7

## ansibleのインストール
```
# yum install epel-release
# yum install ansible
```


## playbookを作成

```file:init.yml
- hosts: localhost
  vars:
    user_name: user  # 作成するユーザ名を指定する
  tasks:
    - name: add user.
      user: 
        name: "{{user_name}}"
        createhome: yes

    - name: make .ssh directory
      file:
        path: /home/{{user_name}}/.ssh
        state: directory
        owner: "{{user_name}}"
        group: "{{user_name}}"
        mode:  0700

    - name: copy ssh key
      copy:
        src: /root/.ssh/authorized_keys
        dest: /home/{{user_name}}/.ssh/authorized_keys
        owner: "{{user_name}}"
        group: "{{user_name}}"
        mode: 0600

    - name: add sudoers.
      lineinfile:
        path: /etc/sudoers
        state: present
        regexp: "^%{{user_name}} ALL="
        line: "%{{user_name}} ALL=(ALL) NOPASSWD: ALL"
        validate: '/usr/sbin/visudo -cf %s'

    - name: comment out PermitRootLogin yes
      lineinfile:
        path: /etc/ssh/sshd_config
        state: present
        regexp: "^PermitRootLogin yes"
        regexp: "^#PermitRootLogin yes"
        line: "#PermitRootLogin yes"

    - name: add PermitRootLogin no
      lineinfile:
        path: /etc/ssh/sshd_config
        state: present
        regexp: "^PermitRootLogin no"
        insertafter: '^#PermitRootLogin yes'
        line: "PermitRootLogin no"

    - name: restart service sshd
      systemd:
        name: sshd
        state: restarted
```

## playbookの実行
直接playbookにユーザ名を指定するか、
`--extra-vars`オプションを使ってユーザ名の指定ができる

```
# ansible-playbook init-server.yml --extra-vars "user_name=[username]"
```
composerでgitの公開レポジトリからcloneする際のエラーの回避方法

composerでgitの公開レポジトリから下記のようにしてパッケージをインストールしようとしたら

```json:composer.json
...
    "repositories": [
        {
            "url": "git@github.com:pikanji/agent-plugin.git",
            "type": "git"
        }
    ]
}
```

認証がどうのでエラーになった。（Docker container内で実行したんで、Docker特有の問題かも。）

```
Cloning failed using an ssh key for authentication, enter your GitHub credentials to access private repos
Head to https://github.com/settings/tokens/new?scopes=repo&description=Composer+on+9a20d36bf162+2017-11-19+0747
to retrieve a token. It will be stored in "/root/.composer/auth.json" for future use by Composer.
Token (hidden): 
No token given, aborting.
You can also add it manually later by using "composer config --global --auth github-oauth.github.com <token>"

  [RuntimeException]                                                                                                                                         
  Failed to execute git clone --mirror 'git@github.com:pikanji/agent-plugin.git' '/root/.composer/cache/vcs/git-github.com-pikanji-agent-plugin.git/' 
```

レポジトリ定義をhttpsに変更したら、あっさり解決した。

```json:composer.json
...
    "repositories": [
        {
            "url": "https://github.com/pikanji/agent-plugin.git",
            "type": "git"
        }
    ]
}
```
Universal Linksのために置いたapple-app-site-associationのMIME typeを.htaccessで指定する方法

# 概要
タイトルの通り。
拡張子がないためContent-Typeが自動で返らない時に以下を`.htaccess`に追加することで問題なく動いたというメモ

# .htaccess

```
<Files apple-app-site-association>
    Header set Content-Type "application/json"
</Files>
```
HomebrewでdoctorしたらWarning: You have unlinked kegs in your Cellarとなった時の対応方法

**環境**
OS : macOS High Sierra
Homebrew : 1.3.7

### 事象 : `brew doctor`したら`Warning: You have unlinked kegs in your Cellar`となった
```shell-session:事象
$ brew doctor
Please note that these warnings are just used to help the Homebrew maintainers
with debugging if you file an issue. If everything you use Homebrew for is
working fine: please don't worry and just ignore them. Thanks!

Warning: You have unlinked kegs in your Cellar
Leaving kegs unlinked can lead to build-trouble and cause brews that depend on
those kegs to fail to run properly once built. Run `brew link` on these:
  php56
  ruby
```

### 原因 : linkできてないから

### 対応方法 : いらないパッケージの場合
```bash:いらないパッケージ
# 一応unlinkしておく
$ brew unlink php56
Unlinking /usr/local/Cellar/php56/5.6.29_5... 0 symlinks removed

# ディレクトリ削除
$ rm -drf /usr/local/Cellar/php56/

# デッドリンクになっているものを削除 > (追記)「brew prune」じゃなくて「brew cleanup」になりました。
$ brew prune

# 今一度doctorするとphp56が消える
$ brew doctor
Please note that these warnings are just used to help the Homebrew maintainers
with debugging if you file an issue. If everything you use Homebrew for is
working fine: please don't worry and just ignore them. Thanks!

Warning: You have unlinked kegs in your Cellar
Leaving kegs unlinked can lead to build-trouble and cause brews that depend on
those kegs to fail to run properly once built. Run `brew link` on these:
  ruby
```

- 参考 : [Error: Unknown command: prune - Qiita](https://qiita.com/ponsuke0531/items/7d175bad2c960618fc6c)

### 対応方法 : いるパッケージの場合
```bash:いるパッケージ
# ちゃんとlinkする
$ brew link ruby
Linking /usr/local/Cellar/ruby/2.4.2_1... 3003 symlinks created

# 今一度doctorするとるrubyが消える
$ brew doctor
Your system is ready to brew.
```
OctoberCMSでブラウザ、OS、デバイスを判定する

PHPやTwigテンプレートでユーザのブラウザ、OS、デバイスを判定したい場合は、[pikanji/oc-agent-plugin](https://github.com/pikanji/oc-agent-plugin/blob/master/README_ja.md)で簡単にできる。

JSで判定したいならば[こちら](https://octobercms.com/plugin/alexlit-browserdetector)。今回はPHPとテンプレートからの利用の話。

PHPやTwigで使えるものは[こちら](https://github.com/scottbedard/oc-useragent-plugin)などあるが、Twigからの使い方がキレイでないのと引数が必要なメソッドが呼べないので、↓自分で作ってみた。

[OctoberCMS Agentプラグイン](https://octobercms.com/plugin/pikanji-agent)

## Viewテンプレートでの利用
OctoberCMSテーマのレイアウトにAgentコンポーネントを追加するだけで、下記のようにテンプレートから使えるようになる。詳しくは[README](https://github.com/pikanji/agent-plugin/blob/master/README_ja.md)で。

```
{% if Agent.isFireFox() %}
```

下記は引数が現在のUserAgentにマッチするか判定する。

```
{% if Agent.match('regexp'); %}
```

## PHPコードでの利用
PHPからはベースになっている[jenssegers/agent](https://github.com/jenssegers/agent)をファサードで使用できる。プラグインがファサードも登録しているので自分で登録する必要はない。

```php
use Agent;
...

if (Agent::isFireFox()) {
...
```

あるいは、直接 jenssegers/agent を使っても問題ない。

```php
use Jenssegers\Agent\Agent;
...

$agent = new Agent();
if ($agent->isFireFox()) {
...
```
ATOMからリモートサーバ接続を行う設定値

ATOMからリモートファイルを編集する際の設定値を残す。
## インストール
* settings->+install で「Remote-FTP」をインストール

## 設定ファイル作成
- Packages >  Remote-FTP > Create FTP config file

デフォルト設定

```
{
“protocol”: “ftp”,
“host”: “xxx.xxx.xxx.xx”,
“port”: 21,
“user”: “”,
“pass”: “”,
“promptForPass”: true,
“remote”: “/home/pi/SampleProject”,
“local”: “D:/SampleProject”,
“secure”: false,
“secureOptions”: null,
“connTimeout”: 10000,
“pasvTimeout”: 10000,
“keepalive”: 10000,
“watch”: [],
“watchTimeout”: 500
}
```

リモート接続の設定

```
{
    "protocol": "sftp",
    "host": "ec2-xx-xxx-xxx-xxx.us-west-2.compute.amazonaws.com",
    "port": 22,
    "user": "username",
    "pass": "",
    "promptForPass": "",
    "remote": "/",
    "local": "",
    "secure": false,
    "secureOptions": null,
    "connTimeout": 10000,
    "pasvTimeout": 10000,
    "keepalive": 10000,
    "watch": [],
    "watchTimeout": 500,
    "privatekey": "秘密鍵のパス"

}
```
JavaScriptでループの練習をする

#N予備校の章
第１章　08．JavaScriptのループ
## はじめに
●この単元をやりきるのに1時間かかった。
## 分かったこと、できるようになったこと
●JavaScriptでループ（繰り返し）を行うにはfor文を使う

```js
for(var i=0; i<100; i++){
  }
```
●例題の「1から10万まで数えてみよう」を答えを見ずに解けた。
## 感想
●練習問題の「Fizz Buzzを実装してみよう」が途中で煮詰まり、解けなかったのが悔しかった。

## 終わりに
●今回の単元で体験入学でできる範囲が全部おわった。復習を兼ねて、まとめを作ってみようと思う。
Djangoプロジェクトを作成する

pythonのWebフレームワークDjangoのプロジェクトを作成するまでの流れをメモとして残す。

# python仮想環境を作成する。
anacondaを使用し、仮想環境を作成する。

# 作成した仮想環境にDjango
```
pip install django==1.8
```
* conndaかpipどのような違いがあるのかいまいちわかっていない

## Djangoのバージョンを確認
python3を起動し、バージョンを確認する。

```
　>>> import django
　>>> print(django.get_version())
1.8
```
## Djangoプロジェクト作成
```
django-admin startproject myapp .
```

* tree で構成を確認する。
```
tree -L 1 .
```

├── manage.py
└── myapp　　

 manage.py:Django プロジェクトに対する様々な操作を行うための コマンドラインユーティリティ

* my app 以下の構成 

├── __init__.py　　
├── __pycache__　　
├── settings.py　　
├── urls.py　　
└── wsgi.py　　

settings.py:設定ファイル
urls.py    :URL　とファイルを紐付けている

#　DB設定
settings.pyを編集し、DB設定を行う
デフォルトではSQLiteを使用するように設定されている。

# DBマイグレーションを行う

```
python manage.py migrate
```

# サーバを起動する

```
python3 manage.py runserver
```
デフォルトでは8000番を使用する。
コマンドライン引数でIPとポートを指定することができる。

```
python manage.py runserver 0:8000
```

あくまで開発用のサーバのため、運用環境では使わないようにする。

* ブラウザから確認する。
サーバを起動したIPとポートを指定してURLへアクセスする。
ローカル環境なら、http://127.0.0.1:8000/
テストページが表示されたら成功。
ENSIMEがバージョン番号付きのscalaディレクトリを作るのを鎮めた話

# あらすじ
Scala開発をサポートしてくれるENSIMEをAtomに入れて作業しているのですが、Ensime:Startするたびにscalaディレクトリがある改装にscala-2.12といったようにバージョン番号がついたディレクトリを勝手に作成するので困っていました。
# 解決策
参考URLはこちら
[https://stackoverflow.com/questions/41070767/ensimeconfig-creates-directories-java-and-scala-2-11-which-i-dont-need](https://stackoverflow.com/questions/41070767/ensimeconfig-creates-directories-java-and-scala-2-11-which-i-dont-need)
## やること
ホームディレクトリ配下の.sbtの下のバージョン番号ディレクトリの下のglobal.sbtに以下のような内容を記述します。ファイルが存在しない場合は新規作成しましょう。

```scala:~/.sbt/0.13(バージョンにより異なる)/global.sbt
import org.ensime.EnsimeKeys._

ensimeIgnoreMissingDirectories := true
```

## すでに.ensimeファイルを作成している場合
自分のケースにおいてはEnsimeをリスタートしたりsbt ensimeConfigを実行しても設定は反映されませんでしたので、一度プロジェクトディレクトリの.ensimeを削除したのちsbt ensimeConfigを実行したところ、勝手にフォルダが作成されなくなりました。

# まとめ
Ensime:Startするたびにディレクトリ削除しなきゃいかんのか・・・とゲンナリしていたところ解決策が見つかってよかったです。
記載内容に誤りや気になる点などございましたら、ご指摘いただければ幸いです。
~~絶対~~パスの取得「__file__」

忘れないうちに備忘録。

環境は、
Windows10
bash on ubuntu on windows(gensim Doc2Vecで日本語処理したいため)
python3、


~~絶対~~パスの取得にあたり、```(__file__)```の部分で次のようなエラーがでてしまいます。

```py

NameError                                 Traceback (most recent call last)
<ipython-input-6-841aa8654707> in <module>()
     17 
---> 18 current_dir = path.dirname(__file__)
     19 

NameError: name '__file__' is not defined
```

どうして使えないのかは、よく理解できませんでした。
わかる方いらっしゃったら、教えていただければ、うれしいです。

とりあえず調べに調べ、つぎのような感じで~~絶対~~パスが取得できることはわかりました。


```py

import os
current_dir = os.path.dirname(os.path.abspath(sys.argv[0]))
print(current_dir)
```

（2017年11月20日追記開始）
7 of 9さんのアドバイスをもとに、試してみたところ、パスの取得に成功しました。
ありがとうございました。_(_ _)_

頂いたアドバイスの内容と、その他に試してみた結果出力を張り付けておきます。

```py

import os
current_dir1 = os.path.dirname(os.path.abspath("__file__"))

current_dir2 = os.path.dirname(os.path.abspath('__file__'))

current_dir3 = os.path.dirname(os.path.abspath(sys.argv[0]))

print(current_dir1)
print(current_dir2)
print(current_dir3)
```

```
/home/ユーザ名
/home/ユーザ名
/home/ユーザ名/.pyenv/versions/anaconda3-5.0.1/lib/python3.6/site-packages
```
（2017年11月20日追記終了）

（2020年10月16日追記開始）
例えば、書き換え例

●エラーが出てしまうパターン

```py
from os.path import dirname, join, normpath
BASE_DIR = normpath(dirname(__file__))
csv_path = join(BASE_DIR, './training_data.csv')
```
↓↓↓↓↓↓

●エラーがでないように書き換えると

```py
from pathlib import Path
BASE_DIR = normpath(Path().resolve())
csv_path = join(BASE_DIR, './training_data.csv')

```



（2020年10月16日追記終了）
final の意味

## クラス

クラス宣言に final がついてる場合、そのクラスは拡張できない。(サブクラスが作れない)

## メソッド

インスタンスメソッドの宣言に　final がついてる場合、サブクラスでオーバーライドできない。

## インスタンスフィールド

final なフィールドには一度しか代入できない。
final なインスタンスフィールドに代入するには下記2つの方法がある。

#### フィールドの宣言時に初期値を書く

```java
class Qiita {
    final int value = 123;
}
```

#### コンストラクタで代入する

```java
class Qiita {
    final int value;

    public Qiita() {
        this.value = 123;
    }
}
```

## クラスフィールド

final なクラスフィールドに代入するには下記2つの方法がある。

#### フィールドの宣言時に初期値を書く

```java
class Qiita {
    static final int value = 123;
}
```

#### static ブロックの中でフィールドに代入する

```java
class Qiita {
    static final int value;

    static {
        value = 123;
    }
}
```

## 変数

一度しか代入できない。

## 引数

一度も代入できない。(メソッドが呼び出されたときに既に値が代入されているから)
Moodleのユーザリストを発音順に表示されるように変更する

# Moodleの仕様
Moodle 2.6からユーザ情報にfirstnamephonetic、lastnamephoneticなどのフィールドが追加されたが、実際にはほとんど利用されていない。
そのため、実際にはユーザリスト表示時などではユーザ氏名のUnicodeコード順で表示されることが多い。これはアルファベットで氏名を表示する場合には問題ないが、漢字などを用いる場合には意味の無い並び順になってしまう。

# 修正方法
Moodleの下記の箇所でユーザリストの並び順を決定している。この場所でlastname, firstnameの代わりにlastnamephonetic, firstnamephoneticを利用するよう変更する。

## コースへのユーザ登録などの場合@Moodle3.2
lib/datalib.php の $sort を変更する。

```:lib/datalib.php
function users_order_by_sql($usertablealias = '', $search = null, context $context = null) {
    global $DB, $PAGE;

    if ($usertablealias) {
        $tableprefix = $usertablealias . '.';
    } else {
        $tableprefix = '';
    }

-   $sort = "{$tableprefix}lastname, {$tableprefix}firstname, {$tableprefix}id";
+   $sort = "{$tableprefix}lastnamephonetic, {$tableprefix}firstnamephonetic, {$tableprefix}id";
    $params = array();

    if (!$search) {
        return array($sort, $params);
    }

    if (!$context) {
        $context = $PAGE->context;
    }
```

## クイックメールブロックの場合@v1.5.5


```:blocks/quickmail/lib.php
    public static function get_non_suspended_users($context, $courseid){
        global $DB, $CFG;
        $everyone = self::get_all_users($context);
        
        $get_name_string = 'u.firstname, u.lastname';
        
        if($CFG->version >= 2013111800){
               $get_name_string = get_all_user_name_fields(true, 'u');
        }

        $sql = "SELECT u.id, " . $get_name_string . " , u.email, u.mailformat, u.suspended, u.maildisplay, ue.status  
            FROM {user} u  
                JOIN {user_enrolments} ue                 
                    ON u.id = ue.userid 
                JOIN {enrol} en
                    ON en.id = ue.enrolid                     
                WHERE en.courseid = ?
                    AND ue.status = ?
-               ORDER BY u.lastname, u.firstname"; 
+               ORDER BY u.lastnamephonetic, u.firstnamephonetic"; 

        //let's use a recordset in case the enrollment is huge
        $rs_valids = $DB->get_recordset_sql($sql, array($courseid, 0));

        //container for user_enrolments records
        $valids = array();

```

以降、必要に応じて追記
laravel-mixでvueにカスタムなPostCSS設定を使う


# TL;DR

`mix.js`などではなく、`mix.options.postCss`に設定する

## 設定例( postcss-custom-mediaの例 )

```js
mix.options({
  postCss: [
    require("postcss-custom-media")({
      "extensions": {
		  '--phone': '(min-width: 544px)',
		  '--tablet': '(min-width: 768px)',
		  '--desktop': '(min-width: 992px)',
      }
    })
  ]
})

```

# 詳しく
laravel-mixのvueにおいて、`postcss.config.js`を配置しても`.vue`のファイルには利用されずにうまく行かなった。

コードを深追いしてみると、`mix.options.postCss`を設定すれば効かせてくれるとわかった。
https://github.com/JeffreyWay/laravel-mix/blob/d0951a8f91feef2ff0d1dd4e8aba125c5aadf394/src/builder/webpack-rules.js#L252


Autoprefixerはこれと別途設定されている。
https://github.com/JeffreyWay/laravel-mix/blob/d0951a8f91feef2ff0d1dd4e8aba125c5aadf394/src/builder/webpack-rules.js#L160-L162
Autoprefixerはデフォルトでtrueになっている。
https://github.com/JeffreyWay/laravel-mix/blob/master/src/config.js#L108
Node.jsをWindows10にインストールする方法

#インストール動機

Amazon Echo dotの招待メールがいっこうに来ないのです。。
他の人はもう招待メールどころか現物を手にしている報告がわんさかきているのがすぐ見れるSNS社会辛い。

というわけで。

#Google Home miniに目が向いた
代わりに手元にあるGoogle Home miniをいじくってみよう。

→GoogleHomeスピーカーに外部からプッシュして自発的に話してもらいます - Qiita
https://qiita.com/azipinsyan/items/db4606aaa51426ac8dac
鯖立てて→ツールインスコ→コマンドうつ→動く

ということらしい。

<blockquote class="twitter-tweet" data-partner="tweetdeck"><p lang="ja" dir="ltr">サーバーっぽいものがあれば(たぶんnodejsが動けばなんでもいい</p>&mdash; てんちょー@xRTechTokyo展示 (@shop_0761) <a href="https://twitter.com/shop_0761/status/931926185440714752?ref_src=twsrc%5Etfw">November 18, 2017</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
ともてんちょーさんに教えてもらったのでいれてみる。

#参考資料
Windowsでのnode.jsとnpmのインストールと基本的なセットアップ | ぱーくん plus idea
http://web.plus-idea.net/2017/05/windows-node-js-npm-install-setup/


#インストール方法
##ダウンロードサイト
Node.js
https://nodejs.org/ja/
9.2.0のほう入れた。ぽちぽち次へ押していくだけでおｋ。

##node.jsのバージョン確認
インストール成功の確認も兼ねてバージョンを確認。

> $> node -v
> v9.2.0

一緒にインストールされる、パッケージ管理npm のバージョンも確認。
> $> npm --version
> 5.5.1

ちゃんと動いた。

##パス設定をしておく
グローバルインストール先を確認
>$> npm bin -g
C:\Users\miku\AppData\Roaming\npm

グローパルじゃないローカルインストールのほうもみてみる（-gオプション無しのときのインスコ先）

> $>npm bin
C:\node_modules\.bin

そのままのパスではなくて子フォルダを追加する。

> 確認したパスに「node_modules」を追加した値>「C:\Users\username\AppData\Roaming\npm\node_modules」を環境変数「NODE_PATH」としてセットします。(※グローバル・インストール先のフォルダの配下に「node_modules」というフォルダが作られ、そこにnpmでインストールしたパッケージのライブラリが置かれていくためです。)

だそうなので、
コントロール パネル\システムとセキュリティ\システム→システムの詳細設定→詳細設定タブ→環境設定ボタン→システム環境変数　に

> 変数：NODE_PATH　
> 値：C:\Users\miku\AppData\Roaming\npm\node_modules

をセット。

以上。
BoUoWでGUIテキストエディタ(gedit)を使う。

備忘録。

環境は、
Windows10
bash on ubuntu on windows(gensim Doc2Vecで日本語処理したいため)
python3

問題発生
-----------------
Doc2vecを使うにあたって、学習用で利用するらしい「.txt」ファイルをPythonがうまく読み込めない。
正確には、読み込める場合と読み込めない場合がある。
不安定。

どうも、Bash on ubuntu on windows特有の問題らしい。
http://aoe-tk.hatenablog.com/entry/2017/09/22/000459
（原文？）
https://blogs.msdn.microsoft.com/commandline/2016/11/17/do-not-change-linux-files-using-windows-apps-and-tools/

思いっきり、やってました。これ。
今回の問題は、ハードルが高そうな予感が(;´∀｀)

では、早速対応。
-----------------

上の記事では、Windows10側からのUbuntu側のファイルの操作（読み書き）を禁止しているように読み取れます。

なので、Ubuntu側でファイルを操作すれば問題なさそうにも考えられます。

それならば、
bashのvimエディタで「.txt」ファイルの作成。
日本語で１万文字くらいのテキストデータを、bash上でvimエディタに挿入してみましたが、何度やっても３００文字くらいでフリーズしてしまいます。
vimエディタの使い方じたい、よくわかっていないので、すんなりあきらめ。

コマンドラインインターフェースじたい、僕にはちょっと、、、(-_-;)、、、むずしいかも。

思い切って、GUI導入することに。
ここからは、手順。

Xmingのインストール
-----------------
次の２つの記事を参考に。ありがとうございます。
http://wgg.hatenablog.jp/entry/20161022/1477125614
http://verifiedby.me/adiary/0101


ここから、ダウンロード。
https://ja.osdn.net/projects/sfnet_xming/releases/

Xmingの実態？として、
Xming-6-9-0-31-setup.exe

フォントは
Xming-fonts-7-7-0-10-setup.exe

exeファイルなので、インストール方法は、Windows10側でダブルクリック。全部「Yes」でインストール完了。


Xmingの起動確認。
-----------------

bashで

```
$ export DISPLAY=localhost:0.0
```

```
$ sudo apt install x11-apps
```
完了。

次のコマンドで、目玉ウィンドウ登場。
目玉がカーソルを追えば、とりあえず正常にインストールできたっぽい。

```
$ xeyes &
```

xming上で動かしたい軽量エディタ「gedit」をインストール。

```
$ sudo apt install gedit
```

このままだと、geditを起動しても日本語が麻雀パイのような表記になってしまう。
いろいろしらべ、フォントの問題だとわかり、次のフォントをインストール。

```
$ sudo apt-get install unifont
```

日本語フォントインストール。

```
$ sudo apt install fonts-ipafont
```

見やすくなりました。

かな漢字変換システムをインストール

```
$ sudo apt install uim uim-xim uim-anthy
```

次のコマンドで、日本語入力可能なgeditを起動。

```
$ DISPLAY=localhost:0.0 XMODIFIERS="@im=uim" GTK_IM_MODULE=uim QT_IM_MODULE=uim gedit &
```

無事、起動。日本語入力OK(*´Д｀)

ただし、こっちのleafpadのほうが、フォントとか使い勝手がよさそうです。

```
$ DISPLAY=localhost:0.0 XMODIFIERS="@im=uim" GTK_IM_MODULE=uim QT_IM_MODULE=uim leafpad &
```


学習用データ（テキストファイル）を作成
---------------


Windows10のエディタで作成した学習用テキストデータをコピーして、bash on ubuntu on windows上のxmingで起動したgedit（ubuntu側のエディア）に貼り付けて保存。

bashを使ってdirコマンドで見てみると、とりあえず作成した「.txt」ファイルの存在確認はできました。

さて、pythonは読み込んでくれるか？(;´∀｀)

jupyter notebook上で実行してみると、
無事成功(;・∀・)
(初心者向け) JavaScript の null と undefined

#概要

Java や C# ではオブジェクトが未定義な場合、null という値が返されます。JavaScript では普通は undefined が返されますが、null が返されるときもあり混乱します。

この undefined と null ですが、値としては同じもののようで、undefined == null を実行すると true になります。でも、当然ながら undefined === null は false です。

[developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference) によると、これらはグローバルオブジェクト (Global Objects) の値の一種だそうです。これらは次の４つです。

- Infinity (無限大)
- NaN (非数)
- undefined
- null (literal)

そして、undefined は値ですが、null はリテラルだそうです。初心者としては混乱しますね。
もし、C 言語を知っていれば、次のように解釈するとよさそうです。

- undefined は変数を宣言し、値を代入する前の状態 (メモリは確保したが、値は未確定)
- null は NULL というシンボル (0 が割り当てられている)

C だと変数を宣言して値を代入しないと、その変数の値は確定しませんが、JavaScript ではそのような状態に undefined という値を割り当てているという感じです。そして、その値は null と同じと評価するということで、自分的には解釈しています。


#判別

プログラミングで undefined と null を区別して評価するケースはあまりないものと思われますが、区別して評価するためには == でなく === を使う必要があります。

それ以外なら == で値を評価すればいいし、if 文のカッコ内に変数名だけ書いておけば判別できます。(この場合は空文字や 0 も null と同じに評価される)

```JavaScript
// 厳密に undefined か評価するとき (null も同様)
if (a === undefined) {
  // undefined のときの処理
}

// undefined でも null でもいいから緩く評価するとき
if (b == null) {
  // undefined または null のときの処理
}

// 0 や '' も含めさらに緩く評価するとき
if (c) {
  // 処理
}
```

#サンプル

```JavaScript
'use strict';
/* グローバルにアクセス可能なビルトイン値。 */
/* undefined, null, NaN, Infinity */
var var1;
console.log(var1);  // undefined (メモリだけ確保したが、初期化されていない)
var1 = null;
console.log(var1);  // null (初期化されているが、型も値も決まっていない)

console.log(undefined == null);  // true (同じ値とみなされる)
console.log(undefined === null); // false (値は同じでも別ものとみなされる)

var y = 1 / 0;  // Infinity (無限大)
console.log(y);

var y0 = 0 / 0;
console.log(y0); // NaN (計算できない)

// null と表示される。
var1 = null;
if (var1) {
  console.log('有効な値');
}
else {
  console.log('null');  // こちら
}

// undefined と表示される。
var var2
if (var2) {
  console.log('有効な値');
}
else {
  console.log('undefined');  // こちら
}

if (var2 == null) {
  console.log('null');  // var2 は undefined だが null と評価
}
else {
  console.log('有効な値');
}
```

実行例

```
undefined
null
true
false
Infinity
NaN
null
undefined
null
```

※ JavaScript では 0 の割り算で例外が起こらなことに注意！


終わり
Daydream開発入門 PlayerにColliderをつけたらGvrControllerPointerが動かなくなった話

## 事象
以下の画像のようPlayerが設定されているものとします
![スクリーンショット 2017-11-19 6.56.27.png](https://qiita-image-store.s3.amazonaws.com/0/112492/5b2a7ad3-09b4-242d-6bd6-a77800bf926b.png)

このPlayerにColliderをつけると、コントローラーのポインターが動かなく(見当たらなく)なってしまいました
この記事はその解決法となります

## 解決法
Playerゲームオブジェクトの `layer` に **Ignore Raycast** を指定します
![スクリーンショット 2017-11-19 6.56.55.png](https://qiita-image-store.s3.amazonaws.com/0/112492/d9d108c5-83a0-e189-3831-105d297f449f.png)

GvrPointerPhysicsRaycasterスクリプトの `Raycaster Event Mask` から **Ignore Raycast** のチェックを外します
![スクリーンショット 2017-11-19 6.58.59.png](https://qiita-image-store.s3.amazonaws.com/0/112492/c2916739-f1d3-2f3c-e12a-3a5b6c339127.png)

これでGvrControllerPointerが正常に動きます
tmux upgrade して 2.6 にしたら死にそうになった


pbcopy と bind-key が動かなくて泣いた。

before:

```
if "which pbcopy" "bind-key -t vi-copy y     copy-pipe 'pbcopy'"
if "which pbcopy" "bind-key -t vi-copy Enter copy-pipe 'pbcopy'"

bind-key -t emacs-copy C-w copy-pipe 'pbcopy'
bind-key -t emacs-copy C-u page-up
bind-key -t emacs-copy C-d page-down
```

もう、全く動かない。技術者として死活問題。

after:

```shell
$ brew install reattach-to-user-namespace

```
して、

```
set -g default-command "reattach-to-user-namespace -l ${SHELL}"
bind-key -T copy-mode-vi y     send -X copy-pipe-and-cancel "reattach-to-user-namespace pbcopy"
bind-key -T copy-mode-vi Enter send -X copy-pipe-and-cancel "reattach-to-user-namespace pbcopy"

bind-key -T copy-mode C-w send -X copy-pipe-and-cancel 'pbcopy'
bind-key -T copy-mode C-u send -X page-up
bind-key -T copy-mode C-d send -X page-down
```

で何とかなった。`-T` と`send -X` はかなり難産したよ。
seeds.rbとfakerを利用したデータ生成


　シードデータとは、アプリケーションの挙動を確認するときに使う実験用のデータのことです。
　Railsでは、rails db:seedコマンドを活用することでテストデータを大量に生成することが可能です。

　テストデータは、できるだけ実際のものと近しいもので作ることが望ましいため、今回はシードデータを作成する際にランダムに名前やメールアドレスを作成してくれるfakerというgemを使い、実験用のデータ作成をしていきたいと思います。


### fakerとは
　Fakerとはランダムな値を入れられるgemです。
　Gemfileの中にgem 'faker'を追記し、 bundle installコマンドを実行することで使用出来る様になります
　例えば、Fakerのgemを入れた状態でa = Faker::Pokemon.nameというコードを記述すると、変数aの中にポケモンの名前がランダムで一つ入ります。

fakerで生成できるものはGitHubのREADMEに全て載っています。 
神の名前からワンピースのキャラクターまでいろいろあります

https://github.com/stympy/faker


### シードデータ挿入

今回は、usersテーブルに100件のダミーデータを追加したいと思います。
(db/seeds.rb)

```
100.times do |n|
  email = Faker::Internet.email
  password = "password"
  User.create!(email: email,
               password: password,
               password_confirmation: password,
               )
end
```

ターミナルにて・・

```
rails db:seed
```

シードデータが挿入されたか確認して見ましょう。

```
$rails c
>User.count
=> 100
```

おっけい
Ubuntu 16.04 LTSでWacom Intuos Comicを使えるようにする方法

Ubuntu 16.04 LTSで[Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic) (CTH-490) を使えるようにする方法についてまとめます。

#注意事項
* ペイントソフトとして__GIMP__を使用します。
* [Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)の設定を`Wacom Tablet`で行えるようにするため、デスクトップ環境として__GNOME__を使用します。  
※Unityの場合、[Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)を接続しても`Wacom Tablet`で認識されないという問題があります。

#方法
1. `sudo apt install ubuntu-gnome-desktop`コマンドを実行し、GNOMEをインストールします。
2. 再起動します。
3. デスクトップ環境をGNOMEに切り替え、ログインします。
1. [Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)とPCをUSBケーブルで接続します。
2. `Wacom Tablet`を起動し、[Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)の設定を行います。
2. [GIMPでペンタブレットを有効にする方法 | ツールのメモとその他あれこれ](https://toolmania.info/post-2275/)に従ってGIMPで[Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)を有効にします。

#その他
`Wacom Tablet`における[Wacom Intuos Comic](https://www.wacom.com/ja-jp/products/intuos-comic)の板に付いているボタンのマッピングが間違っていますが、この問題に関しては未解決です (解決方法を知っている方がいましたら、情報提供お願いします)。

#参考文献
* [(Linux) Wacom タブレット設定](http://azsky2.html.xdomain.jp/note/linux/setwacom.html)
* [Ubuntu 16.04 LTS DesktopでGNOMEを使用する！ | ICT実験室](http://expr.ictlab101.com/ubuntu-16-04-lts-desktop%E3%81%A7gnome%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%99%E3%82%8B%EF%BC%81)
例外メッセージポリシー

# 概要

例外処理を実装する際には例外処理のポリシーをあらかじめ決めてから実装しないと後々面倒なことになるため、最初に決めておく必要がある。今回はその辺りを教えていただいたため、備忘録としてまとめておく。後々追記していく。


**間違いなどあればコメントください。m(_ _)m**


# 基本事項
例外メッセージの書き方をミスると例外起きた時、何もわからないよね。というお話。例えば、以下のような感じ。

```
try
{
    // 正常系処理
}
catch (Exception $e)
{
   // 異常系処理 => そして例外に関する処理が全くない。(例外メッセージなど)
}
```
=> 一般的には**「例外を握り潰す」**という。
これをやると、なんか処理止まってるけど、何もログなくね？となる。


正しくは以下のように書く。

```
try
{
    // 何らかの処理
}
catch (Exception $e)
{
     error_log($e, 3);

}
```

基本的にtry catchにおける例外処理は結構なコストをかけて情報を集めてくれている。余すところなく活用する。

## catchでreturnしない

これも基本事項であるが、returnしてしまう人もいる。(過去の自分がそう)
時々catch句で以下のように値をreturnしてしまうコードを見るが、それはない。

```
try
{
    // 正常系処理
    return regular;
}
catch (Exception $e)
{
   　// 異常系処理 => そして例外に関する処理が全くない。
   　return irregular;
}
```


そういう処理をしたい時にはif-elseなどを用いたjumpなどで実装を行う。

```
try{
    if (!regular varilable){
        return irregular;
    }
    // 正常系処理
    return regular;
}
catch (Exception $e)
{
   // 異常系処理(例外メッセージなど)
}
```


# 例外メッセージの書き方
## 曖昧な表現はさける

例)
うまく送信されませんでした

=> うまく送信されなかった原因を書くべき。

## 受動態を使わない
クライアントの担当者によっては不快に感じる方(投げやりな姿勢だな💢と捉えられやすい)もいるため、自身のシステムが出力するものに受動態を使わない。


例）
登録されました

=> 書くなら「登録が成功しました」など。


# 参考

[[YakiBiki]エラー処理ポリシー](http://d.hatena.ne.jp/msakamoto-sf/20080329/1206761490)
[例外処理とロギングのベストプラクティス](https://codezine.jp/article/detail/1581)
繰り返しを許さない組み合わせをランダムで出力

一対比較法を用いたデザインの比較実験の過程で作りました。
順序効果を打ち消すために、実験対象(デザイン)の組み合わせをランダム提示するコードです。

####ソースコード
```Python:random_list.py
import random

#デザインパターンの数
design_num = 3

#デザインパターンの組み合わせリストを作成
numbers1 = numbers2 = range(1,design_num+1)
pair_list = [[m, n] for m in numbers1 for n in numbers2 if(m!=n)]

#ランダムで組み合わせを出力
print(random.sample(pair_list, design_num*(design_num-1)))
```

####実行結果
```
[[3,2], [1,2], [3,1], [1,3], [2,3], [2,1]]
```
後輩からの急ぎの注文で、下調べせずサクッと書いたコードです。
もしかしたら、もっと上手い書き方や便利なライブラリがあるかも。
rails 5.1でbootstrap3のドロップダウンリストを使う方法


#application.jsを下記記述にする
//= require rails-ujs
//= require jquery
//= require bootstrap
//= require turbolinks
//= require_tree .

#この二つが重要っぽい
//= require jquery
//= require bootstrap


#ちなみにこれを入れるとドロップダウンできなかった
//= require bootstrap-sprockets
これは不要っぽい



#rails5.1ではjQuery依存が廃止されたことでドロップダウンできなくなった
従来のRailsでは、data-remoteやdata-confirmについてはjQueryに依存し、その他の機能をUnobtrusive JavaScript（UJS: 控えめなJavaScript）に依存する形で機能を提供していました。Rails 5.1からはこれらの依存が解消され、UJSはvanilla JavaScript（=純粋なJavaScript）で書き直されました。このコードはAction View内部でrails-ujsとしてリリースされています。

デフォルトではjQueryに依存しなくなりましたが、必要に応じて従来どおりjQueryに依存することもできます。


#htmlコード例
```

 <li id="fat-menu" class="dropdown">
   <a href="" class="dropdown-toggle" data-toggle="dropdown">
     Account <b class="caret"></b>
   <ul class = "dropdown-menu">
      <li><%= link_to "test1","#" %></li>
      <li><%= link_to "test2","#" %></li>
   </ul>

```

2018/03 追記 
Rails5.1.4
application.jsにjquery追加しても使えなかった場合
ドロップダウンを使うhtml.erbにこれを追加すると使えた

```
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
         <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
         <script>
           $('.dropdown-toggle').dropdown()
         </script>
</header>
```
windowsのterminalの設定方法


1. window subsystemのterminalを立ち上げる

1. 右クリック
![wsl_terminal_1.png](https://qiita-image-store.s3.amazonaws.com/0/49498/8557a06b-30aa-5ab6-f707-2976d1eb513d.png)


2. オプションをクリック
![wsl_terminal_2.png](https://qiita-image-store.s3.amazonaws.com/0/49498/2951a5af-6d14-d5a9-4812-afd5e9afa976.png)


3. 画像の場所をいい感じの値に設定する

![wsl_termial_3.png](https://qiita-image-store.s3.amazonaws.com/0/49498/8d312746-a6eb-b8ed-c4f0-422794ae1306.png)