OmniAICreator/Qiita-1.07M huggingface dataset:
Smartyを組み込んだFuelPHP環境に自作の修飾子プラグインを追加する

https://www.smarty.net/docs/ja/plugins.modifiers.tpl
修飾子プラグインの作り方自体は、上記の公式ドキュメントに書かれてあるとおり。簡単なことしか書いてないのに難しく感じられるので、もう少し噛み砕いた説明をします。

# 修飾子プラグインを作る

``` php
<?php
function smarty_modifier_osakaben($string)
{
    return str_replace('です。','やで。',$string);
}
```
上記のようなコードを書いて、modifier.osakaben.php というファイル名で任意のディレクトリ(※後述)に保存する。

* modifier.**osakaben**.php
* function smarty_modifier_**osakaben**($string)

修飾子プラグインの作り方としては、覚えるルールは基本的にこれだけ。次に、FuelPHPとの連携について説明します。

# FuelPHPに設定を追加する

parser.phpを編集します。

``` php
'View_Smarty' => array(
    'environment' => array(
        'plugins_dir' => array(APPPATH.'smarty_custom_plugin/'),
    ),
),
```
smarty_pluginsというディレクトリに保存したとしたら、こんなふうに指定します。

あとはテンプレートのほうで、

``` smarty
<div>
    {$content|osakaben}
</div>
```
こんなふうに書けば動作します。

説明終わり。

ちなみに、今回説明したようにファイルで作るのではなくて、FuelPHPのコントローラ内だけでレジストして完結させる方法もあって、それはまた機会があれば説明します。そのページの中だけでしか使わない処理は、ファイルを増やしたりしないでそのように実装するのがよいです。そうすれば、ああこの修飾子はこのページでしか使わないんだってことを暗黙的に示すこともできるし。

# 自作修飾子の保存ディレクトリについて

上記の説明では適当に`smarty_custom_plugin`などとしてますが、

```
APPPATH.'override/vender/smarty/libs/plugins/'
```
実務ではこんなふうにしてます。Smarty_Fuel_Extensionのディレクトリ構成に沿っています。

# Smarty本体にプリセットされている修飾子について

Smartyではデフォルトで20種類くらいの修飾子が使えるようになっています。`nl2br`とか`strip_tags`とか、便利なものは10種類くらい。他は・・・

## 日本語サイトではあまり使わない修飾子

* lower
* capitalize
* wordwrap
* count_words

## あまり使いみちがない修飾子

* count_characters
* count_paragraphs
* count_sentences

## どう便利なのかよく分からない修飾子

* cat
* indent
* spacify

catって文字列連結に使うみたいだけど、普通に文字列書けばよくない？修飾子を数珠つなぎにする場合に必要ってことかな。

あと、PHPの関数を修飾子として使えます。

修飾子は、上手に使うとテンプレートがすっきりします。たとえばSmarty_Fuel_Extensionではブロックプラグイン方式のヘルパとしてmarkdown変換を実装していたりしますが、テンプレート内で「ここから～ここまで」って指定するのはあまりスマートではない。修飾子として実装し、`{$content|markdown}`というふうに書くほうがすっきりします。

余談ですが、修飾子という呼び方はあまりピンとこなくて、自分は勝手に「カスタムモディファイア」または「カスタムフィルター」などと呼んでます。

# そもそもSmartyって

https://www.smarty.net/documentation
ドキュメントは英語・日本語・中国語の３つしか用意されていません。v2の頃は9カ国語対応でしたが、TwigやBladeの勢いに押されてユーザが減ってるってことかな。WordPress普及の影響で、ネイティブPHPをテンプレートエンジンっぽく使いこなせるからテンプレートエンジン使わない。って人も多少増えてると思います。
LSL Animesh サンプルスクリプト (ランダムでアニメーションを切り替える）

Animesh なオブジェクトに一緒にいれたアニメをランダムで切り替えるスクリプトです。
１番上の行の 30.0 は３０秒ごとに切り替えるよってことです。

(同じアニメが選択される可能性があります。これはアニメが１つしか入ってない場合の制御省略ということでｗ）

ではみなさん　おたのしんでね！！

```lsl

float gap = 30.0; // アニメーションを切り替えるランダムタイマーの間隔（秒）

list anim_list;
integer anim_cnt = 0;
integer index = 0;


string current_anim = "";

list get_anims()
{
    list result = [];
    integer n = llGetInventoryNumber(INVENTORY_ANIMATION);
 
    while(n)
    {
        result = llGetInventoryName(INVENTORY_ANIMATION, --n) + result;
    }
 
    return result;
}

stop_all_animations()
{
    list curr_anims = llGetObjectAnimationNames();
    integer i;

    for(i = 0 ; i < llGetListLength(curr_anims) ; i++)
    {
        string anim = llList2String(curr_anims, i);
        llStopObjectAnimation(anim);
    }
}

integer random_integer( integer min, integer max )
{
    return min + (integer)( llFrand( max - min + 1 ) );
}

start_rand_anim()
{
    if(current_anim != "")
    {
        llStopObjectAnimation(current_anim);
    }
    index = random_integer(0, anim_cnt -1 );
    current_anim = llList2String(anim_list,index);
    llStartObjectAnimation(current_anim);
}

default
{
    state_entry()
    {
        llSetTimerEvent(0);
        
        stop_all_animations();
        anim_list = get_anims();
        anim_cnt = llGetListLength(anim_list);
        start_rand_anim();
        
        llSetTimerEvent(gap);
    }
    
    changed(integer change)
    {
        if((change & CHANGED_OWNER) || (change & CHANGED_INVENTORY))
        {
            llResetScript();
        }
    }
    
    on_rez(integer start_param)
    {
        llResetScript();
    }
    
    timer()
    {
        start_rand_anim();
    }
}
```
MacでRのcaret使う

またハマったのでメモ書き．
2018年12月時点の状況でござる．

MacでRのcaretを使おうとして

```R
install.packages("caret")
```
をすると次のエラーがでる(ことがあります)

```R
auc_.cpp:2:10: fatal error: 'omp.h' file not found
#include <omp.h>
         ^~~~~~~
1 error generated.
make: *** [auc_.o] Error 1
ERROR: compilation failed for package ‘ModelMetrics’
```

`caret`は`ModelMetrics`と言うパッケージに依存しているんですが，`ModelMetrics`に並列計算に使うOpenMPが必要だそうで，参照するためのヘッダがないとインストールできないそう．

解決策は
　https://github.com/JackStat/ModelMetrics/issues/24
を参考に，`R`の外に出て

```bash
brew install libomp
```
でOpenMPのライブラリ入れて再度`caret`のインストールをすればOK
めんどいことはしない
Python の辞書で条件に一致するキーと値を削除する

# お題

辞書で特定のキーを持つ要素を除くケースを考える。ただし、次の条件をどちらも満たしている。

- 辞書の中身が事前に分からない
- 対象のキーは `two` だが、大文字小文字を区別しない

例えば次のような結果となる。

```py
import pprint

dic = {'one': 1, 'two': 2, 'three': 3}
# 削除処理
# pprint.pprint(dic)
# => {'one': 1, 'three': 3}

dic = {'one': 1, 'TWO': 2, 'three': 3}
# 削除処理
# pprint.pprint(dic)
# => {'one': 1, 'three': 3}

dic = {'one': 1, 'Two': 2, 'three': 3}
# 削除処理
# pprint.pprint(dic)
# => {'one': 1, 'three': 3}
```

# 次の記述でOK

```py
dic = {k: v for k, v in dic.items() if k.lower() != 'two'}

# pprint.pprint(dic)
# => {'one': 1, 'three': 3}
```

イテレータを使う場合は Python 2.x と 3.x の互換性を考慮して six を使う事を検討したい。

```py
import six

dic = {k: v for k, v in six.iteritems(dic) if k.lower() != 'two'}

# pprint.pprint(dic)
# => {'one': 1, 'three': 3}
```

# リスト内包表記を使用しない場合は要注意

リスト内包表記を使用しない場合、次の記述で良さそうに思える。

```py
for k, v in dic.items():
    if k.lower() == 'two':
      dic.pop(k, None)
```

Python 2.x では問題ないが、Python 3.x では次のエラーが発生する。

```
Traceback (most recent call last):
  File "delete_if.py", line 4, in <module>
    for k, v in dic.items():
RuntimeError: dictionary changed size during iteration
```

代わりに次のように記述する。

```py
for k, v in list(dic.items()):
    if k.lower() == 'two':
      dic.pop(k, None)
```

値は取り出しても参照しないのであれば、次の記述の方がシンプルになる。

```py
for k in list(dic.keys()):
    if k.lower() == 'two':
      dic.pop(k, None)
```

さらにイテレータを使う場合は次のようになる。

```py
import six

for k in list(six.iterkeys(dic)):
    if k.lower() == 'two':
      dic.pop(k, None)
```
ksnctf 10 #! 20pt

#問題

https://ksnctf.sweetduet.info/problem/10

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/d93a8b4b-7773-ff2c-f768-204569d0dab9.png)

#解いてみた

- あれの名前を答えなさいということでしょうか。
- わからないのでgoogle検索。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/f968fc28-5079-d098-415d-a2bcb2a1685d.png)

- ですって。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/de01eb8b-ac3e-f7e9-bc1e-09c8766d5b7a.png)
VSCodeをVimのように楽々オープン

# はじめに

