OmniAICreator/Qiita-1.07M huggingface dataset:
未経験からテックキャンプで学習を行い受託、自社開発企業を内定をもらった事について



##はじめに
　私は2020年5月半ばから7月半ばまでテックキャンプに通い、10月半ばに受託、自社開発企業から内定をいただくことができました。正直、コロナの影響もあり転職活動に不安がありました。
　これからプログラミングスクールに通おうと思っている方や現在通っている方、転職活動中の方の参考になればと思います。
　具体的な勉強方法というより、考え方がメインになります。自分の経験談に基づく考えですが、時期や価値観によっては全てが正しいわけではないです。あくまでも参考程度にしてください。
誤字脱字が多いかもしれません。ご了承ください。

##プロフィール
27歳、前職は塗料メーカーにて営業と施工管理を3年間しておりました。
営業成績は個人目標も190%達成
大学は、私立文系卒でプログラミングは、プログラミングスクールに行くまで、一切しておりません。
建築業界の効率の悪さに嫌気がさし、自分でシステムを作り、悪い文化を変えようと思い転職を決意しました。

##プログラミング学習歴

2020年　5月半ばにテックキャンプ短期集中に入学
2020年　7月下旬にテックキャンプ短期集中に卒業
2020年　8月頭から9月頭くらいまでポートフォリオ作成
　　　　(内容はテックキャンプで学んだことの復習と追加実装程度)
2020年　9月中頃から10月半ばまで転職活動を行い、自社、受託企業様から内定を頂き11月から就業開始

##取り組んだこと
・ポートフォリオ作成(https://github.com/toshiki-hato/app-cuisine)
　使用技術、Html,css,JavaScript,Ruby,Ruby on Rails,Mysql,Heroku,AwsS3
・面接対策


##取り組まなかったこと
・Twitterにてアウトプット？は一切しなかった。
・Qiita記事投稿
・Paizaのテスト(キャリアアドバイザーからやる様に言われた。)
・資格の勉強(ITパスポート、基本情報技術者の資格など)

##転職活動実績

応募　：　100社以上
面接　：　14社程度
内定　：　２社　（SES会社１社、自社、受託企業１社）

応募、面接はうる覚えで申し訳ございません。

応募経路　：　リクルートエージェント、マイナビ、エン転職、Green、Wantedly、DODA、Typeなど

##テックキャンプに通って良かった事
###短期でWEBアプリケーションを開発
２ヶ月半でプログラミングの学習を行いましたが挫折する事なく取り組む事ができた。
###継続して取り組む環境(メンタル面)
ライフコーチが気さくな方で相談や勉強で集中できない時に雑談をする事で気分転換ができ、継続し学習ができた。
###教室設備に感動
コロナの影響で教室に通う事が週2日になりましたが、その２日間は教室で学習をしてきました。
教室からの眺めが最高でした。
（教室の設備環境はとても良かった。特に椅子！！！）

###転職成功までのキャリアアドバイザーによるサポート
テックキャンプ経由での就職意外の質問などにしっかり答えてくれました。

#転職活動について

私の転職活動についてですがメンタルが持ち続ける事が苦痛でした。テックキャンプの受講生も２週間置きに５０名近く入学されてその方が同じ時期で卒業していきその方達が同時に転職活動をスタートし始めるという事になります。しかしコロナの影響もあり私が卒業するまでに卒業していた方達が転職活動が終わってなければその人たちと競争しながら転職活動を進めなければならないという事。
テックキャンプから求人を紹介して頂けるが正直書類選考でさえかなり通過しづらい状況でしたので自分で転職サイトを活用し動いておりました。応募ですが**言語経験者のみという求人もダメもとで応募しました。(応募するのは只なので)**
また、テックキャンプは転職できなければ全額返金と制度がございますがこれは**東京で勤務可能の方のみ**で私は大阪勤務が希望でしたので自分へのプレッシャーをかけるために転職サポートを外しました。（テックキャンプ側に東京勤務と意思を伝えて大阪の求人をこっそり探してもいいと後々思った。)
応募事業はSES,自社開発、受託開発、パッケージ制作など幅広く応募した。本命は自社、受託開発企業でしたが書類選考通過ができなく路線変更が多かった事を反省。
また、SES事業の会社を受けましたがそちらの企業が全部ではないですが面接の際に人を道具として扱う様な発言が出てた為、私はあまりオススメ致しません。
私の経歴を自慢ではないのですが営業成績はかなり良く面接では、営業で結果を残しているのになぜエンジニアになろうとしたのかという質問が多かった為、私の思いを企業様に対してぶつけていました。

##面接対策
こちらはどの企業様も聞いてくる内容の為、必ず言える様に準備しておく(内容は変えなくて良い)

・自己PR
・自己紹介
・前職退職理由
・前職の経歴
・就職活動の軸
・長所、短所
・成功体験、失敗体験
・自分がどういうエンジニアになりたいか

企業ごと変えて行かないといけない内容

・志望動機
・入社してやりたい事
・逆質問

##転職活動を終えて

・企業側はなぜエンジニアになりたいのかを特に聞いてくる
・企業は技術的なことの質問はあまりなかった。
しかし、**ポートフォリオは作成しといた方が良い。企業側はなぜそれを作成したかを聞いてくる**
・面接は場数を踏みなさい(対面式とWEBの両方)
・地方勤務希望の方は根気が必要

私は9月下旬から10月下旬までに転職が決まらなければ営業職に戻る事も視野に入れてました。書類選考で落とされ面接に進めない時には不安にもなりました。テックキャンプ経由の応募した企業様からお見送り理由が営業職の方が向いていると言われた時には腹も経ちました。コロナの影響で就職したくても出来ない方が連日ニュースで出たりなど悪い情報ばかりが頭に入ってきます。その様な状況で内定が出た時には大変喜ばしい事で今後の私に大きな自信がつきました。

##これからエンジニアになろうと考えている方たちへ

一度きりの人生ですのでやりたくない事を我慢してやるより、やりたい事を思う存分やってください。コロナの影響で転職活動に進めない方も多数おられると思いますが、現状に満足出来ない人は勇気を出して前に進んでください。未経験でエンジニアを目指して居られる方は多くおられ狭き門かもしれません。私も前職の退職の際に上司に言われましたがそれを実現する事が出来ました。そしてyoutubeなどを見て未経験が企業にとって必要としていることなど分析した結果が今になっていると思います。エンジニアとしてあまりこういう事をいうのはどうかと思いますが根性論でどうにかなるかもしれません。参考になるかわかりませんが以上が私が未経験からテックキャンプの学習を
経て転職活動の報告になります。誤字脱字が多いのはご了承ください。最後まで見てくださってありがとうございました。参考程度で見てください。
Progate JavaScript 文字列と数値


##JavaScript(ES6)とは
従来のJSより効率的コードのかける新しい仕様のバージョン
2015(ES6)

##プログラムを実行してみよう
「console.log("〇〇")」と書くと〇〇という文字がコンソールに出力されます。

```script.js
console.log("Hello World");
```

##演習

```scirpt.js
console.log("「ES6 学習コース」へようこそ！");
console.log("にんじゃわんこと一緒にES6を学んでいきましょう。");
```

##console.log()

