OmniAICreator/Qiita-1.07M huggingface dataset:
【2018年版】WEB初心者がはじめに使うべき学習サービス 10個


#〜2018年はプログラミング学習サービス戦国時代

ここ2,3年でエンジニアの需要が高まった社会背景から、プログラミング学習サービスが多くリリースされた。
ざっと有名なところだけでも以下の通り。

- Progate
- Schoo
- ドットインストール
- N予備校
- CodeCamp
- Udemy
- paiza
- CODE MONKEY
- シラバス

その多くは動画や開発画面で実践的な内容となっており、
また全くの初心者でも取り組めるよう各々工夫がなされている。
しかし上記の各サービスには利用者のタイプや状況に応じて合う/合わないがあり、
それを見極めないとプログラミングに対するネガティブな第一歩で終わってしまう危険性もある。

今回はそれぞれの特徴をもとに、読者にあった学習サービス選びの参考になればうれしい。

#コツコツ実践タイプは[Progate](https://prog-8.com/)

![progate.png](https://qiita-image-store.s3.amazonaws.com/0/202968/fd52c80f-5b1d-d211-cea8-1c08c97e6f6a.png)

Progateはゲーム感覚で自分のレベルをあげながら、実践を繰り返して実力をつけることができる学習サービス。
無料から利用が可能で、基礎の基礎からステップごとに教えてくれるため手っ取り早く学ぶことができる。

ただし、少し発展的な内容になるとコンテンツが乏しい、また説明が不十分なため
大まかな書き方や概念を学んだらそれ以降は技術書や実際に自分でWEBサービスを作りながら学んでいったほうがいいかと思われる。

#動画で流し見 [ドットインストール](https://dotinstall.com/)

![ドットインストール.jpg](https://qiita-image-store.s3.amazonaws.com/0/202968/bd8e98d8-3ff8-8372-85bb-367aaba35234.jpeg)

実践というよりは、動画でのインプットがメインとなるドットインストール。
Progateよりも前にリリースされ、非常に幅広い言語・技術分野を扱っている。
実際に講師がプログラムを組む様子を動画で見ながら、PCがあれば自分で手を動かすかたちになるため、
自由度は高いものの、エラーが出た際のリカバリーも自分で行う必要がある。

また動画コンテンツの量は膨大であることから、すべてを網羅しようとするとかなり大変・・・。
決まった分野をはじめに決めて、それをまずは流し見聞きでインプットすることが非常に重要だと思われる。
ちなみに無料プランもあるため今すぐにでも利用開始可能。

#プログラミング以外も学びたいなら [Schoo](https://schoo.jp/guest)
![schoo-01.jpg](https://qiita-image-store.s3.amazonaws.com/0/202968/bf7f36e6-cd73-a393-bafa-3abcd6d76c2e.jpeg)

プログラミングを始めるきっかけは、「新しいスキルを身に着けたい」という考えの方もいる。
そんな方にはプログラミング以外の様々なスキルや知識を動画でインプットできるSchooがおすすめ。

イメージとしてはお上品なニコ生。
プログラミングはもちろん、ビジネス・英語・デザイン・マーケティングなど新しい第一歩を後押ししてくれるような動画コンテンツが豊富。
基本的には生放送の動画を見ながら授業を受ける感覚で進めていくが、どうしても見れないというかたは後から保存された動画をみることもできる。
ただし、プログラミングに関しては実践的というよりは、インプットの色合いが強いように見受けられる。
また無料プランもあるものの、有料でないと後から動画をみることができないため時間が不規則な社会人は有料プランを余儀なくされると思われる。。

#良いとこ取りの[N予備](https://www.nnn.ed.nico/pages/programming/)
![N予備校 プログラミングコース.png](https://qiita-image-store.s3.amazonaws.com/0/202968/f0715319-3231-5e1d-f34f-10fee51ccbba.png)

2017年にリリースされた「N予備」。
ニコニコ動画のドワンゴが運営し、プログラミング以外にも高校で学ぶ授業が動画で受けられる。
その中でもプログラミングコースがプログラマも絶賛の内容となっている。
基本的には生放送の動画(放送後の保存あり)+テキスト教材で自分のペースで進めていく。
ドットインストールにテキスト教材が付いたと思ってもらえればわかりやすい。

しかしこのテキスト教材のわかりやすさと、適切な量、そして幅広い範囲がエンジニアにも好評の理由のようだ。

そんな良いことづくめのN予備だが、有料プランのみしかないため月額1,000円が必須となることがデメリットか。
GASでサービスを作った話

#はじめに

この記事はGASってなんなの？という方に向けて書いています。２０１７年に書く内容じゃないというツッコミは無視しますのでご了承ください。

先日あるお客さんからメールで飛んでくるオーダーフォームをそれをPDF化して欲しいという要望を頂き調べたのですが、GASで結構すんなりと出来てしまいました。かなり便利で色々と面白そうな事が出来そうなので共有しておきます。

#GASってこんな感じ

##ブラウザ上で開発できる
[本家のページ](https://developers.google.com/apps-script/)で一目瞭然ですがブラウザ上のIDEで開発できます。

##GmailやGoogle Docなどを組み合わせたサービスが作れる

基本的に自分のアカウント以下のgoogleサービスを組み合わせてサービスが作れます。今回作ったのは、次のようなものです。

- Gmailを定期的に調べてフォームのメールを探す。(Gmail)
- 上記のメールをHTML形式でGoogle Docに書き出してPDFに変換して特定のフォルダに置く。(Drive)
- 上記のPDFを添付してメールをお客さんに送る。(Gmail)

結局GoogleサービスのAPIを叩いて色んなことをするのですが、APIにアクセスOAuthの設定だとかをいちいち設定しなくて良いので気楽に作れます（厳密には設定するのですが簡単です）。外部のAPIサービスにクエリーを出すことも出来るようなので、そういうサービスと組み合わせることも出来るようです。

##無料で色々出来る

普通のGoogleアカウントでかなりの事が出来ます。有料のGSuitesのほうがAPIを叩ける回数とかが多いのですが、今回は無料の範囲ですべて行いました。

##プログラムの定期実行も無料
これが個人的には一番驚いたのですが、プログラムを定期的に実行出来ます。しかも無料です。LambdaとかAzureのFunctionとかはお金がかかるので、この部分をどうしようか悩んでいたのですが。

**01/05/2018追記:** LambdaもAzureも無料枠がありました。

##GITHUB連携もできる

GASはブラウザ上で開発します。そこで構成管理とかどうするのだろう、、、と思っていたのですが、こんな[プラグイン](https://chrome.google.com/webstore/detail/google-apps-script-github/lfjcgcmkmjjlieihflfhjopckgpelofo)が。

私はこれでGitBucketにアップしました。ローカルで開発するツールとかもあったのですが、あまり使いやすくなさそうで、ひとまずこれに落ち着きました。とりあえず差分が管理出来れば良かったので。

ちなみにファイル名と同じ名前のクラスはPUSH出来ないようなので、使う時は注意して下さい。

##お客さんのアカウントにログインしなくてよい。

基本的に自分のGoogleアカウント間の連携しか出来ません。しかし、お客さんのGoogleアカウントにログインするわけにはいきません。
そこで今回はフォームのメールだけ転送するようにしました。これで自分のアカウントのGmailに転送されたメールをパースしてPDFを作って、お客さんのアドレスに送りました。作成したPDFは特定のフォルダに置いておいて、お客さんのアカウントと共有する事で、閲覧はしてもらえるようにしました。

##サーバーレスを体験できる

私はこれをやってサーバレスって何か腑に落ちました。これについては色々とあるのですが、書ききれないので「あぁそうなんだ」と思っていただければ。

#どんなプログラムなの？
いろいろな事情でまだフリーで公開とまでは行かないですが、どんな感じのプログラムになるか参考に貼っておきます。

##PDFファイルを作る関数

```
function createFilesByHtml(text, name, baseFolder) {
  var saveFolder = baseFolder + getSaveSubFolderName();
  var folderId = createFolder(saveFolder);
  var f = DriveApp.getFolderById(folderId);
    
  var file = f.createFile(name + ".html", text, MimeType.HTML);
  var htmlBody =  file.getAs('application/pdf');
  var pdfFile = f.createFile(htmlBody); 
  return pdfFile;
}

```

一つの問題はhtmlに画像を貼っても、PDF化する時に消えてしまいます。これは何とかならないかなと考えています。

#今後やってみたい事
GUIも組めるようなのでバックエンドをGoogle Sheetにした簡単なDBシステムは作れそうです。これはちょっと試してみたいです。
「N予備校」は本当にWEB初心者に優しいのか？

![N予備校 プログラミングコース.png](https://qiita-image-store.s3.amazonaws.com/0/202968/744ddf83-17b3-989a-e7ce-83cb94be287b.png)

#N予備校とは何か？
端的に言えば、中高生〜社会人に向けたeラーニングタイプのWEBサービス。
ドワンゴが運営していて、主に同社が経営するN高校向けに提供されている。

では、なぜN予備校がWEB初心者向けに良いとされているかというと以下の記事がすべてを語ってくれているので、特段言うことはない。

**[これからN予備校でプログラミングを学ぶ方へ](https://qiita.com/hiralin@github/items/f19a03ee41630e1344f1)**

#N予備校の何がいいのか？
丁寧に説明してくれる動画教材と、細かい部分まで説明してくれるテキスト、
それらが初歩の初歩から中級者向けの内容までを抑えている点が支持されているのかな。

とは言っても、「ぶっちゃけどうなの？」という方向けに実際にWEB初心者(非エンジニア)の自分が実践しているなかで感じた点をメモ代わりにおいておく。
今後N予備校がより拡大していくなかで、主観的な記事を書いて誰かの後押しになれればいいと思っている。

#N予備の良い点

- アプリでさくさく勉強ができる
- 不安なところ、苦手なところに関しては動画で詳細を補足できる
- 毎講義のコードがGithub上にあるため実践しながら学ぶことができる
- ややこしい構造の内容に関しては、簡易的なイラストでわかりやすい
- プログラミングの"プの字"から教えてくれる
- 技術の広い範囲を学ぶことができる

まずWEB初心者がつまづくのが、モチベーションが継続しないという点だと思う。
「何をやったらいいのかわからない」「いま自分がやっていることが身についているのか不安」「どこがゴールなのか・・・」などなど不安は増すばかり。
現に技術は日々進歩していて、学ぶスピードよりも新しい技術や考え方、単語がわんさかでてくる。
学校の勉強のように、100に対して自分の位置が見えながらインプットするのとは全く違うため多くの自主学習WEB初心者(自分もそう)がつまづくことが多いと思う。

でも、その点N予備ならまずコンテンツが細切れになっているため、日々やるべきことが明確だ。
１つのコンテンツ、例えば「JavaScriptのループ」など、がおよそ１０分程度で読める量にまとめられている。
もしわからない部分があれば、２時間弱の動画教材があるため補足しながらインプットができる。

さらに、フロントサイド・サーバサイド、iOS/Androidアプリ、Scalaを用いた大規模アプリなど幅広い内容が網羅されてなんと月々1,000円！
(べた褒めしてますがドワンゴさんからは一銭もいただいておりません。一銭くらいください。)

ただし、より改善できる点もまだあると思っている。

#N予備の改善できる点

- 動画コンテンツが長すぎる
- コンテンツの後ろにあるアウトプットの部分の出題・解説が少ない or アプリユーザ向けになっていない

サービスの仕様上、仕方がないのだが動画コンテンツの時間が長いと感じることもある。。
そもそもN予備校は、その名前から分かる通り「教室」のようなスタイルであり、ニコ生のシステムに予備校をのっけている。
よって生放送中のやりとりなどもすべて動画コンテンツとして残っており、
自分のように「後追い派」にとっては若干冗長に感じてしまうこともある。。

#それでもやっぱりN予備はWEB初心者におすすめ

世の中には様々なWEB初心者向けのサービスが存在する。

Progate、ドットインストール、CodeCampなど数えればきりがない。。
そのなかでも手軽さ、幅広さを考慮するとまずはじめにN予備で基礎を学ぶことは、WEB初心者にとって非常に有効なステップだと思う。
MAとBGM


## ことはじめ
只今2017/12/16 13:00 FESTA会場。開始を楽しみに待っているところ。
で、会場に流れているBGMがPE'zなんですよね。大好きなPE'zがBGMに使われていてテンションが上がったので、この記事を書きはじめてます。今までのCalendarでみんな技術的な面白い話とかMAのいいところとかを書きまくってくれているので、そこら辺は今更語るまでもないでしょうということで、誰もあまり目をつけてなさそうなところに目をつけてみました。


## お前一体誰なのよ
こういうものです。
@kojipole(https://twitter.com/kojipole)

現在はRepl-AIというチャットボットPFと、Sebastienという音声対話エージェントPFを作っているエンジニアです。MAでは主にAPI提供と技術サポートをする側の人ですね。たまに参加者側になったりもします。毎年新しい技術ネタを作ってはMAに持ってきて使ってもらって改善して、を繰り返しています。毎年暖かく迎えてくださるMAコミュニティには感謝しかありません。


## PE'zとは
めっちゃかっこいいジャズをやる素敵なグループです。
[wikipedia](https://ja.wikipedia.org/wiki/PE%27Z)でも置いておきましょう。 ※もう解散してしまっているのが悲しい。。。

## MAのBGMの選曲
今回のFESTAに限らず、よくPE'zが流れている気がします。ハッカソン中なんかは比較的落ち着いた音楽を流していることが多いですがそれもTPOを考慮した選曲がしっかりされていて、集中できるような雰囲気作りを怠らないのもMAの素晴らしいところ。

事務局か音響担当さんの辺りの趣味なんでしょうか？最高ですね。

聞いた感じ、曲の流れ的にこのCD辺りを流しているんじゃないだろうかと予想。
[侍JAZZ -PE'Z standard tracks-](https://itunes.apple.com/jp/album/%E4%BE%8Djazz-pez-standard-tracks/406903464)

めっちゃいいのでみんな聴こう。「人が夢を見るといふこと」とか「Akatsuki」とかいい曲です。

ファイナリストの登場曲もいい感じの曲使われてました。趣味が近い気がします。お友達になりたい。


## 舞台装置としてのBGMの重要性

ハッカソンはどうしても、

- 初対面の人が多い
- 制作作業はもくもく作るのでコミュニケーションが発生しづらい
- 他チームもいるし迷惑かけられない
- みんな真面目にちゃんとやる

みたいな条件が重なるので、結構重苦しい雰囲気になってしまいがちなんですよね。
そうなるとやっぱり発想は制限されるし、何より楽しくないですよね。

MA以外のイベントでもサポート側としてハッカソンに参加している関係もあり、全体の進行や環境に目が行くことが多いのですが、会場にBGMが流れているのと無いのでは雰囲気がまるで違います。BGMを含めたストレスを感じさせない会場の空気作りはとても大事だと個人的には思っています。

これは完全に霊感ですが、明るい雰囲気で笑顔が多いハッカソンは面白いものが出てくる確率が高い気がします笑 発表で大笑いが発生する確率というか笑


## 終わりに

MashupAwardsの運営さんのホスピタリティに敬意と感謝を表明しつつ、終わりにしたいと思います。来年もMAを楽しみにしてる一人です。皆さんまたよろしくお願いします。
TypeScript＆jestの構成でVSCodeのデバッガを使う

この記事は[TypeScript Advent Calendar 2017](https://qiita.com/advent-calendar/2017/typescript)の22日目の記事です。
空いていたので小ネタを。

## やりたかったこと
* TypeScript と Jest 使う
* Jest でカバレッジ出す
* VSCode のデバッガをストレスなく使う
  * 特にブレークポイントとか

## 問題
* カバレッジ出そうとしたらブレークポイント止まらない
* ts-jest 使うとブレークポイント止まらない

## 解決策
* Jest の設定を2つ用意
    * `package.json` 内にデフォルト設定
        * カバレッジ出す
        * ts-jest 使う

        ```json:package.json
        {
          "scripts": {
            "test": "jest --coverage"
          },
          ...
          "jest": {
            "transform": {
              "^.+\\.tsx?$": "ts-jest"
            },
            "testRegex": "(\\.|/)(test|spec)\\.tsx?$",
            "moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"],
            "coverageDirectory": "coverage",
            "collectCoverageFrom": ["src/**/*.ts", "!src/**/*.spec.ts", "!src/**/*.d.ts"],
            "mapCoverage": true
          }
        }
        ```

    * デバッガ起動時の設定
        * カバレッジ出さない
        * ts-jest 使わず `preLaunchTask` で事前にコンパイル
          * 設定自体は残さないと、なぜかブレークポイントで止めた際にコンパイル後のJSコード側に飛ぶ。。
          * `npm run compile` で `tsc` が走るようになってます

        ```json:.vscode/jest.json
        {
          "transform": {
            "^.+\\.tsx?$": "ts-jest"
          },
          "testRegex": "(\\.|/)(test|spec)\\.jsx?$",
          "moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"],
          "rootDir": "../"
        }
        ```

        ```json:.vscode/launch.json
        {
          "version": "0.2.0",
          "configurations": [
            {
              "name": "test",
              "type": "node",
              "request": "launch",
              "preLaunchTask": "compile",
              "program": "${workspaceRoot}/node_modules/jest/bin/jest",
              "args": ["--config", "${workspaceRoot}/.vscode/jest.json", "--runInBand", "--no-cache"],
              "sourceMaps": true,
              "outFiles": ["${workspaceRoot}/out/**/*"]
            }
          ]
        }
        ```

        ```json:.vscode/tasks.json
        {
          "version": "0.1.0",
          "command": "npm",
          "isShellCommand": true,
          "showOutput": "always",
          "suppressTaskName": true,
          "tasks": [
            {
              "taskName": "compile",
              "args": ["run", "compile"],
              "isBuildCommand": true
            }
          ]
        }
        ```

## その他
* SourceMap 吐いてないと正しい位置で止まらないとかあった
* 上記構成を以下のリポジトリでお試しできます。ぜひぜひ。<br>
  https://github.com/benishouga/typescript-basic
PythonやJavaで処理時間を計測する方法

処理性能の要件がシビアな場合、実装した処理の処理時間が気になることがあると思います。今回はPythonとJavaにおける処理時間を計測する方法について備忘録として記事に残したいと思います。

## Pythonで処理時間を計測する方法

```python:処理時間を計測
# -*- coding: utf-8 -*-
import time

# main
if __name__ == "__main__":

    # 開始時刻
    startTime = time.time()
    
    # 計測対象の処理
    # processing

    # 終了時刻
    endTime = time.time()
    
    # 処理時間の表示
    print(endTime - startTime)
```

## Javaで処理時間を計測する方法

```java:処理時間を計測
public class TimeWatchDemo {
    
    public static void main(String[] args) {

        // 開始時刻
        long startTime = System.nanoTime();
        
        // 計測対象の処理
        // processing
        
        // 修了時刻
        long endTime = System.nanoTime();
        
        // 処理時間の表示
        System.out.println(endTime - startTime);
    }
}
```
Go言語でExcelアートを作成する

この記事は[QiitaアドベンドカレンダーのGo2](https://qiita.com/advent-calendar/2017/go2) 22日目の記事です。

[昨年のアドベントカレンダー](https://qiita.com/tebakane/items/2f2ed2558357c274c478)ではExcelをGoで出力するライブラリとして
[excl](https://github.com/loadoff/excl)を作った話を書きました。今回は書くことがあまりにもなかったので
ネタのツールとしてexclライブラリを使用してExcelアートを
書き出すプログラム[go-exclart](https://github.com/loadoff/go-exclart)を書きました。

# go-exclartとは

png, jpegファイルを読み込んでExcelアートを作ってくれる
何の役に立つのかわからないけど私が作ってみたかったという自己満足のツール

## Excelアートって？

Excelの表計算ソフトとしての意味を完全に否定した芸術作品(Excelなどただの方眼紙である！)
ドット絵で書くパターンとシェイプを使用して書くパターンがある。
[参考](http://press.share-wis.com/excel-art)

## インストール方法

```bash
$ go get -u github.com/loadoff/go-exclart
```

ちょっと時間がかかるかも。。。
時間がかかって気になる場合は-vをつけてみてください。

## 使い方

```bash
go-exclart -i image.png -o output.xlsx
```

-i イメージファイルパス(png, jpegのみ対応) 必須
-f すでに存在するExcelファイルパス(指定しない場合は新規でExcelファイルが作成される)
-o 出力するExcelファイル(指定しない場合はoutput.xlsxファイルがカレントディレクトリに出力される)
-sheet 出力するシートを指定する(指定がない場合はSheet1に出力される) 
-row 出力開始箇所の行番号(1から)(指定がない場合は1)
-col 出力開始箇所の列番号(1から)(指定がない場合は1)

## 例

Gopherくんの画像をExcelアートにしてみる

![gopher.jpg](https://qiita-image-store.s3.amazonaws.com/0/104322/36e8a2ec-bebc-41a0-7b40-1d7991a87c13.jpeg)

```bash
$ go-exclart -i gopher.jpeg
```

出力結果、Excelファイル

![excel.png](https://qiita-image-store.s3.amazonaws.com/0/104322/a9e153a3-15e8-d6f4-693e-bb8cd44a4497.png)


## 何か役に立つの？

今の所役に立つ場面が思いつきません。
誰か思いついたら教えてください！

## 画像貼り付けたらいいんじゃない？

いや、至極真っ当なご意見です。
やってみたかったんです。ただそれだけなんです。
許してください。
(Excelファイル自体の大きさも画像を貼る方が小さいサイズになるのでいいとこ無し）

## 作ってみた感想

* ツールを作るにあたって、exclライブラリの改善を行ったのでドックフード大事
* イメージファイル操作が思いの外簡単でGo言語やっぱり優秀
* [xmlのライブラリ不具合](https://github.com/golang/go/issues/13400)については根が深いのかまだ直る気配無し(いや実際根が深くてどう直すのか難しそう)

### 問題点

大きいファイルになればなるほど
びっくりするくらい時間がかかるので何か対策を考えたいです。

### Gopherの画像について

GoのマスコットのGopherの原作者は[Renee French](http://reneefrench.blogspot.jp/)さんです。
Jupyter notebookのextensionを使ってオレオレPythonチートシートを作る

# はじめに
最近Jupyter NotebookでPythonを書き始めたのですが、関数がどうしても覚えられなかったり、綺麗なコードの書き方を忘れてしまって、なんども調べることがありました。

Jupyter Notebookにはjupyter_contrib_nbextensionsという拡張機能があります。

その中にあるTable of Contentsという目次を自動的に作ってくれる機能を使って、日頃使う関数やコードをまとめたチートシートを作ろうと思います。

# jupyter_contrib_nbextensionsとは
Jupyter Notebookの拡張機能を集めたものです。

ブラウザから様々な拡張機能のオンオフが出来ます。公式サイトは[こちら](http://jupyter-contrib-nbextensions.readthedocs.io/en/latest/index.html)。

今回使うTable of Contents以外にも様々な機能があるので、興味のある方は[この記事](https://qiita.com/sasaki77/items/30a19d2be7d94116b237)などを参考に色々試してみると良いでしょう。

# Table of Contentsとは
Jupyter_contrib_nbextensionの機能のうちの一つです。

Markdown記法に沿って、Jupyter notebookに目次をつけてくれます。

# Markdown記法とは
手軽に文章を書くための言語です。

Markdown記法のサンプル集は[ここ](https://qiita.com/tbpgr/items/989c6badefff69377da7)などを参照。

# インストールとアクティベーション

[公式サイトに載っているやり方](http://jupyter-contrib-nbextensions.readthedocs.io/en/latest/install.html)で進めていきます。

Jupyter notebookが起動してない状態で以下のコードを入力して下さい。  

```bash
pip install jupyter_contrib_nbextensions
jupyter contrib nbextension install --user
jupyter nbextension enable codefolding/main
jupyter contrib nbextensions migrate

#拡張機能を止めたいときは、以下のコードを入力
#jupyter nbextension disable codefolding/main
```

これでインストール完了です。  

インストール後にJupyterを起動すると、Nbextensionsというタブが現れます。

<img width="1149" alt="スクリーンショット 2017-12-22 23.35.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/175024/6058406c-daba-4c1d-1ce7-b3bc588274cb.png">

ここをクリックすると、様々な拡張機能のオンオフが出来るようになります。

拡張機能の詳細は画面下部に表示されます。

<img width="1145" alt="スクリーンショット 2017-12-22 23.39.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/175024/666ef43b-5747-c8f5-2dae-da869643aecc.png">

右下にあるTable of Contents(2)のチェックマークをクリックします。

チェックマークが付いていればアクティベーション完了です。

# 使い方

アクティベーションが終わった後に適当なnotebookを立ち上げると、以下のようなボタンが追加されているのがわかります。

<img width="1423" alt="スクリーンショット 2017-12-23 0.00.33.png" src="https://qiita-image-store.s3.amazonaws.com/0/175024/f62f761a-9fa1-7feb-6b51-f4b37b8e4bae.png">

Markdown記法に沿ってnotebookを記入した後にこのボタンを押すと、自動で目次を作ってくれます。

目次を消したい時にはこのボタンをもう一回押します。

<img width="1438" alt="スクリーンショット 2017-12-23 0.06.17.png" src="https://qiita-image-store.s3.amazonaws.com/0/175024/5d365d28-aa24-8b0e-b2d0-a64981a383df.png">

スクロールすると目次が自動で移動したり、目次をクリックすると該当するセルへジャンプしたり、とても便利です。  

後は、忘れやすい関数やよく使うコードなどを記入していけば、オレオレPythonチートシートの出来上がりです。

# 終わりに
オレオレPythonチートシートを作って、生産性を上げましょう。Enjoy!
wxPython(dockアイコン変更)

情報が少なかったのでよかったどうぞ
<h2>環境
<h6>MacBookPro(Retina, 13-inch, Early2015)
macOS Sierra version 10.12.6
Python3 3.6
wxPython 4.0.0b2

``` python3:wxpython.py
# -*- coding: utf-8 -*-
#!/usr/bin/python3
import wx.adv
application = wx.App()

frame = wx.Frame(None, wx.ID_ANY, u"テストフレーム")
dock = wx.adv.TaskBarIcon(iconType=wx.adv.TBI_DOCK)
icon = wx.Icon("logo.png",wx.BITMAP_TYPE_PNG)

dock.SetIcon(icon)
frame.Show()

application.MainLoop()
```
#TaskBarへのアイコン設定方法

```python3:wxstatusBar.py
#-*- coding: utf-8 -*-
#!/usr/bin/python3

import wx.adv


class TaskBarFrame(wx.Frame):
    def __init__(self, parent):
        wx.Frame.__init__(self, parent)

        self.taskbar = wx.adv.TaskBarIcon()
        icon = wx.Icon('logo.png', wx.BITMAP_TYPE_PNG)
        self.taskbar.SetIcon(icon, '')


app = wx.App()
frame = TaskBarFrame(None)
frame.Show()
app.MainLoop()
```


参考サイト
https://stackoverflow.com/questions/2822052/how-to-add-osx-menu-bar-icon-with-wxpython
dockerをmacにインストール

dockerをmacで簡単にインストールする方法について

### 環境について

- __OS__
macOS High Sierra

- __ツール__
[iterm2](https://www.iterm2.com) (teratermのmac版)
[Homebrew](https://brew.sh/index_ja.html) (yumとかapt-getのmac版)

~~dockerをHomebrewでインストール~~
__2016年くらいからHomebrewではなく[公式サイト](https://docs.docker.com/docker-for-mac/)からインストールするのがスタンダードとなっているようです。__

```shell
$ brew install docker
==> Downloading https://homebrew.bintray.com/bottles/docker-17.11.0.high_sierra.bottle.tar.gz
######################################################################## 100.0%
==> Pouring docker-17.11.0.high_sierra.bottle.tar.gz
==> Caveats
Bash completion has been installed to:
  /usr/local/etc/bash_completion.d

zsh completions have been installed to:
  /usr/local/share/zsh/site-functions
==> Summary
🍺  /usr/local/Cellar/docker/17.11.0: 8 files, 26.6MB
$ which docker                                                                                                                                                                                                                       [~/work]
/usr/local/bin/docker
```

## 何を動かすか
dockerはあくまでもコンテナなのでdocker環境に何か動かすものが必要です。
# __[nginx](https://ja.wikipedia.org/wiki/Nginx)__
__nginxとは__
これまではApacheの独壇場でしたが近年大規模システムを中心にシェアを伸ばしてきている__nginx__の学習も合わせてやっていきたいと思います。

- OSSのwebサーバ
- シングルスレッドモデル（node.jsなどでも採用している
I/O待ちをせず、どんどん次の処理に移っていく方式。）
そのため、多くのリクエストを処理するのには向いているが、CPUリソースが多く必要な重い処理はプロセスがブロックされて処理能力が落ちてしまう。

とりあえずdockerのインストールが完了しました。
__[次回　dockerを実際に動かしてみます。](https://qiita.com/kkkkkkkkkk1005/items/02b4ffae8af2578002e1)__

参考　[Apacheとnginxどちらを採用すべきかメリット・デメリット比較https://qiita.com/pink/items/7709218310b5cf11eabe](https://qiita.com/pink/items/7709218310b5cf11eabe)
Vagrantで作成したVMにWinSCPでログインする

Vagrantで起動したVMにファイルを送るならばsynced_folderを使えばいいのですが、
ここ、しょっちゅうマウントに失敗してしまいます。。。
そこで、WinSCPを使ってファイルを送るという手段を用意してみました。

## WinSCPを起動して情報を入力
画像のように設定値を入力します。
![winscp_conf1.png](https://qiita-image-store.s3.amazonaws.com/0/194735/a64c0def-747b-d1fb-7af9-2b186b926a89.png)

転送プロトコル：SCP
ホスト名：localhostまたは127.0.0.1
ポート番号：Vagrantfileで設定したホスト側のポート番号
ユーザ名：vagrant
パスワード：空欄のままでOK

## 秘密鍵の設定
「設定」ボタンを押して以下のように秘密鍵を設定します。
![winscp_conf2.png](https://qiita-image-store.s3.amazonaws.com/0/194735/116318f7-3170-76a3-9970-e42826a449dc.png)


SSH>認証>認証条件の「秘密鍵」に以下のファイルを指定。
VagrantのSSHで利用している秘密鍵は↓のパスにあります。

```
Vagrantfileのあるフォルダ/.vagrant/machines/<hostname>/virtualbox/private_key
```
※もし見当たらない時は`vagrant ssh-config`コマンドで確認することが出来ます。
OKボタンをクリックすると、
「秘密鍵OpenSSHをPuTTY形式に変換しますか？」が出るので「OK」をクリック。
変換しても元のファイルが削除されることはないので大丈夫。
心配な人はバックアップを取っておくと安心です。

## 「保存」をクリック
ここで、分かりやすいセッション名を付けることをお勧めします！
特にたくさんVMがある人。。。
あとは「ログイン」をクリックするとつながります！！
Java9で変わったことを調べてみた

# Java9正式リリース
2017年9月にJava9がリリースされました。Java8が2014年3月にリリースされてたので約3年半のメジャーアップデートになりました。
かなり出遅れた感がありますが、勉強メモとしてJava9についてまとめてみることにした。
全ての変更点を網羅できていないので自分が大事だと思った部分のみピックアップしています。

## 古いOSのサポート終了
Java9からは32bitのOSには提供されなくなりました。
WindowsServer2012以前のOSで32bitのOSで動いているサーバでは要注意です。
まだまだ開発の現場（特に大規模な業務アプリ）ではWindows7の32bitで開発している現場も多いイメージですが、実態は皆さん64bitに移行してるんですかね。

## REPFツール
Pythonを使ったことがある人にはわかりやすいと思いますが、コマンドラインから色々できるアレがJavaにもやってきました。
REPFとはRead-eval-print-loopの略です。
コマンドライン上でjshellと入力してSystem.out.println("Hello World");で実行すれば結果が表示されます。
簡単なサンプルプログラムならわざわざクラスを作って動作確認する手間が省けて良いですね。

## Unicode8.0対応
業務アプリであまり絵文字を使う機会はないと思いますが、今回Unicode-8.0に対応したことで幅広く新しい文字を利用することが可能になりました。
Androidアプリなどスマホ系での幅が広がるかも！

## 乱数生成の強化（DRBG）
今までJava標準のRandom関数(java.util.Random)と暗号用に強化された乱数ジェネレータ(RNG)を提供しているSecureRandom関数(java.security.Random)の二種類でした。
これに加えて今回追加されたDRBGはNIST-800-90Arlというものに定義されている乱数ジェネレータです。
NISTはアメリカ国立標準研究所と呼ばれるところで米国政府機関でも利用されています。

## SHA-3対応
こちらはセキュリティ対応の強化としてハッシュアルゴリズムのSHA-３に対応しました。
SHA-3も上記のDRBGと同様にNISTで定義されているものです。

## Javaアプレットの非推奨化
最近ではほとんど見る機会は減ってきたJavaアプレットですが、Java9でついに正式に非推奨となりました。


## モジュール化システム「Project Jigsaw」
Java9の全てと言っても良いんじゃないのかと。
モジュール化システムのJigsawの歴史としては2009年から始まっています。
長い時間をかけ、偉い人やらすごい人達が血と汗と涙を流しながらついにJava9でリリースされました。（血と汗と涙を流したかどうかは知りませんが。）

### そもそもモジュールって何だろ。。。
>モジュールとは、機能単位、交換可能な構成部分という意味の英単語。システムの一部を構成するひとまとまりの機能を持った部品で、システムや他の部品への接合部(インターフェース)の仕様が規格化・標準化されていて、容易に追加や交換ができるようなもののことを意味する。 

参考：[IT用語辞典](http://e-words.jp/w/モジュール.html)

システムを機能単位でまとめたものの単位と考えればいいですかね。
Javaではパッケージと呼ばれるグループで機能をまとめます。そしてパッケージをまとめてJARファイルを作成し、ライブラリとして提供する仕組みが利用されています。

### 今までじゃダメなんですか？何が問題なの？
1. 機能ごとに可視性が設定できない
機能ごと（Jar単位)で可視性が設定できないため、本来Aシステムだけで使うはずのものが予期せずBシステムで使われて予期せぬ例外が発生することが考えられます。  
<br/>

2. ライブラリ間の依存関係が設定できない
とあるa.jarを使うためにはa1.jar,a2.jarと複数のjarファイルが必要である場合に、開発者はどのjarファイルが足りていないかを都度調査して突き止めていく必要があります。
この問題を解決するために、jigsawではモジュールの依存関係を定義して設定しておくことで、開発者がどのライブラリを必要としているかを調べる手間が省けるようになりました。

### だからこそのパッケージ管理！
上記で書いた問題を解決するために長い時間をかけてJigsawが作られました。
プライベートで隠蔽できる範囲が広くなったことで公開できる範囲が広がったり、環境構築で毎回悩まされるライブラリ依存問題を解消することで開発の初動が早くなったりと色々便利になる（はず）のです。

## 最後に
まだリリースされて間もないため業務でJava9を採用する所はまだ少ないかもしれませんが、これから新規開発するプロダクトやこれからJavaを勉強する人には良いタイミングだと思いますので是非Java9を使ってみてください！
そして僕に色々教えて頂けると嬉しいですm(_ _)m　←　他力本願

まだまだ勉強不足で薄っぺらい内容ですが最後まで読んで頂きありがとうございました。
間違っている部分もあるかと思いますのでご指摘頂ければ幸いです。
HoloLens ホログラムの視野角を可視化する

# HoloLensの視野角を表示する
HoloLensアドベントカレンダー 22日目の記事です！

今回は、HoloLensの視野角（ホログラムが表示される範囲）を可視化したいと思います。
Learn Gestures Appで最初に見るやつです。

![20171223_001318_HoloLens.jpg](https://qiita-image-store.s3.amazonaws.com/0/63863/3c0ba64f-c61d-f1ee-ab8f-ae89bbb85c4a.jpeg)


初めてHoloLensを装着される方に、正しく装着できるよう4つ枠が見えていることを確認する際に使います。

# 開発環境
- Visual Studio 2017 (15.2)
- Unity 2017.1.2f1
- HoloToolkit-Unity-v1.2017.1.2.unitypackage
- Microsoft HoloLens

# 手順
## キャンバスの作成
下記、記事を参考に、映像範囲内にテキストを表示します。
- [SCALING UI FOR THE HOLOLENS](http://heliosinteractive.com/scaling-ui-hololens/)

１．Unityを起動します
２．AssetsからHoloToolkit-Unity-v1.2017.1.2.unitypackageをインポートします
３．HierarchyビューのMain Cameraを削除し、HoloToolkit->Input->Prefabs->HoloLensCameraを用います
４．HoloLensCameraの下にUI->Canvasを作成します
５．Canvasの設定を次のようにします
![2017122201.PNG](https://qiita-image-store.s3.amazonaws.com/0/63863/914e8507-da7e-9032-3835-e730c0e753e2.png)

参考記事と違うところは、Canvasの位置が少しHoloCameraよりも高い0.02に設定しています。
Rect TransformのZが2mに対して魔法の数字 0.00415f を掛け算し、Scaleを求めています。
AddComponentからTextを追加し、任意の文字列を書いてください。

## 枠の作成
次に、キャンバスの周りに枠を表示していきます。
１．HoloLensCameraの下に空のオブジェクトを作成し、Line1を作成します。設定は次の通りです。
![2017122202.PNG](https://qiita-image-store.s3.amazonaws.com/0/63863/acd146ef-a3de-52ab-f490-3094ecfb244f.png)

Zが2mのところに配置し、線分の頂点をCanvasに合わせて設定します。
線の幅（Width）は0.02にしており、枠がきちんと見えるように若干修正してます。
線の位置はCanvasの中心が原点となるので、気をつけてください。

２．これを残り3つコピペします。頂点のリストは次の表になります。

| Name | Elements | X | Y | Z |
|:--|:--|:--|:--|:--|
| Line1 | Element0 | -0.52622 | 0.3088 | 0.0166 |
| | Element1 | 0.52622 | 0.3088 | 0.0166 |
| Line2 | Element0 | 0.51622 | 0.3188 | 0.0166 |
| | Element1 | 0.51622 | -0.2888 | 0.0166 |
| Line3 | Element0 | 0.52622 | -0.2788 | 0.0166 |
| | Element1 | -0.52622 | -0.2788 | 0.0166 |
| Line4 | Element0 | -0.51622 | -0.2888 | 0.0166 |
| | Element1 | -0.51622 | 0.3188 | 0.0166 |

３．次のようになっていたら、完了です。
![2017122203.PNG](https://qiita-image-store.s3.amazonaws.com/0/63863/e786ace5-56a5-ac9a-8eaa-c4e77c71fd88.png)

![2017122204.PNG](https://qiita-image-store.s3.amazonaws.com/0/63863/94ef3713-5827-424f-9152-f77c19559088.png)

# 実行
いつものようにビルドし、確認すると次のようになります。
![20171222_222650_HoloLens.jpg](https://qiita-image-store.s3.amazonaws.com/0/63863/e7491acc-cbfc-2da6-1027-e40c88adc967.jpeg)

実際の物体までの距離Zに合わせて、ホログラムの表示領域を可視化してあげると便利かもですねー
Usageとは

#困ったときによく出てくる
これ・・・「Usage」。私はウサギって思ってた　(馬鹿)
なんか、ウサギ好きな人が、プログラマには多いのか？って思ってた。

#［発音］júːsidʒ、【＠】ユーセージ、ユーセッジ
え、辞書にでてるやん・・・ちゃんとした言葉だったんやな・・・

#［意味]
使用（法）、用法、利用（法）

#で・・・結局なんなん
多分使い方を説明する時に、登場してるんだな・・・
elixir tips with with

# elixir tips with with

これは[elixir advent calender 2017](https://qiita.com/advent-calendar/2017/elixir)の22日目です。

## with構文

elixirのwith構文を使う事で、ネストされたcase構文をより簡潔に記述できます。

```
with パターンマッチ1
     パターンマッチ2
     パターンマッチ3
     ...
do
  処理したいコード
end
```

withは先頭から順番にパターンマッチを実行し、全てのパターンマッチが成功した時、doの中のコードを実行します。

## パターンマッチ中の変数

with構文のdoの中で実行されるコードは、パターンマッチで利用した変数を使う事ができます。

```sample1.ex
with one = 1,
     two = 2,
     three = 3
do
  IO.puts one
  IO.puts two
  IO.puts three
end
```

実行結果

```
$ elixir sample1.ex
1
2
3
$
```

## パターンマッチの失敗

with構文のパターンマッチが失敗した時は、NoMatchErrorとなります。

```sample2.ex
with one = 1,
     two = 2,
     123 = :hoge
do
  IO.puts one
  IO.puts two
end
```

実行結果

```
$ elixir sample2.ex
warning: no clause will ever match
  sample2.ex:3

** (MatchError) no match of right hand side value: :hoge
    sample2.ex:3: (file)
    (elixir) lib/code.ex:376: Code.require_file/2
$
```

## ``<-``を使ったwith構文

with構文で``=``ではなく``<-``を使って記述すると、パターンマッチに失敗した時の右辺の値を結果として返却します。

```sample3.ex
result = with one <- 1,
     two <- 2,
     123 <- :hoge
do
  IO.puts one
  IO.puts two
end

IO.puts result
```

実行結果

```
$ elixir sample3.ex
hoge
$
```

## まとめ

上手にwithを使いましょう。
Symfony 3.4 の新機能: SymfonyMakerBundle の紹介

[Symfony Advent Calendar](https://qiita.com/advent-calendar/2017/symfony)　の 22日目の投稿です。まだ空いていたのでさくっと SymfonyMakerBundleの紹介です。

## SymfonyMakerBundle

Symfony 3.4 以降から [SensioGeneratorBundle](https://github.com/sensiolabs/SensioGeneratorBundle) に代わって[SymfonyMakerBundle](https://github.com/symfony/maker-bundle) が登場しました。

このバンドルは、Commands, Controllers, Form, Test などなど機能の作成を補助してくれます。詳細はドキュメントにて確認してみてください :smile:

- [The Symfony MakerBundle (Symfony Bundles Docs)](https://symfony.com/doc/current/bundles/SymfonyMakerBundle/index.html)

> Symfony Maker helps you create empty commands, controllers, form classes, tests and more so you can forget about writing boilerplate code. 

```bash
$ php bin/console list make

 make:command            Creates a new console command class
 make:controller         Creates a new controller class
 make:entity             Creates a new Doctrine entity class

 [...]

 make:validator          Creates a new validator and constraint class
 make:voter              Creates a new security voter class
```

またこのバンドルを利用してオリジナルの Maker を作成することもできるようですね！実装済みのコードが以下にありますのでここを参考に活用していくといいかもしれません。

- https://github.com/symfony/maker-bundle/tree/master/src/Maker


かんたんですが、以上です。Command で効率化をはかるのが私は好きなので、設計や実装をみていろいろと学んでいこうと思っています :smile_cat: 

それでは :smile_cat:
[Ethereum]Solidity入門TIPS

スマートコントラクトを開発をしようと[開発入門](http://amzn.to/2DttkrL)の本を買ってみて勉強してみたのですが、実際にアプリを開発するためには不便すぎる&色々と悩ましい仕様が多かったので、メモがてらTipsを残しておきます。

## 便利な開発環境
開発入門だとデプロイの度にコマンド打ったり、ローカルのgethがコントラクトを承認するの待ったりと色々と面倒だと思っていたら、TRUFFLE（トリュフ）という開発ツールがあることを発見。
http://truffleframework.com/
TRUFFLE BOXESというDappを作るためのサンプルコードもあって便利。
フロントにReactやAngularを使ったものもある。
http://truffleframework.com/boxes/

## デバッグ方法
VS Codeで開発していたらデバッグできなかった。
デバッグする時にはRemix(browser-solidity)を使う必要がありそう。
https://qiita.com/_pochi/items/69058975e8b1293f0467

[追記]
Truffle consoleでdebugコマンドを使えばデバッグ可能。
`debug <Transaction ID>`
http://truffleframework.com/tutorials/debugging-a-smart-contract

## solidityにnullやemptyはない
uintなら0、配列ならlengthなどを使わなければならないので、ちゃんと設計しないとつまづく事に。
https://stackoverflow.com/questions/37852682/are-there-null-like-thing-in-solidity

## stringの配列やmappingはreturnできない
これもちゃんと設計しないとつまづく事に。
addressやuintの配列は大丈夫とのこと。
https://ethereum.stackexchange.com/questions/17312/solidity-can-you-return-dynamic-arrays-in-a-function
https://ethereum.stackexchange.com/questions/11926/how-to-return-a-mapping-type

## memory領域の可変長の配列はreturnできない
配列にループで何か値を格納してretuenする際に、配列を固定長で定義しないと`VM error: invalid opcode.`というとエラーが発生する。

```javascript
// OK
uint256[] memory results = new uint256[](10);
for (uint256 idx = 0; idx < 10; idx++) {
    results[idx] = idx;
}
return results;

// NG
uint256[] memory results;
for (uint256 idx = 0; idx < 10; idx++) {
    results[idx] = idx;
}
return results;
```

## バグがあった時にコントラクトをアップデートできるようにデータとロジックを分ける
バグがあった場合、新しいコントラクトをデプロイすることになりデータが消えてしまうので、データを保持するコントラクトは切り出して置くと良いとのこと。
データの方にバグがあったら大変そうだ。。
https://blog.colony.io/writing-upgradeable-contracts-in-solidity-6743f0eecc88

[追記]
アップデート可能なコントラクトといかいう概念もあるらしい。
https://fukutech.hatenablog.com/entry/upgradeability-contract
https://guide.blockchain.z.com/ja/docs/problem/versionup/

## throwではなくrequireを使う
throwは廃止されていているらしい。
https://github.com/ethereum/solidity/issues/1793

## ループは極力使わない
長さが未定の配列のループはgasをたくさん消費してgas limitに達し、コントラクトが実行されない可能性があるとのこと。
http://solidity.readthedocs.io/en/develop/security-considerations.html#gas-limit-and-loops

## transactionの発行が必要なファンクションは戻り値を受け取れない
transactionの発行が必要なファンクションで戻り値を設定していても、外部のアプリケーションから呼んだ場合には戻り値を受け取ることはできない。
戻り値が必要な場合は、Eventの発行かStorageへの保存で対応する必要がある。
https://ethereum.stackexchange.com/questions/31399/get-the-return-value-of-payable-function
目指せ自動売買で800万円 : MT4のTick情報を収集する

#Tickとは?
MQL4ではOnTick()という関数がTick情報が更新されるたびコールバックされるみたい。

Tickとは金融商品の値動き変化の最小単位、これを収集することでどんな足でも作れる。

色々探してみたが、TickをダウンロードできるサイトがなかったためMT4でTick情報を
サーバにひたすらアップロードするプログラムを作成した。

#システム構成
基本的にMT4からWebサーバにTickの更新があるたびにGETメソットでリクエストを行う。

MT4は常時動かさないといけないので、お名前.comのWindows VPSを導入。合わせてWebサーバ用のVPSも導入。
(合計3000円/月、しかしWindows VPSは全然性能出ないな)

#MT4側
BiD,ASK,時間情報をWebRequest関数を用いてひたすらGETリクエスト。

しかしMQL4は書きにくい(C++がベース、ポインタとか記憶の外)。

時間周りがMT4のシステム上GMT+2になっている(日本時間ではない)。
今までGMT+9(日本時間)しか考慮したことなかったので、冬時間→夏時間とかどう処理すればいいんだろう。

(サーバ時間 - ローカル時間)でGMTが演算できるので、それもGETパラメータに加えることにした。
その他時間処理がめんどくさいので、クラス化。

```
TimeObject *time_object = new TimeObject(last_tick.time); // 時間情報を保持する自作関数
SymbolInfoTick(Symbol(),last_tick)
string currencyPair = _Symbol;
string bid = (string)last_tick.bid;
string ask = (string)last_tick.ask;
string last = (string)last_tick.last;
string volume = (string)last_tick.volume;
string flags = (string)last_tick.flags;
string mt4DateTime = (string)time_object.getMT4DateTimeString();
string mt4UnixTime = (string)time_object.getMT4UnixTime();
string mt4Offset = (string)time_object.getMT4Offset();
string localDateTime = (string)time_object.getLocalDateTimeString();
string localUnixTime = (string)time_object.getLocalUnixtTime();
string localOffset = (string)time_object.getLocalOffset();
string tickCount = (string)GetTickCount();
```

###WebRequest関数について

WebRequestで引っかかったことは二つ。

1. ツール > オプション > エキスパートアドバーザの許可するURLにWebサーバのアドレスを追加
2. 80 or 443のみ利用できる。

1は許そう。2は駄目だ。

サーバ側を機能(収集、オーダ)でポートを分けてSimpleServerで済まそうと思っていたが、
全て80で行う必要がある。そのため、サーバサイドをそれなりにしっかりしないといけなくなった。

###GetTickCountについて
これはローカルでのMT4起動時からのカウンタ値らしい。

ミリセックオーダでも連続してTick更新があるときがあり、
順序把握のために高精度のカウンタとしてGetTickCountが利用できる。

しかし50日位でオーバーフローするらしい。

まあ1週間に1度は再起動するか。

#サーバ側
全て80で行う必要があり、しかりとしたものを作るためPlayFramework 2.6(Scala)を導入

どうやらactivatorのサポートが終了したらしいので、seedからインストール
(brewが死んでいたのでアップデート、sbtも1系に、sbt1系に対応できないためIntelliJも最新に)

`sbt new playframework/play-scala-seed.g8
`

##uploadフォルダ
MT4からの情報収集するフォルダとして、uploadフォルダを作成。

保存するTick情報は下記のcase classとなっている。

```scala
case class MqlTick(mt4_id : String,
                    currencyPair : String,
                    bid : String,
                    ask : String,
                    last : String,
                    volume : String,
                    flags : String,
                    mt4DateTime : String,
                    mt4UnixTime : String,
                    mt4Offset : String,
                    localDateTime : String,
                    localUnixTime : String,
                    localOffset : String,
                    tickCount : String,
                    createdDateTime : String,
                    createdUnixTime : String)
 val csvHeader = classOf[MqlTick].getDeclaredFields.map(_.getName).mkString(",")
```

特に、localDateTimeはMT4側のローカル時間となるため、
アップロードにかかった時間やローカル時間が間違っている時の補正のためにサーバ側のローカル時間も保存する。

しかしscalaは書きやすいな。

#今後について
とりあえずTickデータが集まってきた。

今後はランダムウォークでの機械学習を試してみよう。

[QRNNでカオス時系列データ予測](https://qiita.com/yukiB/items/681f68690ffabbf3e1e1)を試してみたい・
コントラクトの Event を監視してみる

イーサリアムのコントラクトのイベントについて、よく理解できてないので、調べてみました。

## 説明
- イベントは、コントラクト上で発生したことをDAPPなどのクライアントに通知することができる
- イベントが呼び出されると、実際渡された関数のパラメータをトランザクションのログに保持し、コントラクトのアドレスと関連を付けられる。
    - トランザクションがブロックに保持されるので、イベントも同じく、ブロックが存在している限り、イベントのログもずっと存在している
    - ただ、ログとイベントは、コントラクトから（コントラクトの作成者でも）直接にアクセスできない
- イベントのパラメータは `indexed` で定義できる。`indexed`付けると、そのパラメータまたは特定の値に従ってフィルターできる
    - 配列の場合は、`Keccak-256`のハッシュ値で保持される
    - `indexed`ついてないパラメータはログの一部として保持される

## 使ってみる

```javascript
pragma solidity ^0.4.17;

contract MyToken {
    event Deposit(
        address indexed _from,
        bytes32 indexed _id
    );

    function deposit(bytes32 _id) public {
        // deposit pproc
        // log
        Deposit(msg.sender, _id);
    }
}
```

- Ganache起動してから、 Remix を `127.0.0.1:7545`に接続しておく
- 上記内容を Remix に貼り付けて、デプロイする
- 上記内容ですと、`deposit` 関数を呼び出すと、添付画像のように、トランザクションの`logs`項目に、ちゃんとイベント名とパラメータが保持されている

<img width="987" alt="スクリーンショット 2017-12-22 23.37.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/4777/0e1ba8c1-6713-1081-2f9c-7c305aa2bbdc.png">

- `Deposit(msg.sender, _id);`をコメントアウトして、コントラクトを再度デプロイし、`deposit` 関数を呼び出すと、下記のように、`logs`項目が空になる

<img width="952" alt="スクリーンショット 2017-12-22 23.37.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/4777/2abc04e2-23e6-e609-98c2-b83255727ea8.png">

## まとめ
- コントラクトの処理で、ちゃんとログを残したい場合は、イベントを活用しましょう。
gitlab を virtual box 上の ubuntu 16.04にインストール

VirtualBox上のUbuntuに gitlabをインストールしようとした時引っかかったのでメモ。

この記事では、VB内Ubuntuのブラウザから 127.0.0.1のGitlabを立ち上げる方法を説明します。

1) Virtual Box のインスタンスを作成 ( linux  Ubuntu64用）
2) 仮想マシンのストレージ コントローラー IDEの光学ドライブに、 ubuntu-16.04.3-desktop-amd64.iso など ubuntu.comからダウンロードしたものを指定します。
3) Virtual Boxを起動し、Ubuntuをインストールします。
4) Ubuntuのターミナルソフトから```sudo visudo``` し、自分のログイン名 を xyzとしたら、次の行を加えます。 （加えないと、あとでgitlabのインストールでつまづきます。）

```
xyz ALL=NOPASSWD: ALL
```
5) ストレージ容量が足りないと言われると思いますので（全体で10GBの可変ストレージ割り当てがディフォルトだと思います）

```bash
sudo apt-get install gparted
sudo gparted
```
で起動したら、https://qiita.com/Qiita/items/c686397e4a0f4f11683d の案内に従って、linux-swap領域を小さくし、 /dev/sda1の容量を大きくします。
6) この後は、gitlabの公式ページ https://about.gitlab.com/installation/#ubuntu に従ってインストールします。 EXTERNAL_URLは 特に指定してなければ Ubuntu内のブラウザからアクセスできる様に "http://127.0.0.1/"とします。

```console
#コマンド例  gitlab community editionのインストール
yourid@yourid-VirtualBox:~$ sudo EXTERNAL_URL="http://127.0.0.1/" apt-get install gitlab-ce
```
時間がかかりますが、インストールが終われば http://127.0.0.1/ でgitlabが見れる様になります。

＊手順に失敗した場合は、コマンドを繰り返してもインストールできないかもしれません。私の場合は、Virtual Box の Ubuntuインスタンスから作り直しました。

<img width="1294" alt="スクリーンショット 2017-12-22 23.16.38.png" src="https://qiita-image-store.s3.amazonaws.com/0/126560/bde4b19c-d300-a1ae-bdde-d32fe59b0cb7.png">
Google Drive REST APIを使ってみる

**ファイルアップロード編**
最初はRubyで頑張ろうとしたのですが、ライブラリがα版で開発が止まっていたため（メンテナンスは継続されるらしいですが）、Pythonに切り替えて実装しています。

https://developers.google.com/drive/v3/web/about-sdk


最初に認証を済ませるところまではクイックスタートの手順を参考にしてください。

https://developers.google.com/drive/v3/web/quickstart/python

vagrant環境で実施したため、ブラウザなしで認証を済ませるため、以下のオプションが必要だった以外は上記の手順通りに進むことができました。

```
python3 quickstart.py --noauth_local_webserver
```

`quickstart.py` のとおりだと新しいファイルを10件表示して終わりです。今回は、「Driveのpicturesというディレクトリにローカルのpicsフォルダにあるfoo.jpgという画像をアップロードする」機能を実装してみました。ディレクトリが存在しない場合は、作成します。


``` python
items = service.files().list(q="name = 'pictures'").execute().get('files')
if len(items) == 0:
    body = {'name': 'pictures','mimeType': "application/vnd.google-apps.folder"}
    fid = service.files().create(body=body).execute().get('id')
else:
    fid = items[0]['id']
body = { 'name':'foo.jpg', 'parents':[fid] }
service.files().create(media_body='pics/foo.jpg', body=body).execute()
```

ファイルもディレクトリも実体は名前(name)と異なるIDで管理されていることに注意が必要です。このサンプルを2回実行すると、foo.jpgというファイルが2つ生成されます。上書きもしくは書き込みをスキップしたい場合は、同名のファイルが既に存在しないかどうかチェックが必要です。
ロリポップからgithub pagesに引っ越しした話

# 動機
趣味でホームページを公開していて、今まではロリポップのライトプラン（月額２５０円）で契約していたのですが、先ほどサイトを[Github Pages](https://pages.github.com/)に完全移行しました。今までロリポップを契約していたのはPHPを使いたかったからというのが主な理由でしたが、JSだけである程度のことができるようになった昨今、こうしたレンタルサーバーを契約する意味が薄れてきました。
単にファイルを移行するだけなら何の説明も要らないと思うので、今回は独自ドメインの引き継ぎまわりを中心に説明していきたいと思います。自分への備忘録として説明するだけなので、独自ドメインはムームードメインを想定します。

# ドメイン引き継ぎの手続き
３ステップでできます
1. ロリポップの設定解除
2. github pages の設定
3. ムームードメインの設定

１．まずはロリポップのユーザーページから既存の独自ドメインの設定を解除します
<img src="https://hostingstock.net/images/article/lolipop_jp/another-registrar2/figure_05.png" width=50% alt="独自ドメイン設定"/>
（これだけスクリーンショット撮り忘れたのでネットから拾ってきました）画像で灰色になってるボタンです。

２．Githubのレポジトリから独自ドメインを追加します
![Screenshot from 2017-12-22 10-14-06.png](https://qiita-image-store.s3.amazonaws.com/0/176789/b83e4631-2c94-3d3b-c142-60d304087118.png)

詳しく言うとこれはCNAMEの設定にあたります

３．ムームードメインのカスタム設定からAレコードを手動で設定します
![Screenshot from 2017-12-17 18-35-06.png](https://qiita-image-store.s3.amazonaws.com/0/176789/b982616d-380f-7693-9174-f1502cb1a88b.png)

GithubPagesを使っている限りIPアドレスはこの通りでOKです。

これで１０分位待てば設定したドメインにアクセスした時にGithubPagesにダイレクトされるはずです。
Normalization

```python
Z = np.random.random((5,5))
Zmax, Zmin = Z.max(), Z.min()
Z = (Z - Zmin)/(Zmax - Zmin)
print(Z)
```
* example

```
[[ 0.51739995  0.97920593  0.4546323   0.27452645  0.54283133]
 [ 0.99287368  0.12152634  0.          0.46321662  0.56030387]
 [ 1.          0.74512612  0.14699695  0.30665414  0.41598529]
 [ 0.64583333  0.44344735  0.59313755  0.30551318  0.44216533]
 [ 0.92824925  0.9516955   0.40267365  0.52060142  0.8877353 ]]
```
* if Z = Zmax, the value will be 1.
* if Z = Zmin, the value will be 0.
オプション引数ありデコレータの括弧を省略可能にする

[wrapt](https://pypi.python.org/pypi/wrapt)のドキュメントを読んでいて、

* オプション引数でデコレータをパラメータ化できる
* オプション引数を指定しないときは括弧を省略できる
* ただしオプション引数はキーワード引数として指定する必要あり

という興味深い性質を持つデコレータの書き方を知ったので紹介します。

[wrapt を使う場合の例](https://wrapt.readthedocs.io/en/latest/decorators.html#decorators-with-optional-arguments)は

```py
def with_optional_arguments(wrapped=None, myarg1=1, myarg2=2):
    if wrapped is None:
        return functools.partial(with_optional_arguments,
                                 myarg1=myarg1, myarg2=myarg2)

    @wrapt.decorator
    def wrapper(wrapped, instance, args, kwargs):
        return wrapped(*args, **kwargs)

    return wrapper(wrapped)
```

ですが、functools.wraps でも以下のように書けば同じことが実現できます。

```py
def with_optional_arguments(wrapped=None, myarg1=1, myarg2=2):
    if wrapped is None:
        return functools.partial(with_optional_arguments,
                                 myarg1=myarg1, myarg2=myarg2)

    @functools.wraps(wrapped)
    def wrapper(*args, **kwargs):
        return wrapped(*args, **kwargs)

    return wrapper
```

オプション引数を指定する場合

```py
@with_optional_arguments(myarg1=3, myarg2=4)
def function():
    pass
```

のように書けて

* まず、`with_optional_arguments(myarg1=3, myarg2=4)` が評価される
  * 引数 wrapped が指定されていないので partial で myarg1, myarg2 を束縛
* 続けて、その結果で function をデコレートする
  * `function =  with_optional_arguments(myarg1=1, myarg2=2)(function)`

という流れでデコレータが適用されます。

一方オプション引数を指定しない場合は

```py
@with_optional_arguments()
def function():
    pass
```

と書くと

* まず、`with_optional_arguments()` が評価される
  * 引数 wrapped もmyarg1, myarg2 も指定されていないので partial で myarg1=1, myarg2=2 を束縛
* 続けて、その結果で function をデコレートする
  * `function =  with_optional_arguments()(function)`

という処理になり、括弧を書かなかった場合

```py
@with_optional_arguments
def function():
    pass
```

は単に

* function をデコレート
  * `function = with_optional_argument(function)`
  * デフォルト値の myarg1=1, myarg2=2 が使われる

という処理になり、結果は空の括弧をつけた場合と括弧をつけない場合で同等になります。

このデコレータの定義方法を利用すると例えば

* 最初はデコレータのパラメータ要らないだろうと考えて、使う側では括弧なしで書いていた。
* 後から拡張によりパラメータを足したくなったが、既存のオプション引数指定しない箇所に空括弧つけて回るのは面倒だし無駄な感じがする

という状況をいい感じに乗り越えることができます。

なお、利用時の注意点として、キーワード引数とするところを誤って位置引数で指定してしまうと、本来関数が渡るべき第一引数に位置引数が入るため、わかりにくいエラーになったり誤動作したりするので気をつけましょう。
numpy.tile example

```python
Z = np.tile( np.array([[0,1],[1,0]]), (4,4))
print(Z)
Z = np.tile( np.array([[0,1],[1,0],[3,9]]), (2,3,5))
print(Z)
```
```
[[0 1 0 1 0 1 0 1]
 [1 0 1 0 1 0 1 0]
 [0 1 0 1 0 1 0 1]
 [1 0 1 0 1 0 1 0]
 [0 1 0 1 0 1 0 1]
 [1 0 1 0 1 0 1 0]
 [0 1 0 1 0 1 0 1]
 [1 0 1 0 1 0 1 0]]
[[[0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]
  [0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]
  [0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]]

 [[0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]
  [0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]
  [0 1 0 1 0 1 0 1 0 1]
  [1 0 1 0 1 0 1 0 1 0]
  [3 9 3 9 3 9 3 9 3 9]]]
```

* Z,row,column
unravel_index

```python
print(np.unravel_index(1,(6,7,8)))
print(np.unravel_index(55,(6,7,8)))
print(np.unravel_index(56,(6,7,8)))
print(np.unravel_index(57,(6,7,8)))
print(np.unravel_index(100,(6,7,8)))
```
```
(0, 0, 1)
(0, 6, 7)
(1, 0, 0)
(1, 0, 1)
(1, 5, 4) # 100 % 56 = 8*5 + 4 
```

* Z, Surface, Vector
Dockerで雑にNim with Neovim

...nim アドベントカレンダーに空きがあるようなのでちょっと埋めておこうかと。

##dockerでnim、取り急ぎ。
docker使える環境ならば、以下のように打つことで:

```
docker pull nimlang/nim
docker run -td --name nim nimlang/nim
docker exec -it nim bash
```

安心と信頼のUbuntu16.04 LTS上でnimの最新版をお試しできます。

```
# cat /etc/os-release
NAME="Ubuntu"
VERSION="16.04.3 LTS (Xenial Xerus)"
ID=ubuntu
ID_LIKE=debian
PRETTY_NAME="Ubuntu 16.04.3 LTS"
VERSION_ID="16.04"
HOME_URL="http://www.ubuntu.com/"
SUPPORT_URL="http://help.ubuntu.com/"
BUG_REPORT_URL="http://bugs.launchpad.net/ubuntu/"
VERSION_CODENAME=xenial
UBUNTU_CODENAME=xenial

# nim -version
Nim Compiler Version 0.17.2 (2017-09-07) [Linux: amd64]
Copyright (c) 2006-2017 by Andreas Rumpf
```

あれ、でもこれ、lessもvimもないね。

#Dockerでnim with neovim。

dockerではベースイメージがubuntuな場合、他の方のイメージと併せちゃうことはかんたん。

ということで、neovim + nimなdockerコンテナをつくりはじめてみた。

```
git clone https://github.com/kmry/docker-neovim-nim
cd docker-neovim-nim
make build
docker run -i -t thornycrackers/neovim   /bin/bash
```

はい、イメージ作りを待つこと１０分ほど、元作者の方のdockerfileベースの、python3やPHP　と一緒にneovimでnimできるdockerコンテナが立ち上がりました（雑）。
nimzendなんてのがあるので、PHPの拡張をnimで、なんてことは一応できます。あとは、
以前のエントリー[Cloud9では、gccとnimも使おう。](https://qiita.com/biotist/items/c3402ffdcb69ac9b1f9d)で書いたように、nimのシンタックスハイライトなどを入れるところなんだけれど、、、ここではやくも力尽きた。。

#　実務でnimを使う頃
実務でnimを使う頃には、ちゃんと設定する。。
いつ、実務で使うことになりそうには、後のエントリーにて（了）。
MethodErrorについて

プログラミング初心者です。現在ユーザーログインページを開発中なのですが、form_tagめぞっどを使うと
NoMethodError in User#edit 
Showing /home/ubuntu/workspace/app/views/user/edit.html.erb where line #2 raised: 
undefined method `id' for nil:NilClass
Extracted source (around line #2): 
1
2
3
4
5
6
              
<p>編集フォームはこちら</p>
<%= form_tag("/users/#{@user.id}/update") do %>
<p>名前</p>
<input name="name">
<p>メールアドレス</p>
<input name="email">


Rails.root: /home/ubuntu/workspace
Application Trace | Framework Trace | Full Trace 
app/views/user/edit.html.erb:2:in `_app_views_user_edit_html_erb___220649719522465576_70041070436860'
Request
Parameters:
{"id"=>":id"}
Toggle session dump
Toggle env dump
Response
Headers:
None
とでてしまいます。controllerの入力も間違えがないはずなのですが、どなたか助言をいただけませんか？
コミット前に英→日翻訳の結果を確認

## 完成品

https://asciinema.org/a/qbRI7qeg3a5OE7ffRDvwMEeAZ

コミットメッセージ編集後に、そのコミットメッセージを翻訳させて、
英文的におかしくないかを簡易的に確認できる

## 準備

### 必要なパッケージ入れる

```console
$ brew install translate-shell
```

これを入れると、

```console
$ trans en:ja "hello"
```

で翻訳結果が表示されるようになる

### プロジェクトに適用

以下を`.git/hooks/commit-msg`に設置

```shell
#!/bin/sh

txt=`cat "$1" | grep -v '^#' | sed '/^$/d' | head -n 1`
# git now の機能でのコミットならスルー
if [ "`echo "$txt" | grep 'from now'`" ] ; then
  exit 0;
fi

echo '翻訳前：'
echo "$txt"
echo "\n翻訳後："
trans en:ja -b "$txt"

exec < /dev/tty # これをしないと git hook では read コマンドが使えない
while true; do
  read -p 'これでいいですか？ [y/N]: ' Answer
  case $Answer in
    '' | [Yy]* )
      exit 0;
      break;
      ;;
    [Nn]* )
      exit 1;
      break;
      ;;
    * )
      echo "y/Nを入力してください [y/N]: "
  esac
done;
```

その後

```console
$ chmod +x .git/hooks/commit-msg
```

## 参考

nodeのプロジェクトでgit-hookを用いたい場合は[git-hooks-js](https://github.com/tarmolov/git-hooks-js)や[husky](https://github.com/typicode/husky)を使うと良い気がする
Slicing examples

```python
Z = np.zeros((8,8),dtype=int)
print(Z)
Z[2::2,::2] = 1
print(Z)
Z[::2,1::2] = 1
print(Z)
```
```
[[0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]]
[[0 0 0 0 0 0 0 0]
 [0 0 0 0 0 0 0 0]
 [1 0 1 0 1 0 1 0]
 [0 0 0 0 0 0 0 0]
 [1 0 1 0 1 0 1 0]
 [0 0 0 0 0 0 0 0]
 [1 0 1 0 1 0 1 0]
 [0 0 0 0 0 0 0 0]]
[[0 1 0 1 0 1 0 1]
 [0 0 0 0 0 0 0 0]
 [1 1 1 1 1 1 1 1]
 [0 0 0 0 0 0 0 0]
 [1 1 1 1 1 1 1 1]
 [0 0 0 0 0 0 0 0]
 [1 1 1 1 1 1 1 1]
 [0 0 0 0 0 0 0 0]]
```

# 参考リンク
* [start,stop,step](https://deepage.net/features/numpy-slicing.html)
Angularのセキュリティ(XSS/CSRF)

# Angularのセキュリティ

Angularが対策しているセキュリティ対策は大きく二つ。

* XSS
* CSRF

## XSS対策

### HTML

scriptタグがサニタイズの対象

### Style

`url:(javascript:alert("hello"))`とすることでJavaScriptを実行することが通常可能だが、url:(…)の内部がurlとして不正な場合はサニタイズされる

### URL

a:hrefなどはstyle要素と同様の脆弱性があるが、同様にサニタイズされる

### Resource URL

iframe周りは一律error(迂回策はあり）

## CSRF

HttpClientModuleの設定で自動でXSRF-Tokenを設定する(POST/PUTメソッドでGETには適用されない）

基本この辺。認証周りは責任範囲外
Making diagonal matrix

```
[1 2 3 4]
[[1 0 0 0]
 [0 2 0 0]
 [0 0 3 0]
 [0 0 0 4]]
[[0 0 1 0 0 0]
 [0 0 0 2 0 0]
 [0 0 0 0 3 0]
 [0 0 0 0 0 4]
 [0 0 0 0 0 0]
 [0 0 0 0 0 0]]
[[0 0 0 0 0]
 [1 0 0 0 0]
 [0 2 0 0 0]
 [0 0 3 0 0]
 [0 0 0 4 0]]
```

```python
import numpy as np

# 18
X = np.arange(4)
X = 1+X
print(X)
print(np.diag(X))
print(np.diag(X,2))
print(np.diag(X,-1))

```
GitHubで検索するときに役に立った方法

# 概要
GitHubで検索をする際に役に立った検索方法を記載していく

## 特定のユーザーでfilter
author:<ユーザー名>をつける

```
<検索ワード>␣author:<ユーザー名>
```

## 特定の検索ワードのみでfilter
検索ワードをダブルクォーテーションで括る

```
"<検索ワード>"
```
rsyncの仕組み

まず、以下のようなオプションでrsyncを実行したとする。

```
rsync --debug=ALL -avhz --exclude ".git" --exclude vendor --exclude .bundle  -e "ssh" . study3:/home/ec2-user/copied2
```

すると、rsyncは内部で以下のようなコマンドを実行する。

```
ssh study3 rsync --server -vlogDtprze.iLsfxC  . /home/ec2-user/copied2
```

sshし、リモートでrsyncをサーバモードで起動している。そのため、リモートにもrsyncがインストールされていなければならない。

ローカルのrsyncとリモートのrsyncが通信することになる。

```
[local]                [remote]
rsync   ssh ------   sshd  rsync
```

オプションの`-vlogDtprze.iLsfxC`という部分はランダムに生成された文字列に見えるが、そうではなく、1文字1文字がrsyncのオプションである。

rsyncは、デフォルトではファイルのタイムスタンプとサイズにより転送対象となるファイルを検出する。
Random padding to the matrix using append, concatenate and insert

```python
import numpy as np

NR = 10
NC = 8
Z = np.ones((NR,NC))
print(Z)

_Z = [np.random.randint(0,9,NC)]
Z = np.append(Z, _Z, axis=0)
print(Z)

shape = Z.shape
_Z = np.random.randint(0,9,shape[0])
X = np.reshape(_Z, (shape[0],1))
Z = np.concatenate((Z,X),axis=1)
print(Z)

X = np.random.randint(0,9,shape[0])
Z = np.insert(Z, 0, X, axis=1)
print(Z)

shape = Z.shape
_Z = np.random.randint(0,9,shape[1])
Z = np.insert(Z, 0, _Z, axis=0)
print(Z)
```
TensorFlowで学習したモデルをProtocol Bufferで出力する方法

#はじめに
TensorFlowでモデルを学習させた時はどのように保存していますか？
saver.restore()で保存して.ckptファイルとして出力することが多いと思います。
PC上で動かす場合はそれで良いですが、Androidなど、他の用途に使いたい場合はProtocol Buffer(.pbファイル)で出力することが必要になることがあります。

この記事では、MNIST for ML Beginnersのチュートリアルを例に.pbファイルで出力していきます。

#MNIST for ML Beginnersを学習
まずはTensorFlowのインポートとMNISTの読み込みから

```python
from tensorflow.examples.tutorials.mnist import input_data
mnist = input_data.read_data_sets("MNIST_data/", one_hot=True)
import tensorflow as tf
```

>Extracting MNIST_data/train-images-idx3-ubyte.gz
 Extracting MNIST_data/train-labels-idx1-ubyte.gz
 Extracting MNIST_data/t10k-images-idx3-ubyte.gz
 Extracting MNIST_data/t10k-labels-idx1-ubyte.gz

次に適当にgraph1を作ってそこでモデルを構築します。
graphを使っていること以外はほぼそのままです。


```python
graph1 = tf.Graph()
with graph1.as_default():
    x = tf.placeholder(tf.float32, [None, 784])
    W = tf.Variable(tf.zeros([784, 10]))
    b = tf.Variable(tf.zeros([10]))

    y = tf.nn.softmax(tf.matmul(x, W) + b)
    
    y_ = tf.placeholder(tf.float32, [None, 10])

    cross_entropy = tf.reduce_mean(-tf.reduce_sum(y_ * tf.log(y), reduction_indices=[1]))
    train_step = tf.train.GradientDescentOptimizer(0.05).minimize(cross_entropy)

    correct_prediction = tf.equal(tf.argmax(y,1), tf.argmax(y_,1))
    accuracy = tf.reduce_mean(tf.cast(correct_prediction, tf.float32))

    sess = tf.InteractiveSession()

    tf.global_variables_initializer().run()
    
    for _ in range(1000):
        batch_xs, batch_ys = mnist.train.next_batch(100)
        sess.run(train_step, feed_dict={x: batch_xs, y_: batch_ys})
    print(sess.run(accuracy, feed_dict={x: mnist.test.images, y_: mnist.test.labels}))
```

>0.9006

1000ミニバッチ学習した結果、Accuracyは90%程度でした。
ここまではチュートリアルほぼそのままですね。

#Protocol Buffer形式で保存

ここからが本題で、別のgraphに、先ほどのVariableを全てConstantに変更したモデルを用意します。
学習済みなのでVariableにしておく必要はありません。Constantにしましょう。
また、nameはきちんと書いてください。
基本的に、ここでの変数名x_2などではなくnameを使って呼び出します。
>tf.train.write_graph(graph,".","mnist.pb",as_text=False)

この部分でgraphをカレントディレクトリ"."に"mnist.pb"という名前で保存しています。

```python
graph = tf.Graph()
with graph.as_default():
    x_2 = tf.placeholder(tf.float32, [1, 784],name="input")
    W_2 = tf.constant(sess.run(W),name="Weight")
    b_2 = tf.constant(sess.run(b),name="bias")
    y_2 = tf.nn.softmax(tf.matmul(x_2, W_2) + b_2,name="output")
    sess2 = tf.Session()
    
    sess2.run(tf.global_variables_initializer())
    
    tf.train.write_graph(graph,".","mnist.pb",as_text=False)
```
これで保存されているはずです。
Python3/TensorFlow1.3/Macの環境でしか試していないので、他環境で動かなければご連絡ください。