Vimのように、簡単にVSCodeを開きたいと考えていたところ、すごく簡単に実現出来たので、その方法をご紹介します。

Project Managerよりも楽にディレクトリを開くことが出来る方法です。

具体的には、コマンド一つで、即座に現在のカレントディレクトリを開くことが出来るようになります。

# codeコマンドのインストール

まずは、CLIからVSCodeを操作出来るように、codeコマンドをインストールします。

<img width="1673" alt="Screen Shot 2018-12-29 at 15.22.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/231922/4046764c-1d79-a9cc-b73a-a5e5feac138f.png">

Command Palette(Shift + Command + P)を開き、`shell`と入力すると、「Shell Command: Install 'code' command in PATH」が表示されるので、それをクリックして実行します。

以下のコマンドでバージョンを取得出来ればインストール完了です。

```
$ code --version                                                                                                           
1.29.1
xxxxxxxxxxxxxxxxxxxxxxxxxxxxx
x64
```

# コマンド作成

以下のどちらかのコードを`.zshrc`に記載します。

**前者は、zshの無名関数を使用しているため、bashなどでは使用出来ない**

```
alias vc='(){ code $(pwd) }'
```

または

```
function vc() {
  code $(pwd)
}
```

Zshに新たなコマンドを反映させます。

```
source ~/.zshrc

```

#まとめ

これで、即座にVSCodeでカレントディレクトリを開くコマンドが出来ました。

非常に簡単な設定ですが、ストレスなく開発レポジトリを切り替えられるようになります。

ちなみに、以下の記事のghq + peco + hubなどと組み合わせるとより楽になるのでやってみて下さい。

