OmniAICreator/Qiita-1.07M huggingface dataset:
【Jetpack Compose】Icon() や Image() で ImageVector をより便利に使う

コード記述のみでベクターのマテリアルアイコン使えます。

drawable の作成が不要なので便利、変更もしやすいです。

```kotlin
Icon(
  imageVector = Icons.Filled.Favorite,
  contentDescription = null
)
```

```kotlin
Image(
  imageVector = Icons.Filled.Favorite,
  contentDescription = null
)
```

悪い点としては、


> 絵柄が49個しかない

> 絵柄を見ながら選択できない

というところでしょうか。

対応策を考えてみましょう。

[👉 【Jetpack Compose】Icon() や Image() で ImageVector をより便利に使う](https://android.benigumo.com/20220613/jetpack-compose-imagevector/)
初心者 flutter x firestoreの複合クエリに挑戦する2  未記入項目の処理

# 歴史事象のアーカイブをつくろうとしているのだが
　ユーザーに情報を入力してもらうWikipedia方式を考えている。ということで、こんな情報を入れてください、という項目が、必須項目４、オプションが８、自由記述が10、textformfieldとして用意されている。必須項目については書かないと「未記入です」とアラートが出るようにしたけれど、他は放置したら、firestoreのfieldがnullだらけになってしまった。
　アーカイブだから当然、検索で情報を抽出したいわけだけれど、nullだらけのfieldを横断検索するって、どうするのね、という問題に直面。

## arrayContainsAnyを走らせるための未記入項目処理
　必須項目以外も「必ず書いてね」とユーザーに要求するのはUXが悪すぎる。ちゃんと書かなくても、「･･･」でもいいから入れてもらえればnullは回避できるけれど、自分がユーザーだったら、二度と来ないぞ、という気分がする。なので、ぜひともコードで処理したい。

　今自分でできるのは、「未記入です」とアラートを出すこと。これはFlutter大学の教材から習得済み。

https://www.youtube.com/watch?v=nPAIXqGzjUM&t=687s

　これを流用して「未記入だったら'blank'いう値を追加する」というif文をつくろう、ということ。基本的には教材のadd_modelに、以下のようなコードを追加。

```
class AddFactsModel extends ChangeNotifier {

中略

　Future addFacts() async {


   if (year == null || year == "") {
      throw 'year needed';
    }

    if (date == null || date == "") {
      date = 'blank';

中略

    await FirebaseFirestore.instance.collection('events').add({
   
      'year': year,
      'name': name,
      'country': country,

      'latitude': latitude,
      'longitude': longitude,

      'keywords_arr': [date,　・・・・・・・],
     
       });
   }
}

```

　上のif文はスナックバーでアラートを出す。下のif文は未記入項目に'blank'という文字列を入れることでfirestoreのfieldが　Null　ではなく　String　になるよう対応しています。そしてaddのところでarrayに追加。

## 試行錯誤しすぎて
　できていたfetchが不調になるという元も子もない状態になっているけれど、とりあえずnull回避についてご報告まで。
JavaScript

### コールバック関数
ある他の関数に引数として渡される関数をコールバック関数という。
渡される側の関数であることに注意。
渡す→呼び出す　２つのことが必要。

渡し方は2パターンある。
・事前に定義した関数をコールバック関数として渡す。
・定義した関数内で、関数名を記し、その関数の引数の中に定義したい関数を記す方法

コールバック関数にもプロパティを設定し、後から引数を渡すこともできる。
JavaScript忘備録

solidityの初歩を勉強した。理解を深めるためにJavaScriptもやっておく。

### classとインスタンス
classとはユーザーのデータなどがつまったオブジェクトを作るための設計図。
インスタンスとはclassを使って作成され空のオブジェクトのこと。

```javascript
class Animal{
//classの中身を作るmd
 constructor(){
  console.log("こんにちは")
}
const animal = new Animal();
//pythonと違ってnewをつけてる。
```
【Docker】Pythonのモジュールimg2pdfがdocker build時にエラーとなる

# 概要
Python内でHTMLを生成し、Chromiumにキャプチャを行い、キャプチャ（JPEG）をPDFに出力する処理を作成した際に以下のエラーが発生した。  
その時の対応メモと今後調査をするため備忘録として残しておく。  

# エラー内容 
docker build時にエラー
```
Successfully built img2pdf
Failed to build pikepdf
ERROR: Could not build wheels for pikepdf, which is required to install pyproject.toml-based projects
``` 
img2pdf内のpikepdfというモジュールのインストールでエラーとなった。　　

# 対応
チームメンバー内でエラーとならなかった人がいたので環境の比較を行った。  
- エラーなし
　SOCがintel
- エラーあり
SOCがAppleシリコン

SOCの差や使用しているPythonのバージョンが異なる…などあったのですが結局調査中にimg2pdfを使用しない方針となったので削除しました。  


# まとめ
とりあえず現状はモジュール削除ということで対応終了したが 
今後もPDF変換は行う可能性があるので調査し、追記する。
【kintone認定 アソシエイト】合格体験記

## はじめに
業務にてkintoneに触れているため、それをきっかけとして資格取得を目指しました。
そして先日、kintone認定 アソシエイトを２回目の受験にて無事合格できました！


## kintone認定 アソシエイトとは
kintoneの機能および設定方法に関する体系的な知識を持ち、kintoneを活用した業務改善スキルがあることを証明するものです。

[kintoneの詳細はこちら](https://kintone.cybozu.co.jp/)
[kintone認定 アソシエイトの詳細はこちら](https://cybozu.co.jp/kintone-certification/level/associate/)

## 学習方法
### １回目の受験時
- ラーニングコンテンツとして用意されているyoutubeの視聴
現段階では動画が更新されているようでしたが、こちらを全て視聴して最後の練習問題を解くということを行いました。全問解けるまで繰り返し行いました。
- 業務の中で触る
業務で使用していたので、業務で使用する内容について学んでいきました。

https://cybozu.co.jp/kintone-certification/training/?tab=aa

この状態で試験に挑みました。受験してみると、なんじゃこりゃという感じでした。。youtubeの練習問題よりすごく難しくて絶望を感じました。また、業務で触っているからある程度は大丈夫だろうと思っていましたが、まだまだ知らないことがたくさんあるのだと気付かされました。

結果は正答率４８％でした:sob:。。
７０％以上で合格なのですが、まだまだだなと痛感しました。

### ２回目の受験時
- kintone認定 アソシエイト試験 対策テキスト［第3版］
公式の本を購入しました。細かいkintoneの操作の説明と練習問題がついています。今まで知らなかった機能についても学ぶことができました！１回目の時から買っておけばよかったなと思いました。練習問題は全部で１４８問あるのですが、正答率が９０％以上になるまで何回も問題を解きました。
- ラーニングコンテンツとして用意されている練習問題
１回目の受験時には用意されていなかったのですが、最近追加されたようです。３パターンほど練習問題が用意されており、とても役に立ちました。ただ、解説については公式ドキュメントを読んでねというスタイルなので少し手間でした。これも正答率が９０％以上になるまで何回も問題を解きました。
- ラーニングコンテンツとして用意されているyoutubeの視聴
1回目受験時から練習問題が更新されていたということもあり、こちらも使用しました。練習問題の内容は対策テキストと似ているものがいくつかありました。
- kintoneの開発者ライセンスの使用
１年間kintoneの環境を使用できることができるサービスです。業務ではなかなか自由に使用はできなかったため、こちらを使用しました。ユーザーや契約の管理画面など普段使用しない機能についてを重点的に触りました。

[kintone 開発者ライセンス（開発環境)の申し込みはこちらから](https://developer.cybozu.io/hc/ja/articles/200720464-kintone-%E9%96%8B%E7%99%BA%E8%80%85%E3%83%A9%E3%82%A4%E3%82%BB%E3%83%B3%E3%82%B9-%E9%96%8B%E7%99%BA%E7%92%B0%E5%A2%83-)

２回目は１回目に比べて自信はありましたが、少し不安でした。受験をしてみると、これは分かる！というような感じで受験中に今回は合格したなと感じました。

結果は９６％とかなり高い正答率でした！！
初めからテキスト買っておけばよかったって感じです:ghost:

## さいごに
無事資格に合格ができてよかったです:blush:こちらの記事を参考にしていただき、kintone認定 アソシエイトの資格を持つ仲間が増えることを期待しています！
CentOS7をRocky Linux8にアップグレード

# 0x1 計画と目標

CentOS 7は停止しているため、できるだけ早くRocky Linuxに更新する必要があります。この記事では、Rocky Linuxに安全にアップグレードする方法について説明します。

更新する前に、バックアップを作成してください。

メモリが1GB未満の場合は、仮想メモリを確立する必要があります。

# 0x2 Rescue Kernel（Black Magic）に切り替えます

```shell
cd
yum -y install rsync wget
wget https://raw.githubusercontent.com/johnj/centos-to8-upgrade/master/to8.sh

chmod +x to8.sh
./to8.sh
# エラーが発生した場合、それは問題ではありません
reboot
```
再起動後、それは特別なRescue Kernelです

# 0x3 OSアップデート

```shell
./to8.sh

# remove temp file
rm -Rf /to8

mkdir -p ~/repo.bak
mv /etc/yum.repos.d/* ~/repo.bak

cat > /etc/yum.repos.d/Rocky-BaseOS.repo <<-EOF
# Rocky-BaseOS.repo
#
# The mirrorlist system uses the connecting IP address of the client and the
# update status of each mirror to pick current mirrors that are geographically
# close to the client.  You should use this for Rocky updates unless you are
# manually picking other mirrors.
#
# If the mirrorlist does not work for you, you can try the commented out
# baseurl line instead.

[baseos]
name=Rocky Linux $releasever - BaseOS
baseurl=http://dl.rockylinux.org/vault/rocky/8.4/BaseOS/x86_64/os/
gpgcheck=0
enabled=1
EOF

yum install dnf

dnf -y install nano

cat > /etc/yum.repos.d/Rocky-BaseOS.repo <<-EOF
# Rocky-BaseOS.repo
#
# The mirrorlist system uses the connecting IP address of the client and the
# update status of each mirror to pick current mirrors that are geographically
# close to the client.  You should use this for Rocky updates unless you are
# manually picking other mirrors.
#
# If the mirrorlist does not work for you, you can try the commented out
# baseurl line instead.

[baseos]
name=Rocky Linux  - BaseOS
mirrorlist=https://mirrors.rockylinux.org/mirrorlist?arch=$basearch&repo=BaseOS-$releasever
#baseurl=http://dl.rockylinux.org/vault/rocky/8.4/BaseOS/x86_64/os/
gpgcheck=0
enabled=1
EOF

dnf -y update
dnf -y upgrade
```

# 0x4 Kernelを変更する

```shell
dnf -y install epel-release dnf-plugins-core yum-utils
yum-config-manager --set-enabled powertools

dnf -y copr enable rmnscnce/kernel-lqx
dnf -y install kernel-lqx kernel-lqx-devel kernel-lqx-headers 
grub2-mkconfig -o /boot/grub2/grub.cfg

reboot
```

# 0x5 仕上げ

たくさんのvpsプロバイダーは古いOSを使用しており、パフォーマンスとセキュリティの両方の理由から最新のものに更新する必要があります。

しかし、CentOSシリーズは扱いが最も難しいOSです。

今後、パフォーマンスとセキュリティに関連するコンテンツを更新する予定ですので、ご期待ください。
CanCanCanでMockを使ってRspecを行う

# はじめに

CanCanCanを使うことがありRspecを書いていたのですが、CanCanCanのモデルテストでのMockの使い方がネットで見つからず、テストするのに躓いたのでやり方をまとめます。

# 問題

以下のようなablityを書きます。
Articleに出版社(publisher)が存在して、出版日(publish_date)が2012年6月30日以降なら`current_publish`を返します。

```rb:ability.rb
class Ability
  include CanCan::Ability

  def initialize
    check_datetime
  end

  private
    def check_datetime
      can :current_pulish, Article do |schedule|
        article.publisher.present? && check_pulish_date?(article)
      end
    end

    def check_publish_date?(article)
      article.date > Time.new(2012, 6, 30, 23, 59, 60, 0)
    end
```

ここで`check_datetime`をRspecでテストすることを考えます。
check_datetimeは`check_publish_date?`という関数を利用しているためこの箇所は別でテストをするため`mock`を利用してここでは常に`true`を返すように設定します。

```rb:ability_spec.rb
  subject do
    Ability.new(user)
  end
(省略)
      it 'current_publishであること' do
        allow(Ability).to receive(:check_pubish_date?).and_return(true)
        is_expected.to be_able_to(:current_publish, article) }
```

このように書きましたが以下のエラーが発生しました。

```
Ability does not implement: check_publish_date?
```

# 解決方法

mockの仕方を以下のように変更しました。

```rb:ability_spec.rb
  subject do
    Ability.new(user)
  end
  let(:mock_ability) { Ability.new(user) }

(省略)

      it '権限が通らないこと' do
        allow(mock_ability).to receive(:check_publish_date?).and_return(true)
        expect(mock_ability).to be_able_to(:current_publish, article)
      end
```

また、`check_publish_date?`のテストは以下のように書きました。
注意としてはPrivateメソッドを呼び出すので`send`を使います。

```rb:ability_spec.rb
  let(:mock_ability) { Ability.new(user) }

(省略)

  describe 'chck_publish_date?' do
    context '発売日が2017年のとき' do

      let(:article) { Artcile.create(title: 'title', date: Time.new(2017, 6, 30, 23, 59, 60, 0), publisher: 'publisher')
      it 'trueが返ってくること' do
        expect(mock_ability.send(:check_date_time_send?, article)).to eq(true)
      end
    end
  end
```

# おわりに
CanCanCanで関数を内部的に呼び出すのはあまり行っている方がいなかったので苦戦しましたがテストすることができました。
[作業メモ]PowerAutomateのアレイ（配列）型変数からすべての要素を取り出す方法

## 方法
変数を用意し「Apply to each」でアレイ（配列）内の要素を変数に追加する

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1612369/aacc9170-f59b-d04d-8978-396edb87c10f.png)

## 使いどころ
「Apply to each」と動的なコンテンツの「現在のアイテム」を使っても同じようにアレイ（配列）内の要素をすべて取り出すことは可能だが、繰り返してほしくない箇所まで「Apply to each」で繰り返してしまうときは、一度変数に入れるのが良いと思う。
【ReactNative】FlatList自体のタップを判別する

# 目次
[1.やりたいこと](#1-やりたいこと)
[2.起きていた問題](#2-起きていた問題)
[3.原因](#3-原因)
[4.解決策](#4-解決策)
[5.まとめ](#5-まとめ)

# 1. やりたいこと
赤枠内の青の部分を「タップした時だけ」イベントを発火させたい
スクロールされた場合はタップと判定したくない
青部分をタップしたときにキーボードを非表示にするという処理をしたい。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2552472/6e127f01-1e63-3920-9c7c-7b2921a82007.png" width="50%">

# 2. 起きていた問題
FlatListのonPressやonTouchEndやonTouchStartを使用して、
普通にタップのイベントを拾い処理を行おうとしたが、
単純に上記イベントを契機とするとスクロールした際にもイベントが発火してしまう問題が発生していました。

# 3. 原因
おそらくFlatList自体をタップした際のことは考えらておらず、
onpressとスクロールを判別するすべはReactNative API上にはない。
そのため自前でonPressとScrollの判定を行う.

# 4. 解決策
そのため、スクロールとタップの挙動の違いである
下記をもとにタップ判定をすることを考えた。

①タップ開始位置と終了位置　スクロール→違う　タップ→ほぼ同じ
②タップ時間の長さ スクロール→長い　タップ→短い


今回は①の違いを利用してX, Yの座標が同じであれば、
タップと判定する。それ以外はタップではないと判定する。

```js
  onTouchStart = ({nativeEvent}) => {
    const { locationX, locationY } = nativeEvent
    this.setState({ locationX, locationY  })
  }
  onTouchEnd = ({nativeEvent}) => {
    const { locationX, locationY } = nativeEvent
    if(this.state.locationX == locationX && this.state.locationY == locationY){
      this.hideKeyboard(this.props)
    }
  }

<FlatList data={data}
    onTouchStart={this.onTouchStart}
    onTouchEnd={this.onTouchEnd}
    renderItem={this.renderItem}/>
```

最初は上記のコードだったが、
スマホによっては、性能がよくない場合があり、
図らずもタップがずれてしまうこともあるので、
余白を追加する。
今回は半径8pxの範囲未満であれば、タップと認識するようにした。


```js
/**
   * タップ開始時と終了時の座標が半径8px以内に収まっていればタップとして認識する
   * タップの場合、キーボードをOFFにする
   */
  const ACCEPTBALE_LOCATION_GAP = 8

  onTouchStart = ({nativeEvent}) => {
    const { locationX, locationY } = nativeEvent
    this.setState({ locationX, locationY  })
  }
  onTouchEnd = ({nativeEvent}) => {
    const { locationX, locationY } = nativeEvent
    if(this.state.locationX - ACCEPTBALE_LOCATION_GAP < locationX && locationX < this.state.locationX + ACCEPTBALE_LOCATION_GAP
        && this.state.locationY - ACCEPTBALE_LOCATION_GAP < locationY && locationY < this.state.locationY + ACCEPTBALE_LOCATION_GAP){
      this.hideKeyboard()// ex. Keyboard OFFの処理
    }
  }

<FlatList data={data}
    onTouchStart={this.onTouchStart}
    onTouchEnd={this.onTouchEnd}
    renderItem={renderItem}/>
```

# 5. まとめ
ものすごく単純な処理で終わると思いきや、
ひと工夫する必要があった。
あまり調べた際に参考資料が出てこなかったので、
この記事を作成しました。
もっといいやり方があるよ！などあればぜひコメントまで！

では！

[gamba!公式サイトはこちらへ！ 《無料で15日間gamba!お試しできます》](https://www.getgamba.com/)

[株式会社gamba! カスタマーサクセスチーム note](https://note.com/gamba_sec/)

[gamba! 公式 facebookページ](https://www.facebook.com/getgamba)

[gamba! 公式Twitter](https://twitter.com/getgamba)
Auth0のRate Limitを正しく理解する

# はじめに

Auth0 Management APIのRate Limitについてなんとなく疑問に思っていたものの放置してしまっていたので、改めて調べてみた

# 疑問

[Auth0のドキュメント](https://auth0.com/docs/troubleshoot/customer-support/operational-policies/rate-limit-policy/management-api-endpoint-rate-limits#enterprise-and-startup-subscription-limits)にはEnterpriseプランのrequest per secondが **16** と記載されている
![Screen Shot 2022-06-13 at 11.16.08 AM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/174837/1be26368-dc58-1466-cba7-b982ceb87d6d.png)

だがしかし、任意のエンドポイントでManagement APIリクエストを投げてみると、レスポンスヘッダ内のRate Limitは **50** となっている

```bash:（例）ユーザー取得リクエスト（ヘッダのみ）
$ curl -D - -o /dev/null -s \
  -H "Authorization: Bearer ${MANAGEMENT_API_ACCESS_TOKEN}" \
  -X GET https://${AUTH0_DOMAIN}/api/v2/users
```

```bash:Rate Limitレスポンスヘッダ
x-ratelimit-limit: 50
x-ratelimit-remaining: 49
x-ratelimit-reset: 1655086415
```

この差は何だろう？
ドキュメントの下の方にあるエンドポイントごとのRate Limitで個別に設定されているわけではなさそうだし、[Self-service subscription limits](https://auth0.com/docs/troubleshoot/customer-support/operational-policies/rate-limit-policy/management-api-endpoint-rate-limits#self-service-subscription-limits)に記載されてる数字とも合致しない（そもそもSelf Serviceプランでもないし）

# 解説

ここに全てが書いてあった
[Rate Limits Exposition - Auth0 Community](https://community.auth0.com/t/rate-limits-exposition/70959)

実際のRate Limitは

- 秒間50リクエスト
- 分間1,000リクエスト

となっている

つまり、こういうことである
秒間で50リクエストを超えるようであればHTTPステータス `429 Too Many Requests` を返す
秒間30リクエストでも、それが継続するようなら同じく `429` を返す（詳細は後述）

ここで分間1,000というのをどう解釈するかということになるが、こんなロジックになってるらしい↓↓
- 分間1,000リクエストを秒間に換算すると平均16.67リクエスト/秒となる
- 1秒ごとに16.67が分間Rate Limitのバケットに加算されていくことになる

例えば秒間30リクエスト発生しているとする
1秒後には16.67加算されるので、残りは 1,000 - 30 + 16.67 = 986.67 リクエストとなる
もし秒間30リクエストが継続的に発生すると、毎秒13.33リクエストを消費していることになるので、1,000 / 13.33 = 75秒後には1,000を使い切って超過する、つまり分間のRate Limitに達するということになる

# つまり結局どういうこと？

ということで、毎秒追加される分を枯渇せずに継続的に処理可能なManagement APIのリクエストは秒間16.67が上限ということになる
だから **Sustained Requests per Second** が `16` になってるんだね
Susteinedってそういう意味で書いてあったんだね、なるほど

こうして書いてみてもわかりづらいね
うまく説明できなくてスンマセン

# おまけ

[Enterprise and Startup subscription limits](https://auth0.com/docs/troubleshoot/customer-support/operational-policies/rate-limit-policy/management-api-endpoint-rate-limits#enterprise-and-startup-subscription-limits) に記載してあるRate Limit (per second / per minute)はSustainedではなくそのままの意味で受け取れば良さそう

```:この場合は秒間10リクエスト上限みたい
GET https://${AUTH0_DOMAIN}/api/v2/organizations

x-ratelimit-limit: 10
x-ratelimit-remaining: 9
x-ratelimit-reset: 1655089549
```

更にいうと、Enterpriseプランの場合は **Self-service subscription limits** は適用されないみたい
そもそもプランに応じてエンドポイントごとに設定されているRate Limitはデフォルト値より小さいからね
ディープラーニングの手法(G検定をまとめる, 2022.6.13)

[「G検定をまとめる」](https://qiita.com/tan0ry0shiny/items/8c6bf6d7c03ae268679a)の記事の項目の一つです。簡単にまとめて後付けしていくスタイルです。広く浅く学習していき、徐々に深くしていきます。
# ディープラーニングの手法
ディープラーニングの手法を大きく分けるとCNN、RNN、Attension、生成モデル、強化学習、の５つに分けられます。
# CNN(画像データ)
## CNNの基本的な構造
## CNNの発展
https://gri.jp/media/entry/364

AlexNet, VGG, GoogLeNet, Inceptionモジュール, ResNet, MobileNet, EfficientNet
# RNN(音声データ、テキストデータ)
LSTM, GRU, BiRNN, エンコーダ-デコーダ, 
## Pre-trained Models
応用タスクを解くための事前学習モデル
GPT, BERT, ALBERT, DistilBERT, GPT-2, Megatron-LM, Turing-NLG, ViT
# Attention(画像分類、自然言語処理)
Attention, Transformer, 

https://qiita.com/tan0ry0shiny/items/abffe79e2449770ed997
# 深層生成モデル
VAE, GAN, DCGAN, Pix2Pix, Cycle GAN,
# 深層強化学習
DQN, モンテカルロ木探索、AlphaGo, AlphaGo Zero, Alpha Zero, OpenAI Five, AlphaStar, 
## ロボット制御に応用する際の課題
次元の呪い
# その他の構造
NAS, NASNet, MnasNet, 
# タスクの種類
## 画像分野での応用
### 画像認識タスク
AlexNet, GoogLeNet, VGG, ResNet, Wide ResNet, DenseNet, SENet,
### 物体検出タスク
R-CNN, FPN, YOLO, SDD, Fast R-CNN, Faster R-CNN, 
### セグメンテーションタスク
FCN, SegNet, U-Net, PSPNet, DeepLab, DeepLab V3+, 
### 姿勢推定タスク
Convolutional Pose Machine, Open Pose
### マルチタスク学習
物体クラスの識別と物体領域の位置検出を同時に行う：Faster R-CNN, YOLO, Mask R-CNN, 
## 音声処理と自然言語処理
### 時系列データの扱い(前処理)
#### 音声データの扱い
A-D変換、PCM(パルス符号変調)、FFT(高速フーリエ変換)、HMM(隠れマルコフモデル)
#### テキストデータの扱い
n-gram, BoW(Bag-of-Words),TF-IDF, word embedding, word2vec, skip-gram, CBOW, fast Text, ELMo, 
## モデルの解釈性、
[2022年]初心者向けおすすめCC++プログラミング書籍(参考書)

初心者向けC/C++プログラミング書籍を紹介します。
プログラミングやIT系の勉強するときはKindleや電子書籍で勉強するのがおすすめです。
***
[C言語[完全]入門[Amazon]](https://amzn.to/3HhGUQb)
![a.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/24c4baa2-3e2f-60fb-28fb-dbab70e7fda2.jpeg)

- ＜基礎編＞
  - Chapter1 C言語を学ぶための準備
  - Chapter2 Cプログラミングを始めよう
  - Chapter3 まずは書いた値をそのまま出力しよう
  - Chapter4 Cプログラムの醍醐味は式の計算
  - Chapter5 後で必要な値は変数に格納しておく
  - Chapter6 選択文でプログラムの流れを変える
  - Chapter7 繰り返し文で処理を反復する
  - Chapter8 配列を使って多数の値を管理する
  - Chapter9 文字と文字列を操作する
- ＜応用編＞
  - Chapter10 何度も使う処理は関数にまとめる
  - Chapter11 関数をさらに使いこなす
  - Chapter12 構造体で関連する値を一括して扱う
  - Chapter13 ポインタはアドレスを使って対象を指し示す
  - Chapter14 ポインタでメモリを自在に操作する
  - Chapter15 ファイルを読み書きする
  - Chapter16 プログラムを分割する
- ＜実践編＞
  - Chapter17 仕事の自動化に役立つプログラムを作る
  - Chapter18 ゼロからのプログラミングでAIの仕組みを学ぶ
  - Chapter19 インタラクティブなプログラムを作る
***
[スラスラわかるC++ 第3版[Amazon]](https://amzn.to/3NGhP3S)
![aa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/2dc0d18d-f3ac-23bc-9bdc-02053f66dd5f.jpeg)

- 第1章 プログラミングの準備をする
- 第2章 役に立つプログラムを作る（C++の基本構文）
- 第3章 条件に応じた分岐と繰り返し
- 第4章 プログラムを関数で部品化する
- 第5章 プログラムをクラスで部品化する
- 第6章 クラスがあるから表現できること
- 第7章 オーバーライドとオーバーロード
- 第8章 コピーコンストラクタと代入演算子のオーバーロード
- 第9章 エラー処理とファイル処理
- 第10章 テンプレートとSTL
- 付録
***
[新·明解C言語 中級編[Amazon]](https://amzn.to/3ttrBy6)
![a.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/fc2ecf67-34a2-790c-7625-842341f23ccf.jpeg)
- 第 1 章 数当てゲーム
- 第 2 章 表示に凝ろう
- 第 3 章 じゃんけんゲーム
- 第 4 章 マスターマインド
- 第 5 章 記憶力トレーニング
- 第 6 章 カレンダー
- 第 7 章 右脳トレーニング
- 第 8 章 タイピング練習
- 第 9 章 ファイル処理
- 第 10 章 英単語学習ソフト
***
[新・明解C言語 実践編[Amazon]](https://amzn.to/39gymN6)
![aa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/a7a87a6a-19cf-1456-8f3f-4eeb583e5a98.jpeg)
- 第1章 見えないエラー
- 第2章 型変換
- 第3章 ポインタについて
- 第4章 文字列とポインタ
- 第5章 ナル
- 第6章 関数の定義と宣言
- 第7章 構造体と共用体
- 第8章 ファイル処理とテキスト
- 第9章 ファイルの活用
- 第10章 スタックオーバフロー
- 第11章 ライブラリ開発の基礎
- 第12章 線形リストの応用
- 第13章 ２分探索木の応用
- 第14章 コンソール画面の制御
***
[新・明解C言語で学ぶアルゴリズムとデータ構造第2版[Amazon]](https://amzn.to/39kXx0Q)
![aaa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/4dff0bb8-baae-c33f-1174-81bf502ce148.jpeg)

- 第1章　基本的なアルゴリズム
- 第2章　基本的なデータ構造
- 第3章　探索
- 第4章　スタックとキュー
- 第5章　再帰的アルゴリズム
- 第6章　ソート
- 第7章　文字列探索
- 第8章　線形リスト
- 第9章　木構造
***
[新・明解C++で学ぶオブジェクト指向プログラミング[Amazon]](https://amzn.to/3QsCgmP)
![aaaa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2702119/27677348-30ef-42d8-ef97-b4fd16d3a6fb.jpeg)
- 第1章　クラスの基礎
- 第2章　具象クラスの作成
- 第3章　変換関数と演算子関数
- 第4章　資源獲得時初期化と例外処理
- 第5章　継　承
- 第6章　仮想関数と多相性
- 第7章　抽象クラス
- 第8章　多重継承
- 第9章　例外処理
- 第10章　クラステンプレート
- 第11章　ベクトルライブラリ
- 第12章　文字列ライブラリ
- 第13章　ストリームへの入出力
***
>他の記事
・[[2022年]初心者向けおすすめCC++プログラミング書籍(参考書)](https://qiita.com/metimeti/items/68c67de6700724b06237)
・[[2022年]おすすめ機械学習書籍(参考書)](https://qiita.com/metimeti/items/ad39b4a63e73e841ebb7)
・[[2022年]オライリーおすすめ書籍1(参考書)](https://qiita.com/metimeti/items/8ac3bfbdbde550e07d77)
・[[2022年]オライリー書籍ランキング1(O'Reilly)](https://qiita.com/metimeti/items/a349a5b7b521414c9e5a)
・[[2022年]初心者におすすめのPython書籍(参考書)](https://qiita.com/metimeti/items/85a92f9d5331b558bd9e)
WARNING: There was an error checking the latest version of pip.

# 概要
pip install したら、warning が出た。

```
WARNING: There was an error checking the latest version of pip.
```

最新バージョンのpipのチェック中にエラーが発生しました。

# 対応策
``` sh
$ python -m pip install --upgrade pip
```

# 作業ログ
```
$ python -m pip install --upgrade pip
Requirement already satisfied: pip in ./env/lib/python3.9/site-packages (22.1.1)
Collecting pip
  Downloading pip-22.1.2-py3-none-any.whl (2.1 MB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 2.1/2.1 MB 3.8 MB/s eta 0:00:00
Installing collected packages: pip
  Attempting uninstall: pip
    Found existing installation: pip 22.1.1
    Uninstalling pip-22.1.1:
      Successfully uninstalled pip-22.1.1
Successfully installed pip-22.1.2
```

# 完了
01.01. Data load


#最後の２行を読み込まない
skipfooter=2

#読み込む列を指定
0列目から4列目まで読み込む
parse_cols=4

#1列目と3列目だけ読み込む
parse_cols=[1,3]

#列名を指定してその範囲の列を読み込む
A~B, D~Fを読み込む
parse_cols=“A:B, D:F”

1列目から12列目を読み込む
names= range(0, 13)

```python
df = pd.read_csv("submit_sample.csv", sheet_name=‘SUM’, header=None, index=None, skip rows = 2, index_col=None, dtype=object)
【JavaScript 関数ドリル】中級編のfromPairs関数の実装アウトプット

## fromPairs関数の課題内容

\_.fromPairs関数を自分で実装する課題。
https://lodash.com/docs/4.17.15#fromPairs

「課題内容」/「解説動画」/「解答例」を確認したい場合は、以下リンク先のページを参照。
https://js-drills.com/blog/fromPairs/

## 課題に取り組む前の状態

- 解答を見ずにできそうだと思った。

## 課題に取り組んだ後の状態

- 解答例は変数への代入が美しく実装されていたので、是非今後は真似したい。



## fromPairs関数の実装コード（答えを見る前）

```javascript
function fromPairs(pairs) {
    const PairedObj = {};
    
    for (let i = 0; i < pairs.length; i++) {
        PairedObj[pairs[i][0]] = pairs[i][1];
    }
    return PairedObj;
}

const result = fromPairs([['a', 1], ['b', 2]]);
console.log(result);
// => { 'a': 1, 'b': 2 }
```

##　fromPairs関数の実装コード（答えを見た後）

```javascript
function fromPairs(pairs) {
  const PairedObj = {};

  for (let i = 0; i < pairs.length; i++) {
    const [key, value] = pairs[i];
    PairedObj[key] = value;
  }
  return PairedObj;
}
```
親チケットのカスタムフィールドの情報を子チケットに引き継ぐ

　チケットを作成したときに、ある項目を親チケットと同じように設定する必要があるときにいちいち選択するのがめんどくさいので、自動設定してしまおうという話。
　View Customize Pluginを使って実現できました。ドンピシャで書いているサイトが見つからなかったので残します。


近いことをやっているサイト
https://redmine.tokyo/issues/826

この回答でテキスト形式のフィールドは引き継げました。しかし、今やりたいのはリスト形式。
複数選択不可で、対象のカスタムフィールドが１つの場合は以下で実現できました。

ローカルストレージをほかのスクリプトでも使用している場合は、全部クリアしているので何かしらの気遣いは必要だと思われる。


```javascript
$(function(){
    $('#issue_tree a[href*="/issues/new"]').on('click', function() {
        //[custom_field_values][1] 数字はカスタムフィールの番号を設定
        var inputList = document.getElementsByName("issue[custom_field_values][1]");
        var checked;
        for(var i = 0; i < inputList.length; i++){
            //選択されている項目のテキストを取得
            if(inputList[i].checked){
                checked = inputList[i];
            }
        }

     localStorage.setItem('key1', checked.value);// ローカルストレージへの書き込み
    });
 });
 
 $(function(){
    var hikitugi = localStorage.getItem('key1');
    if (hikitugi){
       // 初期表示時に前回保存された値を読み込んでセット
       var inputList = document.getElementsByName("issue[custom_field_values][1]");
       var checked;
       for(var i = 0; i < inputList.length; i++){
           //テキストが一致する項目を選択状態にする
           if(inputList[i].value === hikitugi){
               inputList[i].checked = true;
           }
       }

       // ローカルストレージのクリア
       localStorage.clear();
    }else{
    //何もしない
    }
 });
```
PHPの連想配列でUndefined indexを出さない実装：あなたはどちら派？

|[../](https://qiita.com/taconana/items/3f5424f9abfc755772c2) |
|---|

連想配列（個人的にassociation listと呼んだ方が親しみがある）を使って、該当するキーがないときにnullなどを返すようにしたい。例えば、以下のような連想配列`$arr`から`French`で検索すると、「PHP Notice:  Undefined index: French」のエラーが出る。

```php
$arr = [
  'Japanese' => 'こんにちは',
  'English' => 'Hello'
];

echo $arr['Japanese'].PHP_EOL;
echo $arr['French'].PHP_EOL;
```
そこでUndefined indexのエラーを出さないように、以下のコードが考えられる。`getValue1()`と`getValue2()`である。

```php
function getValue1(array &$arr, string $key): string {
  if (isset($arr[$key])){
    return $arr[$key];
  }
  return '';
}

function getValue2(array &$arr, string $key): string {
  foreach ($arr as $k => $v) {
    if ($key == $k){
      return $v;
    }
  }
  return '';
}

echo getValue1($arr, 'Japanese').PHP_EOL;
echo getValue1($arr, 'French').PHP_EOL;
echo getValue2($arr, 'Japanese').PHP_EOL;
echo getValue2($arr, 'French').PHP_EOL;
```
getValue1()のコードと、getValue2()のコードでは、どちらが効率いいのだろうか。一般に、getValue1()のようなコードをよく見かけるが、内部的には2回ループしているはずだ。
getValue2()の方は、1回のループで実現できているので効率がよさそうに思える。しかし、変数へバインドする負荷があるので微妙だ。どちらがお勧めなのかな。

## （追記）Null合体演算子やarray_key_exists()も有効
コメント欄にアドバイスをいただきました。array_key_exists()やNull合体演算子も有効そうです。

連想配列がHashで実装されているなら、getValue2()ようなforeachで回すよりも、getValue1()のようなコードやNull合体演算子の利用の方が効率良さそうです。

|[../](https://qiita.com/taconana/items/3f5424f9abfc755772c2) |
|---|
【Nuxt.js】typesquareなどのwebフォントが読み込まれない時

# 【Nuxt.js】typesquareなどのwebフォントが読み込まれない時

事象：初回アクセス描画時やページ遷移後、typesquareなどのwebフォントが再読み込みされず、フォントが反映されない。

解消：
```js:sample.vue
export default {
  updated() {
    Ts.loadFont()
  }
}
```

とりあえずAPIで再読み込みさせます。
6.2 (標準) 十分統計量1，最尤推定1

## 方針

十分統計量について．十分統計量は，パラメータの点推定のために最低限必要な情報量のことである．X_1,...,X_nの一つ一つの値を保存しておかなくても標本平均だけを知っていればパラメータの尤度ベースの分析ができる，という場合には標本平均は十分統計量である．

![知ったこと-61.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1702786/afe427bd-6059-ba2e-532b-173ed4314bf6.jpeg)


答案では，パラメータの十分統計量と最尤推定量を求め，最尤推定量の分散について求める．頻度論的な文脈の限りでは，「パラメータは定数」，「パラメータの最尤推定量は確率変数」であるから，その辺をきちんと理解する．また，答案のように最尤推定量が標本平均に近い形になっていたら，変数変換によって標本平均と見做しCLTに持ち込む．

## 答案

![6. 2周目-7.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1702786/fa4c0fad-fbe8-27ae-4ce3-e55e7891d354.jpeg)
![6. 2周目-8.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1702786/1424de9d-8ebd-9b98-9127-0e09bef13e15.jpeg)



## 参考文献

- 『[現代数理統計学の基礎](https://www.kyoritsu-pub.co.jp/bookdetail/9784320111660)』(久保川達也　著)
対象となる文字列からn番目の文字を削除するメソッド

任意の文字列の先頭からn番目の文字を削除するメソッドを紹介します。

例えば下記のように郵便番号111-1111を入力するが間のハイフンを削除して出力したいときなど削除したい文字が何番目にあるかわかっている時などを想定した時

```
def address(number)
  number.slice!(3)
  puts number　　　　　　　　　　　　　　　　　#1111111が出力されて"-"が削除されている
end

number = "111-1111"
address(number)
```

slice！の後ろの（）内は配列と同じように0から始まる数字を入れます！

:::note info
slice!メソッドは配列や文字列から指定した要素を削除して返します
:::
BASEのテーマをReactで構築しECサイトをつくる

## GitHub
[ika-gyosen/baseShopGen](https://github.com/ika-gyosen/baseShopGen)

[必須タグ](https://docs.thebase.in/docs/template/default/must)がすべて記述された状態のテンプレートなので`yarn start`すれば、[BASEのHTML編集機能](https://help.thebase.in/hc/ja/sections/900000345426-HTML%E7%B7%A8%E9%9B%86-App%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)上ですぐに反映できるはずです(2022/6現在)。

## BASEとは
BASEは非エンジニアでも簡単にECサイトをGUI上から作成でき、その手軽さから広く使用されているサービスです。

ですが、[BASEのデザインをカスタマイズする](https://docs.thebase.in/docs/template/)ためには素のHTML/CSSを記述する必要があり、Reactを使用しているエンジニアには大変遠回りの作業になります。

そこで、webpackのhtml-webpack-pluginを使用してBASEのテンプレートを構築できる環境を作成しました。

## BASEの問題点

 1. BASEのテンプレートは[複数のページを単一のHTML](https://docs.thebase.in/docs/template/default/)に書く必要がある → 複数人での開発に向かない
 2. BASEの商品情報等を参照するには本番環境を使用する必要がある → ローカル環境上では実際の値を参照できない
 3. 1・2の問題があるため、[BASEが用意したオンラインエディタ](https://docs.thebase.in/docs/template/guideline/editor)上で開発を行う必要がある

### 1の解決法
`React`を使用し、コンポーネントごとに別ファイルに記述し、`webpack`の`html-webpack-plugin`を使用して１枚のHTMLへ出力する

### 2の解決法
出力するHTMLにはBASEのタグを入れ込む必要があります。しかし、開発環境ではその値を読み取ることができません。なので、開発環境ではモックデータを読み出すように、環境変数によって結果を分岐する関数を用意しました。

以下のように記述すると…
```jsx
<div>
  {baseTag('itemName')}
</div>
```

開発環境では以下のような出力になります。
```jsx
<div>
  商品名１
</div>
```
本番環境では以下のように、BASEの専用タグが出力されます。
```jsx
<div>
  {itemTitle}
</div>
```
baseTag関数が返す値はJSONで管理しています。

### 3の解決法

1・２の問題が解決されたので、プレビューしながらローカルで開発でき、gitで差分管理することができます。
  
  
### 1 補足:どのようにしてReactでHTMLを出力するのか

`webpack`で`html-webpack-plugin`を使用します。
構成などは[hisho/react-static-generator](https://github.com/hisho/react-static-generator)をかなり参考にさせて頂きました。ありがとうございます。

また、`emotion`の[SSR](https://emotion.sh/docs/ssr)機能を使用しているため、jsx内にCSSを記述するとHEAD内の`<style>`へ`emotion`がCSSを書き出してくれます。

BASEはCSSファイルをアップロードすることができますが、一度アップロードしたファイルのバージョン管理などが出来ないため、HTML内にCSSが書き出せるとかなり楽になります。


## 良い点/悪い点

### 良い
 - Reactコンポーネントで記述できる
 - CSSもJSX内に記述できる
 - `webpack-dev-server`でプレビューできる

### 悪い
 - Hooksが使用できない
 - BASEタグの管理が煩雑
 - 画像を埋め込む等はできなかったため画像の管理が大変
ディープラーニングの概要(G検定をまとめる, 2022.6.13)

[「G検定をまとめる」](https://qiita.com/tan0ry0shiny/items/8c6bf6d7c03ae268679a)の記事の項目の一つです。簡単にまとめて後付けしていくスタイルです。
# ディープラーニングの構造
キーワード：活性化関数、誤差逆伝搬、勾配消失、

非線形分離するためにニューラルネットワークの構造が必要です。より精度を上げるためにディープな構造にします。

## 単純パーセプトロン、回帰
線形分離可能
### 参考
https://qiita.com/tan0ry0shiny/items/e0d4233de1e59c4d4c03

## 多層パーセプトロン、重回帰、重み
入力層、隠れ層、出力層の3層のニューラルネットワーク
### 参考
https://qiita.com/tan0ry0shiny/items/343ebe8ed5840603abc8

## 具体例
名前だけ（オートエンコーダー、深層信念ネットワーク）
### 参考
https://qiita.com/tan0ry0shiny/items/fa10bcdd92676db32737

# 学習するとは？重み付けの最適化
キーワード：ファインチューニング、活性化関数、学習率の最適化、テクニック（ドロップアウト、アーリーストッピング、正規化、初期化、バッチ正規化）
重み付けを最適にするためにいろんな方法があります。
One-hotエンコーディング

カテゴリデータを数値に変換
例：性別（男女）を1,0に変換


```python

# One-hotエンコーディング

# One-hotエンコーディング（OneHotEncoder） 
from sklearn.preprocessing import OneHotEncoder
 
# sparse: false =numpyのデータとして結果を取得
ohe = OneHotEncoder(sparse=False)

# 「Suppliers」の列を変換
encoded = ohe.fit_transform(df[['Suppliers']].values)
encoded

# * ラベル変換後の列名を取得
label = ohe.get_feature_names(['Suppliers'])
label

# dfのコピー
df2 = df.copy()

# もともとの「Suppliers」の列を削除
df2 = df2.drop('Suppliers', axis=1)
 
#新たにOne-Hotエンコーディングで得られた列を追加（エンコードした列は転置して追加）
#元データでのSupplierは8つあるので0~7まで追加。
df2[label[0]] = encoded.T[0]
df2[label[1]] = encoded.T[1]
df2[label[2]] = encoded.T[2]
df2[label[3]] = encoded.T[3]
df2[label[4]] = encoded.T[4]
df2[label[5]] = encoded.T[5]
df2[label[6]] = encoded.T[6]
df2[label[7]] = encoded.T[7]
 
df2.head()
PHP7.4でEnumライクなものを実装してみた

|[../](https://qiita.com/taconana/items/3f5424f9abfc755772c2) |
|---|

PHPでもJavaのEnumのようなものを使いたい。最新のPHPでは提供されているようだが、PHP7.4にはなかったのでそれっぽいものを作ってみた。とりあえず、整数の`$ordinal`に対応する文字列を返す関数`value(int $ordinal):string`が提供できていればいいだろう。

```php:Enum.php
<?php
namespace common;

abstract class Enum {
  
  protected static function key(int $ordinal): string {
    return '_' . $ordinal;
  }
  
  abstract static function __initialize();
  abstract static function value(int $ordinal): string;
}
```
このEnumを継承して、それぞれ定義する。例として、アクセス権限(AclRole)を書いてみる。
```php:AclRole.php
<?php
namespace users\domain;
require_once(__DIR__."/../../common/Enum.php");
use common\Enum;

class AclRole extends Enum {
  
  const ACL_USER = 1;
  const ACL_ADMIN = 2;
  
  private static $enums;
  
  public static function __initialize() {
    if (!empty(self::$enums)) return;
    self::$enums = [
        parent::key(self::ACL_USER) => '利用者',
        parent::key(self::ACL_ADMIN) => '管理者'
    ];
  }
 
  public static function value(int $ordinal): string {
    $k = parent::key($ordinal);
    return isset(self::$enums[$k]) ? self::$enums[$k] : '';
  }
}

AclRole::__initialize();
```
利用方法は、以下の感じ。あらかじめ定義した整数値から対応する文字列を取るだけである。
```php
$r1 = AclRole::ACL_USER;
$r2 = AclRole::ACL_ADMIN;
$r3 = 3;
echo AclRole::value($r1).PHP_EOL; 	// '利用者'
echo AclRole::value($r2).PHP_EOL; 	// '管理者'
echo AclRole::value($r3).PHP_EOL; 	// ''
```
単に配列のインデックスだと0,1,2,...のように固定されてしまうので、それは避けたかった。もっといい書き方があるとは思うが、当面はこの程度で使ってみたい。

|[../](https://qiita.com/taconana/items/3f5424f9abfc755772c2) |
|---|
会社のサービスで自分専用のstaging環境を作った

22卒エンジニアしてますみっちーです。
メンターエンジニアの方からインフラ学習用に君専用のstaging環境作っていいよと言われ作ることになりました。

メンターの方の狙いとしては
- 新卒の自分にインフラ知識のキャッチアップ
- 非エンジニア、外部エンジニアの方の動作確認用の環境（こっちがメイン笑）

サービスの規模拡大に伴い関わる人も多くなってきて、staging環境が追加で必要になったため追加で作ることになりました。
自分としては無料でインフラ構築、学習ができてラッキーです。

# やったこと
- AWSのEC2インスタンス、S3、Route53、セキュリティ周り etc...(サーバー構築)
- CircleCIで環境変数とSSHパーミッションを設定、CI側でリポジトリをフォロしているかの確認
- CircleCI 設定ファイル（config.yml、その他三つくらいstging環境と同じもの追加）を作成
- 非エンジニアの方向けに特定ブランチにpush & deployしてくれるスクリプトの作成
- 非エンジニアの方にgithubの勉強会


# つまづいたこと
設定ファイルに苦戦しました。
CIの設定ファイルにはコマンドで読み込む設定ファイルを諸々指定されているらしく、そこあたりの理解が大変でした。

これらのフローやつまずいた箇所については、今後細かく分けて載せていこうと思います。


# 参考サイト
[【使い方】CircleCIとは？EC2にsshしてデプロイ自動化](https://suwaru.tokyo/%E3%80%90%E4%BD%BF%E3%81%84%E6%96%B9%E3%80%91circleci%E3%81%A8%E3%81%AF%EF%BC%9Fec2%E3%81%ABssh%E3%81%97%E3%81%A6%E3%83%87%E3%83%97%E3%83%AD%E3%82%A4%E8%87%AA%E5%8B%95%E5%8C%96/
)
[GitHub + CircleCI + AWSなBuild & Deploy方法ちょっとまとめ](https://tec.tecotec.co.jp/entry/2020/12/16/000000)
[英単語] 次へ進む(next、forward) 前へ戻る(prev、back)の使い分け

# はじめに
英単語を適当に使っていたので調べてみました

# 結論
順序があるかないかで、next,prev,forward,backを使い分ける

# 参考
>順序がある、ページ番号がある遷移はNext,Prev
>繋がりのない別ページや別階層への遷移はForward,Back

https://nishide-h.hatenablog.com/entry/2019/07/15/172425
[Slack] Bolt.js のリトライ対策をちゃんとやる

# 経緯
### 問題発生
slack からイベントが発行されて 3 秒以内に返さないとリトライされてしまうという仕様により、同じ返信を複数回実行してしまう状態になりました。
試行錯誤をしたが、結局自前で用意した Express でリクエストを捌くという強引な方法で強引に乗り切りました。

https://qiita.com/punkshiraishi/items/da07cdb878f46047e090

### 開発者に解決方法を教えてもらう
上記の記事を twitter に投稿したところ、Bolt.js 開発者の方が解決方法を教えてくれました！ありがとうございました！

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">比較的最近追加された機能でドキュメントにちゃんと書いてないのが申し訳ないのですが customPropertiesExtractor というのを使えば request header も context に渡せます。 <a href="https://t.co/YVJW8vnvAp">https://t.co/YVJW8vnvAp</a> <a href="https://twitter.com/hashtag/SlackDevJP?src=hash&amp;ref_src=twsrc%5Etfw">#SlackDevJP</a></p>&mdash; Kazuhiro Sera (瀬良) (@seratch_ja) <a href="https://twitter.com/seratch_ja/status/1533922381550731264?ref_src=twsrc%5Etfw">June 6, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


# 結論

```ts
import { App } from "@slack/bolt";
import { shouldSkip } from "./shouldSkip"

// アプリの設定など
const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET
});

// global middleware。すべての event action command の前に実行される。
app.use(async (args) => {
  const { context, next } = args;

  // リトライされたイベントであればスキップすべきかどうか判断する
  if (context.retryNum && shouldSkip(contenxt)) {
    return;
  }

  await next();
})

// 処理
app.event("message", async ({ say }) => {  
  say("Hello world!");
});

(async () => {
  await app.start(8080);
  console.log("⚡️ Bolt app is running!");
})();

```

bolt.js の API だけを使ってリクエストを上手く処理することができました！
M5Paper: SPIFFS の日本語TTFファイルを利用

SPIFFS (SPI Flash File System) へのコピーの方法はこちら
[M5Paper: 日本語TTFファイルを SD から SPIFFS へコピー](https://qiita.com/ekzemplaro/items/1ef653a24b8ca22998ed)

プログラム

```text:ttf_spiffs.ino
// ---------------------------------------------------------------
//	ttf_spiffs.ino
//
//					Jun/13/2022
// ---------------------------------------------------------------
#include	<M5EPD.h>
#include	<FS.h>

M5EPD_Canvas canvas(&M5.EPD);

// ---------------------------------------------------------------
void setup() {
	M5.begin();
	M5.TP.SetRotation(90);
	M5.EPD.SetRotation(90);
	M5.EPD.Clear(true);

	Serial.print("*** setup ***\r\n");

	canvas.createCanvas(540, 960);
	canvas.setTextDatum(TC_DATUM);
	canvas.setTextSize(3);

	Serial.print("*** Initializing ***\r\n");
	canvas.drawString("... Initializing ...", 270, 640);
	canvas.pushCanvas(0,0,UPDATE_MODE_A2);

	SPIFFS.begin(false);

 // SPIFFSからフォントを読み込む
	canvas.drawString("Loading font ...", 270, 230);
	canvas.pushCanvas(0,0,UPDATE_MODE_A2);
	Serial.println("*** Loading font from SPIFFS. ***\r\n");
	canvas.loadFont("/font.ttf", SPIFFS);
	Serial.println("*** Loading done. ***\r\n");
	canvas.createRender(96, 256);
	canvas.createRender(32, 256);

	canvas.drawString("OK!", 270, 254);
	canvas.pushCanvas(0,0,UPDATE_MODE_A2);

	M5.EPD.Clear(true);
}

// ---------------------------------------------------------------
void loop() {

	String buf;

	canvas.setTextDatum(TL_DATUM);
	canvas.fillCanvas(0);

	buf = "あいうえお かきくけこ";
	canvas.setTextSize(32);
	canvas.drawString(buf, 12, 16);

	buf = "漢字の表示";
	canvas.setTextSize(96);
	canvas.drawString(buf, 12, 64);
	canvas.setTextSize(32);
	canvas.drawString("こんにちは", 12, 300);
	canvas.pushCanvas(0,0,UPDATE_MODE_A2);

	delay(3000);
	canvas.drawString("おはよう", 12, 350);
	canvas.drawString("今晩は", 12, 400);
	canvas.drawString("ありがとう", 12, 450);
	canvas.drawString("さようなら", 12, 500);
	canvas.pushCanvas(0,0,UPDATE_MODE_A2);
	delay(3000);
	Serial.print("*** loop ***\r\n");
}

// ---------------------------------------------------------------
```

Arduino IDE
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/25094bda-9f73-345f-d9e7-ffc0d59739f4.png)

実行結果
![IMG_20220613_093534.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/b9ec91d2-7bd8-89c9-1d6d-225d6ee91b0c.jpeg)
Python環境構築(pyenv+poetry)

Macbookを新調したので，pyenvとpoetryを使ったpythonの環境構築を備忘録的にまとめている．
基本的に公式ドキュメントに従っているだけなので，記事としてまとめる必要はないと思うが，複数台で環境構築する必要が出てきたためチートシート的な要素でまとめた．

# pyenv

[公式ドキュメント](https://github.com/pyenv/pyenv#basic-github-checkout)
## インストール

```bash
 git clone https://github.com/pyenv/pyenv.git ~/.pyenv
```

## パスを通す

```bash
echo 'export PYENV_ROOT="$HOME/.pyenv"' >> ~/.bash_profile
echo 'command -v pyenv >/dev/null || export PATH="$PYENV_ROOT/bin:$PATH"' >> ~/.bash_profile
echo 'eval "$(pyenv init -)"' >> ~/.bash_profile
```

## バージョン確認

```bash
pyenv -v
```

## バージョン関連

pyenv の [Release note](https://github.com/pyenv/pyenv/releases) を見ると現時点では v2.3.1 が最新なので

```bash
git checkout v2.3.1
```

としておく．
アップデートは，[こちら](https://github.com/pyenv/pyenv#upgrading)のように，pullでやっていたが，どうやらプラグインもあるらしい．

# poetry

## インストール

[公式ドキュメント](https://python-poetry.org/docs/)

```bash
curl -sSL https://raw.githubusercontent.com/python-poetry/poetry/master/get-poetry.py | python -
```

## パスを通す

```bash
echo 'export PATH="$HOME/.poetry/bin:$PATH"' >> ~/.bash_profile
```

## バージョン確認

```bash
poetry -V
```

### プロジェクトごとに .venv を作りたい場合

```bash
poetry config --list
```
コンフィグを確認するとvirtualenvs.in-projectがnullなのでtrueにしておく．

```bash
poetry config virtualenvs.in-project true
```

### アップデート
```bash
poetry self update
```

# 環境構築

## インストール可能なバージョンを表示
```bash
pyenv install --list
```
## 特定のバージョンをインストール
```bash
pyenv install xxx
```
(xxxは好きなバージョン)
## バージョンの切り替え

### ローカルの場合
```bash
pyenv local xxx
```
### グローバルの場合
```bash
pyenv global xxx
```

## poetry 環境設定

```bash
poetry init
```

### パッケージの追加
```bash
poetry add yyy
```
(yyyは入れたいライブラリ名)
MacOS 13.0 Ventura (beta)でXcode13以前のバージョンを使う場合

# Xcode13.x以前のバージョンを起動したい

## 改訂
2022/08/17 Xcode13.4.1について

## 検証環境
OS: MacOS Ventura 13.0 Beta（22A5266r）

## 人柱中につき
NDAに則って、画像は載せられません。  
また、詳細も載せられませんが、「Xcodeを開きたい」という情報は問題ないと思います。
他のバージョンでも同じやり方で開けますしね!!

## 結論
ターミナルから開く

https://developer.apple.com/forums/thread/707626


私は様々なバージョンが混在しているので、Xcodeの末尾にバージョン名が付いています。

```shell
open /Applications/Xcode12.app/Contents/MacOS/Xcode
```

```shell
open /Applications/Xcode13.app/Contents/MacOS/Xcode
```

色々とダイアログが出ますが、そのまま進んでいけばOKです。

## Xcode13.4.1について
2022/08/17現在、Xcode13.4.1では上記コマンドでの起動が出来ません。
ConcurrentModificationExceptionが起こる仕組み

すごく渋い記事なんですが、どうしてConcurrentModificationExceptionがどのように起こるのか簡単にメモしておきます。

ArrayListなどが継承しているAbstractListクラスには`protected transient int modCount = 0;` というフィールドがあります。

ArrayListのremove()などにはこのフィールドをインクリメントする処理が書いてあります。


```java
    public E remove(int index) {
...
        modCount++;
// 削除の処理
...
    }
```

またArrayListのforEach()などのメソッドを見ると以下のように最初にmodCountをローカルの変数に保存して、それがループごとに変わっていないかをチェックし、変わっていたらConcurrentModificationExceptionを投げるだけです。

```java
    @Override
    public void forEach(Consumer<? super E> action) {
        // ローカルの変数に保存
        final int expectedModCount = modCount;
...
        // 毎ループmodCountがローカルの変数から変わっていないかを確認して変わっていたらループをやめる
        for (int i=0; modCount == expectedModCount && i < size; i++) {
            action.accept(elementData[i]);
        }
        // 違ったらConcurrentModificationExceptionを投げる
        if (modCount != expectedModCount) {
            throw new ConcurrentModificationException();
        }
    }
```
[2022年]おすすめ機械学習書籍(参考書)

おすすめの機械学習の書籍を紹介します。
プログラミングやIT系の勉強するときはKindleや電子書籍で勉強するのがおすすめです。
***
[Pythonで学ぶ強化学習［改訂第２版］[Amazon]](https://amzn.to/3HjpB1m)
![aa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708198/09216d2a-f511-7ab3-0caf-6e07331cdc6f.jpeg)
「Pythonで強化学習が実装できる!」と好評を得た入門書の改訂版。読者からの要望・指摘を反映させた。主に、Policy GradientとA2Cの記述・実装を見直した。
- Day1 強化学習の位置づけを知る
- Day2 強化学習の解法(1): 環境から計画を立てる
- Day3 強化学習の解法(2): 経験から計画を立てる
- Day4 強化学習に対するニューラルネットワークの適用
- Day5 強化学習の弱点
- Day6 強化学習の弱点を克服するための手法
- Day7 強化学習の活用領域
***
[ゼロからつくるPython機械学習プログラミング入門[Amazon]](https://amzn.to/3mH0wnq)
![a.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708198/56c9ddf7-8953-eec2-4fa2-9dab22d70009.jpeg)
機械学習モジュールが普及することにより、かえって学びづらくなった機械学習アルゴリズムの基本を徹底マスター！
scikit-learnを使わない、numpyとpandasのみのコーディングで、実装力がスキルアップ！
- 第1章 機械学習とは何か
- 第2章 Python入門
- 第3章 数学のおさらい（線形代数、最適化、確率、統計）
- 第4章 回帰分析（線形回帰分析、ロジスティック回帰分析）
- 第5章 分類（線形判別分析、サポートベクトルマシン、ナイーブベイズ法、決定木）
- 第6章 カーネルモデル
- 第7章 ニューラルネットワーク
- 第8章 強化学習
- 第9章 教師なし学習（主成分分析、因子分析、クラスター分析）
***
[ウェブデータの機械学習[Amazon]](https://amzn.to/3Qj8iRS)
![aaa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708198/94df07a2-a3f1-0046-a604-2420efdbecc9.jpeg)
「ウェブ」を知らずして、「データ」を語ることなかれ・機械学習がどのように応用されているかを概観する。・評判分類の学習、単語の意味表現、検索結果の順序学習を重点的に解説。・話題を瞬時に発見するバースト検出やウェブのリンク解析も紹介。
- 第1章　ウェブと機械学習
- 第2章　バースト検出
- 第3章　評判分類の学習
- 第4章　意味表現の学習
- 第5章　グラフデータの機械学習
- 第6章　順序学習
***
[オンライン機械学習[Amazon]](https://amzn.to/3HhR7fx)
![aaaa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708198/22da250b-3764-ff05-3192-188bab6c12ce.jpeg)
誰でもすぐにオンライン機械学習を実践できる即戦力の入門書！オンライン機械学習の基礎から理論、実装、応用、最新手法までをすべて網羅し、明快に解説した。この１冊で、面白いほどよくわかる！
- 第1章 序論
- 第2章 準備
- 第3章 基礎
- 第4章 発展
- 第5章 性能解析
- 第6章 実装
- 付録A
***
[オンライン予測[Amazon]](https://amzn.to/3zypcpS)
![aaaaa.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708198/d33d2260-8f09-7866-951b-7f05bcbff672.jpeg)
絶えず流れる情報を、いかに捉え、いかに学習するか？　広告配信、証券投資、経路探索……いまや豊富な応用分野を擁するオンライン予測。Hedge、OGD、ONSなど多彩なアルゴリズムを理解し、使えるようになる。
- 第1章　エキスパート統合問題
- 第2章　オンライン凸最適化
- 第3章　ランダムネスに基づくオンライン予測
- 第4章　組合せ論的オンライン予測
- 付録A　数学的準備
***
>他の記事
・[[2022年]おすすめ機械学習書籍(参考書)](https://qiita.com/metimeti/items/ad39b4a63e73e841ebb7)
NUXT.JSでHerokuにデプロイした時データが取得できない問題

NUXTの`axios-module`で`BaseURL`は設定が何もないと`http://localhost:3000`になってHeroku上で上手く動いてくれなくなります。
![スクリーンショット 2022-06-12 8.11.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/cef016a0-38d2-18d3-6ce4-034e145d4e23.png)
こちらの部分を`http://XXXXXXXXXXXXXXXXXX.herokuapp.com/api`としたい。
![スクリーンショット 2022-06-13 8.32.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/1ed39581-d166-ceee-904f-d3922cfc3016.png)
`window.location.origin`を付与して、GETできるように致します。　
```ts
this.$axios.$get(window.location.origin + "/api/XXXX");
```
![スクリーンショット 2022-06-13 9.53.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/728b4c23-be42-4a0d-5958-280e970d4075.png)

※ `@nuxtjs/axios`でbaseURL設定するには、nuxt.config.jsに下記のように書き込みます。
```
modules: [
    '@nuxtjs/axios',
  ],

  axios: {
    baseURL: 'http://localhost:8000',
  },
```
このように書き変わります。
![スクリーンショット 2022-06-13 12.42.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/c1d9dce8-c336-1365-4798-2baf516ddbbc.png)

HerokuのBASE_URLの設定を確認して、
![スクリーンショット 2022-06-14 9.36.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/555f0a9d-3127-a211-248f-4e8fd2142851.png)
nuxt.config.jsの設定を書き換えで`BASE_URL`に値(URL)を渡したら、
```nuxt.config.js
 modules: [
    '@nuxtjs/axios',
  ],

  axios: {
    baseURL: process.env.BASE_URL
  },
```


プロダクション環境で動作する設定を下記コマンドで実行し、
```
heroku config:set HOST=0.0.0.0
heroku config:set NODE_ENV=production
```
ルートディレクトリに`Procfile`を追加し`web: nuxt start`を書き込む。
![スクリーンショット 2022-06-13 9.07.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/92d217a1-48b0-f0db-3f51-9a8cbd7dcd4c.png)
Nuxt.jsアプリをHerokuでプッシュしてデプロイすると。
```
git push heroku main
```
切り替わり、無事データが送られるようになったようです。
![スクリーンショット 2022-06-13 9.12.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/59380f9e-3a82-72b7-6436-529e62c00c02.png)
ReactでStoryBookを導入したがアクセスできなかった

## エラーの内容
```
yarn storybookでサーバーを立ち上げた後にアクセスしても接続拒否によってアクセスできない
```

## 原因
dockeｒ内のポートに外部で接続できる設定ができていなかったため
（今回の場合6006ポートが外部から接続できる設定になっていなかった）

## 解決策
docker-compose.ymlファイルに下記記述を追加する

```yml
version: '3'

services:
  frontend:
    build: .
    environment:
      - NODE_ENV=development
    volumes:
      - ./:/usr/src/app
    ports:
      - '3000:3000'
      - '6006:6006' # ←これ
    tty: true
    container_name: react_app
    working_dir: "/usr/src/app"
networks:
  default:
```
### 補足
dockerファイルを編集後は、`$ docker-compose build`でイメージを再構築し、`$ docker-compose up -d`でコンテナを再作成する。
その後、`$ docker ps -a`で確認したときにPORTSが下記のようになっていれば良い

```
PORTS                 
0.0.0.0:3000->3000/tcp, :::3000->3000/tcp, 0.0.0.0:6006->6006/tcp, :::6006->6006/tcp
```


### 反省
dockerの理解がまだまだ足りていないと感じた。
外部からdockeｒ内の仮装環境にアクセスする際はPORTを設定しないといけない（Railsの時も同じとこで詰まった記憶が、、、）

### 参考記事
https://zenn.dev/yknight/articles/f0167dc5b0cceb
さくらのクラウドのサーバーにでVPN接続でローカルIP接続して正規のSSL証明書を使ってブラウザからアクセスする方法

# クラウド上のサーバーに一般のインターネット回線を使わずにVPNでつないでローカルIPアドレスで接続したい場合

1 VPCルーターでIPSecで接続する設定をしてさくらのクラウドに接続

2.サーバーインスタンスにNICを２つ設定
ひとつはグローバルIPアドレスを割り当て、
もう一つはVPCルーター経由でつなぐためにローカルIPを割り当てる。

2 DNSにサーバーのグローバルIPを登録
たとえば
my-local.foobaa.com211.99.99.999だとすると、
さくらのクラウドのDNSにmy-local.foobaa.comを211.99.99.999登録する。

3.グローバルIPアドレスの設定の状態でSSL証明書を取得
グローバルIPアドレスで公開されているので、ドメイン認証型のSSL証明書の発行が可能。
わたしはjPRSでSSL証明書を取得しました。

4.SSL証明書をサーバーに設定する
一般的な証明書発行手順になるので、割愛します。

5 DNSにサーバーのローカルIPを登録
たとえばmy-local.foobaa.comが192.168.42.88だとすると、
さくらのクラウドのDNSにmy-local.foobaa.comを192.168.42.88登録する。
AWSのRoute53でも同じ用にローカルIP設定出来るんじゃいかな。やってないけど。

6.VPN接続してローカルIPを使ってサーバーにHTTPSで接続する
SparkデータフレームにおけるSelectとExpr

[Select Expr in Spark Dataframe \| Analyticshut](https://analyticshut.com/select-expr-spark-dataframe/)の翻訳です。

:::note warn
本書は抄訳であり内容の正確性を保証するものではありません。正確な内容に関しては原文を参照ください。
:::

SelectとExprは、Sparkデータフレームで最も使用される関数の一つです。本ブログでは、selectとexpr関数を用いて行えるさまざまなことを学びます。

# データフレームからカラムを選択する

これはデータフレームに対して最も使用される機能の一つであり、これを行うためには`expr`とSelectを使用します。`expr`関数を使う前に、インポートする必要があります。

```py:Python
df_csv = spark.read.format("csv") \
        .option("inferSchema", "true") \
        .option("header","true") \
        .load("data/flights.csv")
# selecting columns
from pyspark.sql.functions import expr
df_csv.select(expr("count")).show(2)
```

# カラムデータに対するオペレーション

より面白い`expr`のユースケースは、カラムデータに対してさまざまなオペレーションを実行するというものです。これによって、カラムの長さを取得したり、データを抽出したり、その他SQLでできるすべてのことが可能となります。

```py:Python
df_csv.select(expr("count"), expr("count > 10")).show(2)
+-----+------------+
|count|(count > 10)|
+-----+------------+
|   15|        true|
|    1|       false|
+-----+------------+
```

上のコードでは、カラムのフィールドが10より大きいか否かを表示しています。このカラム名はユーザーフレンドリーではないことが分かるかと思います。SQLと同じように、使いやすいカラム名を指定します。

```py:Python
df_csv.select(expr("count"), expr("count > 10 as if_greater_than_10")).show(2)
```

# Exprによるエイリアスの使用

カラムにユーザーフレンドリーな名前を指定するために`Alias`関数を使用します。

```py:Python
df_csv.select(expr("count"), expr("count > 10").alias("if_greater_than_10")).show(2)
```

# Exprを用いた全カラムの選択

データフレームからの他のカラムと、新たに作成した表現式のカラムを選択する必要があるかもしれません。これは非常に簡単です。カンマ区切りのカラムのリストや、データフレームの全てのカラムをリストするために`*`を使用することができます。

```py:Python
df_csv.select("*", expr("count > 10").alias("if_greater_than_10")).show(2)
```
![](https://cdn.shortpixel.ai/spai/w_746+q_glossy+ret_img+to_webp/https://analyticshut.com/wp-content/uploads/2020/08/select_all_colums_expr.png)
Exprを用いてデータフレームの全ての列を選択

# ExprとAliasによるカラムの名称変更

データフレームのカラムの名前を変更するためにExprを使用することができます。これは実際にはカラムの名称を変更するのではなく、新たなカラムを作成します。

```py:Python
df_csv.select("*", expr("DEST_COUNTRY_NAME").alias("dest")).show(2)
+-----------------+-------------------+-----+-------------+
|DEST_COUNTRY_NAME|ORIGIN_COUNTRY_NAME|count|         dest|
+-----------------+-------------------+-----+-------------+
|    United States|            Romania|   15|United States|
|    United States|            Croatia|    1|United States|
+-----------------+-------------------+-----+-------------+
```

# SelectExpr - selectとexprのショートカット

SelectとExprは、Sparkデータフレームを操作する際に広く使用されており、Sparkチームは簡単にそれらを利用できるようにしています。`selectExpr`関数を使うことができます。

```py:Python
df_csv.selectExpr("count", "count > 10 as if_greater_than_10").show(2)
df_csv.selectExpr("*", "DEST_COUNTRY_NAME as dest").show(2)
```

これが有用であれば幸いです。次に記事でお会いしましょう。
100日後くらいに個人開発するぞ！day044

## 今日はnilとハッシュの配列を学んでみた！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2632394/f74c101b-4ae7-bcd9-c489-dea43ffe6351.png)



## 今日の学び
### nil
* nil：「何もない」という意味の値で「ニル」と読む

### nilを利用したif文
* ifの条件文で指定した値がない場合はnilになるため、else側の処理が実行される
    * 例：userの年齢情報がない場合に「〜さんの年齢は秘密です」と出力したい場合
        * `user=[name:"Yamada"]`
        * `if user[:age]`
        * ` puts "#[user[:name]さんは#[user[:age]]歳です"`
        * `else`
        * `puts "#[user[:name]さんの年齢は秘密です"`


### 要素がハッシュである配列の作り方・使い方
* 配列の要素にはハッシュも使うことができる
    * [[キー1:値1],[キー2：値2]]
* コードが横に長くなることを防ぐために要素ごとに改行することがある
    * 例
        * `users=[`
        * `[name:"Yamada",age:21]`
        * `[name:"Tanaka",age:24]`
        * `]`
* 配列の要素がハッシュでも配列[インデックス番号]を使って出力できる
* 配列の中のハッシュの値を出力するには`配列[インデックス番号][キー]`で可能
    * 例：インデックス番号が1のnameキーを出力したい場合
        * `users=[`
        * `[name:"Yamada",age:21]`
        * `[name:"Tanaka",age:24]`
        * `]`
        * `puts users[1][:name]`

### ハッシュが値の配列でeachを使う場合
* ハッシュが値の配列でeachを使うと指定した変数にハッシュ要素が順番に代入される
    * 例：usersをuserに代入してnameキーのみ出力したい場合
        * `users=[`
        * `[name:"Yamada",age:21]`
        * `[name:"Tanaka",age:24]`
        * `]`
        * `users.each do |user|`
        * `puts user[:name]`