OmniAICreator/Qiita-1.07M huggingface dataset:
Webフロントエンジニアのためにアプリ開発の導入部分を説明する

アプリとか作ってみたいね、ってことで友人たちといろいろ計画したときに、アプリ開発に明るくないメンバ向けに情報をまとめた時のメモ。
皆さん、HTMLとCSSでウェブサイト作ったことはあったり、Webアプリの考え方は何となくわかるようだったので、若干Webアプリ開発との対比のような内容になってます。

# 背景 


有識者は多くないけど折角ならWebアプリで終わりたくない、ということでハイブリッド(後述)を採用。

実際に手を動かそう！の前に、スマホアプリ開発のイメージを持ってもらうことを重視したので、「説明が雑すぎる」とか「厳密に言ったらそれ違うでしょ」とかあるかもしれませんが、ご容赦ください。

筆者は正しく理解してますよ。理解してますってば。


# ハイブリッドアプリ
`Webアプリ`と`ネイティブアプリ`の良いとこ取りをした開発方式として、`ハイブリッドアプリ`があります。

- Webアプリ
	- メリット
		- 基本的にブラウザでアクセスするので、難しい実装しなくても最悪HTMLとかCSSとか書ければOK。
		- PCのブラウザからもアクセス可能。（⇒ウェブサイトとかのことですね。）
	- デメリット
		- スマホへのプッシュ通知や、アルバムやアドレス帳との連携など、スマホの機能を取り入れたものは作れない。

- ネイティブアプリ
	- メリット
		- スマホの機能を存分に使ったアプリが作れる。（⇒スマホアプリ、と言うと、この方式のことを指すのが普通なのではないでしょうか。）
	- デメリット
		- AndroidとiOSなど、OS別に専用のプログラミング言語で作る必要があり、開発のハードルが高い。
		- その言語の知識がないと作れない。
		- OSの知識も求められる。

### ハイブリッドアプリの仕組み・特徴

- 実装には主に、HTML、CSS、JavaScriptを使用。
- HTMLとCSSでレイアウトを作成できる。
- Cordovaというアーキテクチャが、スマホ本体をjavascriptで操作できるように橋渡しをしてくれるため、OS毎にいろいろな言語をかき分けなくてよい。

※ここではCordovaと言い切ったけど、多分それ以外のものを使ったハイブリッドアプリもあります。けど今回はCordova使います。


# 開発方法のイメージ
この辺から著しく雑になってきます。今後の知識習得の邪魔になったらごめんなさい・・・。
なんとなくイメージができるようになることを重視します。

上記の通り、お手軽感のあるハイブリッドアプリ。とは言えそれを開発する環境は必要です。

HTML、CSS、JavaScriptだけだったら、極端なこと言えばエディタだけでも書けるし、ブラウザ起動すれば動作確認も出来ないことはないですね。

**でも今回はスマホアプリ。**

- **Cordovaが上手いこと橋渡ししてくれるって言うけど、Cordovaどこにいるの？開発PCに入れたりするの？**
- **そもそもパソコンでデザイン書いてるのに、そこからスマホの機能を使う、っていうのが意味わからない。**
- **動作確認したいけど、パソコンで書いたデザイン達はどんな風にアプリの形にして、スマホに入れればいいの？**

**というような事、思いませんか？**

実際のところ、

- CordovaがPCで動くようにいろいろダウンロードしてセットアップ
- Cordovaとデザイン達を繋いで、スマホ機能を使えるように設定
- エミュレータと呼ばれる、PC上で動く擬似スマホを開発 PCにインストール
- Cordovaとデザインをまるっとパッケージングして、擬似スマホ内に配置

みたいな事をすれば、コストかけずに実現可能です。
実際、そうやって開発してる人たくさんいると思います。
でもこれだけ見ると、開発環境作るのがすでに面倒そうですね。

## Monacaを使うことにした

Monaca
https://ja.monaca.io/

基本的にコストかけないで進めたいねー、とか話していたのですが、環境構築の方法についてもレクチャーが必要そうだな、と。
構築しても使い方を共有して、、、とか考えると、作り始めるの何か月後になるんだろう？と思いました。


なので今回は、多少コストがかかってもより早く簡単にできる方法として、Monaca採用しました。
ただ、今回私たちが作ろうとしているアプリは、コストかけないと実現できない、というだけです。
Monacaは無料で使うこともできるようなので、ちょっとやってみようかな、くらいだったら無料枠でOKだと思います。


### monacaとは

- ブラウザでMonacaにログインして、ブラウザ内でデザインとかJavaScriptとかを実装できます。（インストールして使うクライアントソフトもあるみたい。）
- デザインとかが出来上がったら、Cordovaとデザインを結びつける部分を実装します。（この辺が若干特殊に感じるかも。AngularJSとかのフレームワーク知ってればなんてことはない。）
- ブラウザ上でポチポチ操作していくと、デザイン＆Cordovaをパッケージングしたものが、インターネット経由で自分のスマートフォンから開けるようになります。（出来立てホヤホヤアプリの動作確認が、スマホ実機でできます。）

自分のPCには何も準備せずに、ブラウザさえあれば動作確認まで完了です！

Monacaについて詳しく知りたい人は、入門系の記事書いてる人がたくさんいるので、検索してみてください。


# おわりに
アプリ開発に限らない話ですが、何か新しいことに手を出そうとすると、コアとなる部分にたどり着く前に、設定やら環境構築で打ちのめされたりすることが多々あります。

まずは最短ルートでやりたいこと（今回でいえばアプリ作成）に触ってみて、わかってきてからほかの方法も試してみる、というほうがモチベーションも保ちやすい！

そういった意味で、Monacaはなかなかおすすめです。
もちろん、わかってきたら自分で環境作ってみたりすると、いろいろ幅が広がるとは思います！

※本記事はざっくりとイメージをつかむことを重視しているので、少しわかってきたら「正しく詳細な情報」を調べなおすことをオススメします。
LaTeXでスライドが作れるBeamerでBibTeXを使う


# 準備
確認環境はArch Linuxですが，他のOSでも適切にパッケージをインストールすれば動くと思います．

## 必要なパッケージのインストール(Arch Linux)

```
# pacman -Syu
# pacman -S texlive-langjapanese texlive-bibtexextra texlive-latexextra biber otf-ipafont
```

biberはtexlive-*とは別にインストールが必要なので注意．

dockerで実行する場合は，(おそらく)最初/etc/profileを見に行かない影響で，biberまでパスが通らないので，`su -`などとしておく．

# コード

## LaTeXファイル

### slide.tex

```latex
% beamerを使う．オプションはそれぞれ，xelatexを使う，文字コードはunicodeを使う，文字サイズは12pt，上寄せ
\documentclass[xelatex, unicode, 12pt, t]{beamer}
% beamerのテーマ．テーマ一覧は http://deic.uab.es/~iblanes/beamer_gallery/index_by_theme.html で見れる．
\usetheme{Boadilla}

% 日本語周り 参考: http://zrbabbler.sp.land.to/zxjafont.html
\usepackage{zxjatype}
\usepackage[ipa]{zxjafont}

% biblatex．標準のバックエンドはbiber
\usepackage{biblatex}
% bibtexのファイル
\addbibresource{mybib.bib}
% 参考文献のインデックスを文字列で表示
\setbeamertemplate{bibliography item}[text]

% url用．参考文献にurlが含まれる場合は必要(?)
\usepackage{url}

% タイトル指定(beamer)
\title{タイトル}
% 著者指定(beamer)
\author{山田 太郎}
% 日付指定(beamer)
\date[2018/10/01]{2018/10/01}

\begin{document}

% 表紙
\frame{\maketitle}

% 1フレーム分．allowframebreaksで改ページするようになる．
\begin{frame}[allowframebreaks]{題1}
  hoge \cite{bib_test}
  \begin{itemize}
    \item huga1
    \begin{itemize}
      \item ぴよ1
      \item ぴよ2
    \end{itemize}
    \item huga2
  \end{itemize}
\end{frame}

% 参考文献
\begin{frame}[allowframebreaks]{参考文献}
  \printbibliography
\end{frame}

\end{document}
```

## BibTeXファイル
実際にはGoogle Scholarの引用などを使うと楽

### mybib.bib

```bibtex
@book{bib_test,
  title={参考文献のタイトル},
  author={参考文献の著者},
  year={2018},
  publisher={publisher}
}
```

# コンパイル
以下のコマンドでslide.pdfが生成される．

```
$ latexmk -xelatex slide.tex
```