[ghq, peco, hubで快適Gitライフを手に入れよう！] (https://qiita.com/itkrt2y/items/0671d1f48e66f21241e2)
プログラミンを使って８歳と６歳がプログラミングの基礎を学ぶ

# 小学プログラミング教育の狙い
文部科学省「「未来の学びコンソーシアム　小学校プログラミング教育必修化に向けて」パンフレット」を確認すると、小学校のプログラミング教育の狙いは大きく２つです。
> 1. プログラミング的思考を育むこと
> 2. プログラミングの動きやよさ、情報社会がコンピュータ等の情報技術に支えられていることなどに気付くことができるようにするとともに、コンピュータ等を上手に活用して身近な問題を解決したり、より良い社会を築いたりすることができるようにしようとする態度を育むこと

...１は抽象的過ぎて捉え方が難しく、2は何言っているか最早分かりません。理解できないのは小生の国語力が足りないせいでしょう。深く考えずにまずはやってみましょう。



# プログラミンとは
* 文部科学省が作成したプログラムができるウェブです。
* 小学校低学年でも簡単にプログラミング体験できるように作られています。
* __プログラミン__はMITメディアラボが作った「スクラッチ」を参考に作られています。物足りなくなったら「スクラッチ」にステップアッププする構図が見えます。
![Screenshot from 2018-12-29 14-12-07.png](https://qiita-image-store.s3.amazonaws.com/0/10574/0855f70b-cb14-359a-f61c-9392fc164c05.png)

# 百聞は一見に如かず。まずはチャレンジ
* 冬休みに入った小学校２年生の娘が暇を持て余しているので、「プログラミンやってみないかー」と誘ってチャレンジしてみました。
![キャプチャ3.PNG](https://qiita-image-store.s3.amazonaws.com/0/10574/98fc9421-3a30-45b1-c52e-81501a337076.png)


# 「プログラミン」を組みあわせて、絵を動かす仕組み
* プログラミンは下のように直感的にわかりやすいパーツ「プログラミン」がツールバーにならんでいます。絵を動かしたりする機能を１つ１つの「プログラミン」が持っています。
![Screenshot from 2018-12-29 14-22-50.png](https://qiita-image-store.s3.amazonaws.com/0/10574/e9a28632-e03e-102c-0326-95b507dd8f97.png)

# 「アニメプログラミン」で「プログラミン」の基礎を学ばせる問題を自作

* プログラミンを開くと、まず黄色のワンちゃんがデフォルトで表示されています。これを最も基礎的な黄色のパーツ「アニメプログラミン」を使う問題を作りました。
* 大体30分位でできる算段で、__小学校の授業にもフィットさせれる__と考えています。

> 問題
> 1. 上、左、下、右のじゅんに３びょううごかして、元のいちに戻ってください。
> 2. １ばんめのプログラミンで、みどりのわくまでワンちゃんを動かして、元のいちに戻ってください。
> 3. ２ばんめのプログラムで、さいしょにワンちゃんの色をかえてうごかしてください。
> 4. 3ばんめのプログラムで、さいごにワンちゃんをジャンプさせてください。
> 5. ４ばんめのプログラムで、さいごにワンちゃんをクルリンさせてください。
> 6. ５ばんめのプログラムで、さいごにワンちゃんを大きくさてください。

![キャプチャ1.PNG](https://qiita-image-store.s3.amazonaws.com/0/10574/4796b665-a688-b563-4c75-b69e54cf900f.png)
:sunny:問題に関連と発展を持たせることで小学生２年生の娘も理解がしやすく、達成感も得やすいと考えます。

# 所感
* 文部科学省で作るだけあって、Qiitaに登録するような諸先輩方でなくても、__「仕組みを理解しようとする前向きなマインド」__があれば、簡単に動かせるようになります。
* PC性能は不要。Pentiumの3000番台の古いモバイルPCでもサクサク動きます。
* 小学校の教室で、隣の席の児童同士で__ペアプログラミング__しても面白いと思う。PCの台数半分でOK。
* 例えば私の家内(IT業界未経験)と幼稚園児も簡単に動くプログラミンを作成できます。
![キャプチャ2.PNG](https://qiita-image-store.s3.amazonaws.com/0/10574/dc225a80-e188-f945-2bfd-5876451a3930.png)

以上です。
お年頃のお子さんがいらっしゃるQiitaの諸先輩方！休日に親子でプログラミング体験はいかがですか！
はじめての vue.js ~GUIで開発環境を構築する~

# はじめに
vue-cli3の公式サイトを確認していたところ、
GUIでプロジェクトを構築していけることを発見したのでメモ書きとして記載していきます。

[公式 VueCLI3](https://cli.vuejs.org/guide/creating-a-project.html#using-the-gui)

# 環境
vue-cli (versionは3.2.1)

# コマンド
実行するとブラウザが起動されます。

```
vue ui
```
# 起動画面
![image.png](https://qiita-image-store.s3.amazonaws.com/0/56169/ae34ea2b-a6eb-b1e0-d0a9-f2c58c7e74fc.png)

# おわりに
GUIで設定できるですね。
また、何か気になることがあったらメモ書き程度で投稿していきます。
【Python】処理毎の所要時間が明確になるスマートなwith文 ＋ @contextmanagerの使い方

### 処理の所要時間が明確なコードはありがたい。
機械学習のロジックの書き方は人それぞれですが、
個人的に機械学習のコードを見てて「イケてる...:heart_eyes:」と思う書き方は「<strong>処理の所要時間</strong>」が明確なコードです。
やはり機械学習は処理に時間がかかるので、時間に関する情報が明確なコードは配慮が行き届いているなと感じます。
処理の所要時間はwith文とcontextmanagerを用いて、簡潔に出力することができます。
以下のテンプレートをご覧ください。

## コードテンプレート

```python:script.py
import time
from contextlib import contextmanager
from time import sleep

@contextmanager
def timer(title):
    t0 = time.time()
    yield
    print("{} - done in {:.0f}s".format(title, time.time() - t0))

def data_import():
    sleep(10)

def data_preprocessing():
    sleep(20)

def train():
    sleep(30)

def main():
    with timer("Process data_import"):
        data_import()
    with timer("Process data_preprocessing"):
        data_preprocessing()
    with timer("Process train"):
        train()


if __name__ == "__main__":
    with timer("Full model run"):
        main()
```

# 実行結果
```
Process data_import - done in 10s
Process data_preprocessing - done in 20s
Process train - done in 30s
Full model run - done in 60s
```

それぞれのメソッドでの処理時間、
そして、最後に処理全体の所要時間が出力されてます。
以上、ぜひご活用ください！
はじめての vue.js ① ~ローカル環境での開発/環境構築/vue-cli3~

# はじめに
Vue.jsについてはたくさん記事がありますが
章を分けてローカル環境からFCMと連携まで記事を書いていきます。

今回は「ローカル環境」でVue.jsのテンプレートを利用したサイトを作成していきます。

## 学べること
- Vue.jsの開発環境の土台作り
- 土台を作るために「vue-cli」でプロジェクトを構築する方法

## 環境構築
- 開発環境
    - macbook pro
    - iTerm2 (便利です)
- 利用する言語環境/環境
    - node [公式リンク](https://nodejs.org/ja/)
    - npm
    - vul-cli (version3)

# Vue.jsの開発環境の土台作り
Vue.jsを動かすにはWebpack環境等を構築する必要があり時間がかかるところでもあります。
そこでVue.jsのCLI(Command Line Interface)を使い、サイト構築のテンプレートをダウンロードして開発していきます。今回はvue-cliを使ってVueを動かして行きます。

### vue-cli3をインストール
[公式サイト](https://cli.vuejs.org/guide/prototyping.html)
公式には「npm install -g @vue/cli-service-global」と書いてありますが
インストール後にコマンドを叩いても反応しないことがあったのでコマンドの内容を変更しています。

```
npm install -g @vue/cli
```

### vueのプロジェクトを作成
```
vue create sample
```
※ sampleはプロジェクト名

#### 詳細設定
コマンド実行するとプロジェクトを作る上で必要な情報を要求してきます。
簡単な設定ではじめていきます。

#### ライブラリの選定
- default：babel、eslintをインストールする。**← defaultを選択**
- Manually select features：導入するライブラリを選定できます。typescriptやwebpackなどを設定してインストールできる。
![スクリーンショット 2018-12-29 15.27.20.png](https://qiita-image-store.s3.amazonaws.com/0/56169/feadd1be-c7b8-8768-2179-5b7e3fc38582.png)

# 出来上がり！
成功したら下記の画面が表示されます。
フォルダを移動してコマンドを叩くことでサーバが立ち上がりサイトが出来上がります。
![スクリーンショット 2018-12-29 15.33.17.png](https://qiita-image-store.s3.amazonaws.com/0/56169/40730fa5-8312-33fb-73ee-c07f34a963de.png)

### サーバの起動
packege.jsonに記載されているコマンドを叩きサーバ/サイトを起動させる。

```
npm run serve
```

### 表示される画面
![http://localhost:8080/](https://qiita-image-store.s3.amazonaws.com/0/56169/37a57af0-86b8-8602-fe06-945473301f27.png)

# おわりに
思ったほど簡単にvue環境を構築することができました。
次回はVue.jsでサイトができたのでFCMの機能とつなぎ込んでいきます。
いろいろメモ

## shasum

```none
shasum -a 256 hoge.zip > hoge.sha256
shasum --check hoge.sha256
```

## find

```none
# %M:ファイルの許可属性
# %n:ハードリンク数
# %s:バイトで表示したファイルサイズ
# %T:最終更新日時
# %P:ファイル名から探索開始点を示す部分を取り去ったもの

$ find dir_ROOT \! -type d -printf "%M %n %10s %T+ %P\n"
-rwxr-xr-x 1         75 2018-12-29+12:46:53.2154289000 dir_A/hoge.sha256
-rwxr-xr-x 1    3846211 2018-06-18+01:39:21.6839699000 dir_A/hoge.zip
-rwxr-xr-x 1         75 2018-12-29+12:46:53.2154289000 dir_B/hoge.txt
-rwxr-xr-x 1       8523 2018-12-29+13:11:14.6952583000 dir_C/file.zip
```

## tar

```exclude.txt
dir_B
```

```none
$ tar -cz -f foo.tgz -C dir_ROOT -X exclude.txt .

$ tar -tz -f foo.tgz
./
./dir_A/
./dir_A/hoge.sha256
./dir_A/hoge.zip
./dir_C/
./dir_C/file.zip
```

## Links

* [JM Project](http://linuxjm.osdn.jp/ "JM Project")
OSが何なのかを歴史からサクッと知る

#OSとは
> オペレーティングシステム（英語: Operating System、OS、オーエス）とは、コンピュータのオペレーション（操作・運用・運転）を司るシステムソフトウェアである。

> オペレーティングシステムは通常、ユーザーやアプリケーションプログラムとハードウェアの中間に位置し、ユーザーやアプリケーションプログラムに対して標準的なインターフェースを提供すると同時に、ハードウェアなどの各リソースに対して効率的な管理を行う。

出展：[Wikipedia](https://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%9A%E3%83%AC%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0)

要するに、ハードウェアの制御も含め**「当たり前の機能を提供してくれるプログラムの集合体」**ということですね。

どこかの本に「単独のプログラムではなく、複数のプログラムの集合体」と書いてありましたが、かなり的確な説明だと思います。


# OSが生まれた経緯

OSが存在していなかった頃のコンピュータは、全くプログラムの存在しない状態から、プログラマが一からプログラムを書いていたそうです。

- ハードウェアの制御
- メモリの制御

これらも含めてプログラムを書くなんて、骨が折れますね...

ここで、ある人が閃いたそうです、
「せめて、プログラムのロードと実行は共通化しようぜ...」

ということで、**モニタープログラム**と呼ばれるものが誕生しました。

これによって、開発効率は上がりました。
モニタープログラムを起動させておけば、それにプログラムを投げるだけで簡単にロード→実行ができてしまいますからね。


時代は進み、モニタープログラムが複数誕生した時に、ある人が閃きました。
「あれ、プログラムに共通しているものがたくさんあるそ。まとめちゃえばよくね....」

ということで、キーボードやディスプレイ等のハードウェアの制御を共通化し、モニタープログラムに含めるようにしました。


これが初期のOSというわけです。


さらに時代は進み、
- 言語プロセッサ(アセンブラ、コンパイラ、インタプリタ)
- 様々なユーティリティ機能

が追加され、今日のOSとなったのです。
Ruby環境構築１

# はじめに
Ruby（on Rails）の環境を構築しようと思ったとき、Ruby、Rails、rbenv、ruby-build、Gem、bundlerといろんなものが登場する。それらが何のためにあるのか、どこに何があるのか、どういう順番で構築するのかなど、よくわからない。これらをまとめてみる。

# それぞれの役割と関係性
まずは役割と関係性の全体像を１枚の絵にしてみる。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269452/196bcf13-8e7d-4b0e-14ca-3b9184783312.png)

まず押さえたいのは、Rubyは１つのサーバーの中で複数のRubyバージョンの環境をもつことができる。これを管理するのがrbenvだ。rbenvのプラグインとして、実際にrubyをインストールするのがruby-bildである。

Rubyをインストールすると、rubygemsが付随してインストールされる。これはgemをインストールしてくれる。gemとは、Rubyにアドオンするパッケージ的なもので、必要なgemを入れることでアプリに様々な機能を簡単に実装できる。

ただし、gem間にも依存関係があり、これを人で管理するのは難しい。そこでbundlerを入れる。bundlerを入れると、gemインストール時に依存関係のあるgemを合わせてインストールしてくれる。また、アプリケーション毎にgemを入れることも可能である。分かりにくいがbundler自体もgemである。よって、gemは本質的には同列であるが、抽象的にはbundlerの配下にいたほうが理解しやすい。

gemはrubygemsでもbundlerでもどちらでもインストールできる。ただ、実際はrubygemsで最初にbundlerを入れて、以降はbundlerを使ってgemを入れるのが一般的だ。
Railsはgemの１つであり、Webアプリケーションのフレームワークである。

# コンポーネント導入の流れ
改めて説明すると、これらのコンポーネントは以下の順番で入れていく。
1. rbenvを入れる
2. rbenvにruby-buildを入れる
3. ruby-buildでrubyを入れる（付随してrubygemsも入る）
4. rubygemsでbundlerを入れる
5. bundlerでgemsを入れる。（gemsの１つとしてRailsがある）

# 構成パターン
これらのコンポーネントは全て入ってないといけないわけではない。別になくてもいいものもある。一般的なパターン別に分けてみる。


| パターン | rbenv | ruby-build | Ruby | rubygems | bundler | gem  | 内容                                           |
| -------- | ----- | ---------- | ---- | -------- | ------- | ---- | ---------------------------------------------- |
| 1        | ×     | ×          | 〇   | 〇       | ×       | 〇    | rubyアプリケーションが動く環境                 |
| 2        | ×     | ×          | 〇   | 〇       | 〇      | 〇   | gemを使ったrubyアプリケーションが動く環境      |
| 3        | 〇    | 〇         | 〇   | 〇       | 〇      | 〇   | 複数バージョンのrubyアプリケーションが動く環境 |


インターネットでrubyのインストール手順を調べると各々自分のパターンで説明しているため、最初は何が必要なのかが分からないがいろんなパターンがあるのだ。

# まとめ
環境構築については**Rubyは便利なゆえに複雑である**という印象だ。
Google Chrome で同じURLで新しいタブを作る拡張 ショートカットは Shift+Option+D @yumainaura

# install


https://chrome.google.com/webstore/detail/duplicate-tab-shortcut-ke/pfippblampohahkkdoomekekmfbjkimg?hl=en

![image](https://user-images.githubusercontent.com/13635059/50534142-e0afa080-0b7b-11e9-8f7c-ddc889b56f36.png)

# Setting

chrome-extension://pfippblampohahkkdoomekekmfbjkimg/options.html

![image](https://user-images.githubusercontent.com/13635059/50534135-c4abff00-0b7b-11e9-9172-5add5cc409f5.png)

# Shortcut setting

chrome://extensions/shortcuts

![image](https://user-images.githubusercontent.com/13635059/50534125-99291480-0b7b-11e9-95a0-ef4d1c623ec2.png)








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
一蘭の行列で待ちながらPythonicなコードを書く


一蘭の行列に並んでいた折、ふと店の壁を見るとオーダー次第で1万2千もの味ができるという。本当か。Pythonicに検証してみた。


```python
from functools import reduce

order1 = {'味の濃さ': ('うす味', '基本', 'こい味'), 
         'こってり度': ('なし', 'あっさり', '基本', 'こってり', '超こってり'), 
         'にんにく':  ('なし', '少々', '基本', '1/2片分', '１片分'),
         'ネギ': ('なし', '白ネギ', '青ネギ'),
         'チャーシュー': ('なし', 'あり'),
         '秘伝のたれ': ('なし', '1/2倍', '基本', '２倍', 'X倍'), 
         '麵のかたさ': ('超かた', 'かため', '基本', 'やわめ', '超やわ')}
print(order1)
```

    {'味の濃さ': ('うす味', '基本', 'こい味'), 'こってり度': ('なし', 'あっさり', '基本', 'こってり', '超こってり'), 'にんにく': ('なし', '少々', '基本', '1/2片分', '１片分'), 'ネギ': ('なし', '白ネギ', '青ネギ'), 'チャーシュー': ('なし', 'あり'), '秘伝のたれ': ('なし', '1/2倍', '基本', '２倍', 'X倍'), '麵のかたさ': ('超かた', 'かため', '基本', 'やわめ', '超やわ')}


各変数のレベルの数を内包表記で取り出す


```python
order1_num = {key: len(value) for key, value in order1.items()}
order1_num
```




    {'味の濃さ': 3,
     'こってり度': 5,
     'にんにく': 5,
     'ネギ': 3,
     'チャーシュー': 2,
     '秘伝のたれ': 5,
     '麵のかたさ': 5}



高階関数を用いて、リスト内の全要素を掛け算する。高階関数の引数としてラムダ関数を渡している。


```python
reduce(lambda x, y: x * y,  order1_num.values())
```




    11250



11250を千の位で切り上げて1万2千としているらしい。一蘭の主張はだいたい本当だったようだ。もっとも、'こってり'と'超こってり'に大きな差があるとは思えず、1万2千のうち多くは似たような味だろうと思うが・・・。
その locale initialization i18n って使ってる？ Qiita英語版とは。 @yumainaura #ローカライズ #Web #サービス

![image](https://user-images.githubusercontent.com/13635059/50534087-78ac8a80-0b7a-11e9-997a-f8c5c26681e8.png)

英語設定ができる。

# 使ってる？

英語ユーザーを見かけたことがない。

# メニューだけ英語でもコンテンツが日本語じゃ、readerにもそれほどは役立たないのでは…？

たとえEnglish only reader がいたとしても。

# 維持コストかかってない？

locale を追加するたびに英語の翻訳を追加してるとすれば。

いや、未知だけど内部開発は。

# localization とは？

日本向けのサービスなら日本向けに固定してしまっても良いのかもしれない。
実装的には英語版も用意しておくとしても、実際のloacleの値は日本語オンリーに絞るとか。


# もどそっと

そっと。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/89618/a9b6bf6f-9343-22e0-e8a2-59afd2e1a93b.png)








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
attr_accessorメソッドの使い方

コードを見ていて「attr_accessor」について理解できていないと感じたので、調べたことのメモとして書きます。

## attr_accessorとは
- attr_accessorメソッドは、クラスやモジュールに`インスタンス変数`を読み書きするためのアクセサメソッドを定義する。
引数には、`インスタンス変数名`をシンボルか文字列で指定。（複数指定できる）。
- 定義されたメソッドは、シンボルの名前の先頭に「@」を付加したインスタンス変数の値を取り出す。
- 戻り値はnil

 - `インスタンス変数`とは、オブジェクトの中で値を保存しておくための利用される変数。

 ```ruby:
class クラス名

  def メソッド名
    @name = 値
  end
  # 「@name」がインスタンス変数
end
```
## attr_accessorの使い方

```ruby:
class Book
  attr_accessor :title, :price
# クラス内でシンボルを渡しアクセサメソッドを定義。
# 一度に複数渡すことが出来、それぞれのアクセサメソッドが追加される。
  
  def initialize(title, price)
    @title = title; @price = price
  end
end
 
book = Book.new("Programming Ruby", 1980)
puts book.title
book.price = 2000
puts book.price

# 結果
=> Programming Ruby
=> 2000
```
上記の例は、次のように記述するのと同じ。

```ruby:
class Book
  def title
    @title
  end
  def title=(val)
    @title = val
  end
  def price
    @price
  end
  def price=(val)
    @price = val
  end
```

- title=(val) や price=(val)は、book.title = “test”　や　book.price = 1500などの`代入式を書いた時に呼び出されるメソッド。`

## attr_accessorで何が出来るのか
- アクセサメソッドを定義することで、インスタンス変数に外部からアクセスできるようになる。
- アクセサメソッドのないインスタンス変数にアクセスしようとした場合、NoMethodError が発生してしまう。

```ruby:
class Car
  def initialize(carname="クルマ")
    @name = carname
  end
  
  attr_accessor :name
end

car = Car.new()
car.name = "civic"
print(car.name)

# 結果
=> "civic"
```
上記のように、「オブジェクト名.変数名」で参照したり更新したりが直接行える。

まだ完全には理解できてないので、随時更新予定です。
WDL-OL

https://adventar.org/calendars/3353 の24日目エントリー…を後になって書いています。

----

WDLは複数のオーディオプラグインをひとつのコードでサポートするためのC++ライブラリです。Reaperを開発しているCockosが公開した3-clause BSDなライブラリですが、現在ではWDL-OLという（開発者Oli Larkinの名を付けた）forkが一番ポピュラーであるようです。（筆者は後述する理由でまだ使っていません。）

https://github.com/olilarkin/wdl-ol

WDLの目的はJUCEと類似しています。JUCEは複数開発環境のサポートのためにプロジェクトファイルを自動生成するProjucerも含めたエコシステムとなっているのに対して、WDLはあくまで複数オーディオプラグインをインターフェース`IPlug`でまとめたライブラリとして提供されています。JUCEのプロジェクトファイルを複数環境向けに構築するという世界観はやや特殊なので、初心者というか一般的な開発者にはこちらのほうが取り組みやすいでしょう。（わたしとしては、Projucerのアプローチはやや時代遅れだし廃れていってほしいと思っています。クロスプラットフォーム対応はCMakeだけで十分です。CLionも対応していますし。）

JUCEもWDLもオーディオプラグイン開発のために使われる機能をオーディオプラグイン処理からGUIまで各種取りそろえています。概ねJUCEのほうがいろいろ持っているのではないかと思います。

JUCEにあってWDLにないのは全面的なLinuxサポートです。DSSIサポートももちろんありません。もともとの開発元であったCockosもReaperのLinuxビルドは提供していません（試験的に公開されているLinux版はwineが前提です）。Linux環境で行きている筆者には現状では無縁のものです（が、VST SDKなどはLinuxもサポートしているので、部分的にでもLinuxサポートを追加するコストはそれほど高くないでしょう…多分）。

現在はWDL-OLの開発者が根本的にIPlug2として再設計していて、今年中に公開したいようなことを[issueで書いている](https://github.com/olilarkin/wdl-ol/issues/126#issuecomment-445261346)のですが、これを待っているとこのエントリが2018年のうちに書ける気がしないので、とりあえず簡単な紹介と現状だけですませることとします。

参考:

- KVRの[JUCE vs. WDL-OL vs. ?スレ](https://www.kvraudio.com/forum/viewtopic.php?p=5755304)
- [Making Audio Plugin](http://www.martin-finke.de/blog/tags/making_audio_plugins.html) （WDL-OLの詳細なチュートリアル群）
- [日本語での紹介記事](http://himatya.hatenablog.com/entry/2017/01/05/152433) - 日本語情報は現状これくらいでしょうか
Qiitaに超超雑な線を描きたい。エンジニアの図面作成もどき。絵文字スクリーンショットの裏技。@yumainara #qiita 

左下から右上に描きたい

でもとにかくペイントツールとかiPadとかどんなツールも面倒すぎて辛い‥

正解はこれだ越後製菓

![image](https://user-images.githubusercontent.com/13635059/50534019-48182100-0b79-11e9-9e6b-5aae335be002.png)



https://github.com/YumaInaura/YumaInaura/issues/31








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
SDカードやUSBメモリのバックアップ・リカバリ


## デバイス名を調べる

```none
$ cat /proc/partitions
major minor  #blocks  name   win-mounts
...
    8    16  15558144 sdb
    8    17  15554048 sdb1   X:\
```

## DDコマンドを使用する

#### パーティション単位 "sdb1" 

```none
# バックアップ
dd if=/dev/sdb1 of=sdb1.dd

# リカバリ
dd of=/dev/sdb1 if=sdb1.dd
```

#### ディスク全体 "sdb" 

```none
# バックアップ
$ dd if=/dev/sdb of=sdb.dd
dd: '/dev/sdb' を開けませんでした: Permission denied
```

Cygwin環境では管理者権限が必要。

```none
# バックアップ
cygstart --action=runas dd if=/dev/sdb of=sdb.dd status=progress

# リカバリ
cygstart --action=runas dd of=/dev/sdb if=sdb.dd status=progress
```
TeraTermマクロのlistboxウィンドウの横幅を広げる方法

## 問題点 : listboxで長い文字列が見切れてしまう

TeraTermのマクロのlistboxの不便な点として「ウィンドウサイズを変更することができず、選択対象として長い文字列を表示すると見切れてしまうため、文字列全体を読むためにはマウスで横スクロールするしかない」という点が挙げられます。

**見切れてしまうコードの例**

```
; リストボックスの中身を定義
strdim LISTITEM 6
LISTITEM[0] = "192.168.0.1 - some_descriptions_about_this_host"
LISTITEM[1] = "192.168.0.2 - some_descriptions_about_this_host"
LISTITEM[2] = "192.168.0.3 - some_descriptions_about_this_host"
LISTITEM[3] = "192.168.0.4 - some_descriptions_about_this_host"
LISTITEM[4] = "192.168.0.5 - some_descriptions_about_this_host"
LISTITEM[5] = "192.168.0.6 - some_descriptions_about_this_host"

; リストボックス表示
listbox "Select login server" "Select server" LISTITEM
```

**実行結果**
![image.png](https://qiita-image-store.s3.amazonaws.com/0/275707/38861143-be0b-d7a7-a938-d69c78855200.png)

意外とストレスフルなこの問題点については改善要望のチケットも上がっているものの、開発状況的に改善される見込みはなさそうなのが現状です。

* チケット #34991: listboxのitem欄について - Tera Term - OSDN 
    * https://ja.osdn.net/projects/ttssh2/ticket/34991
* ウィンドウ - teratermマクロのリストボックスについて｜teratail
    * https://teratail.com/questions/90070

## 解決策 : \<messages\> 引数に長文を入れてウィンドウサイズを引き伸ばす

アドホックな解決策ですが、listboxの第一引数である\<messages\>を長文にすることでウィンドウサイズが横に引き伸ばされるため、リスト部分の横幅を広げることができます。

**見切れてしまうコードの例**

```
; リストボックスの中身を定義
strdim LISTITEM 6
LISTITEM[0] = "192.168.0.1 - some_descriptions_about_this_host"
LISTITEM[1] = "192.168.0.2 - some_descriptions_about_this_host"
LISTITEM[2] = "192.168.0.3 - some_descriptions_about_this_host"
LISTITEM[3] = "192.168.0.4 - some_descriptions_about_this_host"
LISTITEM[4] = "192.168.0.5 - some_descriptions_about_this_host"
LISTITEM[5] = "192.168.0.6 - some_descriptions_about_this_host"

; リストボックス表示
listbox "Select login server----------------------------------------------------" "Select server" LISTITEM
```

**実行結果**
![image.png](https://qiita-image-store.s3.amazonaws.com/0/275707/f0340a9b-00ca-a628-bc8b-a17c05b2a4ac.png)
vhを使う際にはモバイルのアドレスバーに注意

Google Chromeのモバイル版で`vh`が思い通りに使うことが出来なくて調べました。

**`vh`ではなく`%`で対応できるのであれば`%`を使った方が以下のような問題が起きないので楽です。**

webページをPCで開発していると問題なかったのですが、自分のスマホ端末で確認すると予定位置とずれて要素が表示されてしまい、困りました。

ちょうどブラウザのアドレスバーくらいのずれている気がしたので調べてみたところ`カスタムプロパティ`を使用した[The trick to viewport units on mobile](https://css-tricks.com/the-trick-to-viewport-units-on-mobile/)にたどり着きました。

[CSS のカスタムプロパティ (変数) の利用](https://developer.mozilla.org/ja/docs/Web/CSS/Using_CSS_variables)
[カスタムプロパティ (--*): CSS 変数](https://developer.mozilla.org/ja/docs/Web/CSS/--*)

```js:js
// --vhというカスタムプロパティを作成
let vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`);
// window resize
window.addEventListener('resize', () => {
    vh = window.innerHeight * 0.01;
    document.documentElement.style.setProperty('--vh', `${vh}px`);
});
```

```css:css
/* カスタムプロパティ未対応ブラウザ対応 */
height: 100vh;
/* 100vh --vhが未定義の場合は1vhを使う */
height: calc(var(--vh, 1vh) * 100);
```

とりあえずPCと自分のandroid端末では問題なく動作しました。
@Twitter #UI #UX 入力欄の近くに確定ボタンは置こう。当たり前体操🕺 @yumainaura

# プロフィール確定ボタンかと思ったら色変更ボタンを何度も押していた！

# なぜこんな場所に！！！


![image](https://user-images.githubusercontent.com/13635059/50533944-05097e00-0b78-11e9-84f5-dda366b751f7.png)

# 視力が悪いユーザーには厳しい

いやほんとにこれ。
目が悪い人でも、文字が見えなくても分かるUIを基準にしよう。
直感に反する確定ボタン配置はやめよう。
通例で「テキストボックスのすぐ下には確定ボタンがある」ってなってるじゃん。
UI/UXの世界は歴史や他サービスとの揃いレベルを考えて作ろう。
反逆者は反逆者でもうまーーいぐらいに反逆しなければいけない。
さすがにこれはない。

# TOOOOO FARAWAY

![image.png](https://qiita-image-store.s3.amazonaws.com/0/89618/4c7ed9e4-a592-1371-37fc-57c9e63fbbe0.png)



https://github.com/YumaInaura/YumaInaura/issues/28








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Web Mac で視力回復のアプリがないか探してみた結果は？ @yumainaura 

# 結論

良いのは見つからなかった。
物理世界で目を動かそう。
Qiita書いたら目を一休み。
1パースごとに遠くを見る基本的習慣をつけても良いかも。
目がぼやけて年末に死にそうなんですけど‥😢

# 記録

YesGoogling

![image](https://user-images.githubusercontent.com/13635059/50533815-aa6f2280-0b75-11e9-9a11-7a80d0612d63.png)

whatisthis?

http://www.eyesight-tech.com/

![image](https://user-images.githubusercontent.com/13635059/50533818-b5c24e00-0b75-11e9-92c1-bb1f0e4585a4.png)

# EMBEDDED COMPUTER VISION

not silimar to english me

# unn its no

![image](https://user-images.githubusercontent.com/13635059/50533824-ca9ee180-0b75-11e9-981f-0d4ddc5ae176.png)

# What is this?

![image](https://user-images.githubusercontent.com/13635059/50533830-dee2de80-0b75-11e9-93eb-9eda02466ef0.png)

![image](https://user-images.githubusercontent.com/13635059/50533833-e7d3b000-0b75-11e9-9061-6c447acb7b2c.png)

# Googling continued

![image](https://user-images.githubusercontent.com/13635059/50533841-f9b55300-0b75-11e9-8d49-89cacb926692.png)

# ?

![image](https://user-images.githubusercontent.com/13635059/50533846-13ef3100-0b76-11e9-9c7f-24b74073507a.png)


https://www.visionweb.com/

# umm..

# Mac app

![image](https://user-images.githubusercontent.com/13635059/50533862-40a34880-0b76-11e9-8cf3-f64a564b52e1.png)

1 app found

Waiting♪

![image](https://user-images.githubusercontent.com/13635059/50533870-5b75bd00-0b76-11e9-8bde-bc5c1b1e7860.png)

# Taka while i use emoji in github  with mac app Rocket

settings

and im waiting

waitin on a freans .. rollong stones


![image](https://user-images.githubusercontent.com/13635059/50533877-8829d480-0b76-11e9-9570-12a598c79a53.png)

# Ya installed!

![image](https://user-images.githubusercontent.com/13635059/50533884-bb6c6380-0b76-11e9-8de7-a61879fdfab5.png)


# Woooooo greate moneky!

![image](https://user-images.githubusercontent.com/13635059/50533887-c4f5cb80-0b76-11e9-86aa-bcea716565ea.png)

# lol lol lol

![image](https://user-images.githubusercontent.com/13635059/50533888-d0e18d80-0b76-11e9-8029-155968f98524.png)

# Conclusion

move your eyes without apps



https://github.com/YumaInaura/YumaInaura/issues/27








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
pythonでつくるTodoアプリ（CLI）

こんにちはKN_appleです。
今回は端末上で利用できるTodo管理アプリというかコマンド？を作ってみました。

コードは[こちら](https://github.com/nakano16180/Todo_cli)

作成した機能は以下の3つです。
- タスクの追加
- 未完了のタスク表示
- 完了したタスクの削除

## 使い方
![todo_demo1.gif](https://qiita-image-store.s3.amazonaws.com/0/263384/a5eb2030-bb0b-823e-f9cb-b005b44ff3e8.gif)

### タスクの追加

```
$ python3 todo_cli.py todo_add 
```
![todo_demo2.gif](https://qiita-image-store.s3.amazonaws.com/0/263384/9b17b6b1-a01f-273d-c703-6d1f4b76aeaf.gif)

### 未完了のタスク表示

```
$ python3 todo_cli.py todo_list
```
![Screenshot from 2018-12-29 14-07-43.png](https://qiita-image-store.s3.amazonaws.com/0/263384/c5416669-3d8d-3c0f-3b78-14e4a141241a.png)

### 完了したタスクの削除

```
$ python3 todo_cli.py todo_done タスク
```
![Screenshot from 2018-12-29 14-09-18.png](https://qiita-image-store.s3.amazonaws.com/0/263384/c45568c0-2f5b-cb82-8c5d-a8a2065a1c0f.png)

## 技術的な話
使用したのはpython-fireというgoogleが開発したCLI生成用のライブラリ。
これを使うことで、CLIアプリとしての実装が簡単にできました。
あとから関数を追加しても特にややこしい設定もないですし。

タスクについては辞書型で扱っています。
最初はcsvでやろうと思っていましたが、辞書型で扱ってそのままテキストに吐き出すほうが処理が書きやすかったので変更しました。
また、JSONと辞書がほぼ同じように使えるので、jsなどで同じ機能を作り直したときにそのままファイルを読み込めるという利点もあります。
@Github レポジトリで名刺"的"プロフィール作成。@yumainaura #就職 #エンジニア #取扱説明書 #Facebook #Twitter  #アイディア

Facebook Twitter アカウントなどリンクさせたり。

# Githubprofile使わないの？

yes

狭いし。

エリア。

# やっぱレポジトリでしょ？

エンジニアのプロフィールってREADMEに書かなくて良いの？

取扱説明書でしょ？

# 例

https://github.com/YumaInaura/YumaInaura

images talk than words

![image](https://user-images.githubusercontent.com/13635059/50533774-a5f63a00-0b74-11e9-9f3a-1fadb77e2ea2.png)

![image](https://user-images.githubusercontent.com/13635059/50533776-aa225780-0b74-11e9-8d7f-e48f1d6416cf.png)


https://github.com/YumaInaura/YumaInaura/issues/26








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
GoogleChromeお気に入りブクマの「ホームバー」の利用法、活用法 @yumainaura #tips

# いままで使ってなかった

js bookmark appletぐらいにしか。

アドレスバーから行けるし。ブックマークなんて古いと思っていた。

だけどこれは📌ピン機能として浸かるじゃん！と発見。

1日だけアクセスしたい‥！ 忘れたくない！とかいう場合に有効。

# ツール使いこなして行こうぜ。

pinする、忘れない、1日の記憶、1秒のメモリ、1ヶ月用、1週間覚えておきたいこと、忘れても問題ないことなどなど、全てのアプリケーションは「記憶」と「注意」のために存在するのかもしれない。

言い直す。全ての情報アプリケーションは。

![image](https://user-images.githubusercontent.com/13635059/50533720-9a564380-0b73-11e9-8403-dcc95f188a5d.png)

![image](https://user-images.githubusercontent.com/13635059/50533721-9c200700-0b73-11e9-806c-26810c1fb2e3.png)



https://github.com/YumaInaura/YumaInaura/issues/25









<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
初めてのGCP(google cloud platform) part1

自分用の備忘録的なやつ。
gcpはgoogleのawsのようなもの

◆目標
cloud使うなら開発もローカルにファイル落としてやりたくないので、cloud shellだけでまずWEB制作やりたい。

◆準備
・登録（これは省きます）
・スタートガイド
　この手順忘れるので、簡単に説明
　①プロジェクト作成(上部ヘッダメニュー左上ロゴの右にある)
　①-1 左上ナビメニュー→ホームからリソース確認
　　　1.右上カスタマイズから項目表示/非表示
　　　2.アクティビティからGCPリソース間情報確認

◆App Engine手順
※ここからはgit操作必要（省きます
①上部ヘッダーメニュー 『[<_]』からGoogle Cloud Shell起動
②gitブランチ作成

②-1ファイル作成 （php例)
app.yaml
index.php
index.html

②-2 ファイル（コード）
・app.yaml
　※言語によってコードは変わるが、対象となるファイルを指定(設定するファイル)

```
runtime: php55
api_version: 1
threadsafe: true

handlers: - url: /.*
script: index.php
```
・index.php

```
<?php
header('Content-Type: text/html; charset=utf-8'); // 文字コードとか 
readfile(__DIR__ . '/index.html'); // html指定
```
・index.html

```
<!DOCTYPE html>
<html>
  <head>
    <title>初めてのGCP</title>
  </head>
  <body>
    表示テスト<br>
  </body>
</html>
```
②-3　ローカル確認(※必須ではない)
※修正分を都度確認するなら

```
dev_appserver.py     --php_executable_path=/usr/bin/php-cgi     $PWD
```


③Google App Engineにデプロイ

```
gcloud app create
(app作成なので1度だけやればOKだとおもう)
gcloud app deploy
(修正したファイルをgaeにデプロイする)
gcloud app browse
(url確認)
```

長くなったので、
画像アップロードの詳細は次回のpart予定

◆ざっくり手順
①左上メニュー→ストレージ→ブラウザ→バケット作成
※作成したバケット内でフォルダ作成などでファイル構成を行う

②作成したバケット選択→ ファイルD&DでUPできる（画像とか）
②-1アップロードした画像をappで使用したい場合は以下で呼び出す

```
gs://バケット名/UPした画像名など
gs://testbake1/testImg001.jpg
gs://testbake1/img/testImg001.jpg
```
このファイル名をphp側でごにょごにょする。
CloudStorageToolsに何かあるので次回はそれをメモ予定
https://cloud.google.com/appengine/docs/standard/php/googlestorage/images
【Mono】C#とC++ その1

##概要
　私はC++erってほどC++の仕様に詳しいわけじゃないですが、この人生上、最も長けているプログラミング言語はC++言語です。最も好きなプログラミング言語もC++。好きだけどビルドの遅さだけは気になる・・・
　最近、Monoというライブラリを使うことでC++からC#のコードを実行できることに興味を持ちました。Monoといえば、ゲームエンジンで有名なUnityや、AndroidやiOSなどのスマホ向けクロスプラットフォーム開発環境のXamarinで利用（Embedded）されています。Monoの使い方についてはいつか別の機会に。
　で、要は今までほとんど使ったことがないC#を使い始めたわけです。似てるようで異なるC++とC#。その二つを比較していこうと思います。

　※最近のUnityはMonoから自社製IL2CPPというのに移行しているみたいです。


##C言語との関係

- C言語のコードをC++言語で利用するのは簡単
- C言語のコードをC#言語で利用するのはめんどくさい

　C言語・・・それは長い歴史をもっていてそしてなお現在も生き残り続けるプログラミング言語です。Cで書かれた数多くのライブラリが存在します。利用できるものは利用したい！
　C++言語もC#言語も、C言語の影響を受けた派生言語です。文法は非常に似ています。ですが互換性の面では大きな差があります。純粋にCで書かれたコードはそのままC#のコードとしてコンパイルすることはまずできないでしょう。それだけ文法に違いがあります。
　一方、CのコードをC++としてコンパイルすることは割とあっさりできたりします。（完全な互換性があるわけではないですが）C++はCで書かれたコードをそのまま再利用できるのです。(CのコードをC#で利用する場合はP/Invokeという仕組みが必要になります。めんどくさい...)


##対応環境

- C++ →　多い
- C#　→　少ない (現在は増えてきている)

　C++は、様々な開発に用いられた長い歴史を持つC言語と高い互換性があります。そういう事情もあって、Windows、Linux、Mac、スマホ、いろんな環境に移植できます。ただ、基本バイナリはネイティブコードであるため、環境に合わせてビルドしなおす必要があります。
　C#のバイナリは中間コード(IL)で、プラットフォームに依存しないコードですが、Microsoft製の言語で、古くはWindows限定でした。しかしMicrosoftが仕様を公開して、Monoプロジェクトが立ち上がったことで様々な環境に対応しています。

##コンパイル(ビルド)の速度

- C++ →　遅い
- C#　→　速い

　C++もC#も基本的に事前にコンパイル（+リンク）が必要です。
　C++はtemplateやプリプロセッサマクロを利用することで静的でありながら非常に自由度の高いコーディングを実現しますが、その分、複雑になってパース・解析に時間がかります。依存関係を気にせず書いているとコンパイル時間もバイナリサイズもびっくりするほど肥大化します。ただ実行速度(パフォーマンス)は良いです。
　C#はC++のようなtemplateはありません。似たようなジェネリクスというのはありますがtemplateの機能限定版のようなものです。C++の自由すぎるものを取っ払って、stringやプロパティ、delegateという仕組みをライブラリとしてではなく、言語そのものに取り込んでいます。自由すぎないのでC++ほど解析に時間はかかりません。ただ実行速度はC++に劣る・・・と言いたいところですが・・・JITエンジンは進化しており、現在では遜色ないぐらいの速度に...（ｹﾞﾌﾝｹﾞﾌﾝ
C++は実行速度の速さが売りのはずなのに追いつかれてるのってなんかちょっとショック！


##余談 「IL2CPP」
 最近のUnityはMonoから独自のIL2CPPに移行しているみたいです。その名の通りILコードをC++コードに変換するようです。え　最終的にC++コードにするなら最初からC++つかわせてよ！
@GIthub ラベル作成の色、カラーコードの仕様が辛いよ‥ @yumainaura #ui #ux 

# Wanna create red!

![image](https://user-images.githubusercontent.com/13635059/50533518-c1f6dd00-0b6e-11e9-8f28-c01c8528a0d4.png)

# No its no

![image](https://user-images.githubusercontent.com/13635059/50533519-c3280a00-0b6e-11e9-9004-4924a0026620.png)

# like Wizardry character making...

![image](https://user-images.githubusercontent.com/13635059/50533533-01252e00-0b6f-11e9-9aaa-c0f28333b5d8.png)

# imagine トルネコの冒険 lost リレミトの巻物 ... steps


![image](https://user-images.githubusercontent.com/13635059/50533560-83155700-0b6f-11e9-8703-4a3eb818d761.png)

# Engineers should know and handle color codes?

no! we does not use it well..

# Ahhhh lost favorite color!!!!

I wanna red color i want really i want

`#ff0000` its no

# Color picker ... welcome!

![image](https://user-images.githubusercontent.com/13635059/50533549-40ec1580-0b6f-11e9-9b55-62fe5d7a6cbf.png)

 
i home really want it








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Open NSynth Super

https://adventar.org/calendars/3353 の17日目のエントリー…を後になって埋めています。

----

Open NSynth SuperはGoogleが開発している機械学習ベースの音楽生成システムであるところのNSynthを利用して音色を作成するためのハードウェアで、その設計図が設計図共有サイトgithubで公開されています。

https://github.com/googlecreativelab/open-nsynth-super/

NSynthとはGoogleがtensorflowをアート方面に利用したmagentaと呼ばれる一連のプロジェクトの一部で、複数の音色の特徴を数値化してから混ぜることで今までに無かったような音色を生成する、というものです。magentaやNSynthについては、筆者はほぼノータッチなので、詳しい解説は他所におまかせします。

Open NSynth Superが面白いのは、プリセット音色約20種類の中から4つを選んで、それらの混合比率やADSR（エンベロープ）をツマミで調整しながら合成できるUIを実現する、という目的のためだけに全てのエンジニアリングリソースを費やしているところです。Raspberry Pi上でopenFrameworksで書かれたアプリケーションを動作させるものです。

主要な関心が生成されるサウンドのほうにある筆者としては、正直わざわざハードウェアを用意しなくても手元のPCで再現すれば十分なのではないかと思うのですが、プリセット音色だけで数十GBにもなるので、あまりお手軽ではありません。

組み立てるために必要な部品の情報は全てリポジトリ上で公開されています。日本で調達できない部品は無かったと思いますが、基本的に英国の開発者が作成したのか、購入できるパーツショップのURLは英国のものでした。筆者はPCBとケースを調達するところが面倒で先に進めていませんが、PCBは[KiCADのデータが用意されている](https://github.com/googlecreativelab/open-nsynth-super/tree/master/pcb_hardware)ので、業者に発注すれば作れるでしょうし（それなりの金額になるとは思います）、ケースはプラスチック板をレーザーカットするだけなので、その手のものを貸し出してくれる場所で作成できるでしょう。この辺に興味がある人が他にいたら一緒にやってみるのもいいかもしれないとは思っています。（1人で単なるオモチャのために1枚のPCBを発注するのは割に合わないな…という感じです）

サウンドバンクは、プリセットで用意されているものを使えばとりあえず十分なのですが、自前で用意した音色をNSynthで処理して指定することも可能です。この辺りも詳しく[ドキュメントにまとめられています](https://github.com/googlecreativelab/open-nsynth-super/tree/master/audio)。ただしビルドするためにCUDAのあるLinux環境が必要になるので、筆者はローカルのLinux環境では試せませんし、音色データが数十GBになるのでクラウド環境でビルドするのも厳しいんじゃないかな…という印象はあります（試していません）。
俺でもわかるConfluenceとActiveDirectory連携はLDAPSだからパケットキャプチャされても恥ずかしくないもん！編

俺です。

[コレの続きです](https://qiita.com/gamisan9999/items/8975bd60b3fdc9800e9a)。

ActiveDirectory(AD)やLDAPからuser, group情報を連携できましたが、通信経路はLDAPで流れてます。
紳士たるものSecure Sockets Layerで暗号化しておきたいところです。

以下ADCSで発行されたサーバ証明書を使い、ConfluenceからADDSへのLDAP連携をLDAPS化するtipsです。

# 参考情報

- [公式ドキュメント](https://confluence.atlassian.com/doc/connecting-to-ldap-or-jira-applications-or-other-services-via-ssl-133817.html)

# 構成

- ADDSとADCSが同居している
- ADCSのサーバ証明書が発行されている
- ConfluenceはServer版を利用している

# LDAPS連携までの流れ

## ADCSから証明書のエクスポート

- ADCSのスナップイン(mmc.exe)に証明書(ローカルコンピュータ)を追加します
- ADCSから発行された証明書の中でサーバ証明書となっているものをbase64でエクスポートします
- エクスポートした証明書をConfluenceサーバの任意のディレクトリへ転送します

## Confluenceサーバへ証明書をインポートする

- keytoolコマンドを使います。

```
keytool -importcert -alias <任意のエイリアス名> -keystore <Confluence Install Path>/jre/lib/security/cacerts -file <転送したサーバ証明書までを示すフルパス>
```

- Confluenceの再起動

```
service confluence stop && service confluence start
```

## ConfluenceのLDAPS設定

- Confluence管理画面からActiveDirectory連携へ遷移します。
- LDAPからLDAPSに変更します。
- 接続先AD名をADCSのServer Aliasにします
- 接続テストを実行し、成功したら保存をします

これでConfluenceとADの間で流れるパケットを眺められても恥ずかしくない疎通ができるようになりました。
おわり
Qiita の記事って日本語で書いてても意外と海外から読んでいただけているみたいですよ

# はじめに
Qiita に日本語で書いた記事のコメントに質問を英語で頂くことが時々ありまして、こんなマイナーな言語でかいた記事に御興味をもって読んで頂き、ありがたい事にご質問までいただけるとはなんとありがたい事であろうかと喜んでおりました

***日本語での情報発信はグローバルな価値はゼロ***なんてよく腐されておりました***グローバル言語弱者***の私といたしましては、小さいとはいえ決して***ゼロではなかった***事、私の声が***少しでも世界に届いていた***事実に大変勇気づけられたものでございます

つきましては***日本語で書いたソフトウェアに関する記事はグローバルにどれぐらい読んでいただけるものなのか***というソフトウェア工学的な興味をエンピリカルに検証してみましたので、以下その旨をご報告させていただきます次第にございます

# Resarch Question

RQ1: Qiita に書いた日本語の記事がグローバルに参照される比率は何％ぐらいなのか

# 検証方法
Qiita はありがたいことに ***Googleアナリティクス設定*** ができますので、それで自分の記事がどれぐらい日本以外で参照してもらえているものなのか調べてみようと思います

![スクリーンショット 2018-12-29 12.25.35.png](https://qiita-image-store.s3.amazonaws.com/0/46544/615f19e5-b979-689b-4a60-b49c28d64340.png)

期間は2018年の 9月3日から 12月29日（今日ですね）までの***約４ヶ月間***、これまでに上梓させていただきました***74本***の記事が対称です

# 結果
それがぱっと見凄いんですよ
![スクリーンショット 2018-12-29 11.33.49.png](https://qiita-image-store.s3.amazonaws.com/0/46544/94b02703-dbbe-7217-de56-3c878116384c.png)

北米とヨーロッパは予想してたのですが、南米、アジア、オセアニア、ロシアと余すところなくグローバルじゃないですか、日本語の記事なのに、５ヶ月間の集計なのに

特筆すべきはタンザニアとケニアで、BBCとか見てると国策もあって近年急速に産業が発達してると紹介されているんですが、そういう国や地域でも読んでいただけているなんてちょっと胸が熱くなりますね、書いてよかった

イエメンとか４０人も読んでくださった方がいらっしゃいましてほんと嬉しい

チュニジア（行こうとしてた年にジャスミン革命がおきてしまって行きそこなった悲しい思い出が）やモロッコみたいないつかは行きたいマグレブ諸国でも読んでくださってる方がいらっしゃるんだとおもうともうなんというか感動です

世界の皆様、こんな記事をわざわざ読んでいただきまして本当にありがとうございますだ

なんて感慨に浸ってないで（感動は研究の最強のモチベーションであるとはおもうのですが）、前述の RQ の検証にもどりますと

![スクリーンショット 2018-12-29 11.34.16.png](https://qiita-image-store.s3.amazonaws.com/0/46544/8a4d719a-0294-6e61-bcf2-4ec3b68808f4.png)

日本からの参照が 95.49%、なので***海外からの参照は 4.51%*** ですね、思ってたより桁違いに多い、マジで有意な数の参照が海外からだったんですね

ところで日本国内にも日本語話者でない IT エンジニアの方がたくさんいらっしゃいますし、海外で働いている日本語話者の IT エンジニアの方もたくさんいらっしゃいます
日本語話者ではないと思われる方がどれ位参照してくださっているものなのかというと

![スクリーンショット 2018-12-29 12.15.10.png](https://qiita-image-store.s3.amazonaws.com/0/46544/37bf3028-8408-c1b7-8b52-655529f71a87.png)

ええと、だいたい ***7.28%*** ぐらい？
すごい

# 考察
機械翻訳が進んでいて、何語で書いてあるかは問題じゃなくなってきてるということなのでしょうか？

# 結論
日本語の記事ってみんなが信じてる以上に実は発言力があるみたいですよ
少なくとも「価値はゼロ」なんてことは決してないみたい

# threat of validity

external validity への threat ですけど、***Qiita が特別にグローバルにアトラクティブなサイトである***という可能性がいなめてませんね ^^;;;
比較対称として Crieit とか Qrunch とかでも試してみたいんですけどアナリティクスの設定できるようになるまで保留

あと、記事を書いた人の個体差がないと主張するための検証もできていません
本稿を読んでいただいた諸兄諸姉の場合、どんな感じだったかをコメントしていただければ大変有益なデータになりますので助かります

というわけで、本稿は十分に一般性のある主張とは言い難いと結論づけざるをえません（threat of validity の考察になってないどころかこれじゃ reject 通知ですね ^^;;;）

# future works
記事毎の差異とかも興味あります
なにか面白い事象を見つけましたらまたご報告いたしますね

# related works
しらべてません ^^;;;; ごめんなさい
なにかご存知でしたらコメントしていただければ大変ありがたいです
PHP MySQLにて新規登録時のemail重複チェック

webサービスでよく見かける、新規登録時のemailアドレス重複チェックを実装しました。
初学者でだいぶ時間がかかりましが、なんとかググりながらやりきりました。
今回の理解を忘れないために書いていきます。


## 考えたプログラムの流れ
1,[eamil][password][password再入力]の各項目入力
2,DBに接続
3,SQL文にてSELECTを用いemailを検索
4,if文で重複していればエラーメッセージ。重複がなければ新規登録しマイページへ。

## 実際のコード

```php:new.acount.php

if(empty($err_msg)){
      $dsn = 'mysql:dbname=feel.share;host=localhost;charaset=utf8';
      $user = 'root';
      $password = 'root';
      $options = array(
        // SQL実行失敗時に例外をスルー
        PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
        // デフォルトフェッチモードを連想配列形式に設定
        PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
        // バッファードクエリを使う（一度に結果セットを全て取得し、サーバー負荷を軽減）
        // SELECTで得た結果に対してもrowCountメソッドを使えるようにする
        PDO::MYSQL_ATTR_USE_BUFFERED_QUERY => true,
      );

      $dbh = new PDO($dsn,$user,$password,$options);

      $query = $dbh->prepare('SELECT * FROM users WHERE email = :email limit 1');

      $query->execute(array(':email' => $email));

      $result = $query->fetch();


      if($result > 0){

        $err_msg['email'] = MSG06; //このE-mailは既に使用されています。

      }else{

        $stmt = $dbh->prepare('INSERT INTO users(email,pass,login_time) VALUES (:email, :pass, :login_time)');

        $stmt->execute(array(':email' => $email,':pass' => $pass, ':login_time' => date('Y-m-d H:i:s')));

        header("Location:mypage.php");
        }
      }

```

と言った具合です。

## 学んだこと

### elseで条件分岐させること
最初、elseをつけずこのようなコードを書いていました。

```php:new.acount.php
if($result > 0){

 $err_msg['email'] = MSG06; //このE-mailは既に使用されています。

 }

 $stmt = $dbh->prepare('INSERT INTO users(email,pass,login_time) VALUES (:email, :pass, :login_time)');

 $stmt->execute(array(':email' => $email,':pass' => $pass, ':login_time' => date('Y-m-d H:i:s')));

 header("Location:mypage.php");
}
```
考えはいたって単純で、ifで引っかかればそこで処理が終わるだろうと思ったからです。

だけど、同じemailでも登録されてしまってました。
正直な所その理由はまだ分かりません。
（elseを書いていないことで、そもそもifが実行されていなかったと思われる・・・多分）

が、elseをつけることにより、条件分岐ができ実装できました。
過去に一文でifは終わらせられるというのを聞いたことがあり、それでelseを書いていませんでした。

## まとめ
プログラムの流れや、どの部分にコードを書けば良いのかを考え、ググりながら時間かけながらもなんとか1人で実装できました。
セキュリティー面などもちろんまだまだ未熟な点は多いですが１つずつクリアにしていこうと思います。

### 諸先輩方へ
もっと出来るようになりたいので、こうした方がいいなどのアドバイスがあれば是非教えてください。
「私はロボットではありません」失敗！皆大嫌いなあいつは「ReCAPCHA」というらしい。@yumainara @qiita #認証 #google

# Qiitaがいつの間にか導入していた。

いつから？

# バスはどれ？

わからないぜ。

![image](https://user-images.githubusercontent.com/13635059/50533325-bdc8c080-0b6a-11e9-8654-0d07c3a5900e.png)

![image](https://user-images.githubusercontent.com/13635059/50533324-b99ca300-0b6a-11e9-9d66-2a3861ebe251.png)

![image](https://user-images.githubusercontent.com/13635059/50533331-db962580-0b6a-11e9-8300-856beaee6a11.png)


#ReCaptcha Qiita

https://qiita.com/amagasu1234/items/9760c2c410776fd02e12

# reCAPTCHA: Easy on Humans, Hard on Bots - Google

人間に優しくボットに厳しく。


![image](https://user-images.githubusercontent.com/13635059/50533349-2f087380-0b6b-11e9-9a4c-d261ce910e62.png)

# 僕らは人間じゃなかったらしいな？

# V3らしい

![image](https://user-images.githubusercontent.com/13635059/50533353-3891db80-0b6b-11e9-9d17-ec8c58616ee3.png)


# スコア制らしい

![image](https://user-images.githubusercontent.com/13635059/50533356-4ba4ab80-0b6b-11e9-81ac-6d4de3375dc0.png)


#フロントエンドはこれだけ！

```js
 <script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
  <script>
  grecaptcha.ready(function() {
      grecaptcha.execute('reCAPTCHA_site_key', {action: 'homepage'}).then(function(token) {
         ...
      });
  });
  </script>
```

すごすぎ。

これは採用したくなる。

おそるべしGoogle

#で、なぜ嫌いなの？

ローカライズ全然出来てない。
日本人が理解する「バス」が分からない。
画像のローカライズって大変そう。
でも現状一番の選択肢なんだろうな、コスパ考えると。

# 以上。

誰かバスの見つけ方おしえてください。

https://github.com/YumaInaura/YumaInaura/issues/22








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
filterしたListは別物として定義してみたらどうか

Listをfilterする機会は多々あると思います。
業務でコードを書いたときに何回か以下のようなコードを書いた/見たことがあってなかなか悩みました。

たとえばこんなコード。

```java
class トマト提供Service {
   @Autowired
   private 冷蔵庫Repository 冷蔵庫Repository;

   public List<トマト> 取り出す() {
     return 冷蔵庫Repository.getトマト().stream
              .filter(v -> v.is新鮮())
              .collect(Collectors.toList());
}
```
この時、**返却されるトマト型は新鮮かどうかを表現していない**ので、このServiceを使う側は新鮮であることを信用して使うことになります。
このままでは調理工程が後半になるにつれ、「このトマトは本当に新鮮なんだろうか、腐ってないだろうか」と心配になってきてしまいます。もう一回新鮮かどうかチェックしてしまうかもしれません。

なので、新鮮であることをクラスで表現してみます。

```java
class トマト提供Service {
   @Autowired
   private 冷蔵庫Repository 冷蔵庫Repository;

   public List<新鮮なトマト> 取り出す() {
     return 冷蔵庫Repository.getトマト().stream
              .filter(v -> v.is新鮮())
              .map(v -> new 新鮮なトマト(v)
              .collect(Collectors.toList());
}

class 新鮮なトマト {
   private トマト トマト;
}
```
**クラス名に新鮮であることが明記されている**ので安心して調理を進められます。
ただ、このままでは名前を変えただけなのでもうちょっと工夫してみます。

```java
class トマト提供Service {
   @Autowired
   private 冷蔵庫Repository 冷蔵庫Repository;

   public List<新鮮なトマト> 取り出す() {
     return 新鮮なトマト.create(冷蔵庫Repository.getトマト());
   }
}

class 新鮮なトマト {
   private トマト トマト;
   
   public List<新鮮なトマト> create(List<トマト> トマト){
     return トマト.stream
             .filter(v -> v.is新鮮())
             .map(v -> new 新鮮なトマト(v)
             .collect(Collectors.toList();
   }
}
```
どうやって新鮮なトマトを選んだかは新鮮なトマトクラスを見るだけでよくなりました。

元のリストにfilter処理を施したとき、別クラスのリストで返した方が後工程で不安にならないので安心です。
Raspberry Pi B+のバックアップimgファイル作成

# 手順

①予め、空のバックアップimgファイル(例：yyyymmdd_RasPiSdBackup.img)を作成しておく。
②Win32 Disk Imagerを起動する。
③「Image File」に①で作成したimgファイルを選択する。
④「Device」にRaspberry Pi B+のSDカードを挿したドライブ(例：R:\)を選択する。
![001_Setting.jpg](https://qiita-image-store.s3.amazonaws.com/0/333390/a83241e9-716d-7896-285d-1da3f77ec234.jpeg)
⑤「Read」ボタンをクリックする。
⑥ファイルの上書き確認画面が表示されるので、「Yes」ボタンをクリックする。
![002_Check.jpg](https://qiita-image-store.s3.amazonaws.com/0/333390/2ba75752-8522-f15a-1951-6517b91ad7b4.jpeg)
⑦しばらく待つ
![003_Process.jpg](https://qiita-image-store.s3.amazonaws.com/0/333390/ff563d97-72e3-99c2-f809-6b93f4fde863.jpeg)
⑧「Complete」画面が表示されたら「OK」ボタンをクリックして、完了。
![004_Complete.jpg](https://qiita-image-store.s3.amazonaws.com/0/333390/7b219188-46da-85c3-e79a-304cc0e28130.jpeg)


# 背景

以下でRaspberry Pi B+の再インストールを実施した際、
時間がかかり、もったいないと感じたので、当該内容を試行した。
https://qiita.com/TTakeshi/items/e9772a1293b1e3f88dea

# 今後の予定

バックアップimgファイルを使用したSDカードの復旧について、試行する。
@Github で Issue のサジェスト機能スタート！ @yumainaura #beta #2018

![image](https://user-images.githubusercontent.com/13635059/50533242-2878fc80-0b69-11e9-9b49-02557e633bef.png)

https://blog.github.com/changelog/2018-10-16-suggested-changes/

どうやらベータ版らしい?

Try it!

っていうボタンが出てきた。既に押してしまったのでスクショはロスト。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/89618/3509d02a-f1c2-8fd2-2d36-0a7c1d5528ba.png)








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->