コードの書き方をより詳しく見ていきましょう。
<strong>console.log()</strong>は丸括弧()内に入力された文字をコンソールに出力
また「Hello World」の様な文字のことを<strong>文字列</strong>と呼びます。文字列は、シングルクォーテーションか、(`)ダブルクォーテーションで囲む必要があるので、注意

○

```script.js

console.log('Hello World')
console.log("Hello World")
```


×

```script.js

console.log(Hello World);

```

##セミコロン
文の最後はセミコロン(;)で終わります。セミコロンはなくても正直に動作する場合が多いですが、思わぬ不具合が生じる場合があります

```script.js

console.log("Hello World");

```
##コメントアウト
文頭に「//」を書くと、その行はコメントとみなされます。そのため、
プログラムとしては無視され、実行されません。(コメントアウトと言います)
コメントは、どの様な意味のコードであるのか記すメモとして使われます。

```script.js

//console.log("Hello World");

//Helloと出力します

console.log("Hello World");

```


##演習

```script.js

// 「Hello World」とコンソールに出力してください
console.log("Hello World");

// 「にんじゃわんこ」とコンソールに出力してください
console.log("にんじゃわんこ");

// 以下の行をコメントアウトしてください
//console.log("この行をコメントアウトしてください");

```

##数値と計算
プログラミングでは、数値(数字)を扱うこともできます。
数値は文字数と違いクォーテーション囲みません。
数値は足し算や引き算といった計算もすることができます。
足し算「+」、引き算には「-」の記号を用います。
数値と記号は全て半角で記述する

```script.js
console.log(3);

console.log(5+2);

console.log(3-2);

```


##文字列と数値
console.log(5+2);は足し算の結果である7
一方、「5+2」にクォーテーションをつけると、文字列と解釈されそのまま
出力されます。
文字列と数値は明確に違うもの

```script.js
console.log(5+2);
console.log("5+2");

```


```script.js
// 5と3を足した値を出力してください
console.log(5+3);

// 20から8を引いた値を出力してください
console.log(20-8);

// "4 + 5" を文字列として出力してください
console.log("4+5");
```

##計算してみよう(2)
掛け算「*」、割り算「/」
掛け算は「*」(アスタリスク)、割り算「/」(スラッシュ)という記号を用いて
計算することができます。

```script.js
console.log(3*7);
console.log(6/3)
```

###余りの計算「%」
さらに、「%」記号を使うと、割った時の余りを求めることができます。

```script.js
console.log(9%2);
```

```コンソール
1

9割る2は、４余り1
```

##演習

```script.js
// 8と4をかけた結果を出力してください
console.log(8*4);

// 24を4で割った結果を出力してください
console.log(24/4);

// 7を2で割った余りを出力してください
console.log(7%2);
```

##文字列の連結
「+」記号を用いると、文字列同士を連結することができます。
「"にんじゃ"+"わんこ"」とすると「"にんじゃわんこ"」という１つの文字列

```script.js
console.log("にんじゃ" + "わんこ");
console.log("A" + "B" + "C" );
```

##文字列の数値の違い
ここでも文字列と数値の違いを確認
"3" + "5"は「35」という文字列になる、3+5は「8」
「文字列と数値は別もの」

```script.js
console.log("3" + "5");

console.log(3 + 5);
```

##演習
```script.js
// 「ひつじ」と「仙人」を連結してコンソールに出力してください
console.log("ひつじ"+"仙人");

// 文字列の「20」と「15」を連結してコンソールに出力してください
console.log("20"+"15");

```
「レガシーコードからの脱却」読書メモ その1

レガシーコードからの脱却
ソフトウェアの寿命を延ばし価値を高める9つのプラクティス

David Scott Bernstein 著
吉羽 龍太郎、永瀬 美穂、原田 騎郎、有野 雅士 訳
オライリー・ジャパン 2019年
https://www.oreilly.co.jp/books/9784873118864/

---
第Ⅰ部　レガシーコード危機
　1章　何かが間違っている
　2章　CHAOSレポート再考
　3章　賢人による新しいアイデア
を読んだメモ

---
# 600億ドルのコスト
アメリカ合衆国内における**1年間の**ソフトウェア障害のコスト

---
# 20%の価値
開発コストの**80%**が「障害の特定と修正」
→価値を作るために使える予算は20%しかない

---
# 45%の不要機能
ソフトウェアの機能のうち、よく使われるのは20%
45%は**一度たりとも使われない**

---
# 何かが間違っている

---
# ソフトウェアに対する考え方が間違っている

---
# 建築の比喩
家を建てる際は部品を組み立てて作る
**ソフトウェアは部品の作り方から考える**
→ソフトウェア開発は**創造的**

---
# プロセスと品質
製造業はプロセスで品質を担保
**プロセスは創造性に影響しない**

---
# ウォータフォールの問題点
**最後にまとめてテスト**
→現実世界では効率的だが、ソフトウェアの世界ではそうではない

---
# 一か八かの勝負
「何かが動作するためには、すべてが動作しなければならない」
バグの検出は先送りされる

---
# 変更ができない
手戻りに大きなコストがかかる
→最初に機能を入れ込む
　**「使うかわからないけどあった方が」症候群**

---
# レガシーコードの発生
間違った考え方、間違ったやり方から、難解で変更が困難なコードが生じる
→保守のコストを増大させる

---
# ソフトウェア開発の問題の在処
従来の考え方は「人」や「プロセス」に焦点を当てた
→そうではなく**レガシーコードが生み出される環境**が問題の根底

---
# 新しいアイデア

---
# アジャイル 

---
# 無駄をなくす
**リーン**の考え方
「手をつけたものの完了していない仕事」はすべて無駄

---
# 小さく作る
ソフトウェア開発は創造的=未知に挑むこと
プロジェクトの**すべて**を見積もることは不可能
→だが、小さくすれば辛うじて見積もれる

---
# 技術的卓越性を求める
ソフトウェア開発は論理性(**技能**)と創造性(**芸術**)の両方から成る
エンジニアは技術や設計思想を学習して自身の能力を高めること

---
# 9つのプラクティス(1)
・やり方より先に、目的、理由、誰のためかを伝える
・小さなバッチで作る
・継続的に統合する
・協力しあう

---
# 9つのプラクティス(2)
・「CLEAN」コードを作る
・まずテストを書く
・テストでふるまいを明示する
・設計は最後に行う
・レガシーコードをリファクタリングする

---
# つづく
【Chrome拡張】別タグ開いてLocalStorageの値を取得してみました

タイトルのことを業務で頼まれたので、作ってみました（無駄にVue.jsを使っています）。
指定されたURLを裏で開きまして、ローカルストレージの値を取得しに行きます。

![Vue.js-v1.0.28-csp](https://img.shields.io/badge/Vue.js-v1.0.28-brightgreen)

↓ファイル構成はこんな感じです。

```
├─LocalStorageGet
│  background.js
│  manifest.json
│  popup.css
│  popup.html
│  popup.js
│  vue.min.js
```

```json:manifest.json
{
  "name": "LocalStorage Access Sample",
  "description": "LocalStorage Access Sample",
  "version": "0.0.1",
  "manifest_version": 2,
  "permissions": [
    "tabs"
  ],
  "content_scripts": [{
    "matches": ["https://*/*", "http://*/*"],
    "js": ["background.js"]
  }],
  "browser_action": {
    "default_title": "LocalStorage Access Sample",
    "default_popup": "popup.html"
  }
}
```

表示部分です。
`vue.min.js`と独自に作った`popup.js`を読み込んで、`view`という変数を表示させています。

```html:popup.html
<!DOCTYPE html>
<html>
    <head>
        <title>LocalStorage Access Sample</title>
        <link rel="stylesheet" href="popup.css">
    </head>
    <body>
        <div id="app">
            <p>LocalStrage is: {{ view }}</p>
        </div>
        <script src="vue.min.js"></script>
        <script src="popup.js"></script>
    </body>
</html>
```

`popup.js`の中で、`https://test.com`に非選択状態でアクセスして、タブの表示の完了（`chrome.tabs.onUpdated`）を待って、対象のページに仕込んだ`background.js`（後述）にメッセージを送っています。
その結果を`view`に設定しています。
そしてそのあとに閉じます（`chrome.tabs.remove`）。

```javascript:popup.js
window.addEventListener('DOMContentLoaded', () => {
    new Vue({
        el: '#app',
        data: {
            view: '',
        },
        created: function() {
            chrome.tabs.create({url: 'https://test.com', selected: false }, (tab) => {
                chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
                    if(tabId === tab.id && changeInfo.status === 'complete'){
                        chrome.tabs.sendMessage(tab.id, { method: 'getItem', key: 'sampleId', }, (response) => {
                            this.localStrageValue = response && response.data;
                            chrome.tabs.remove(tab.id);
                        });
                    }
                });
            });
        }
    });
});
```

対象ページに仕込むコードはこちら。

```javascript:background.js
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
    if(request.method === 'getItem'){
        sendResponse({data: localStorage.getItem(request.key)});
    }
});
```

作った拡張をChromeに読み込ませて、アイコンをクリックすれば、

![キャプチャ.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/624898/cd85bf6e-b5df-aa0a-8613-d303031d6e12.jpeg)

こんな感じで表示されるはずです（上記画像は適当にランダムな値を設定しております）。
numpyのint64をpythonのintに変換する


`.item()`を使う

```python
import numpy as np

# numpyのint64
np_int = np.int64(0)
print(type(np_int))
# <class 'numpy.int64'>

# pythonのintに変換
py_int = np_int.item()
print(type(py_int))
# <class 'int'>
```


## 参考

* `Converting numpy dtypes to native python types
` 
 
 
 * https://stackoverflow.com/questions/9452775/converting-numpy-dtypes-to-native-python-types
Bootstrap4でflashメッセージに閉じるアイコンボタン（Dismissing）を実装する

#前提条件
すでにbootstrap4を導入していてる人。
####bootstrap3でもできますが少し記述が変わるので以下参考
https://bootstrap-guide.com/components/alerts
###やりたい事
flashメッセージの横に✖️を出してメッセージを消せるようにしたい
(参考画像）http://drive.google.com/uc?export=view&id=1ckdEvoEdn79roPkAsarFpTbnf-pq_Ejl
#実装
以下のコードを部分テンプレートファイルに記載

```ruby:layout/_flashes.html.erb
<% flash.each do |key, value| %>
  <div class="alert alert-<%= bootstrap_alert(key) %> alert-dismissible fade show" role="alert">
  <button type="button" class="close" data-dismiss="alert" aria-label="閉じる">
    <span aria-hidden="true">&times;</span>
  </button>
    <strong>
      <%= value %>
    </strong>
  </div>
<% end %>
```
#コードの説明
`<% flash.each do |key, value| %>`はコントローラなどでflashメッセージを記載したときにeachで毎回出るように回しています。
` <span aria-hidden="true">&times;</span>`の`&times;`は✖️のエスケープ文字です。正直これは直接✖️と書いても良いらしい。
エスケープ処理について理解したい方は下記のURLを参考に
https://qiita.com/n_hirai/items/df0a21d2409ee47973e5
##追記2020 11/9
違うアプリで導入するとbootstrap_alertにエラーが出たので`<%= key %>` だけにして,

```ruby:application_controller.rb 
add_flash_types :success, :info, :warning, :danger
```
application_controller.rbに上記を記載して、コントローラでこのようにするとうまく行きました。

```
 redirect_to @event, flash: {success: "イベントが追加されました"}
```
#最後に

さすがbootstrap と言ったところでしょうか。少しの記述で簡単に実装できます。
エスケープ処理についても少し理解できたので良かったです。
PHP: 所有者apacheファイル(dir)をrootなしで権限変更！

`ユーザー権限`しかなくて、Laravelのフォルダを単純に削除しようとすると、
`storage以下`の`所有者apache`のフォルダが消せないんですよねー

`PHP`で`Permission変更`かけてやると消せるんですが、ハマリポイントがあったんで備忘録です。

####ディレクトリごと権限の変更
__注：必ずブラウザから実行__

```php:chmod.php
<?php
function chmod_r($path) {
    $dir = new DirectoryIterator($path);
    foreach ($dir as $item) {
        if ($item->isDir() && !$item->isDot()) {
            //chomd()だとエラーがでたので。
            system('chmod 0777 ' . $item->getPathname());
            echo 'Dir : ' . $item->getPathname() . '<br>';
            //再帰的に変更
            chmod_r($item->getPathname());
        }
    }
}
//パーミッション変更したいフォルダをフルパス指定してください。
chmod_r('/var/www/html/laravel');
?>
```
こいつを`実行できる場所（www以下等）`において`ブラウザから実行`してください。
`再帰的`に`全フォルダのパーミッション`が変更されていますので、`rm -rf {フォルダ名}` ですべての`apache所収者ディレクトリ`を消せるはずです！

__追記：__
####ディレクトリごとではなく、`１ファイルごと`に権限の変更
__注：ブラウザから実行__

```php:chmod_file.php
<?php
function chmodApacheFile($file) {
    if (file_exists($file)) {
        system('chmod 0777 ' . $file);
        echo 'file : ' . $file . '<br>';
    } else {
        echo 'ファイルが見つかりません';
    }
}
//ファイル名を適宜変更（フルパス）
chmodApacheFile('/path/filename.php');
?>
```
LGTMお願いします！
ストックのついでにお願いします！
モチベーションがあがります！
RailsにVue.jsを導入する

## 備忘録
今回はrailsで開発中のアプリにVue.jsを導入したので備忘録として記録します。
初めてrailsでVue.jsを使う人の助けになればと思います。
また、初心者のため間違いなどあればご指摘お願いします！
ruby 2.6.5
Rails 6.0.3.3

##ステップ１webpackerのインストール
インストール済みの方はスキップして下さい
Gemgile内に記述

```
gem "webpacker", github: "rails/webpacker”
```
記述できたらbundle installしましょう。

インストールできたらターミナルで以下を実行

```
$ bin/rails webpacker:install
```

これでwebpackerのインストールが完了

## ステップ２　Vue.jsのインストール
ターミナルで以下コマンドを入力

```
$ rails webpacker:install:vue
```

これでVue.jsに必要なファイルなどが作成されました。

##ステップ３　Vue.jsの読み込み
app/views/layouts配下のapplication.html.erbファイルに以下を記述

```ruby
 <%= javascript_pack_tag "hello_vue" %>
```

正常に読み込まれると写真のようにviewに表示されます。
https://gyazo.com/57e56686d2113920659f3dc9410f3a15


## 最後に
以上でrailsでVue.jsを導入する事ができました！
比較的に簡単に導入する事ができるのでよければ使ってみて下さい！
何か間違えなどあればご教授下さい！
React 機能メモ(自分用)

###表示出しわけ
```
let flg = true;
let el = (
　　　　　<div>
　　　　　 { flg &&
　　　　　　　　<p>yesなら表示</p>
　　　　　 }
　　　　　</div>
);
```
※ flg ? a : b
という表示でも可能

###リストの表示
```
let list = [
    <li>松井</li>,
    <li>田中</li>
];
let el = (
    <div>
       <ul>
       {list}
       </ul>
    </div>
);
```
※ list.map((value)) => (処理)でも操作可能

###classの記入
```
<div className="test">sample</div>
```
※jsxにはclass="test"では無いらしい

###テキストの入力
```
<input value={this.state.text} onChange={(e)=>{console.log(e.target.valiue)}}
```
【Rails】video_tagで動画が再生されない

#Railsのvideo_tagを使用した実装

Railsで画像を表示させる時は`image_tag`を使用しますが、動画を再生したい時には`video_tag`を使用します。
ところがどっこい動画が再生されないのはどうしてなのでしょう！
ちなみにRailsの公式ドキュメントは以下です。

[Rails公式ドキュメント【video_tag】](https://railsdoc.com/page/video_tag)

#再生されない記述
```ruby
<% @posts.each do |post| %>
　<%= video_tag(post.movie, size: "500x300", autoplay: true) %>
<% end %>
```

postsテーブルのmovieカラムからデータをとってきています。
動画サイズを500×300に指定、`autoplay: true`とすることで自動再生されるはず、、、されません。


#原因とコード追加
Rails公式ドキュメントを見てもらえればわかる通り、`muted`というオプションがあります。
デフォルトだと`muted: folse`となっており、音声再生が行われる状態になっています。
自動で音声などが再生され始めるとユーザーにとって負担となるため、Chromeでは`autoplay`と`muted`がどちらも有効になっていないと自動再生されないようです。
`muted`を追加した記述が以下です。

```ruby
<% @posts.each do |post| %>
　<%= video_tag(post.movie, size: "500x300", autoplay: true, muted: true) %>
<% end %>
```

#おわりに
読んでいただきありがとうございました。
どなたかの動画再生で役に立てば幸いです。
UITableView上で、キーボードを閉じる処理

# はじめに
`TableView`のセルに`TextField`や`TextView`を配置した際に、これら以外の部分をタップした時のキーボードを閉じる処理に少し手こずりましたので、備忘録として投稿します。


# 動作環境
【Xcode】Version 12.0.1
【Swift】Version 5.3


# 実装コード
```Swift
import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var tableView: UITableView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.delegate = self
        tableView.dataSource = self
        
        // タップ認識するためのインスタンスを生成
        let tapGesture = UITapGestureRecognizer(
            target: self,
            action: #selector(dismissKeyboard))
        tapGesture.cancelsTouchesInView = false
        // Viewに追加
        view.addGestureRecognizer(tapGesture)
    }
    // キーボードと閉じる際の処理
    @objc public func dismissKeyboard() {
        view.endEditing(true)
    }

}

extension ViewController: UITableViewDelegate, UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath as IndexPath)
        return cell
    }
    
}

class TableViewCell: UITableViewCell {
    
    @IBOutlet weak var textField: UITextField!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        textField.delegate = self
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }

}

extension TableViewCell: UITextFieldDelegate {
    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        textField.resignFirstResponder()
        return true
    }
}
```


# 実装詳細
はじめに、Swiftで準備してある下記関数でタッチイベントを取得し、キーボードを閉じようと試みましたが、処理が呼ばれませんでした。調べると`UIScrollView`や`UITableView`はデフォルトではタッチイベントを取得できないようになっているらしいです。

```Swift
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    self.view.endEditing(true)
}
```

上記の方法がダメだったので解決策として、`UITapGestureRecognizer`を使ってタップを認識できるようにし。キーボードを閉じるようにしました。  

```Swift
// タップ認識するためのインスタンスを生成
let tapGesture = UITapGestureRecognizer(
    target: self,
    action: #selector(dismissKeyboard))
view.addGestureRecognizer(tapGesture)
```
```Swift
// キーボードと閉じる際の処理
@objc public func dismissKeyboard() {
    view.endEditing(true)
}
```

`UITapGestureRecognizer`を設定すると他ViewへのTapを認識しなくなります。理由としましては、`cancelsTouchesInView`がデフォルトで`true`になっているからだそうで、下記コードを追加することで解消されます。

```Swift
tapGesture.cancelsTouchesInView = false
```

個人的な意見にはなりますが、オリジナルアプリの登録画面の実装の際にこの問題に直面しましたが、キーボードが表示されている間はフォーカスがあたっている`TextView`や`TextField`以外は触れなくしててもいいかなと考えています。

# 参考
* [UITapGestureRecognizer を設定すると他ViewへのTapを認識しなくなる](https://qiita.com/RS_Dessin/items/f1d337289589b4c5f551)
ポインタについてのメモ(Go)

ポインタがどういうものなのか分からなかったので調べた。
今回はGoで書いた。

```pointer_practice.go
package main

import (
	"fmt"
	"math/rand"
	"time"
)

func main() {

	x := 2
	/* 変数xのアドレス(変数xが保存されているメモリの位置)を格納 */
	/* ある変数のアドレスが格納された変数のことをポインタ変数という */
	x_pointer := &x

	fmt.Println(x)
	fmt.Println(x_pointer)
	/* ポインタ変数x_pointerに格納されたアドレスに存在する値を取得 */
	/* メモリをjsのオブジェクト、アドレスをオブジェクトのキーと考えると メモリ[アドレス(x_pointer)] = 2 というイメージ */
	fmt.Println(*x_pointer)

	arg := 0
	arg_pointer := &arg

	test_pointer(arg_pointer)
	/* 同じ結果になる */
	fmt.Println(arg)
	fmt.Println(*arg_pointer)

	/* 値は書き換えられない(関数内では書き換えられるが、引数として設定した変数の値に影響はない) */
    /* returnで関数内での書き換え結果を取得する */
	test_val(arg)
	fmt.Println(arg)

}

/* ポインタ変数を引数として受け取る関数(ポインタ渡し) */
func test_pointer(val_pointer *int) {

	/* 時間を用いてseed(乱数のもと?)を作成 Seedがないと毎回同じ値を取得してしまう */
	rand.Seed(time.Now().UnixNano())
	/* ポインタ変数に格納されたアドレスを取得 -> 値の書き換えを行うメモリの位置をアドレスで指定 -> 指定したメモリの位置に保存されている値を0~999のランダムな数字に書き換える */
	*val_pointer = rand.Intn(1000)

}

/* 値渡しの関数(いつもの) */
func test_val(val int) {

	rand.Seed(time.Now().UnixNano())
	val = rand.Intn(1000)

}
```
値渡し(変数の値を受け取る)の関数とポインタ渡し(変数のアドレスを受け取る)の関数とでは、引数の型の設定方法が異なる。

```go
/* 値渡しの関数 */
func(引数 引数の型) { /* 関数の処理 */ }
/* ポインタ渡しの関数 型名の前に「*」が付く*/
func(引数 *引数の型) { /* 関数の処理 */ }
```
DockerでSwaggerUIとSwaggerEditorを起動させる方法

# Swaggerとは
Swaggerとは、APIドキュメント設計やAPIモック（プロトタイプ）のリクエストを投げることができるAPI構築のフレームワークとことです。
今回使用するSwaggerツールは以下の3つです。

|ツール|説明 |
|:---|:---|
|Swagger Spec|（Spec＝Specification＝仕様書）Swaggerの仕様に関するドキュメントのことであり、YAML/JSON形式で書かれる。 | 
|Swagger Editor|ブラウザ上で動くSwagger Specファイルを編集することができ、リアルタイムで構文チェックすることができるツール|
|Swagger UI |Swagger Specをから動的にドキュメントを生成するツール。 |

その他のSwagger関連のツールは公式ページの[リンク](https://swagger.io/tools/open-source/open-source-integrations/)から確認してみてください。
# Swaggerツールの関係性について
まずは、Swagger Specファイルの生成を主軸として、Swagger EditorとSwagger UIがどのように使われるのか図解にしてみました。
今回の使用イメージとしては、Swagger Editorを使いブラウザ上でAPIの仕様書となるSwaggerSpecを編集、定義していき、構文を確認できたら実際のyamlファイルに入力してSwagger UIから参照できるようにするという流れです。

![スクリーンショット 2020-10-24 17.24.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/623708/0bbde666-d149-301b-2f13-e51186675c03.png)

## 手順

設定のポイント:
1. `docker-compose.yml`にSwaggerEditorとSwaggerUIのイメージが作成されるように設定する・
2. Swaggerの定義を`sample.yaml`として置く。

```yaml:docker-compose.yml
version: '3.7'
services:
 swagger-editor:
    image: swaggerapi/swagger-editor
    ports:
      - "8001:8080"

  swagger-ui:
    image: swaggerapi/swagger-ui
    ports:
      - "8002:8080"
    volumes:
      - ./sample.yaml:/sample.yaml
    environment:
      SWAGGER_JSON: sample.yaml
```

```:ディレクトリ構造

├── docker-compose.yaml
└── sample.yaml
```

ターミナルで以下を実行。

```:ターミナル
$ docker-compose up
```

`https://localhosst:8001`でSwaggerEditorが起動、`https://localhost:8002`でSwaggerUIが起動する。
【Androidアプリ】Android Studio設定～HelloWorld!まで

今回は実際の起動(Hello World!)まで行ってみようと思います。
※今回は実機への起動ではなく、エミュレーターで起動します。

#プロジェクト作成
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/04ca7076-b958-f9f6-b48c-012ad3d45e6b.png)
立ち上げたときに表示される「Start a new Android Studio project」で新しくプロジェクトを作成します。

![18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/c8d07e7f-79f8-c633-9597-bfd215fa6586.png)
アプリ画面のテンプレートを選べます。
「Empty Activity」がこのリストの中で一番空っぽの状態らしいので、こちらを選択します。

![19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/47d2acf2-7ec1-42ce-fb21-16acf025bc4f.png)
プロジェクト名やファイルの格納場所、言語を選べます。
プロジェクト名は自由に選択し、言語はJavaを選びます。

#XMLの編集
アプリ画面のレイアウトはXMLファイルが決めているようです。
ここで表示文字を簡単に編集してみます。
※XMLの場所は、[Procect名] > app > src > main > layout > activity_main.xml
![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/ad9fc368-9f62-3bd6-1620-b7afe72f05d5.png)
ここではテキストをひらがなに変えています。
これで実行してみます。

#エミュレーターの追加
起動の際は、実機かエミュレータが必要となります。
本稿では、エミュレータで動かすため、エミュレータの追加を記載します。
![8 - コピー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/4a24b589-8250-6797-7489-95312685f60c.png)
赤枠で囲まれた部分を選択し、AVD Managerを選択します。![9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/8f906b10-7104-1f25-974e-742dc8c766e9.png)
「Create Virtual Device...」を選択します。
![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/4066fc4b-293c-1da1-cc03-227674c639d3.png)
スマートフォンのサイズを選びます。
私が持っている(後に試す)実機のサイズを選びました。
![11 - コピー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/87833dfc-8249-42cf-a1e7-8f9f4855e932.png)
APIレベルは一番高いモノを選びます。
(私はここで適当に選んでしまい、後に起動出来ませんでした)
ここではダウンロードが必要なので、「Download」のリンクをクリックします。
![14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/e6d3987f-9c3b-7538-ad18-7c0f425e5f1a.png)
ダウンロードが完了すれば、先に進めます。(画像はAPI22になっていますが、30に置き換えてください)
![16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/cf011d2e-d459-44cd-c82e-d9f85fa4d96e.png)
そのままNextで進んでいくと、デバイスリストに追加されます。

#起動
![20 - コピー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/e32ef501-6d40-36c1-7160-ea6f75c21acd.png)
赤枠の部分に、追加したデバイスを選択します。
![20 - コピー (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/7bd8354c-97fc-92ba-c595-57596c30f82f.png)
隣の三角で起動します。
![21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/514630/e38db6ef-e460-bda4-d17e-7d6faa2a44be.png)
起動すると、スマートフォンの画面が表示され、作成したアプリの内容が表示されます。
この横にあるバーで、実際のスマートフォンのように電源を切ったり、横にしたりできるみたいです。
tweepy のapi.search て完璧じゃないの！？

#はじめに

僕の生きる糧である女優の松岡茉優さんの最新画像を自動取得すべく、LINE Bot の作りました。

もしよかったらQRコードで追加してやってください。僕が喜びます。
![M.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/569968/972b51f5-766c-d9d9-2dfa-6342b11b6c59.png)


詳しいコードは以下の記事もしくは GitHub をご覧ください。
**[毎日定時に推し画像が送られてくるLINE Bot を作った]**
https://qiita.com/soma_sekimoto/items/4c01d0ab890024d6f87c

GitHub
https://github.com/SomaSekimoto/MayuDelivery

この画像送信bot の画像取得元が、twitter になっています。（なぜなら情報が早いから。つまり最新の画像も出るのが早い。）

tweepy を使って実装して、つい今日まで満足していました。tweepy 神だなぁと思っていました。

あ、ちなみにもうお気づきかもしれませんが、これは技術的なことあんまり書かないです。


# tweepy で api.search 使っていたのだが何かおかしい。。。
最近ふと思いついて、
コード内で記述している 検索ワードを、実際の twitter の検索窓にも入力して全く同じ


検索部分のコード

```python
q = f"#松岡茉優 OR 松岡茉優 -'松岡茉優似' filter:media exclude:retweets min_faves:10 since:{yesterday}"

tweets = tweepy.Cursor( api.search, q=q, tweet_mode='extended', include_entities=True).items(20)
```


# ドキュメント読んでみたらちゃんと書いてあった。

https://github.com/tweepy/tweepy/blob/master/docs/api.rst

![スクリーンショット 2020-10-23 23.42.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/569968/b582d553-faa5-3e42-d075-44e396449380.png)

*Please note that Twitter's search service and, by extension, the Search API is not meant to be an exhaustive source of Tweets. Not all Tweets will be indexed or made available via the search interface.*

要は、

**「Search メソッドで全部のツイートを取得するわけではないですよ！！」**

ってことだと僕は解釈しました。

そもそもの tweepy の仕様だったのか。。。。

でもどのツイートが取得できてどれができないのか知りたい。知りたい。

# result_type="mixed" で取りたかったツイートを取得できた。

取得したかったツイートが取得できた。


修正前

```python
q = f"#松岡茉優 OR 松岡茉優 -'松岡茉優似' filter:media exclude:retweets min_faves:10 since:{yesterday}"

tweets = tweepy.Cursor( api.search, q=q, tweet_mode='extended', include_entities=True).items(20)
```

修正後

```python
q = f"#松岡茉優 OR 松岡茉優 -'松岡茉優似' filter:media exclude:retweets min_faves:10 since:{yesterday}"

tweets = tweepy.Cursor( api.search, q=q, tweet_mode='extended', result_type="mixed", include_entities=True).items(20)
```

result_type で設定できる値は、三種類あって
"recent"： 時系列で最新のツイートを検索 
"popular"： 人気のあるツイートを検索（何を基準に人気か判断しているかは不明）
"mixed"： 上記を混ぜたもの。
となっている。

さらに、調べていくと、デフォルトだと "recent" が設定されていることがわかった。


以下記事参照

https://note.com/katomaru0510/n/n8797618a68ce
https://qiita.com/mima_ita/items/ba59a18440790b12d97e


#おわりに

完全に自分のやらかしでした。

もちろん result_type の存在も知っていましたが、デフォルトだと そういったツイートの種類にかかわらず全部取得してきてくれるものだと勘違いしていました。

とりあえず今回は解決しましたが、根本的にtweepy の api.search について解明できたわけではないので、これからも tweepy 使いながら理解を深めていきます。
Laravel composer ライブラリインストール時のメモリエラー

# 目的

- Laravelで使うライブラリインストール時にメモリ系のエラーを解決した話をまとめる。

# 問題までの経緯

1. 下記コマンドを実行してライブラリをインストールしようとした。

    ```terminal
    $ sudo composer require league/flysystem-aws-s3-v3 ~1.0
    ```

# 問題

- 下記のエラーが発生しライブラリをインストールすることができない。

    ```terminal
    PHP Fatal error:  Allowed memory size of 1610612736 bytes exhausted (tried to allocate 4096 bytes) in phar:///usr/local/bin/composer/src/Composer/DependencyResolver/Solver.php on line 223
    
    Fatal error: Allowed memory size of 1610612736 bytes exhausted (tried to allocate 4096 bytes) in phar:///usr/local/bin/composer/src/Composer/DependencyResolver/Solver.php on line 223
    
    Check https://getcomposer.org/doc/articles/troubleshooting.md#memory-limit-errors for more info on how to handle out of memory errors.
    ```

# 問題解決までの経緯

1. エラーに「このリンク見て！」って書いてあったから当該リングにアクセスしてみる。
    - [https://getcomposer.org/doc/articles/troubleshooting.md#memory-limit-errors](https://getcomposer.org/doc/articles/troubleshooting.md#memory-limit-errors)
1. リンク先の指示に従い現在の割り当てられている設定のメモリを出力するコマンドを実行してみる。

    ```terminal
    $ php -r "echo ini_get('memory_limit').PHP_EOL;"
    ```
1. 「128M」と出力された確かにこれだと足りていない。
1. php.iniファイルで割当メモリ設定を設定できるらしいので下記コマンドを実行してphp.iniファイルを開く。※php.iniファイルの場所は筆者の環境と異なる可能性があるので下記コマンドをただ実行してもphp.iniファイルを開けないかもしれない。（php.iniファイルの場所はこちらの方法で確認可能である→[php.iniファイルの場所をターミナルで確認する](https://qiita.com/miriwo/items/acb49b0a97b5d5fa47fd)）

    ```terminal
    $ sudo vi /etc/php.ini
    ```
1. メモリ割り当て設定を無制限である`-1`に設定し保存して閉じた。

    ```/etc/php.ini
    ; 省略

    ; Maximum amount of memory a script may consume (128MB)
    ; http://php.net/memory-limit
    memory_limit = -1

    ; 省略
    ```
1. ライブラリインストールのコマンドを再度実行する。

    ```terminal
    $ sudo composer require league/flysystem-aws-s3-v3 ~1.0
    ```
1. 問題なくインストールする事ができた。
Ship&Coの追跡情報APIをつかって、配送状況を取得する

この記事では、[Ship&CoのAPI](https://developer.shipandco.com)を使って、荷物が発送された後の追跡情報をAPIを使ってシステム連携する方法について説明します。


# 1. tracking APIを呼び出す準備をする

[こちらの記事](https://qiita.com/shipandco/items/ffba21c1d0682bde1dc9)を参考にして、`https://app.shipandco.com/api/v1/tracking/:carrier/:trackingNumber`に`GET`するURLを作成します。

- `:carrer`は、[運送会社とサービス](https://developer.shipandco.com/#t-common_obj)で定義されている`carrier`を指定します。

- `:trackingNumber`は、上記で指定した運送会社から発行された追跡番号を指定します。

```
https://app.shipandco.com/api/v1/tracking/japanpost/RN00*********JP
```

# 2. APIを実行する

上記で作成したURLをもとに、APIを実行します。成功すると、下記のような追跡情報のレスポンスが返されます。

```
{
    "requested_at": "2020-10-26T15:54:40.711Z",
    "carrier": "japanpost",
    "tracking_number": "RX068331915JP",
    "service": "国際書留・保険付書状",
    "from_address": {},
    "to_address": {},
    "current_status": {
        "date": "2020-10-23T21:20:00.000Z",
        "status": "transit",
        "details": "国際交換局から発送",
        "location": "東京都 138-8799"
    },
    "history": [
        {
            "date": "2020-10-22T07:09:00.000Z",
            "status": "collected",
            "details": "引受",
            "location": "岐阜県 501-3299"
        },
        {
            "date": "2020-10-22T19:49:00.000Z",
            "status": "transit",
            "details": "国際交換局に到着",
            "location": "東京都 138-8799"
        },
        {
            "date": "2020-10-23T21:20:00.000Z",
            "status": "transit",
            "details": "国際交換局から発送",
            "location": "東京都 138-8799"
        }
    ]
}
```

# 3. 追跡情報を使ったユースケース

このAPIを使ったユースケースとして以下のようなことが考えられます。

- 自社サービスやシステムに配送状況の表示機能を組み込む
- 配送ステータスが配達済み（`"delivered"`）になった場合や何日も変化しない場合に通知を出す

# その他の注意点や情報
- [追跡情報](https://developer.shipandco.com/#t-tracking)のAPIは現在無料で利用できますが、Ship&Coの主な利用用途は送り状の作成です。追跡情報の取得のみのご利用はご遠慮いただいております。
Ionic+Angular 環境構築からアプリビルドまで（macOS）

## 環境
- macOS v10.15.5
- npm v6.13.4
- Ionic v6.10.1
- Xcode v12.0.1
- Android Studio v4.0.1

## Ionic環境構築
Nodeを以下からインストールします
https://nodejs.org/ja/

Ionic CLIをインストールします

```
% sudo npm install ionic -g
```
## Ionic+Angularプロジェクトを作成
以下コマンドでIonic+Angularプロジェクトを作成します

```
% ionic start --type=angular
```

以下のように聞かれるので`? Project name:`の後に任意のプロジェクト名を入力します

```
Every great app needs a name! 😍

Please enter the full name of your app. You can change this at any time. To
bypass this prompt next time, supply name, the first argument to ionic start.

? Project name:
```

プロジェクト名設定後ionicのテンプレートを選択します
モバイルアプリでよく使うUIが用意されているようです（本記事ではtabsを選択）

```
? Starter template: (Use arrow keys)
❯ tabs         | A starting project with a simple tabbed interface
  sidemenu     | A starting project with a side menu with navigation in the cont
ent area
  blank        | A blank starter project
  list         | A starting project with a list
  my-first-app | An example application that builds a camera with gallery
  conference   | A kitchen-sink application that shows off all Ionic has to offer
(Move up and down to reveal more choices)
```
以下のように聞かれるので`y`を入力して次に進みます  
`y`を選択するとCapacitorというライブラリによってプロジェクト内にiOSとAndroidが追加されます

```
? Integrate your new app with Capacitor to target native iOS and Android? (y/N)
```

`N`を選択して進んだ場合でも以下コマンドで後から追加することが可能です

```
% ionic integrations enable capacitor
```
```
% npx cap add ios
```
```
% npx cap add android
```

以下が表示されていればプロジェクト作成完了です

```
Your Ionic app is ready! Follow these next steps:
```

## ブラウザで立ち上げる
以下コマンドでブラウザでプレビューを表示します

```
% ionic serve
```

以下のように表示されました
プロジェクト作成時点でtabsテンプレートを選択したのでタブが自動生成されています
![Screen Shot 2020-10-24 at 16.45.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/269846/6fd1441b-a1a4-0483-f18c-1a9d1c048304.png)


## アプリとしてビルドする

コマンドにてXcodeかAndroidを起動するだけでビルド自体は各IDEの機能で行います
プロジェクト作成時点で前述したCapacitorライブラリが利用可能になっていることが前提です。

**iOSの場合**
以下コマンドでXcodeが自動で起動します

```
% npx cap open ios
```
**Androidの場合**
以下コマンドでAndroid Studioが自動で起動します

```
% npx cap open android
```

また以下コマンドで各OS端末のプレビューをブラウザでも確認することができるようです。

```
% ionic serve --lab
```
![Screen Shot 2020-10-24 at 16.58.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/269846/2ebde819-f58c-238c-ed1b-59d2f69d1f91.png)

この時点ですでにiOS、Androidらしいデザインで生成されていて素晴らしいです

## おわり
次回はプロジェクトファイルの構成を調べて投稿予定です。（2020/10/25時点）

## 参考
https://ionicframework.com/jp/docs/angular/your-first-app
https://capacitorjs.jp/docs/getting-started/with-ionic
Vue3.0から読みやすいコードに！？ Composition APIの概要紹介

# はじめに
今回は新しく導入されたComposition APIについて解説します！

動画でもコード付きで解説してるので、よろしければご視聴お願いします！

[【YouTube動画】 Composition APIやsetup関数の使い方を一緒にみていきましょう！](https://youtu.be/3bvbqUvZKiQ)
[![Composition APIやsetup関数の使い方を一緒にみていきましょう！](https://img.youtube.com/vi/3bvbqUvZKiQ/0.jpg)](https://www.youtube.com/watch?v=3bvbqUvZKiQ)

# Vue 2系と3系の書き方の違い
Vue2系でコンポネントを作るとき、以下のように書いてましたね。
定義場所と使う場所が離れているため、コードジャンプできないと、読むの辛いですね (できても見辛いですが...)。

```javascript
export default {
  components: { RepositoriesFilters, RepositoriesSortBy, RepositoriesList },
  props: {
    user: { type: String }
  },
  data () {
    return {
      repositories: [],
      filters: { ... },
      searchQuery: ''
    }
  },
  computed: {
    filteredRepositories () { ... },
    repositoriesMatchingSearchQuery () { ... },
  },
  watch: {
    user: 'getUserRepositories'
  },
  methods: {
    getUserRepositories () {
      // using `this.user` to fetch user repositories
    },
    updateFilters () { ... },
  },
  mounted () {
    this.getUserRepositories()
  }
}
```

これがVue3系からこうなります！
dataとかがなくなった代わりに、setup関数が追加されていますね！

setup関数内に変数や関数を定義し、mountedやmethodsに対応するものを書いていきます。
setup関数のおかげで、同じデータを扱う処理をまとめることができます！！

また、setup関数の最後で定数などを返すと、template内で扱うことができます。

```js
export default {
  components: { RepositoriesFilters, RepositoriesSortBy, RepositoriesList },
  props: {
    user: { type: String }
  },
  setup(props) {
    const test = ...
    console.log(props) // { user: '' }
    
    // setup関数内で定義したものを外 (<template>など) で使えるようにreturn
    return { test, ... }
  }
  ...
}
```

ビジュアルにまとめると以下のようになります。
左が今までのVue.jsの書き方で、右がComposition APIを使った場合の書き方です。
この画像では、アクセスするデータごとに色分けしています。

比較画像 [Vue Composition API #code-organization](https://composition-api.vuejs.org/#code-organization)
![対比画像.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/751408/2f1ef508-6f16-6b14-298d-c595c5087ca2.png)


# dataはどこにいった？
dataを使わない代わりに、refやreactiveが導入されました！

例えば、以下のように使います。

```js
import { ref } from 'vue'

...
setup(props) {
  const counter = ref(0)

  console.log(counter) // { value: 0 }
  console.log(counter.value) // 0

  counter.value++
  console.log(counter.value) // 1
}
```

データを複数まとめたい場合はreactiveを使います。

```js
import { reactive } from 'vue'

...
setup(props) {
  const counters = reactive({ x: 0, y: 0 })
}
```

# ライフサイクル周りのメソッドは？
mountedなどのライフサイクル周りのメソッドはonMounted()などを読み込んで使います。

```js
import { onMounted } from 'vue'
...

setup (props) {
  const getUserRepositories = ...

  onMounted(getUserRepositories)
  ...
}
```

# まとめ
今回はVue 3.0のComposition APIについて紹介しました！
今までの書き方でも一応エラーにはならないですが、より読みやすいComposition APIを使ったか書き方に挑戦するのも良いかもしれませんね。

[twitter](https://twitter.com/yassun_youtuber)や[youtube](https://www.youtube.com/channel/UCajrdoGzHzDogrNrLYYmGsg/featured?view_as=public)でのコメントもお待ちしています！
[Rails]Active Storageの使用方法

# はじめに
Active Storageを使うと、画像などのファイルのアップロードを簡単にするメソッドが使用できたり、画像を保存するテーブルを簡単に作成できます。

# 目次
1. 画像加工ツールの導入
2. Active Storageのインストール
3. 画像の保存方法
4. 画像の表示

# 1. 画像加工ツールの導入
まず画像加工に必要な画像変換ツールと、これをRailsから使えるようにするためのgemを導入します。
ImageMagicはコマンドラインから画像の作成やサイズ変更、保存形式などの変更ができます。
以下のコマンドを実行します。

##### ターミナル
```
brew install imagemagick
```

ImageMagicはgemではないのでRubyやRailsで扱うには、MiniMagickというgemを導入する必要があります。
MiniMagicはImageMagicをRubyで扱えるようにするためのgemです。
次に画像サイズの変更をするためのgemをインストールします。
ImageProcessingはMiniMagicではできない、画像サイズを調整する機能を提供するgemです。
以下のようにgemfileの一番下に追記します。
その後、コマンドでbundle installを実行します。

```ruby:gemfile
gem 'mini_magick'
gem 'image_processing', '~> 1.2'
```

# 2. Active Storageのインストール
ターミナルで以下を実行します。
##### ターミナル 
```
rails active_storage:install
```

Active Storageに関連したマイグレーションが作成されるので、続けて以下を実行します。
##### ターミナル
```
rails db:migrate
```

# 3. 画像の保存方法
Active Storageのテーブルに画像を保存するために、アソシエーションの定義とimageカラムの保存の許可を設定します。
今回はhas_one_attachedメソッドを使って、一つの画像ファイルを添付できるようにしました。

```ruby:app/models/post.rb
class Post < ApplicationRecord
  ~略~
  has_one_attached :image
  ~略~
end
```

これでpostsテーブルに画像ファイルの紐付けができました。
**このとき、postsテーブルにカラムを追加する必要はありません。**

次にストロングパラメーターにimageを追加し、画像ファイルの保存を許可します。

```ruby:app/controllers/posts_controller.rb
class PostsController < ApplicationController
  ~略~
  def post_params
    params.require(:post).permit(:name, :image, :price, :evaluation, :description, :category_id, :shop_name).merge(user_id: current_user.id)
  end
  ~略~
end
```

# 4. 画像の表示
Railsのヘルパーメソッドであるimage_tagメソッドを用いて画像を表示します。

##### 例
```ruby
<%= image_tag post.image, class: "post-img" %>
```

attached?メソッドを使うことで画像が存在しないときのエラーを防ぐことができます。

##### 例
```ruby
<%= image_tag @post.image ,class:"user-box-img" if @post.image.attached? %>
```

上記のように記述することで画像が存在する場合のみimage_tagが読み込まれます。

Active Storageを導入している場合、variantメソッドを用いることができます。
variantメソッドを使用することで、画像ファイルの表示サイズを指定することができます。

##### 例
```ruby
<%= image_tag post.image.variant(resize: '500x500'), class: "post-img" %>
```
JavaScriptについての備忘録

JavaScriptについて、備忘録としてまとめる。

###関数の書き方
#### function命令で定義

```
function 関数名(引数, ...){
 ...任意の処理...
 return 戻り値;
}
```

#### Functionコンストラクター経由で定義
- 関数が受け取る仮引数を順に並べ、最後に関数の本体を指定する。
- JavaScriptの関数は原則として、function命令,　または関数リテラル/アロー関数で定義する

```
var 変数名 = new Function(引数,...,関数本体);

例
var getArea = new Function('base', 'height', 'base' * 'height');
```

#### 関数リテラル表現で定義する
 - JavaScriptにおいて関数はデータ型の一種
 - リテラルとして表現でき、関数リテラルを変数に代入したり、ある関数の引数として渡したり、戻り値として関数を返すことが可能
    
```
var 変数名 = function(変数、　変数) {...処理...};

例
var getArea = function(base, height) { base * height}
```

- ES2015でが、オブジェクトリテラルの構文を改善し、プロパティ/メソッドをよりシンプルに表現できる

```
名前(引数) {...処理...}

例
run() {
  return 'tokotoko'
}
``` 

＊function命令と関数リテラルの違い
- function命令 : 関数getAreaを直接定義
- 関数リテラル　　: 「function(base,height {...}」と名前のない関数を定義し、変数getAreaに格納している

#### アロー関数で定義する

```
(引数...) => {...関数の本体...}

例
let getArea = (base,height)=> { return base * height }
```

ブロックを表す{...}は省略可能

```
let getArea = (base,height) => base * height;
```

引数が１個の場合には、引数をくくる()も省略可能

```
let price = cost => cost * 1.08;
```

### JavaScriptにおけるオブジェクト指向
#### 最もシンプルな「クラス」
- JavaScriptでは関数(Functionオブジェクト)にクラスとしての役割を与えている。

```
var Member = function(){};

var mem = new Member();
```

#### コンストラクターで初期化する
- コンストラクターとはインスタンスを生成する際に、オブジェクトを初期化する処理を記述するための特殊なメソッド
- thisキーワードは、コンストラクターによって生成されるインスタンスを表す
- `this.プロパティ名 = 値;`でプロパティを指定でき、文字列や整数、日付を指定できるだけでなく、関数オフジェクトも指定できる。



```
var Member = function(firstName,lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.getName = function() {
      return this.lastName + '' + this.firstName;
    }
};
```

- クラスという抽象的な設計図が存在しないのがJavaScriptの世界
- JavaScriptの世界にあるのは、あくまで実体化されたオブジェクトだけで、新しいオブジェクトを生成するにも（クラスではなく）オブジェクトがもとになっている。


### オブジェクトの継承
#### アクセサーメソッド
- プロパティそのものはクラス外部からアクセスできなようにして、代わりにプロパティにアクセスするためのメソッド

####  get/set

```
get: function() {
  return プライベート変数
},
set: function(value) {
  プライベート変数 = value
```

#### クラス定義

クラスの定義

```
class クラス名 {
  ...コンストラクターの定義...
  ...プロパティの定義...
  ...メソッドの定義...
}
```

#### クラスのコンストラクター

- インスタンスを生成する際に引数として文字列や数値を受け取るために用意する。

```
メソッド名(引数...) {
 ...メソッドの本体...
}

例
constructor(email, password) {
   this.email = email;
   this.password = password
}
```

#### 既存のクラスを継承

- extendsの使い方

```
class Human {
  get walk() 
     return 'tokotoko'
  }
}

class Man extends Human {
  run() {
     return 'dodododo'
  }
}

let keigo = new Man
console.log(keigo.walk());  //結果:tokotoko
console.log(keigo.run());  //結果:dododo 
```

#### モジュールの基本

- モジュールは1つのファイルとして定義するのが基本
- モジュール内はデフォルトでは非公開.
- exportで指定する必要がある。

```:lib/Utill.js
export class Human { ...中略... }
export class Cat { ...中略... }
```

以下のようのインポート

```:main.js
import { Human, Cat } from './lib/Util'
```

##### import命令記法

```
import { name, ...} from module
   name:インポートする要素
   module:モジュール(拡張子を抜いたパス)
```
- アスタリスクを（*）でモジュール内での全ての要素をインポートできる

```
import * as animals form '.lib/Util'
```
- モジュールに含まれる要素が1つだけであれば、デフォルトのエクスポートを宣言できる

```:./lib/Area.js
export default class {
  static getArea(base,height) {
   return base*height
  };
}
```
参考文献
JavaScript本格入門
node.jsでneo4jを使ってみる

#neo4jドライバーのインストール

```
#npm install neo4j-driver
```

#neo4jサーバーへの接続

```js
const neo4j = require('neo4j-driver')

const driver = neo4j.driver("bolt://サーバーアドレス:7687", neo4j.auth.basic("ユーザー名", "パスワード"))
const session = driver.session()
const personName = 'Alice'

try {
  const result = await session.run(
    'CREATE (a:Person {name: $name}) RETURN a',
    { name: personName }
  )

  const singleRecord = result.records[0]
  const node = singleRecord.get(0)

  console.log(node.properties.name)
} finally {
  await session.close()
}

// on application exit:
await driver.close()

```

[参考:https://neo4j.com/developer/javascript/](https://neo4j.com/developer/javascript/)
[APIマニュアル:https://neo4j.com/docs/api/javascript-driver/4.1/](https://neo4j.com/docs/api/javascript-driver/4.1/)
C言語+MPIのtips（MPI_Allgather）

MPI_Allgatherは「各プロセスの持つ同じ長さのデータを結合して，全てのプロセスに渡す関数」。
※MPI_Gatherはある一つのプロセスに渡すことに注意。

【目的】
 各プロセスの一次元配列 div を結合した配列 cmb を作り、全てのプロセスへ送信することで MPI_Allgather の機能を知る。

【使用するもの】
  open-mpi

【環境】
  $ mpicc —version
  Apple clang version 11.0.3 (clang-1103.0.32.29)   
Target: x86_64-apple-darwin19.6.0   
Thread model: posix   
InstalledDir: /Library/Developer/CommandLineTools/usr/bin 

【方法】

```c:Allgather.c 
#include<stdio.h>
#include<stdlib.h>
#include<mpi.h>

#define N 3

int main(int argc, char **argv){
        int my_rank, num_proc;
        int i,j, div[N];
        int *cmb;

        MPI_Init(&argc, &argv);
        MPI_Comm_size(MPI_COMM_WORLD, &num_proc);
        MPI_Comm_rank(MPI_COMM_WORLD, &my_rank);

        for(i=0;i<N;i++) div[i] = i*4+my_rank;
        printf("myrank:%d, div[0]=%d, div[1]=%d, div[2]=%d\n",my_rank,div[0],div[1],div[2]);

        cmb=(int *)malloc(N*num_proc*sizeof(int));
        if (cmb==NULL){
            printf("arr\n");
            return 1;
        }

        for(j=0;j<N*num_proc;j++) cmb[j]=-1;

        MPI_Allgather(div, N, MPI_INT, cmb, N, MPI_INT, MPI_COMM_WORLD);

        for(j=0;j<N*num_proc;j++) printf("my_rank:%d, cmb[%d] = %d\n",my_rank,j,cmb[j]);
        free(cmb);

MPI_Finalize();
return 0;
}
```

【結果】
mpicc コマンドでコンパイル、mpirun コマンドでプロセス数を２にして実行。

```
$ mpicc Allgather.c
$ mpirun -np 2 ./a.out
myrank:0, div[0]=0, div[1]=4, div[2]=8
myrank:1, div[0]=1, div[1]=5, div[2]=9
my_rank:0, cmb[0] = 0
my_rank:0, cmb[1] = 4
my_rank:0, cmb[2] = 8
my_rank:0, cmb[3] = 1
my_rank:0, cmb[4] = 5
my_rank:0, cmb[5] = 9
my_rank:1, cmb[0] = 0
my_rank:1, cmb[1] = 4
my_rank:1, cmb[2] = 8
my_rank:1, cmb[3] = 1
my_rank:1, cmb[4] = 5
my_rank:1, cmb[5] = 9
```

【考察（何が起きたのか）】   
まずプロセス０と１でそれぞれ div[0]、div[1]、div[2]が生成される。それぞれのプロセスで値が格納される。
 at プロセス０　div[0]=0*4+0=0、div[1]=1*4+0=4、div[2]=2*4+0=8 
  at プロセス１　div[0]=0*4+1=1、div[1]=1*4+1=5、div[2]=2*4+1=9

次にプロセス０と１でそれぞれ cmb[0]から cmb[5]までがメモリ割り当てされる。それぞれのプロセスで値が格納される。 
at プロセス０　cmb[0]=-1、cmb[1]=-1、・・・、cmb[5]=-1   
at プロセス１　cmb[0]=-1、cmb[1]=-1、・・・、cmb[5]=-1

MPI_Allgatherによって各々のプロセスの「div」から、「N」個ずつデータが送信される。データの型は整数（int）「MPI_INT」である。「cmb」がその「N」個ずつの整数型（int）「MPI_INT」のデータを受信して結合する。送信先は全てのプロセスである。
つまり
  at プロセス０　cmb[0]=0、cmb[1]=4、cmb[0]=8、cmb[3]=1、cmb[4]=5、cmb[5]=9 
at プロセス１　cmb[0]=0、cmb[1]=4、cmb[0]=8、cmb[3]=1、cmb[4]=5、cmb[5]=9 
となる。

 それぞれのプロセスで cmbが表示されて終了。free(cmb) で各プロセスのメモリを解放。


【参考】 「mpi 並列プログラミング」と検索すると、より正確でより情報量の多い資料が見つかります。
[day: 6] 失敗を恐れるメカニズム

# 失敗を恐れるメカニズム

## はじめに

私は失敗を恐れていると指摘をされました。
それを言われ、今までを思い返してみたのですが確かにその節があると自分でも感じます。
自身の課題として感じている失敗への恐怖感について向き合うことで、失敗を許容して成長へとつなげる

## 失敗をなぜ逸れるのか

なぜ人は失敗を恐れるのかを調べていたのですが、その中でも多くの資料で言われていたのが
失敗をすると人に嫌われるのではないか、評価が下がるのではないか
という恐怖心があり、失敗することを恐れ挑戦しなくなってしまうということです。

これは幼少期に失敗をして母親からひどく怒られた経験や友人と仲違いをしてしまった経験が影響しているのではないかと考えられています。

動物は失敗経験は記憶に強く残るようにそもそもできています。
それは、動物として自分の命を守るためです。
幼少期に興味本位でヘビに近づき、毒のあるヘビに噛まれ入院したという経験があったとすれば
その経験を忘れてしまては、その後にまたヘビを見ても興味本位に近づいてしまうことでしょう。
そうならないように記憶に強く残るようにできています。

つまり、失敗をして人に嫌われるという経験が成長した今でも記憶に強く残り、無意識に失敗を避ける行動を撮ってしまう流れができているのです。

### 失敗を恐れないようにするには

では、失敗を恐れるメカニズムを簡単に理解した上で失敗を恐れないようにするにはどうしたら良いのでしょうか。

それは失敗をしても人に嫌われない、逆に失敗をすると自分にとってプラスであるということを理解することです。

普通の思考をしている社会人同士であれば、よほどの失敗でなければお互いを嫌いになったりするようなことはないと思います。
そして、失敗をすることは自分の成長のチャンスでもあります。
なぜなら失敗をするということは、何がよくなかったのか、どこを改善するとうまくいくのかを知る機会になるからです。
いかに優れた人間でも最初からベストな答えを持っているわけではなく細かな失敗を繰り返し、そこから改善をして徐々によくしていくプロセスを踏んでいます。

挑戦 -> 失敗 -> 反省 -> 改善 -> 成長
のサイクルがうまく回りだすと自分の成長が楽しくなり失敗をそれなくなると思います。

私もこのことを意識して、KPTで自身の振り返りを行いながら成長を楽しむマインドに変化させていこうとしています。

## 毎日投稿が途切れてしまいました

毎日投稿を実施しておりましたが、昨日投稿ができませんでした。
理由は寝落ちです。
同じ失敗を繰り返さないように振り返りを行いまいした。

### 失敗の原因

木曜日に帰宅が遅くなり睡眠が十分に取れていなかったこと
金曜日も帰宅が遅くなり、気付いたら椅子に座って寝てしまっていたことが原因

### 改善案

家に帰ってからその日の記事を投稿するのではなく、前日に書いておいて日付が変わったら投稿する
記事を毎日一つではなく何本か下書きにストックしておき、書けない日にも投稿はできるようにする

### 実行

0時を過ぎたら記事を投稿する
学んだことは1日に1つに限らずアウトプットして、記事のストックを作る
ESXi Arm Edition v1.1 登場 vSAN もしてみた

# ESXi Arm Edition の新しいバージョン v1.1 登場!
![ESXiArmEdition.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/541683/a90f2787-6b14-5780-2cc4-8ab1e9658119.png)


先日紹介した ESXi Arm Edition ですが、さすが Flings だけあって既に次の更新版が登場しています。今回登場したのは v1.1 で、いくつかのバグ修正と新しいプラットホームのサポートが行われています。
## v1.1 の変更点
* [ESXiホストを分散スイッチに追加した後のPSOD 発生] (https://flings.vmware.com/esxi-arm-edition/bugs/1098)に対する修正 
* Arm N1SDPプラットフォームのサポート 
* Neoverse N1CPUでのVMのサポート 
* LS1046AおよびLX2160Aプラットフォームのパススルー安定性の向上
* vCenter / DRS の誤ったCPU使用率の修正
* VMストレージがいっぱいになった際 VM がクラッシュする問題の修正
* 非コヒーレントDMAデバイスサポートの安定性のための修正
* インストーラー：3.125ではなく4GBの4％以内のRAMサイズを許容します（サポートされていないRK3399ボードの場合）
* シリアルポート処理の改善（サポートされていない/不明なボードの場合、ファームウェア構成エラーに対しての回復力改善）
多分 Raspberry Pi 4 に関係するのは PSOD と VM クラッシュと Non Coherent DMA 位でしょうか。テストしてみないとこのあたりがどのように変わったかはちょっと判断できません。
## v1.1 の入手
前回の [ESXi Arm Edition](https://flings.vmware.com/esxi-arm-edition) v1.0 のページがそのまま v1.1 になっていますので、特に別の所に行ってダウンロードする必要はありません。今後のアップグレードも同様になっていくものと思います。
今回の v1.1 のiso イメージは VMware-VMvisor-Installer-7.0.0-17068872.aarch64.iso です。vSphere HA 関連の 2つのファイルは前のままの vmware-fdm-7.0c-16620014.arm64.vib および vmware-fdm-7.0d-16749671.arm64.vib になります。
## v1.1 のインストール
これは前回の v1.0 と変わりませんので、こちらを参考にインストールしてください。
[ARM版 ESXi 7 をインストール](https://qiita.com/inasato/items/3e1ecbb9f57ced86d75b)
今回のバージョンも vCenter Server Appliance は 7.0.c または 7.0.d までしか使えません。上記 2つの vib はそれぞれの Appliance を使う際に追加インストールしてください。

# ESXi Arm Edition での vSAN を作ってみた
こんな感じで作ることができます。

vSAN を構成した Raspberry Pi 4 4ノードクラスタとデータストア
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/541683/46282814-dd10-a633-f0ce-dd4ecb34fdc8.png)

vSAN ディスク構成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/541683/1b5fb3a8-7e72-4874-95d8-6340ee4f34df.png)

Skyline 健全性
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/541683/3dfbf641-015e-8cd8-f4e2-f8caa75fd3a5.png)

この vSAN 上で ubuntu-20.04.1-live-server-arm64.iso の仮想マシンが稼働していて、vMotion や HA をしています。
C言語+MPIのtips（MPI_Gather）

MPI_Gather は「各プロセスの持つ同じ長さのデータを結合して，あるプロセスに渡す関数」。

【目的】
 各プロセスの一次元配列 div を結合した配列 cmb を作り、プロセス０へ送信することで MPI_Gather の機能を知る。

【使用するもの】
 open-mpi

【環境】
 $ mpicc —version 
Apple clang version 11.0.3 (clang-1103.0.32.29) 
 Target: x86_64-apple-darwin19.6.0 
 Thread model: posix 
 InstalledDir: /Library/Developer/CommandLineTools/usr/bin 

【方法】
 
```c:Gather.c 
#include<stdio.h>
#include<stdlib.h>
#include<mpi.h>

#define N 3

int main(int argc, char **argv){
        int my_rank, num_proc;
        int i,j, div[N];
        int *cmb;

        MPI_Init(&argc, &argv);
        MPI_Comm_size(MPI_COMM_WORLD, &num_proc);
        MPI_Comm_rank(MPI_COMM_WORLD, &my_rank);

        for(i=0;i<N;i++) div[i] = i*4+my_rank;
        printf("myrank:%d, div[0]=%d, div[1]=%d, div[2]=%d\n",my_rank,div[0],div[1],div[2]);

        cmb=(int *)malloc(N*num_proc*sizeof(int));
        if (cmb==NULL){
           printf("arr\n");
           return 1;
        }
        for(j=0;j<N*num_proc;j++) cmb[j]=-1;

        MPI_Gather(div, N, MPI_INT, cmb, N, MPI_INT, 0, MPI_COMM_WORLD);

        for(j=0;j<N*num_proc;j++) printf("my_rank:%d, cmb[%d] = %d\n",my_rank,j,cmb[j]);
        free(cmb);

MPI_Finalize();
return 0;
}
```

【結果】
mpicc コマンドでコンパイル、mpirun コマンドでプロセス数を２にして実行。

```
$ mpicc Gather.c
$ mpirun -np 2 ./a.out
myrank:0, div[0]=0, div[1]=4, div[2]=8
myrank:1, div[0]=1, div[1]=5, div[2]=9
my_rank:1, cmb[0] = -1
my_rank:1, cmb[1] = -1
my_rank:1, cmb[2] = -1
my_rank:1, cmb[3] = -1
my_rank:1, cmb[4] = -1
my_rank:1, cmb[5] = -1
my_rank:0, cmb[0] = 0
my_rank:0, cmb[1] = 4
my_rank:0, cmb[2] = 8
my_rank:0, cmb[3] = 1
my_rank:0, cmb[4] = 5
my_rank:0, cmb[5] = 9
```

【考察（何が起きたのか）】  
まずプロセス０と１でそれぞれ div[0]、div[1]、div[2]が生成される。それぞれのプロセスで値が格納される。
at プロセス０　div[0]=0*4+0=0、div[1]=1*4+0=4、div[2]=2*4+0=8  
at プロセス１　div[0]=0*4+1=1、div[1]=1*4+1=5、div[2]=2*4+1=9

次にプロセス０と１でそれぞれ cmb[0]から cmb[5]までがメモリ割り当てされる。それぞれのプロセスで値が格納される。
at プロセス０　cmb[0]=-1、cmb[1]=-1、・・・、cmb[5]=-1
  at プロセス１　cmb[0]=-1、cmb[1]=-1、・・・、cmb[5]=-1

MPI_Gatherによって各々のプロセスの「div」から、「N」個ずつデータが送信される。データの型は整数（int）「MPI_INT」である。「cmb」がその「N」個ずつの整数型（int）「MPI_INT」のデータを受信して結合する。送信先はプロセス「０」である。プロセス１のcmbの要素は変化なし。

つまり 
at プロセス０　cmb[0]=-1、cmb[1]=-1、・・・、cmb[5]=-1
  at プロセス１　cmb[0]=0、cmb[1]=4、cmb[0]=8、cmb[3]=1、cmb[4]=5、cmb[5]=9
となる。
それぞれのプロセスで cmbが表示されて終了。free(cmb)で各プロセスのメモリを解放。

【参考】
「mpi 並列プログラミング」と検索すると、より正確でより情報量の多い資料が見つかります。
【CakePHP3】クエリービルダーで年月を降順にする

「え？こんなのも分からないの？」と思われるタイトルですが、まさかの私は躓いたんですよ〜！
そんな方もいる、いて欲しい！という思いで、記事に残しておきます。(最低)

``````PHP:UsersController.php
public function usersBirthDate {
 $birthDate = $this->Users->find()
     ->order(['birth_date' => 'DESC'])
     ->all();

 //ページネーション
 $birthDate = $this->paginate($this->User);
}
```

これだと見ての通りですが、ページネーションの`$birthDate`で、デフォルトの昇順(ASC順)になってしまいました・・・。

そこで以下で解決しました！

``````PHP:UsersController.php
public function usersBirthDate {
 $birthDate = $this->Users->find()->all();

 //ここで降順にする
 $this->paginate = ['order' => ['birth_date' => 'DESC']];

 //ページネーション
 $birthDate = $this->paginate($this->User);
}
```

それではまた！