# コンパイル結果
![slide-0.jpg](https://qiita-image-store.s3.amazonaws.com/0/280971/3a7e430c-92b7-a406-1bce-dcd36a98bd96.jpeg)
![slide-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/280971/c2b2c72b-4fb0-7cd3-3f41-bc9309143f68.jpeg)
![slide-2.jpg](https://qiita-image-store.s3.amazonaws.com/0/280971/e8894d02-de5c-617f-e1ab-c23652e5c54c.jpeg)
laravelをHerokuへデプロイするまで

# 参考文献
[Laravelアプリをherokuで動かすチュートリアル](https://qiita.com/kamukiriri/items/73ff35fc7f9083ca68c1)
上記のリンク先を参考にしてデプロイしました。

# Laravelプロジェクト作成
```:command
composer create-project --prefer-dist laravel/laravel test_laravel
```

ちなみに下記のコードの意味は、「リリース版、安定版をダウンロードします」と言う意味。

```:example
--prefer-dist
```

●参考文献
[LARAVEL 5.6 のインストール]
(https://laravel10.wordpress.com/2015/02/13/laravel%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB/)

下記は好きな名前に変えて良い（example_laravelとか。今回はtest_laravel）

```:example
test_laravel
```
# Gitでバージョン管理

```:command
git init
git add .
git commit -m 'create_app'
```
# HTTPサーバー設定を作成
今回はApacheを設定する。

```:command
echo web: vendor/bin/heroku-php-apache2 public/ > Procfile
```

Procfileに「web: vendor/bin/heroku-php-apache2 public/」を書き込む

# Herokuアプリケーションを作成してデプロイ

```:command
Heroku login
heroku create $(basename $(pwd))
Creating ⬢ test_laravel... !
 ▸    Name must start with a letter and can only contain lowercase letters, numbers, and dashes.
```
あれ。。。動かない。翻訳すると「名前は小文字か数字かダッシュのみにしてね」と言うことなので

```:command
heroku create testlaravel
Creating ⬢ testlaravel... !
 ▸    Name testlaravel is already taken
```
あれれ。すでに名前が使われているとな。うーん。じゃあこれにしよう。

```:command
heroku create sholovelaravel
Creating ⬢ sholovelaravel... done
https://sholovelaravel.herokuapp.com/ | https://git.heroku.com/sholovelaravel.git
```
これでOK!続きをやっていこう。

```:command
heroku config:set APP_KEY=$(php artisan --no-ansi key:generate --show)
git push heroku master
```
上のコマンドでAPP_KEYを設定していて、下のコマンドはherokuにデプロイするコマンド。

# 動作確認

```:command
heroku open
```

<img width="1440" alt="スクリーンショット 2018-10-10 1.31.35.png" src="https://qiita-image-store.s3.amazonaws.com/0/268048/6233fdc7-463c-5fb8-aa0c-383cb28842cf.png">


これでひとまず完成！！明日はDB入れるところからかな。
Goのslice expressionについて

Goのslice expression(スライス式, スライシング)をちゃんと理解できてなかったので、反省を込めてメモ。

まず何の変哲もないスライス。

```go
sli := []int{1, 2, 3, 4, 5}
```

スライスの添字は `0` から始まり、 `要素数-1` までになる。このsliの場合、添字は0 ~ 4となる。

slice expressionは、配列や配列へのポインタやスライスから、別のスライスを作るときに使う記法のこと。(ちなみに文字列にも使えるが、結果は文字列になる点が少し違う)
https://golang.org/ref/spec#Slice_expressions

```go
s2 := sli[0:5] // 1, 2, 3, 4, 5
```

こんな風に `a[low : high]` と書くことで別のスライスを切り出すことができる。

* lowとhighはどちらも添字が基準で、 $low \leq i < high$ の範囲が切り取られる
* `sli[0:5]` とは、 $0 \leq i < 5$ の範囲を抜き出すので、つまりは 添字0~4を抜き出す意味になる
* `sli[:3]` のようにlowを省略すると`0`の意味になる。 $0 \leq i < 3$ と同じ。
* `sli[1:]` のようにhighを省略すると`len(sli)`の意味になる。この場合は $1 \leq i < 5$ と同じ
    * つまり、`sli[:]` は `sli[0:len(sli)]` と同じ意味

## slice expressionの性質

* できあがる新sliceの要素数は、`high - low`
* low == highな値を設定すると、空のsliceが返ってくる
* $0 \leq low \leq high \leq len(a)$ を満たさないと駄目。lowとhighの大小関係も重要
    * 満たしてないとpanic
        * ということは、もし対象の要素数が未知数なら、あらかじめサイズの確認は必須
* pythonなど、他言語にあるような超高機能なslice式ではない
    * 負の値を指定してお尻から切り出す〜みたいな機能はない
        * len()を使え、ってことかな？
    * ステップを指定したりreverseを作る機能もない
        * そういうのはライブラリを使うのがgo文化ですね

## なんでhighは一個大きな数字にしてるんだろう？

たぶん色々なロジックを書くときにわざわざ-1をせずに済み、便利だからでしょう。
配列の添字が1始まりじゃなくて0始まりになってるのと同じ理由だと思う。

## full slice expressionについて

使ったことがないです。使いみちがよくわからない…
capをあえて広げて切り取れるという構文がある。

```go
numbers := [10]int{0,1,2,3,4,5,6,7,8,9}
s := numbers[2:4:6]
fmt.Println(s) // [2, 3]
fmt.Println(cap(s)) // 4
```

## 参考文献

https://medium.com/golangspec/slice-expressions-in-go-963368c20765
tensorflow+Geforce RTXシリーズでパフォーマンスを確認してみる

# 概要

RTX2080を衝動買いしたため、これで機械学習を高速化できないか、とtensorflow+CUDA10自家ビルドで試してみた話。
結果としては「FP32性能上昇分しか変わりませんでした」という残念なものになっています。
ただ、やり方を間違えている可能性はあるのでいずれリベンジ記事を書け...ればいいなぁ。
なおこの記事ですが「Windows10＋Python3.6」というマイナー(?)環境でやっていますのでその点ご注意を。

# 前準備

RTX20xxシリーズの機能をフルに使うには[CUDA10の案内](https://developer.nvidia.com/cuda-toolkit/whatsnew)で「Turingサポート」が挙げられているので、CUDA10を使ってやる必要がありそう。
が、ビルド済みパッケージの提供は

|プラットフォーム|CUDAバージョン|
|---|---|
|Tensorflow v1.11| 9.0 |
|Pytorch 0.4| 9.2 |

という状況で、どちらもCUDA10は組み込まれていません（10/9現在）。
なければビルド...ということでビルドしてみましたが、どちらも一筋縄ではビルドできず。
そもそもWindowsビルドなんてそんな検証されてない（であろう）ため、解決策を探すのに難儀しましたが、こちらの[神記事](https://medium.com/@amsokol.com/update-1-how-to-build-and-install-tensorflow-gpu-cpu-for-windows-from-source-code-using-bazel-and-c2e86fec9ef2)のお蔭で無事解決。
自分がWindowsビルドで嵌った以下4か所はすべてこの文書でカバーされてました。

* VC2015 update3以上じゃないとだめ(VS2017 CommunityはOK)
* checkout version/configure.pyで成功する組み合わせ（v1.11+CUDA10.0+CuDNN7.3.1でOK）
* cuda/half.hでビルドエラーが出る問題(patchで対応）
* ビルドは通るんだけどパッケージができない問題(zipファイルが2GBを超えないよう手修正)

なおビルド時のconfigure.pyでは使用するカードに合わせた[Compute Capability](https://developer.nvidia.com/cuda-gpus)を設定する必要があるんですが、configure.pyの設定時に両方("6.1,7.5"みたいに)設定すると
「zipファイルが2Gを超えないようにする」を満たすのが非常に難しくなります。仕方がないのでCC6.1ビルドとCC7.5ビルドの2パッケージを作ることにしました。

|使用カード|Compute Capability|
|---|---|
|Geforce 10xx| 6.1 |
|Geforce 2080ti/2080/2070| 7.5 |

どちらも"tensorflow-1.11.0-cp36-cp36m-win_amd64.whl"という同名パッケージとしてできてしまうので、差し替えの際にはアンインストール→インストールの手順を踏む必要があります...


ちなみにPytorchもビルドしようとしたんですが、今日時点では
[MPI関連のライブラリがリンクできない件](https://github.com/pytorch/pytorch/issues/12001)とか[at::optionalのコンストラクタ問題](https://github.com/pytorch/pytorch/issues/12117)とかにあたって解決できず。
~~まぁ2つ分検証するのも面倒だからTensorflowだけでいいや~~

# 検証

さて、以下の確認を行ってみようと思います。
ベンチマークにはTensorflowチュートリアルにのってる[Images/Pix2Pix](https://github.com/tensorflow/tensorflow/blob/r1.11/tensorflow/contrib/eager/python/examples/pix2pix/pix2pix_eager.ipynb) を使ってみました。Tesla P100だと1epoch58秒で回るらしい。

1. 6.1ビルド + GTX1060
1. 6.1ビルド + RTX2080
1. 7.5ビルド + RTX2080(FP32)
1. 7.5ビルド + RTX2080(FP16)

コードはKerasベースなので、FP32/FP16の切り替えは

```Python
import keras.backend as K
K.set_floatx('float16')
```

で良い..はず。(FP16)として検証している個所は、上記を（モデル構築直前である）コードセル7に突っ込んでいます。
コードセル19の実行時、1epoch実行ごとに時間を表示してくれるみたいで、
1回目が少し多め、2回目以降は安定するため2回目以降での表示を手メモした結果が以下。

|テスト番号|Tensorflowビルド|GPU|FP16指定|実行時間|
|---|---|---|---|---|
|1|v1.11.0+CUDA10+CC6.1|GTX1060|なし|113.8sec|
|2|v1.11.0+CUDA10+CC6.1|RTX2080|なし|66.6sec|
|3|v1.11.0+CUDA10+CC7.5|RTX2080|なし|66.9sec|
|4|v1.11.0+CUDA10+CC7.5|RTX2080|あり|65.1sec|

FP32 FLOPSはGTX1060が4.4T、RTX2080が10.0Tなので大体FP32性能比率通りですね。
性能2倍超なのに時間が2倍以下になってしまっているのはCPUからのデータ転送でGPUが遊んでしまっているためと予想。
タスクマネージャで見てもcompute_0が70%程度しか動いていません。

![CC75_RX208.png](https://qiita-image-store.s3.amazonaws.com/0/262860/5225ea57-70c4-07f8-dd1d-98550e3c82bd.png)


で、FP16にしたときにTensorCoreで爆速..になればよかったのですが、誤差程度。
相変わらずFP32で動いているようにしか見えません。
[NvidiaがVoltaのTensorCoreに向けて書いた資料](https://www.nvidia.com/content/apac/gtc/ja/pdf/2017/1055.pdf)では
Tensorflow1.4時で「tf.cast(...,tf.float16)すればTensorコア使う」とか書いてあるんですけどねぇ...

# 今後

まずはNvidiaのプロファイラの使い方を覚えねば。jupyterと相性悪そうだなぁ.. →[やってみました](https://qiita.com/kuroyagi/items/e70c55cbc88fc0ed0220)
オープンソースの顔照合 SeetaFace

今回調査したのは
2016年頃にリリースされたオープンソースの顔照合のライブラリです。

https://github.com/seetaface/SeetaFaceEngine

(追記　2022.08
https://github.com/seetaface/SeetaFaceEngine2
が公開されています。)


顔照合のライブラリは
顔検出・顔位置の正規化（＝アライメント）・狭義の顔照合ライブラリが
セットになって作られています。

> SeetaFace Engine is an open source C++ face recognition engine, which can run on CPU with no third-party dependence. It contains three key parts, i.e., SeetaFace Detection, SeetaFace Alignment and SeetaFace Identification, which are necessary and sufficient for building a real-world face recognition application system.

顔検出
https://github.com/seetaface/SeetaFaceEngine/tree/master/FaceDetection
顔位置の正規化（＝アライメント）
https://github.com/seetaface/SeetaFaceEngi![Screenshot from 2018-10-11 00-00-21.png](https://qiita-image-store.s3.amazonaws.com/0/83761/edc2a300-7370-f2f6-3443-41b6fbaa5f67.png)
ne/tree/master/FaceAlignment
狭義の顔照合ライブラリ
https://github.com/seetaface/SeetaFaceEngine/tree/master/FaceIdentification


paper [Funnel-Structured Cascade for Multi-View Face Detection with Alignment-Awareness](https://arxiv.org/pdf/1609.07304.pdf)

![Screenshot from 2018-10-10 23-55-43.png](https://qiita-image-store.s3.amazonaws.com/0/83761/fb28f4e5-adfe-4b1a-2a68-d9564f0bc361.png)




paper [Coarse-to-fine auto-encoder networks (cfan) for real-time face alignment](https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=6&ved=2ahUKEwjym6Hvn_fdAhWMWrwKHXQVBk0QFjAFegQIBhAC&url=http%3A%2F%2Fvideolectures.net%2Fsite%2Fnormal_dl%2Ftag%3D921119%2Feccv2014_zhang_face_alignment_01.pdf&usg=AOvVaw0mH5AtF90IrxolN5oL3DO2)


paper [VIPLFaceNet: An Open Source Deep Face Recognition SDK](https://arxiv.org/pdf/1609.03892.pdf)


![Screenshot from 2018-10-11 00-00-21.png](https://qiita-image-store.s3.amazonaws.com/0/83761/bc184cee-cfaf-64c1-ebf5-4616f3445d1a.png)


これらの１セットが、論文が書かれると同時に、オープンソースの顔照合のソースコードとして公開されているのです。

このような研究・開発が組織的に行われている凄さを、単純に褒め称えたいと思います。
railsアソシエーションオプションのメモ

#アソシエーションで利用するオプションメモ
最近開発していて、利用するオプションが増えてきたので、一度まとめておこうかと思います。
メモ書きですのでご了承。。。。

##class_name
一つのモデルに対して、二つのアソシエーション経路を組む場合に多用します。
二つアソシエーションを組む場合は、経路を指定する必要がありますが、モデルが一つのため、
別経路なのに取りに行くモデルが同じということが起こります。これを防ぐために、class_nameがあります。
これのおかげで便宜的にモデルを二つに分けることができ、実際は一つのモデルを見に行くということができます。
例えば。。。。
本を売り買いできるサービスがあったとして、自分が売った本一覧と買った本一覧を見ることができるとします。
単なるアソシエーション（user.booksとか）だと、userがそのbookに対してどのようなアクションを行ったのかが判別できません。
なのでclass_nameを利用して、経路を二つ用意してやります。
user１に対してbook多になります。


```user.rb
has_many :bought_book, class_name: "Book"
has_many :sold_book, class_name: "Book"
```

```book.rb
belongs_to : "User"

```
こうしてあげると、同じbookでも買ったのか売ったのかがわかるようになります。
booksを取りたいときは、user.bought_booksなどにしてあげれば、買った本の一覧が取れます。
soldもまた然り。


##source
class_nameと機能はほぼ同じ。ですが強いていうならば、throughを使うような中間テーブルがある際には
source、一対多のような中間テーブルを使わない場合は、class_nameが使われる。

##foreign_key
日本語では外部キー、別テーブルの参照idを指定することができます。
先ほどの例を使いますが、

|usersテーブル|booksテーブル| 
|:--------:|:----------|
|id        |id
|name      |title
           |user_id
　　　　　　　　　　　　　　　　　　　　　　|author_id


それぞれこんなカラムを持っていたとします。今回はuserモデルの他にauthorモデルがあるとします。


```user.rb
has_many :books
```


```book.rb
belongs_to :user
```


何もないただの一対多ですと上のようにしますね。こうするとbooksテーブルにあるuser_idと合致するidをusersテーブルから持ってくるということができます。これはrailsが自動的にmodel名と一致するidを取りに行ってくれるからできることです。今回でいえば、user_idとUserモデルは同じuserという単語を利用していますよね。


これにあえて、userテーブルに存在しているidとauthor_idを一致させるようにする場合。。。。

```user.rb
has_many :books, foreign_key => "author_id"
```


```book.rb
belongs_to :user
```

ここで外部キーが出てきます。外部キーを明示してあげることでその名前のidをuserから取りに行きます。
実はアソシエーションの際には通常の場合でも、has_manyやbelongs_toの後にはforeign_keyが省略されています。このforeign_keyはあえて指定することで、外部キーを示すことができます。



##through
中間テーブルが複数ある場合に利用します。sourceと一緒に出てくることが多いです。
今回は少し例を変えて、多対多で中間テーブルが複数ある場合を考えましょう。
複数のuserと複数のbookがあり、userは複数の本をいいねでき、本もまた複数の人からいいねをもらえる。
また、別経路でuserは本を複数書き、共同執筆で一つの本が複数のuserを持てるとします。
そうなると、userからbookを取りに行く場合、どちらの中間テーブルから取りに行けば良いかわかりません。
throughオプションで中間テーブルを指定すれば、経路を決めることができます。





##個人開発をされている方へ

Moverというプロダクトを開発しています。登録していただくと、開発したプロダクトのテスト利用を依頼し、フィードバックをもらうことができます。自分のプロダクトを公開して個人開発を加速させましょう！！　現在僕のアカウントも登録されているので、そちらにテスト利用依頼をいただければ実際に使ってみた感想などをお送りさせて頂きます。(アドバイスなどではなく、一人のユーザーとしての感想となります。)　もちろん無料です。
https://mover-web.herokuapp.com/



![Screen Shot 2020-05-19 at 4.36.42 PM.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147990/40822905-5a9d-6323-4318-bb475c68e887.gif)
ローカルのhtmlでjQueryが上手く読み込まれなかった時の対処法

## jQueryの読み込みシチュエーション

htmlでjQueryを用意する際は以下のように書くことがあると思います。


``` html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>jQuery</title>
</head>
<body>
……ページ本体……
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
……jQueryを利用したコード……
</script>
</body>
</html>
```

しかし、このhtmlをローカルに置いてブラウザで開くとjQueryを読み込むことが出来ません。


## //を使用したライブラリのインポート

src属性を読み込む際に//のようにプロトコルを省略した表記をすると、プロトコルが現在ブラウザで使用されているものになります。そのためローカル環境ではfile://code.jquery.com/jquery-3.3.1.min.jsを見に行っているコードになっていました。

ローカルでも読み込まれるようにするにはきちんと `src=http://code.jquery.com/jquery-3.3.1.min.js`とプロトコルまで指定する必要があります。
技術書典5に行ってきましたメモ

# はじめに
先日、初めて技術書典に行ってきたのでそのレポートを書きます:raised_hands:

![20181008_02.jpg](https://qiita-image-store.s3.amazonaws.com/0/103464/b71812fb-3c80-e270-26b1-ab43bd04a81a.jpeg)

# 技術書典とは？
技術書典サイトは[こちら](https://techbookfest.org/)。以下、サイトより引用。
>新しい技術に出会えるお祭りです。 
技術書典は、いろんな技術の普及を手伝いたいとの想いではじまりました。 
技術書を中心として出展者はノウハウを詰め込み、来場者はこの場にしかないおもしろい技術書をさがし求める、技術に関わる人のための場として『技術書典』を開催します。

# 技術書典5について
技術書典5のサイトは[こちら](https://techbookfest.org/event/tbf05)。
一般参加無料です！

>日時 2018/10/08 (月) 11:00〜17:00
>場所 池袋サンシャインシティ2F 展示ホールD（文化会館ビル2F）
>主催 TechBooster/達人出版会
>一般参加 無料

# 行こうと思ったきっかけ
「技術書典」の存在を知ったのは先月でした。社外の勉強会やTwitterで「技術書典」というワードを何度か目にするうちに興味を持ちました。最近知り合った、よくLT等をされている方も出展すると言われていたので、ますます興味を持ちました。サイトを見てみるとフロントエンド関連の本が色々ありそうだし、行ったことないから行ってみたいと思い、行くことにしました。
# 当日
前回は整理券が配られており、入場制限があったようなので、今回どのくらい待つだろう...という感じでした。
でもまぁ、普通に11時ごろ行きました。私は友達と2人で行き、11時すぎに会場に着きました。着いてみるとものすごい列...！1000人以上は並んでいました。入場できたのは11時40分頃だったので、30分くらい待ちました。行列の割には早く入れたな〜という印象でした。友達と話しながら待っていたから早く感じたのかもです。

# 会場の様子

これは会場に入った時とった写真。
![20181008_01.jpg](https://qiita-image-store.s3.amazonaws.com/0/103464/4053d7b6-67cd-4896-91f8-221e34a89f32.jpeg)

中に入ってからは友人と別行動で見たいものを見て周りました。欲しいものがどこにあるかまでちゃんとチェックしていなかったので、途中ブースから外れたところで休みつつチェック...結局2時間くらい滞在していたような気がします。

会場には立ち読みスペースもありました。気になる本がチェックできます。

![20181008_03.jpg](https://qiita-image-store.s3.amazonaws.com/0/103464/7bc4bee1-d219-f75c-a91c-52fd89f50bb1.jpeg)



# 戦利品
事前にチェックしていたものを中心に購入。Vue.jsの本は他でも変えるけど1000円くらい安く買えました！元々買おうと思っていた本だったのでラッキーでした。Vue.js、React本は見かけたけど、Angularの同人誌は見かけなかったなぁ。（出版社が出してる本は1冊みかけた）

![20181008_03.jpg](https://qiita-image-store.s3.amazonaws.com/0/103464/a873eed6-328c-e941-0a21-6a94629f7ea3.jpeg)


# おまけ
総来場者数はのべ10341人、うちサークル・スタッフ等関係者は889人だったそう。
知り合いがいてもわからないレベルで人がいたはずなのに、会場で会社の先輩に見つかってしまいましたw
めちゃびっくりした。。
先輩の戦利品はこちら:point_down_tone2:茶色い本がきになるので今度見せてもらう予定です〜。

<img width="768" alt="20181008_04.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/103464/9aeff27a-dd20-936b-917a-d4dad18b26ea.jpeg">


# 事前にしたこと
Twitterで準備したほうが良いものが流れていたので軽く準備しました。
やったこと、やらなかったこと、こうすればよかったなということを挙げておきます。

* 現金の準備
 * 大体1000円か500円なので1000円札と500円を用意しておく
      * 実際は1000円の本が多かった気がする
      * 1000円でも500円でもないものもある
      * 私は財布に入っていた9000円を持って参加（みずほ銀行がちょうどメンテナンス中でおろせなかったので、たまたま財布に入っていた現金がなくなるまでくらいが予算でした。銀行のメンテナンスのことまで考慮したなかったのでしておくと良いなと学習しました。）
      * 500円玉は全く持ってなかったけど10枚用意していた優しい友人が一部両替してくれた:baby:（実際、500円ももってて良かったです。）
* 技術書典アプリのインストール
 * AppStore等で「技術書典」で検索すると出てくる
 * アプリに対応しているサークルだとアプリを使って後払い決済にすることができる
 * 今回は1冊だけアプリで購入した。事前に電話番号を入れて認証するところまでやっておくとスムーズ（私はやってなくて会場でやってちょっともたついた。そしてこの時先輩に見つかった。）
 * アプリ対応しているサークルは良いけど、してないサークルもあるので現金は必須！
* 欲しい本をチェックしておく
 * サークルリストがあるので事前にチェックすべし
 * ただ、たくさんあって最後までチェックするの大変
 * いい感じに検索できたら嬉しいなーという感じだった
 * 結局、あんまりチェックせずに当日を迎えてしまった
 * まわりながら選ぶのは難しい気がするので、やっぱりチェックしておくのがおすすめ
* 一緒にいく友人を探す
 * ひとりで行くかどうか迷ったけど、どんな雰囲気かもわからず少々心細かった＆買ったものを見せっこしたいため、友人を誘った:clap:
 * 方向音痴なので会場まで連れってってくれて助かった:baby:
 * 待ち時間があるので、ひとりだと長く感じるかも。誰かが一緒が良いかも。
 * 会場から脱出した後、戦利品見せ合いは楽しい。面白そうな本買ってたから今度借りたいなー。　　 

# 感想
* 行ってよかった！楽しかった！また次も行きたい〜:hugging:
* 気になるサークルチェックとか効率的にやれたら良いな〜と思った。なんか考えてみるのもありだな〜。
* 本を出すってすごい！出してみたい！という気持ちが芽生えた:seedling:
* スポンサーさんって素敵だなーと改めて思った:santa_tone1:
* すごい人だったので運営も大変そう。運営の皆様ありがとうございました！
* 行ったことない方にはオススメしたい:clap:

という訳で久々にQiitaを書きました。社内LTでも話したいな～。
Qiita以外のサイトでもQiitaっぽくソースコードを表示したい

Qiitaのソースコードのシンタックスハイライトってすごくみやすいですよね。
メソッド・変数・クラス名によって文字色が決められていて、黒系の背景で目に優しい…。

私は個人で[ブログ](https://www.sirloin-nagurigaki.net/)をやっていまして、そこでも技術系の記事を書いてるんですが、

いかんせんソースコードの表示の仕方がイマイチだったんでQiitaのスタイルを少し拝借しました。

（Chromeのデベロッパーツールを使って背景色や文字色を舐め回すように見漁りました）


そして自分のブログに適用させたスタイルがコチラ↓↓

```css:style.css
/*ここにソースコード表示部分のセレクタ*/ {
  background-color: #364549;
  color: #e3e3e3;
}
```

結果は私のブログを御覧ください↓↓
https://www.sirloin-nagurigaki.net/

#追記
コメントで教えていただいたのですが、QiitaではRouge（ルージュ）というシンタックスハイライトを利用しています。


>シンタックスハイライトには Rouge を利用しており、下記の対応言語リストは上記サイトに準ずるもの>ですが、最新の状況に対応していない可能性もありますのでご了承ください。(編集リクエストをいただけ>れば幸いです :wink: )
>
>https://qiita.com/Qiita/items/e84f5aad7757afce82ba より引用

Rougeでは256色の色を用いることで100種類のプログラミング言語に対応しています。

>Rouge is a pure-ruby syntax highlighter. It can highlight 100 different languages, and output HTML or ANSI 256-color text. 
>
>https://github.com/jneen/rouge より引用
終了ステータスと標準出力の両方を受け取って処理

こんにちは。
終了ステータスと標準出力の両方を受け取って処理してみました。標準出力は一時的な変数（下記で```RET```）に格納しています。

```console
$ RET=$(grep lunch memo.txt) && echo "$RET" || echo "none"
lunch
$ RET=$(grep foo memo.txt) && echo "$RET" || echo "none"
none
$
$ cat memo.txt
lunch
dinner
$
```
Dockerfileを既存のDockerイメージから生成する方法

#既存のDockerイメージを再構築したい
Dockerイメージは取得できるけどDockerfileがないなーという場合に役立つ

#Docker historyコマンド
Dockerイメージの履歴を確認するコマンド
この履歴こそがDockerfileで実行されるコマンドに相当する。

Docker Documentation
https://docs.docker.com/engine/reference/commandline/history/

#Docker history 実行結果
##例として、centos7のDockerイメージの履歴を見てみる

```
$docker history centos:7 
IMAGE               CREATED             CREATED BY                                      SIZE                COMMENT
5182e96772bf        2 months ago        /bin/sh -c #(nop)  CMD ["/bin/bash"]            0B                  
<missing>           2 months ago        /bin/sh -c #(nop)  LABEL org.label-schema.sc…   0B                  
<missing>           2 months ago        /bin/sh -c #(nop) ADD file:6340c690b08865d7e…   200MB 
```

コマンドが一部省略されてしまう

##省略せずに表示してみる

```
$docker history centos:7 --no-trunc
IMAGE                                                                     CREATED             CREATED BY                                                                                                                                                                                                SIZE                COMMENT
sha256:5182e96772bf11f4b912658e265dfe0db8bd314475443b6434ea708784192892   2 months ago        /bin/sh -c #(nop)  CMD ["/bin/bash"]                                                                                                                                                                      0B                  
<missing>                                                                 2 months ago        /bin/sh -c #(nop)  LABEL org.label-schema.schema-version=1.0 org.label-schema.name=CentOS Base Image org.label-schema.vendor=CentOS org.label-schema.license=GPLv2 org.label-schema.build-date=20180804   0B                  
<missing>                                                                 2 months ago        /bin/sh -c #(nop) ADD file:6340c690b08865d7eb84a36050a0ab0e8effc2b010a4ccb20b810153a97a9228 in /                                                                                                          200MB  
```

どうしたらこんなにきたなくひょうじできるんだ...

##整形して見やすく表示
formatオプションにより、コマンド部分のみを抽出

```
$docker history centos:7 --no-trunc --format '{{ json .CreatedBy }}' 
"/bin/sh -c #(nop)  CMD [\"/bin/bash\"]"
"/bin/sh -c #(nop)  LABEL org.label-schema.schema-version=1.0 org.label-schema.name=CentOS Base Image org.label-schema.vendor=CentOS org.label-schema.license=GPLv2 org.label-schema.build-date=20180804"
"/bin/sh -c #(nop) ADD file:6340c690b08865d7eb84a36050a0ab0e8effc2b010a4ccb20b810153a97a9228 in / "
```

#履歴の新しい方から表示されるためDockerfileとして扱うには逆順にしてあげる必要がある

```
$docker history centos:7 --no-trunc --format '{{ json .CreatedBy }}' | tail -r
"/bin/sh -c #(nop) ADD file:6340c690b08865d7eb84a36050a0ab0e8effc2b010a4ccb20b810153a97a9228 in / "
"/bin/sh -c #(nop)  LABEL org.label-schema.schema-version=1.0 org.label-schema.name=CentOS Base Image org.label-schema.vendor=CentOS org.label-schema.license=GPLv2 org.label-schema.build-date=20180804"
"/bin/sh -c #(nop)  CMD [\"/bin/bash\"]"
```

##まとめ
ADDコマンドなどは、何やらファイルのIDなどを指すように置き換えられているため
そのまま流用できないが、参考にする程度のことはできると思う
ファイルなどもでてきたら嬉しいのだけど...
python3でWebスクレイピングやってみた

#Webスクレイピングやってみた
大学でpythonに入門してみたは良いものの、どう使おうか…。
スクレイピング？なにそれ楽しそう。
というわけでスクレイピングしてみました。
---
ちなみに環境はWindows10 python3.7です。
今回は角川さんから新発売の書籍のタイトルを取得してみました。

```python
import urllib.request, urllib.error
from bs4 import BeautifulSoup

url = "https://www.kadokawa.co.jp/product/search/?lgenre=13&releaseDate=1"
#python2系ではurllib.request(url)
html = urllib.request.urlopen(url)
soup = BeautifulSoup(html, "html.parser")

h2 = soup.find_all("h2")

book_titles = []
for tag in h2:
    try:
        string_ = tag.get("class").pop(0)
        if string_ in "book-title":
            ts = tag.string.replace('　', ' ')
            book_titles.append(ts)
            #break
    except:
        pass
print(book_titles)
with open('titles.csv', mode='w+',encoding='utf-8') as f:
    for i in book_titles:
        s = f.write('%s,' %i)
```

作ってみて
---
角川様のサイトを訪問された方はお気づきかと思いますが、上記のプログラムだと全てのタイトルを取得しきれておりません。
「もっと見る」ボタンをクリックしなければ見られないものがあり、そちらの対応も考えていかない…。
スクリプトでマウスオーバーすることもできるらしいので、きっと出来るはず…。
CentOS7へのOpenJDKインストールあれこれ

CentOS7にOpenJDKをインストールする時の備忘メモ

# OpenJDKのインストール
## 方法その1：yumコマンドによるインストール
コマンド打つだけなので一番簡単。
インストール先は```/usr/lib/jrm/```。
また、alternativesには自動で登録される。

```shell
# yumレポジトリからjava-1.8.0-openjdkのパッケージを検索する
$ yum search java-1.8.0-openjdk
# OpenJDKのランタイムをインストール
$ sudo yum install java-1.8.0-openjdk
# OpenJDKのdevelopmentkitをインストール
$ sudo yum install java-1.8.0-openjdk-devel
```

## 方法その2：rpmファイルからインストール
rpmファイルを配布サイト等からダウンロードしてインストールする方法であり、インターネットが繋がっていないなどyumコマンドでインストールができない場合に有効（当然ダウンロードはインターネットに接続している端末から行う）。ただし、インストール環境によってはJava以外の依存パッケージを予めインストールする必要がある。

rpmファイルは[pkgs.org](https://pkgs.org/download/openjdk)で配布されているのでダウンロードしてから下記の順番でインストールする。
yumコマンド同様、alternativesには自動で登録される。

```shell
$ sudo rpm -ivh java-1.8.0-openjdk-headless-1.8.0.171-7.b10.el7.x86_64.rpm
$ sudo rpm -ivh java-1.8.0-openjdk-1.8.0.171-7.b10.el7.x86_64.rpm
$ sudo rpm -ivh java-1.8.0-openjdk-devel-1.8.0.181-3.b13.el7_5.x86_64.rpm
```

※rpmファイルは下記からもダウンロードが可能

* [ftp.riken.jp](http://ftp.riken.jp/Linux/centos/7/updates/x86_64/Packages/)
* [ftp.jaist.ac.jp](http://ftp.jaist.ac.jp/pub/Linux/CentOS/7/updates/x86_64/Packages/)

## 方法その3：バイナリファイルからインストール(Java9以降)
Java9以降はOpenJDKのバイナリファイルからインストールする。

バイナリファイルは[jdk.java.net](http://jdk.java.net/archive/)に公開されているので、ダウンロード・解凍する。

解凍後任意のフォルダに移動させ、alternatives に登録する。

```shell
# tarファイルを解凍
$ tar xzvf openjdk-11_linux-x64_bin.tar.gz
# 任意のフォルダに移動
$ mv jdk-11 /usr/lib/java/

# 利用するコマンドをalternativesに登録する
$ alternatives --install /usr/bin/java java /usr/lib/java/jdk-11/bin/java 1
$ alternatives --install /usr/bin/javac javac /usr/lib/java/jdk-11/bin/javac 1
```

# 利用するJavaのバージョンの切り替え
複数バージョンがインストールされている場合、利用するJavaのバージョンをalternativesで切り替えることができる。

**javaコマンド**

```shell
# javaコマンドのalternatives確認 &「3」を指定してjdk11を利用する設定に変更
$ alternatives --config java

3 プログラムがあり 'java' を提供します。

  選択       コマンド
-----------------------------------------------
   1           java-1.7.0-openjdk.x86_64 (/usr/lib/jvm/java-1.7.0-openjdk-1.7.0.171-2.6.13.2.el7.x86_64/jre/bin/java)
*+ 2           java-1.8.0-openjdk.x86_64 (/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.181-3.b13.el7_5.x86_64/jre/bin/java)
   3           /usr/lib/java/jdk-11/bin/java

Enter を押して現在の選択 [+] を保持するか、選択番号を入力します: 3

# javaのバージョン確認
$ java -version
openjdk version "11" 2018-09-25
OpenJDK Runtime Environment 18.9 (build 11+28)
OpenJDK 64-Bit Server VM 18.9 (build 11+28, mixed mode)
```

**javacコマンド**

```shell
# javacコマンドのalternatives確認 &「2」を指定してjdk11を利用する設定に変更
$ alternatives --config javac

2 プログラムがあり 'javac' を提供します。

  選択       コマンド
-----------------------------------------------
*+ 1           java-1.8.0-openjdk.x86_64 (/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.181-3.b13.el7_5.x86_64/bin/javac)
   2           /usr/lib/java/jdk-11/bin/javac

Enter を押して現在の選択 [+] を保持するか、選択番号を入力します: 2

# javacのバージョン確認
$ javac -version
javac 11
```

# 参考情報
* [openjdk.java.net](http://openjdk.java.net/install/)
* [CentOS7系+JDK-9.0.1+JDK1.8.0+alternativesで切り替え](https://qiita.com/edward999th/items/ffec0ff3209797c43da7)
* [OpenJDK8をRPMでインストールする](https://qiita.com/yukiko-bass/items/3c6bbcaf44050cee6f2e)
* [参考メモ/CentOS7 の OpenJDK パッケージの構成メモ](https://qiita.com/msakamoto_sf/items/92d421bf724efa740350)
TwistRelaxer で変な動きをなんとかする

みなさん、元気にバ肉美してますか？

多分、Unityで作っている人の多くはFinalIKってアセットを買ってると思います。
その中にTwistRelaxerというモジュールがあります。

これは、自分の親と子の中間の回転を加えるものです。
手の角度によっては手首がぐいっとねじれるのが気になる人がいるでしょう。

そこで、前腕(肘と手首の間の部分)にTwistRelaxerを加えることで、
前腕も若干回転し、少し緩和することが出来ます。

ただ、TwistRelaxerでもうまく回転してなくね？ということがあります。
シーンに最初から置いている場合はOKなのに、あとからInstantiateするとダメだとか…。
(シーンに最初から置いているのにうまくいかない場合は多分仕様です 諦めてください)

これは、TwistRelaxerがStartで様々な値を計算しておくのですが、
Startのタイミング次第でちゃんとした値を計算できてないのが原因です。

そこで、Startのような実行時で計算するのではなく、
事前に計算するように修正します。

具体的に以下の部分を修正します
修正前

```csharp:TwistRelaxer.cs
	private Vector3 twistAxis = Vector3.right;
	private Vector3 axis = Vector3.forward;
	private Vector3 axisRelativeToParentDefault, axisRelativeToChildDefault;
	private Transform parent;
	private Transform child;

	void Start() {
		...
	}

```

修正後

```csharp:TwistRelaxer.cs
	public Vector3 twistAxis = Vector3.right;
	public Vector3 axis = Vector3.forward;
	public Vector3 axisRelativeToParentDefault, axisRelativeToChildDefault;
	public Transform parent;
	public Transform child;

	[ContextMenu("Preset Value")]
	public void Preset() {
	...
	}

```

privateの変数をpublicに変え、Startの関数をPresetに変えてプロパティをつけます。
その後、TwistRelaxerをアタッチしたオブジェクトで右クリックからPresetValueを選べば
これらのpublicの変数に値が設定されます。

追記

途中にも書いてますが、最初からシーンに置いているモデルはそのままです。
なぜこれが起きるかというと、TwistRelaxerはTポーズの状態でStartを呼ばれることを意図しているのに、
それ以外のポーズでStartが呼ばれてしまうので、Startより前にTポーズで固定した値を入れる、がこの記事の趣旨です。
備忘録：Mac でVagrantをインストールした時に出たエラーと対処

Ubuntuをインストールする際に以下のようなエラーが発生

```ruby:
The box you're attempting to add already exists. Remove it before
adding it again or add it with the `--force` flag.
```

調べた結果、~/.vagrant.dディレクトリを削除するために

```ruby:
$rm -r ~/.vagrant.d/
```
を入力。

もう一度

```ruby:
vagrant box add centos64 https://github.com/2creatives/vagrant-centos/releases/download/v6.5.3/centos65-x86_64-20140116.box

```
を入力した結果。

```ruby:
 box: Successfully added box 'centos64' (v0) for 'virtualbox'!
```
Ambari 経由でNiFi にログイン


# Environment準備
参考情報：
* [Launching a NiFi Docker Instance](https://community.hortonworks.com/articles/69043/launching-a-nifi-docker-instance.html)
* [NiFi 1.1](https://community.hortonworks.com/articles/69379/apache-nifi-110-on-docker.html)

---

# Task 1 :NiFi にログイン
## Ambari にログイン
Ambariのアカウントとパスワードを入れてログイン
<img width="859" alt="image.png" src="https://qiita-image-store.s3.amazonaws.com/0/133516/d2ff5506-861b-2009-317d-d59d9b6df898.png">

## Ambariにログインしたあと、NiFiのリンクを見つける
<img width="1183" alt="image.png" src="https://qiita-image-store.s3.amazonaws.com/0/133516/4656df31-0f3f-0ecd-401d-2b1d732484f5.png">

##【NiFi UI】メニューを選び、NiFiのメイン画面に遷移
<img width="604" alt="image.png" src="https://qiita-image-store.s3.amazonaws.com/0/133516/5685fce8-d97b-3a35-2791-e5d1477fde13.png">

## NiFiのメイン画面に入った
<img width="741" alt="image.png" src="https://qiita-image-store.s3.amazonaws.com/0/133516/95beab87-a6e2-0677-a9db-544d4e961855.png">
Thumbnail付きFLACファイルをALAC(Apple Lossless)に変換

# 目的
FLAC形式でハイレゾ音源を購入したが、iTunesで扱うにはALAC(Apple Lossless)形式の方が都合がいいので変換する、、手順の備忘録。

# 環境
Macbook Pro / macOS X mojave

# 手順
## 必要になるツールをインストール
```
brew install ffmpeg 
brew install atomicparsley
```

## コマンドの実行
まずオーディオ部分の形式の変換を以下の通り実行

```
ffmpeg -i 01-上を向いて歩こう.flac -vn -acodec alac 01-上を向いて歩こう.m4a
```

今回購入した音源はサムネイルがついていたのでその取り出し。

```
ffmpeg -i 01-上を向いて歩こう.flac artwork.jpg 
```

変換したALACファイルにサムネイルを付加

```
AtomicParsley 01-上を向いて歩こう.m4a --artwork artwork.jpg --overWrite
```

以上で画像もメタデータもそのままにFLACに変換できます。
NiFi Hands On@201810

# Goal
* Hands On
    * [Ambari 経由でNiFi にログイン](https://qiita.com/zz22394/items/0985d0c9862f8385e41f)
    * [Hello Wold: 一番シンプルなデータフローを作ってみよう](http://ijokarumawak.github.io/tutorials/nifi/hello-world)
    * [FTPからデータ取得](https://qiita.com/zz22394/items/120060f91ef407f5e492)
    * [REST APIからのデータ取得](https://qiita.com/zz22394/items/7676ada5688f87a2acd2)
    * [Apache Webサーバー アクセスログ取得](https://qiita.com/zz22394/items/3375046d3b63cca62fd6)
Cozmo RSS reader

Anki から発売されている
やんちゃなロボット <a href="https://www.amazon.co.jp/gp/product/B07416TJRD/ref=as_li_tl?ie=UTF8&camp=247&creative=1211&creativeASIN=B07416TJRD&linkCode=as2&tag=unagi0906-22&linkId=95d4c9f64dcf2f514425eb9788ca5d0b">COZMO</a> によるRSSリーダーです
cozmo が
慣れない日本語で
YahooNewsのタイトルを永遠と読み上げてくれます。

<a href="http://cozmosdk.anki.com/docs/">cozmo sdk</a> を利用した "hello world" までの道のりと、pythonインストールは割愛

```
pip install feedparser
```

で、feedparser をインストールしてから以下のプログラムを実行

```python:CozmoRSS.py
#!/usr/bin/env python3

import feedparser
import cozmo

rss_url = "https://headlines.yahoo.co.jp/rss/trendy-all.xml"

# MUGEN loop
while(1):
    # get RSS
    feed = feedparser.parse(rss_url)

    # read RSS
    for entry in feed.entries:
        # view Title log
        print("-----------------")
        print(entry.title)
        def cozmo_program(robot: cozmo.robot.Robot):
            robot.say_text(entry.title).wait_for_completed()
            robot.say_text("Next News").wait_for_completed()

        # run
        cozmo.run_program(cozmo_program)
```

お手軽 python と cozmo のコンビで簡単！
Laravelで作成した会員制サービスをGA上で会員・非会員でセグメントする

Laravelで作成したSPAの会員制サービスで、会員と非会員のユーザーのログを測定するためのメモです。

# やったこと
* 会員と判定するためにカスタムディメンションを作成  
* GTMでPV測定時にカスタムディメンションを測るように設定
* Laravel側でログイン状態をチェックし、htmlタグにクラス名を付与。  
* 計測！

## ステップ1
GA上で会員測定するためにカスタムディメンションを作成します。　　
カスタムディメンションは管理の中のプロパティにあるカスタム定義からいけます。
新規に作成するを押して、「会員」とかで作成
![スクリーンショット 2018-10-09 23.11.45.png](https://qiita-image-store.s3.amazonaws.com/0/77132/191aa77c-e090-f884-85bb-135ecc0e044b.png)
## ステップ2
次にタグマネ上で、
PV測定するタグに、カスタムディメンションを足します。
インデックスは先程作成したカスタムディメンションの値を使います。
![スクリーンショット 2018-10-09 23.13.17.png](https://qiita-image-store.s3.amazonaws.com/0/77132/4fdfdeff-6c80-5ca5-c99e-e4bbd4d30ff9.png)

変数「`{{会員かどうかの判定}}`」はカスタムjavascriptで以下のように定義しました。  

```
function(){	
  return (document.getElementsByClassName('data-gtm-is-logged-in').length > 0) ? 1 : 0;
}
```

## ステップ3
Laravel側のblade内にログインの判定を仕込みます。  
Controller上で下記の変数を返して、

```  
 return view('hoge', ['isLogin' => Auth::check()]);
```  

blade上で下記のように判定します。

```
<html lang="ja" class="{{ (isset($isLogin)) ? 'data-gtm-is-logged-in' : ''}}">
```
これで、各PV測定時に会員の場合は変数「`{{会員かどうかの判定}}`」に１が返るようになります。

最後にGA上でセグメントを作成して完了です。
フィルタは会員にし、値を1に設定してあげれば測定可能です。
![スクリーンショット 2018-10-09 23.23.26.png](https://qiita-image-store.s3.amazonaws.com/0/77132/1777159f-acdd-85ae-bcc2-65c0ef6a97e8.png)

こんな感じで会員と非会員ごとのユーザーログを測定します。
KUSANAGI Runs on DockerのFTPの設定で困った時の対処法

FTPを設定しないとプラグインやテーマが入れられない状態でDockerのKUSANAGIのWordPressが起動します。
解決策として
- FTPのDockerを立てて連携させる
- WordPressのFTPの設定をいじる
がありますが、オススメは、設定をいじる方です。

非常に簡単で一瞬で終わります。

## WordPressのFTPの設定をいじる

ファイルをいじるには、
`$ docker exec -it kusanagi-data /bin/bash`
でログインする。
`$ vi /home/kusanagi/kusanagi/wp-config.php`

```
//ここの行を追加
define('FS_METHOD', 'direct');
```

## 参考
[Mac & Docker MachineでKUSANAGI on Dockerを試す](https://watercolor.wpblog.jp/article/2017-08-18/375)
Zend Framework Tutorials #1

日本語に訳しながら自分メモ

# ZendFrameworkでMVCアプリケーション

MVCで簡単なDBがあるアプリケーションをZendFrameworkで作ってみるよ
最終的にはZFでのアプリケーションの動きがわかって、
自分で探せるようになっているはずだよ

## 用意する
 - PHP5.6以上 
 - (PDOにてアクセス可能なapacheとMySQL)
 - mod rewrite
 - apacheが.htaccessファイルをサポートしていること（※1）


(※1)
これに関してはhttpd.confファイルをこうやって変えればok
`AllowOverride None`→`AllowOverride FileInfo`
ここちゃんとやらないとできないよん

### 早く始めたい人へ
 - ビルドインウェブサーバーを使おう

`php -S 0.0.0.0:8080 -t public public/index.php`

 - Vagrantを使おう

`vagrant up`

 - dockerを使おう
 
`docker-compose up -d --build`

## チュートリアルアプリケーション

シンプルなアルバムの在庫管理システムを作るよ
そのために以下の4つのページから成るアプリケーションを作るよ

|ページ|説明|
|:-:|:-:|
|アルバムたちのリスト|リストの表示、編集、削除、追加が一括でできるページ|
|新しいアルバムを追加する|新しいアルバムを追加できるページ|
|アルバムを編集する|アルバムを編集するページ|
|アルバムを削除する|確認後、アルバムを削除するページ|

また、データベースに以下のテーブル(1つ)も保存しておく必要がある。

|カラム|タイプ|null?|備考|
|:-:|:-:|:-:|:-:|
|id|integer|❌|プライマリーキー、オートインクリメント|
|artist|varchar(100)|❌||
|title|varchar(100)|❌||
Python2のdatetime.strptimeはスレッドセーフではない

# 概要
python2でthreadingモジュールを使用して並列処理を実装した際に、datetimeのstrptime関数がエラーを吐いて、対処法について調べたのでその内容を記す。

# 検証環境
* windows10
* python2.7.11

# 再現コード
```python
from datetime import datetime
import threading

def parse_time(datetime_str):
    print datetime.strptime(datetime_str, "%Y-%m-%d %H:%M:%S")

threads = []
for _ in xrange(20):
    thread = threading.thread(target=parse_time,
                              args=["2018-01-01 12:34:56"])
    threads.append(thread)

for thread in threads:
    thread.start()
```
上記のようなコードを書いた場合に、実行時以下のようなエラーを吐く。

```python
Exception in thread Thread-8:
Traceback (most recent call last):
  File "C:\Python27\lib\threading.py", line 801, in __bootstrap_inner
    self.run()
  File "C:\Python27\lib\threading.py", line 754, in run
    self.__target(*self.__args, **self.__kwargs)
  File "{実行ファイルまでのPath}", line 5, in parse_time
    print datetime.strptime(datetime_str, "%Y-%m-%d %H:%M:%S.%f")
AttributeError: 'module' object has no attribute '_strptime'
```

# 原因
タイトルの通りPython2のstrptimeはスレッドセーフではないらしい。
探したら[それらしいIssueもある](https://bugs.python.org/issue7980)。だいぶ昔からある模様

# 対応
[こちらを参考にした](http://blog.namis.me/2012/02/14/python-strptime-is-not-thread-safe/)
threadingの処理が始まる前に、ダミーで一度呼べば良いそう。
なので先程のコードだと以下のように、threadがスタートする前に仮の呼び出しを一度行えばエラーが解消される。

```python
"""前略"""
# 以下を追加。
datetime.strptime("2018-01-01 12:34:56", "%Y-%m-%d %H:%M:%S")

threads = []
for _ in xrange(20):
    thread = threading.thread(target=parse_time,
                              args=["2018-01-01 10:10:00.123456"])
    threads.append(thread)
"""後略"""
```

#まとめ
動くようにはなったものの、対応方法が完全にバッドノウハウで悲しい。
なお、Python3.6.4で同様の処理を試したところ問題なく動作した。
Maya等のDCCでも早くPython3が使えるようになってほしい。
pipeをweb socketにつなぐコマンドをRustで書いてみた

# wspipe

Linuxのプロセス間通信であるpipeをweb socketにつないで、インターネットをまたいで使えるようなコマンドをRustで書いてみました。

ソースコードはgithub に上げました。
https://github.com/tetsu-koba/wspipe-rs

# 使用方法

`stdin2ws` と `ws2stdout` という2つのコマンドがあります。
`ws2stdout`　が受信側でありweb socketを開いてlistenします。
そこに`stdin2ws`で送信することができます。

例として、受信側(ipアドレスは192.168.10.120)では以下のようにしてポート8001にweb socketを作って待ち受けます。

```
./ws2stdout 0.0.0.0:8001 |tee kern.log
```

それに対して、以下のように`/var/log/kern.log` をwebsocket経由で流すことができます。

```
sudo tail -f /var/log/kern.log | ./stdin2ws ws://192.168.10.120:8001
```

これはある実験のために作ったのですが、それに関しては次の記事で。
(2018.10.10 書きました。[Websocketで簡単に音声のストリーミングをしてみる](https://qiita.com/tetsu_koba/items/daf89efed2b7f95adfe6))

# つまずいたところ

websocketにはws-rs のクレートを使用しています。
https://crates.io/crates/ws

```rust
pub fn stdin2websocket(url: &str) {
    let (sender, receiver) = channel::<u32>();
    if let Err(error) = connect(url, |out| {
        let s2 = sender.clone();
        thread::spawn(move || {
            send_binary(&out);
            thread::sleep(time::Duration::from_millis(100));
            out.close(CloseCode::Normal).unwrap();
            s2.send(1).unwrap();
        });

        msg_handler
    })
    {
        println!("Failed to create WebSocket due to: {:?}", error);
    }
    receiver.recv().unwrap();
}
```

`ws::connect()` の引数で渡すクロージャの中でスレッドを起こしてstdinからwebsocketに転送をするのですが、このスレッドの終了を待つ方法で苦労しました。
このクロージャが FnMut であり、複数回実行される可能性のあるものであるため、単純に所有権をmove させることができないのです。コンパイルエラーになります。
channelのsenderをcloneして渡せばよいということに気がつくまでかなりかかりました。
channelはreceiverはcloneできませんが、senderはclone可能です。
(パッケージ名のmpscはMulti-producer, single-consumer の意味)

また、転送終了後にcloseする前に100msのwaitを入れましたが、これが無いとcloseがエラーになります。まだwebsocketの処理が完了していないためと思われるのですが、ちょっと解せません。バグを踏んでいるのか、やり方が間違っているのか。
Django2.1.2が出ていた。startprojectがうまくうごいてくれなかった。

Ubuntu1804Desktopで久々にDjangoやろうかと思ってたら、Django2.1.2が出ていました…。

`Pip3 install Django`でインストールし、

```sh
ajitama@ajitama-pc:~/python_code$ django-admin startproject mysite

Command 'django-admin' not found, but can be installed with:

sudo apt install python-django-common

ajitama@ajitama-pc:~/python_code$ 
```

あれ・・・？ってなりました。(2.1.1ではできてた…と思う。)
おかしい。いつもならできるのに…なんとかできないかな…。と思って。
`python -m django hogehoge`　でなにかみつからないかと思いたち、やってみました。

```sh
ajitama@ajitama-pc:~/python_code$ python3 --version
Python 3.6.6
ajitama@ajitama-pc:~/python_code$ python3 -m django

Type 'python -m django help <subcommand>' for help on a specific subcommand.

Available subcommands:

[django]
    check
    compilemessages
    createcachetable
    dbshell
    diffsettings
    dumpdata
    flush
    inspectdb
    loaddata
    makemessages
    makemigrations
    migrate
    runserver
    sendtestemail
    shell
    showmigrations
    sqlflush
    sqlmigrate
    sqlsequencereset
    squashmigrations
    startapp
    startproject
    test
    testserver
Note that only Django core commands are listed as settings are not properly configured (error: Requested setting INSTALLED_APPS, but settings are not configured. You must either define the environment variable DJANGO_SETTINGS_MODULE or call settings.configure() before accessing settings.).
ajitama@ajitama-pc:~/python_code$
```

泣きそうで吐きそうだった経験が生きました。
`startproject` ありますね！
ってことで。

```sh

ajitama@ajitama-pc:~/python_code$ python3 -m django startproject sample_site
ajitama@ajitama-pc:~/python_code$ ls -l
合計 4
drwxrwxr-x 3 ajitama ajitama 4096 10月  9 22:57 sample_site
ajitama@ajitama-pc:~/python_code$ ls -l sample_site/
合計 8
-rwxrwxr-x 1 ajitama ajitama  543 10月  9 22:57 manage.py
drwxrwxr-x 2 ajitama ajitama 4096 10月  9 22:57 sample_site
ajitama@ajitama-pc:~/python_code$ 

```
できたみたい

`python3 manage.py runserver 0.0.0.0:8000`　で見てみたら、
無事プロジェクトができてました。

ウチだけでしょうかね…こんなの。
ECDLP用の学習ρ法発見

学習ρ法を発見(2018年7月)
1. Cでプログラム化(2018年9月)
2. 60ビットECDLP44件の結果(学習ρ法、ρ法)
 ρ法は約10時間、学習ρ法は約30秒、1200倍の高速化
 http://ushiro.jp/ECC/Result.htm
その後学習ρ法は、学習λ法、AI学習λ法へと発展し30万倍の高速化
 https://ecc-256.com 参照
DbUnitでの予約語のエスケープ方法

#DbUnitでの予約語のエスケープ方法
- DbUnitでテーブルのカラム名にDBの予約語を使おうとすると例外がスローされた
- DBの予約語を使う際は、エスケープ処理が必要そう

```java
DatabaseConfig config = connection.getConfig();
config.setProperty(DatabaseConfig.PROPERTY_ESCAPE_PATTERN, "\"?\"");
```

#参考にしたサイト

- http://dbunit.sourceforge.net/properties.html#qualifiedtablenames
- https://stackoverflow.com/questions/17728005/escaping-reserved-keywords-in-dbunit-for-db2
Railsのdeviseでログインしている時に新規登録画面、ログイン画面へ行こうとしたらルートへ飛ばす

#やりたいこと
Railsのdeviseを使い、
「ログインしている状態」の時は
新規登録orログイン画面へ飛べないようにする。

##動き
ログインしている時に
新規登録orログイン画面へ飛ぼうとしたら
ルートへ飛ばす。


#実装方法
ルートを確認すると以下のようになっている。
新規登録 > sign_up > devise/registrasions#new
ログイン  > sign_in > devise/sessions#new

![image.png](https://qiita-image-store.s3.amazonaws.com/0/145707/7e85f559-e484-9e06-de36-b43451f82667.png)

上記2つのアクション時に
サインインしていたらルートへリダイレクトするように設定する。

#コード

##新規登録
```ruby:app/controllers/users/registrations_controller.rb

class Users::RegistrationsController < Devise::RegistrationsController
  # before_action :configure_sign_up_params, only: [:create]
  # before_action :configure_account_update_params, only: [:update]

  # GET /resource/sign_up
  # newの部分のコメントアウトを外し、redirect_toを追加
  def new
    redirect_to :root if user_signed_in?
    super
  end

  # POST /resource
〜〜〜〜〜
省略
〜〜〜〜〜

end
```

##ログイン

```ruby:app/controllers/users/sessions_controller.rb
class Users::SessionsController < Devise::SessionsController
  # before_action :configure_sign_in_params, only: [:create]

  # GET /resource/sign_in
  # newのコメントアウトを外してリダイレクト、ifを入れる
  def new
    redirect_to :root if user_signed_in?
    super
  end

  # POST /resource/sign_in
〜〜〜〜
省略
〜〜〜〜

end
flexを使って要素を手っ取り早く縦横の中央寄せにしたい

![image.png](https://qiita-image-store.s3.amazonaws.com/0/235100/10cf8acd-36e0-d412-ce09-531d4aee9bf0.png)

こんな感じでDOM要素のど真ん中に寄せたい時に、毎回忘れそうになるので備忘録もかねて

# flexバンザイ

```flex.html
<div style="width: 100px;height: 100px;display: flex;align-items: center;justify-content: center;background-color: antiquewhite;">
    test
</div>
```

displayをflexに、align-items、justify-contentの両方ともにcenterを指定してあげればOKです。
昔はvertical-alignとかで頑張ったなぁ:sob:
【TIC-80】三日月爆発を再現したかった

まずは結果。

![missile.gif](https://qiita-image-store.s3.amazonaws.com/0/284455/0d8030b9-bae8-7453-c6df-e186f164fb63.gif)

塗り残しっぽいのはありますが、一応想定通り？

##作成理由

[とあるゲーム](http://www.nicovideo.jp/watch/sm9176841 )を「[TIC-80](https://qiita.com/yamachan360/items/3544a96f0dbea31224be )」という [FantasyConsole](https://medium.com/@G05P3L/fantasy-console-wars-a-guide-to-the-biggest-players-in-retrogamings-newest-trend-56bbe948474d ) に移植しようとしているのですが、

ふと以前に読んだ「[ミサイルコマンド](https://www.youtube.com/watch?v=SmgWMHenJBA )で**三日月型の爆風**が表示される場合があるが、それは画面処理の問題で意図したものではなかった」みたいな記事を思い出しました。
その時は「へーそうなんだー」くらいに思ってたのですが、「TIC-80」でそれを再現できるのでは？、と思ったのがきっかけです。
（もう一度その記事を読みたいのですが探し方が悪かったのか見つけられませんでした。
　ご存知の方がおられましたら教えて頂けると幸いです。）

##描画処理

爆風を表す円が大きくなってその後小さくなる、というのを**最も軽い処理**で実現するなら、

- 円の半径を少しずつ大きくしながら、その**外側のみ描画**
- 小さくするときも同様に**外側のみ背景色で描画**しつつ半径を小さくしていく

ってことでしょうか。
「TIC-80」には「circb(x,y,r,c)」中心座標x,y、半径r、色c の円を幅1ドットで描画、という
APIがあるので、それを使用。上記の処理のみ記述。

```missile.lua
MIN_X,MAX_X=40,200
MIN_Y,MAX_Y=40,100
BGCOLOR,BOMBCOLOR=0,15
ran,min=math.random,math.min

function bomb(br,x,y)
	local mcnt,cnt=br*2,br*2
	return function()
		if cnt<1 then return end
		cnt=cnt-1
		r=min(cnt,mcnt-cnt)
		circb(x,y,r,cnt>mcnt//2 and BOMBCOLOR or BGCOLOR) end end

function testinit()
	t=0
	bombr=15
	bmaket=8
	updatet=5
	maxb=100
	bombs={}
	cls(BGCOLOR)
end

testinit()

function TIC()
	if t%bmaket==0 then
		table.insert(bombs,bomb(bombr,ran(MIN_X,MAX_X),ran(MIN_Y,MAX_Y)))
		if #bombs>maxb then
			table.remove(bombs,1) end end
	if t%updatet==0 then
		for i,f in ipairs(bombs) do f() end end
	t=t+1
end

```
（幅40文字,高さ17文字の TIC-80 のエディタで書いているため最近はTIC()やinit()以外の
 end 前では改行しないスタイルを使用。MoonScriptとかLispっぽいインデントスタイル？）
スタイル以外にも色々問題がある気がしますが‥。

自分はLuaしか知らないためこのようなコードになりましたが他の言語だとどういう書き方に
なるのかは興味あります。（TIC-80は javascript も使えますのでどなたか！ （笑）
processing とかだともっときれいに表示されるのでしょうか？

##まとめ

- 円を大きくして小さくする、という処理のみで三日月型の爆風が再現できた

ここからは自分の想像ですが、意図したものではなかったが
面白かったので残した
みたいな感じだったのではないかと思います（スト2のキャンセル技みたいに）。
マクロスで有名（？）な三日月型爆発ですが、ミサイルコマンドの発売が
1980年。マクロス放送開始が1982年。
三日月型爆風がミサイルコマンドからインスパイアされた、という説も
結構信憑性がある気がしますね。
（今、ちょっと調べたらマクロスのバリア制御？がトラックボール？　おー）
NUnitのCategoryを用いて、特定のテストコードをCIに実行させない

　NUnitのテストコードをJenkinsなどのCIで動かすとき、ローカルでは成功するのに、CIサーバーでは失敗し、訳あって成功できないことがあります。
　UIを伴うテストコード、DBを直接更新するテストコードなど……。
　動くような環境を作りたいのは山々だが、余裕がない。
　こんなとき、CIでの実行を無視したい場合の対応方法としてCategoryアトリビュートを使って、ひとまずCIで実行させない方法を紹介します。

# 参考サイト
https://github.com/nunit/docs/wiki/Console-Command-Line

# 試行環境
+ TeamCity
+ NUnit 3.6.0

手元の環境がTeamCityなのでTeamCityで説明しますが、Jenkinsでも同様のことができると思います。

# Categoryアトリビュートの宣言
　あらかじめ、CIで除外対象にするカテゴリー名を決めておきます。
　今回は「BuidServerIgnore」として宣言しますが、「JenkinsIgnore」でも、お好きなように。
　除外したいテストコードにCategoryアトリビュートで宣言します。

```C#
    /// <summary>
    /// <see cref="BaseGameInfo.SaveDataBase"/>をテストします。
    /// </summary>
    /// <remarks>
    /// TeamCityだと失敗するので、Category属性を付与
    /// </remarks>
    [Category("BuildServerIgnore")]
    [Test]
    public void SaveDatabase()
    {
        // 何かしらの DB処理
    }
```

# CI（TeamCity）で除外するように設定

NUnitの起動引数に「--where "cat != BuildServerIgnore"」といったように宣言します。
これで「BuildServerIgnore」とCategoryが宣言されたテストコードは除外されます。

<img width="738" alt="スクリーンショット 2018-10-09 22.58.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/257214/95cc53d0-5683-b558-8920-d2dc38dc7448.png">


## おわりに

　実際には、オンコードではなく、定数化しておいてCategory宣言が良いかと思います。

```C#
    public class TestSetup
    {
        public const string BuildServerIgnoreCategory = "BuildServerIgnore";
    }
```
```C#
   [Category(TestSetup.BuildServerIgnoreCategory)]
   [Test]
   public void SaveDatabase()
   {
        // 省略
   }
```
Oracle SQL(11g)でMySQLのLIMIT OFFSET句を再現したい

# 動作環境
- MySQL 8.0
- Oracle Database 11g

# MySQLの場合

10レコード分取得した場合は、

```sql
SELECT column1 FROM table1 LIMIT 10;
```

10レコード目から20レコード取得した場合、下記のようになります。

```sql
-- MySQLの書き方①
SELECT column1 FROM table1 LIMIT 10 OFFSET 20;

-- MySQLの書き方②
SELECT column1 FROM table1 LIMIT 10 20;
```

②のように、OFFSETを省略して記載することも可能です。
しかし、個人的には、①をよく使っている気がします。

# Oracle SQLの場合


でもOracleだと、LIMITもOFFSETもありません。
Oracleの場合は、疑似列ROWNUMを使用すれば実現できます。

10レコード分取得した場合は、

```sql

SELECT column1 FROM table1 WHERE ROWNUM <= 10;
```

注意しなければならないのは、10レコード目から20レコード取得した場合です。
下記のように書きたくなりますが、これでは取得できません。
（自分はよく忘れて、こう書きます…………）

```sql
-- これでは取得できない！！！
SELECT column1 FROM table1 WHERE ROWNUM <= 10 AND 20 <= ROWNUM;
SELECT column1 FROM table1 WHERE ROWNUM BETWEEN 10 AND 20;
```

最初にfetchされた1行目がROWNUM=1となり、WHERE句の条件を満たすものがないため、レコードを取得できません。
なので、副問合せを使用して、ROWNUMを確定させてから、範囲指定して取得する方法を取る必要があります。

```sql
SELECT
  column1 
FROM
  ( 
    SELECT
      column1
      , ROWNUM AS rn 
    FROM
      table1
  ) 
WHERE
  rn BETWEEN 10 AND 20
```

しかし、ROWNUMには**欠点**があります。
それはORDER BYを使った場合、意図しない順番でデータが取れてしまう場合があることです。
詳細は割愛しますが、ORDER BYする前に、ROWNUMの採番が行われてしまっているためです。

なので、Xレコード目からXレコード分取得する場合は、
ROW_NUMBER()を使用したほうが無難です。

```sql
SELECT
  column1 
FROM
  ( 
    SELECT
      column1
      , ROW_NUMBER() OVER (ORDER BY column1) AS rn 
    FROM
      table1
  ) 
WHERE
  rn BETWEEN 10 AND 20
```

ちなみに、selectする項目にアスタリスク(＊)を使いたい場合は、

```sql
SELECT
  *
FROM
  ( 
    SELECT
      table1.*
      , ROW_NUMBER() OVER (ORDER BY column1) AS rn 
    FROM
      table1
  ) 
WHERE
  rn BETWEEN 10 AND 20
```

テーブル名.＊という形式になります。

# おまけ

## Oracle Database 12cの場合

oracle 12cの場合は、もっと簡潔に記載することができます。

```sql
SELECT column1 FROM table1 ORDER BY column1
OFFSET 10 ROWS FETCH FIRST 10 ROWS ONLY;
```