OmniAICreator/Qiita-1.07M huggingface dataset:
ROS講座125 Unity-ROS#でカスタムmsgを使う

# 環境
この記事は以下の環境で動いています。

| 項目 | 値 |
|:-:|:-:|
| CPU | Core i5-8250U |
| Ubuntu | 18.04 |
| ROS | Melodic |
| Gazebo | 9.0.0 |
| python | 2.7.17 |

Unityの動作環境は以下です。

| 項目 | 値 |
|:-:|:-:|
| ホストマシン | Windows10 |
| Unity | 2019.4 |

インストールについては[ROS講座02 インストール](https://qiita.com/srs/items/e0e0a9dc3f94c2d3348e)を参照してください。
またこの記事のプログラムはgithubにアップロードされています。[ROS講座11 gitリポジトリ](https://qiita.com/srs/items/25a56a6abda41dcf396e)を参照してください。

# 概要
今までUnityのROS#でROSと標準で用意されているmsg（geometry_msgs、sensor_msgsなど）の型をやり取りしてきました。今回は独自に作成したROSの型で通信を行ってみます。

# ROS#で標準で用意されている型の確認方法
std_msgsなどの標準の型も定義ファイルがあるのですが、すべてビルドされてDLLになっています。ソースは[ROS#のリポジトリ](https://github.com/siemens/ros-sharp/tree/master/Libraries/RosBridgeClient/MessageTypes)で確認できます。

# 独自の型を使う
使い方としてまず独自の型の定義ファイルを生成して、それをスクリプトで使用します。リンクのチュートリアルにあるように、このファイルの生成方法は何通りかあるのですが、ROS#に付属のGUIを使って生成していきます。今回はROS講座で使っている`ros_lecture_msgs`パッケージの`Custom.msg`を変換して使用します。

## msgの定義ファイルの生成

* msgファイルが入っているROSパッケージをWindowsにコピーします。
* メニューバーの「RosBridgeClient」->「Auto Generate Message」->「Package Message」を選択します。
![unity_custom_msg_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254442/6f49af6a-3a52-38f7-aaf0-8ac25a57299a.png)

* 出てくるGUIでPackage PathとPackage Nameを正確に入れます。
* 「Generate」を押します。この時に警告が出ますがとりあえず無視します。

![unity_custom_msg_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254442/d1677bad-f2b0-7a19-4178-e86babfb555c.png)

* 「Assets/RosSharpMessages/RosLecture/msg/Custom.cs」が生成されます。

## 上記のファイルの使い方

上記のCustom.msgをUnity側からPublishしていきます。

### スクリプトの作成
以下のようなスクリプトを作成します

```cs:scripts/CustomPublisher.cs
using UnityEngine;

namespace RosSharp.RosBridgeClient
{
    public class CustomPublisher : UnityPublisher<MessageTypes.RosLecture.Custom>
    {

        protected override void Start()
        {
            RosConnector ros_connector = GetComponent<RosConnector>();
            ros_connector.IsConnected.WaitOne(ros_connector.SecondsTimeout * 1000);
            base.Start();
        }

        private void FixedUpdate()
        {
            MessageTypes.RosLecture.Custom message;
            message = new MessageTypes.RosLecture.Custom();
            message.word = "custom msg";
            message.number = 42;
            Publish(message);
        }
    }
}
```

* メッセージの型はMessageTypes.RosLecture.CustomのようにMessageTypes.{パッケージ名から_msgsを抜いてキャメルケースにしたもの}.{msg名}になります。
* あとは標準のmsgと同じように`Publish()`でpublishができます。

## スクリプトのアタッチ

* 空のゲームオブジェクトを生成します。
* これに`Assets/RosSharp/Scripts/RosBridgeClient/RosCommuncation/RosConnector.cs`をアタッチ、urlを記入します。
* 上記で作った`scripts/CustomPublisher.cs`をアタッチ、topicを記入します。

# 実行
* ROS(Ubuntu)側では以下のように実行します。

```shell:rosbridgeの起動
roslaunch rosbridge_server rosbridge_websocket.launch
```

* Unityの「Play」ボタンを押します。

するとROS側で以下のようにSubscribeできます。

```
$ rostopic echo /custom
word: "custom msg"
number: 42
```

# 参考
[ROS#チュートリアル](https://github.com/siemens/ros-sharp/wiki/Dev_NewMessageTypes)

# 目次ページへのリンク
[ROS講座の目次へのリンク](https://qiita.com/srs/items/5f44440afea0eb616b4a)
Flutter（Dart）でRealtimeDatabaseを使う

# はじめに
最近、バージョン２にアップグレードされたFlutterで遊んでいます
そこで、RealtimeDatabaseで躓いたので、メモ代わりにおいておきます

#FireStore使えばいいじゃん
Firebase＋Flutterでデータベースを扱う場合、FireStoreかRealtimeDatabaseになるわけなのですが
Qiitaの記事を見ても新しいFireStoreばっかりでRealtimeDatabaseに関する記事が少ないです。。。
しかし、FireStoreの読み取り回数の無料枠の低さたるや、、、
FireStoreだと直ぐに無料枠超えるので、RealtimeDatabaseを使いたい！ってことです

#どんなデータ？
下記のようなデータが入っているデータベースからデータを取り出す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/911989/03b114ba-6a63-4612-bf2c-f493f7c4ef01.png)

set(Insert)、updateは別に躓かなかったので今回は書かない


#実際のコード
```dart:sample.dart
//ここまではFireStoreと同じ
var ref = FirebaseDatabase.instance.reference();

//onceはFireStoreでいうところの、get();
Future<DataSnapshot> products = ref.child('product/').once();

List<dynamic> productList = [];
//prodcutの子要素は配列なのでMap<dynamic, dynamic>に変換してforeachする
(snapshot.data.value as Map<dynamic, dynamic>).forEach((key, value) {
   //RealtimeDatabaseから取り出したデータは、Jsonではない何かなので、Jsonに変換する
   var json = new Map<String, dynamic>.from(products.value[key]);
   //リストに突っ込む
   productList.add(json);
});
```


# 参考文献
- [firebase_database 6.1.1](https://pub.dev/packages/firebase_database/example)
HTML/CSS displayを調べた

# displayの種類

- none
- block
- inline
- inline-block

# none

画面から消えます。
サイズ自体もとりません！

# block

divが持つようになるデフォルトです。（タグによってデフォルト値が異なる場合があります。）
基本的にはwidthが100％がされるようにします。
簡単に言うと、横の行をすべて占めるようになります。

```html
<style>
  .block1{ display: block; background-color: yellow;}
  .block2{ display: block; background-color: green;}
</style>

<div class="block1">1</div>
<div>初めまして、自分はうにです。</div>
<div>初めまして、<div class="block2">自分はうにです。</div></div>

```

![dfawdf.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421654/f7c4c24d-8732-b2e1-29bd-bf58d71463fe.jpeg)


# inline

コンテンツをぴったり包む程度の大きさしかありません。
blockとは違って、改行がされておらず、widthとheightを指定することはできません。

```html
<style>
  .block1{ display: inline; background-color: yellow;}
  .block2{ display: inline; background-color: green;}
</style>

<div class="block1">1</div>
<div>初めまして、自分はうにです。</div>
<div>初めまして、<div class="block2">自分はうにです。</div></div>

```

![defdgfd.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421654/210700ff-49f2-ac9b-7a0b-cffd43d29bde.jpeg)


# inline-block

inlineとblockの特性を持っている
基本的にはinlineの属性を持っているが、任意のサイズを変えることができる。
ちなみにExplorer7以下では使用できません！

```html
<style>
  .block1{ display: inline-block; background-color: yellow; width: 130px;}
  .block2{ display: inline-block; background-color: green; width: 40px; height: 100px;}
</style>

<div class="block1">1</div>
<div>初めまして、自分はうにです。</div>
<div>初めまして、<div class="block2">自分はうにです。</div></div>

```

![fdbdhgfhd.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421654/dc65b68f-5eb2-6fba-cb05-a95dc8a74e56.jpeg)
java script 学習2

##if構文##

・条件の分岐を表す際に使用する。基本の構文は以下の様になる。

````
if(条件式）{
  条件がtureの際の処理;
}
````

例文としては以下の様になる

````
let num = 4 ; 

if(num % 2 === 0){　　//条件式　sumが2の倍数の時
console.log(`true`);　//trueと出力
}
//結果tureと出力される。
````


##else ##

・if文にて条件式が成り立たない際に行う処理を設定する。基本の構文は以下の通り

````
if(条件式）{
  条件がtureの際の処理;
} else{
  trueの条件が成立しなかった時の処理;
}
````

例文は以下のようになる

`````
let sum =5; 

if(num % 2 === 0){　　//条件式　sumが2の倍数の時
console.log(`true`);　//trueの処理
}else{
 console.log('fales'); //falseの処理
}

````

##else if##
条件分岐の条件を追加する際に使用する。基本構文は以下の通り

````
if(条件式）{
  条件がtureの際の処理;
} else if (条件式）{
  trueの条件が成立しなかった時の処理;
}else{
 上記条件の全てが成立しなかった時の処理
}
````

例文

````
let sum =5; 

if(num % 3 === 0){　　//条件式　sumが3の倍数の時
console.log(`great`);　//trueの処理
}else if(num % 2 === 0){ //else ifの条件式
 console.log('good'); //else ifの処理
}else{
 console.log('oh...');//全てfalesだった時の処理
}
````

以上が基本的なif文の構文である。

条件分の表記方法については比較演算子がよく用いられるので、次回は比較演算子についてまとめたい。
alias の中身を調べる

# やりたいこと

**alias で実際に実行されているコマンド本体が知りたい**

いつもは alias で実行しているけど、
「あれ、実体って何やってるんだっけ」
みたいになることがあるので、それをぱぱっと調べたい

# 方法

`type なんとか` でできるらしい

```fish
> type {alias}
```

## 実行例

```fish
> type gcd
type gcd
gcd is a function with definition
# Defined in - @ line 1
function gcd --wraps='cd (ghq root)/(ghq list | fzf)' --description 'alias gcd=cd (ghq root)/(ghq list | fzf)'
  cd (ghq root)/(ghq list | fzf) $argv;
end
```
(いつもこれでリポジトリの移動をしてる)

## alias が登録されていなかったら

これも便利

```fish
> type git
git is /usr/bin/git
```

# 参考

https://askubuntu.com/questions/102093/how-to-see-the-command-attached-to-a-bash-alias
Python/C APIを読む その7(Py_Initialize)

#概要
Pythonの構造を理解する助けとして、C APIのドキュメントを読み砕いていく。

#内容
##環境
Python 3.9 (CPython)に話を固定したいが、必ずしもそうはならない。
[tree](https://github.com/python/cpython/tree/a144feeb7ec501aaf30072d50e70d54b200e5ef0)   ([コミット](https://github.com/python/cpython/commit/79373951b3eab585d42e0f0ab83718cbe1d0ee33); [ブランチ](https://github.com/python/cpython/tree/3.7))
(↑　githubのリンク)

###＜概説＞
Pythonインタプリタを初期化する。
Pythonの埋め込みを行うアプリケーションでは、他のあらゆるPython/C APIを使用するよりも前にこの関数を呼び出さなければならない。

この関数はロード済みモジュールのテーブル(`sys.modules`)を初期化し、
基盤となるモジュール群、`builtins`,`__main__`,`sys`を生成し、
モジュール検索パス(`sys.path`)も初期化する。
###＜定義＞
```c:定義　(cpython/Python/pylifecycle.c)
void
Py_Initialize(void)
{
    Py_InitializeEx(1);
}
```
([定義出典](https://github.com/python/cpython/blob/94faa0724f8cbae6867c491c8e465e35f4fdbfbb/Python/pylifecycle.c#L1205))


###＜使用例＞
```c:使用例　(cpython/Programs/_testembed.c)
    Py_Initialize();
```
([使用例出典](https://github.com/python/cpython/blob/307745aa42196ad3fd97fee4a1ae6496bb895596/Programs/_testembed.c#L28))

##蛇足
```c:Py_InitializeEx　(cpython/Python/pylifecycle.c)
void
Py_InitializeEx(int install_sigs)
{
    PyStatus status;

    status = _PyRuntime_Initialize();
...
    _PyRuntimeState *runtime = &_PyRuntime;
...
    PyConfig config;
    _PyConfig_InitCompatConfig(&config);

    config.install_signal_handlers = install_sigs;

    status = Py_InitializeFromConfig(&config);
    if (_PyStatus_EXCEPTION(status)) {
        Py_ExitStatusException(status);
    }
}
```

#参考にさせていただいた本・ページ
- https://github.com/python/cpython/
- https://docs.python.org/ja/3/c-api/init.html#c.Py_Initialize

#感想
バージョンが混ざってしまっているが、雰囲気を掴みたかっただけなので、そこは厳密にはしなかった。
使用例については、CPythonの中で用いられているものに限定した。
paizaをやり始めのRuby初学者がググりながら学んだ色々な記述方法

#「動くからいいや」ではなく「可読性」「メンテナンスのしやすさ」が大事

Railsに頼り過ぎていて今までRubyの基本的な文法すら満足に扱っていなかったのだなと痛感させられました。
知っている人からすれば当たり前かもしれませんが、温かい目で見守ってください！
また、もっとこうした方がより実践的だという意見があればコメントで教えていただけると嬉しいです。

##埋め込みRuby

文字列の中にRubyの式や変数を埋め込める。

```
name = "太郎"
puts "こんにちわ！私は#{name}です！"

=> "こんにちわ！私は太郎です！"
```

ダブルクォーテーション（"")じゃないとRubyが展開されないので注意です。


##後置if

例えば以下のようなfalse側がいらないif文がある時

```
if true
  "trueでhoge"
end

=> "trueでhoge"
```

こういう時は以下のように一行で書くことができます

```
hoge = "trueでhoge" if true
puts hoge

 => "trueでhoge"
```

##三項演算子

例えば以下のような普通のif文があるとき、

```
if true
  puts("trueでhoge")
else
  puts("falseでhuga")
end
```

このような if~else~end で終わるようなif文であれば一行で以下のように書くことができます。

```
true ? puts("trueでhoge") : puts("falseでhuga")
```

##配列に入れ込む

```
n = []

5.times { n.push gets.to_i }

puts n.min
```

上記の例だと配列に数字を5回いれ、最小の値を取り出すことができます。


##%配列(Array)記法

%w(小文字) 配列を作る。配列の要素はスペース区切りで指定する。式の展開はされない。
%W(大文字) 配列を作る。%w()と違い、式が展開がされる。


%wを使った例。

```
a=["a","b","c"]
b=%w(a b c)

puts a
puts b

=> ["a", "b", "c"]
=> ["a", "b", "c"]
```

%Wを使った例。

```
rails='Ruby'
react='JavaScript'

array=%W(#{rails} #{react} PHP)
puts array

=> ["Ruby", "JavaScript", "PHP"]
```

##{}
ブロックは do~end で書くことが多いかもしれませんが {} を使って一行で書く時に読みやすくすることができる。

```
%w(dog cat monkey).each do |animal|
  puts animal
end
```

↓↓↓

```
%w(dog cat monkey).each{ |animal| puts animal }
```

この二つはどちらも同じ結果を返します。
do が 「 { 」に、 end が「 } 」 に置き換わっただけです。
ブロックの中身が短く単純な時に便利です。

```
[1, 2, 3, 4].select { |item| item % 2 == 0 }

=> [2, 4]
```

上記のように select や any? など配列、ハッシュを扱うメソッドを使う時によく見られます

##多重代入

```
foo, bar = [1, 2]       # foo = 1; bar = 2
foo, bar = 1, 2         # foo = 1; bar = 2
foo, bar = 1            # foo = 1; bar = nil

foo, bar, baz = 1, 2    # foo = 1; bar = 2; baz = nil
foo, bar = 1, 2, 3      # foo = 1; bar = 2

foo      = 1, 2, 3      # foo = [1, 2, 3]
*foo     = 1, 2, 3      # foo = [1, 2, 3]
foo,*bar = 1, 2, 3      # foo = 1; bar = [2, 3]
```

```
#右辺が , 区切りで複数ある場合には配列に変換される
a=1,2,3,4
#左辺も , 区切りで複数ある場合には配列に変換された上で、左辺の各変数に右辺の各要素が代入される
b,c="apple","banana"

puts a
puts b
puts c

=> [1, 2, 3, 4]
=> "apple"
=> "banana"
```

##~map(&:to_i)

```
a = ["1", "2", "3"].map(&:to_i)

puts a

=> [1, 2, 3]
```

mapメソッドはブロック付きメソッド。
ブロック付きメソッドの引数には、ブロックを渡す必要があるが
to_procメソッドを持つオブジェクト（この場合だとto_i）の前に、&をつけることでmapメソッドの引数としても渡すことができる。


##最後に

まだまだpaizaを学習中なので新しいことを学んだら随時追加していきます！
Defoldをアップデートしよう！

# はじめに
今回はDefoldのアップデート方法を紹介します。
Defoldは2週間に1回は確実にアプデがきます。そういう開発基準になっているみたいです。
ただ、実際には週に何回もアプデが来たり、1日に何回も来たりするのでめちゃくちゃ多いです。

# アプデの目印
Defoldにアプデが来ると、画面に**「Update Available」**と表示されます。(画像の赤枠内)
![2021-03-27_21h21_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/8221eda2-101c-3b74-4152-ab478a7eba6a.png)
![2021-03-27_21h21_09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/6f08e577-4e7b-c897-c0e5-b157cf8d2b3e.png)
この文字が見えたらアップデートが利用できます。

# アプデしてみる
アプデ方法は簡単で、さっきの**「Update Available」**をクリックすればOKです。
するとこんな画面が出てきます。
![2021-03-27_21h24_26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/993d8746-a6e8-7161-2d68-5b61b55c3a77.png)
**「Download Update」**を押せばダウンロードできます。
アップデートを開始すると同じ場所に進捗表示のバーが表示されます。
![2021-03-27_21h25_28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/1dd0affa-d0f4-5beb-c17a-bf898aad0c31.png)
アップデート中にも、ゲーム製作を進めたりできるので安心です。
アップデートが終わると、今度は**「Restart to Update」**のボタンが表示されるのでそれをクリックします。
![2021-03-27_21h27_28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/9553f93b-3949-da8f-d7da-1f6aa57d4bff.png)
コレに関しても **「Install and Restart」** で大丈夫です。
ただ、再起動されるので、ゲーム製作を続けている人は一度プロジェクトを保存してからボタンを押してください。
![2021-03-27_21h29_52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/620977/925f2d24-28b7-42bb-3d5a-fca27c2cf03f.png)
これだけです。

# アプデできないとき
久しぶりに開いたときなど、Defoldを長期間アップデートしていない状況だとDefold内からはアプデできないことがあります。
そういうときは、もう一度[ダウンロード](https://qiita.com/nonzu/items/eae176d34a6766d7c75b)をすると普通に動きます。

# おわりに
今回は、前回できなかったDefoldのアプデに関して説明してみました。
簡単でしょ？？
次回は、ゲームを作るときに必要な要素を紹介します。
[Defold目次](https://qiita.com/nonzu/items/73a39368855f3e1e0f28)
Roo / Ruby on Rails Gem 日本語訳(2)

今回実務で扱ったRubyonRailのGem`Roo`についてまとめました。
**ソースコード: https://github.com/roo-rb/roo**

**→[Roo / Ruby on Rails Gem 日本語訳(1)](https://qiita.com/tako_tako/items/6d2aaaa35ccc21fb478e)
→[Roo / Ruby on Rails Gem 日本語訳(3)](https://qiita.com/tako_tako/items/6ec09ccf3d808479ca01)**

# 投稿動機
→実務で扱ったGemを復習する
→Githubなどのソースコードにビビらないようになりたい
→将来実務で英語を使いたいので、そのポートフォリオの一環として作成したい

**また、最後にも記載しますが著作権に関して疎いので、この記事が著作権違反にあたらないと認識して投稿しています。
なので、著作権を侵害するつもりもありませんし、もし著作権違反になるようであればすぐにこの投稿を削除します。**

**I will mention at the end, I am not familiar with copyright, so I am posting this article recognizing that it does not violate copyright.
So I don't intend to infringe copyright, and if it does, I'll delete this post immediately.**

# Roo
##スプレッドシートの読み取り
`each文`を使用して、`row`を読み取ります。
each文がcolumnの名前を引数としてhashを渡すと、rowにcolumを対応させた形で返します。

```
sheet.each(id: 'ID', name: 'FULL_NAME') do |hash|
  puts hash.inspect
  # => { id: 1, name: 'John Smith' }
end
```
`:headers`オプションを使用すると`header`を含んでメソッドを使用できます

```
sheet.parse(headers: true)
```

`:header_search`オプションを使用すると、`header`と一致したheaderの名前を探せます。

```
sheet.parse(header_search: [/UPC*SKU/,/ATS*\sATP\s*QTY\z/])
```

`clean`オプションを使用して、制御文字と周囲の空白を取り除きます。

```
sheet.parse(clean: true)
```

`cell`が統合されているドキュメントを開く場合、`nil`を返さないようにする。

```
xlsx = Roo::Excelx.new('./roo_error.xlsx', {:expand_merged_ranges => true})
```

###スプレッドシートに書き出す
`Roo`では下記のようなシートにデータを書き出すことができます。

```
sheet.to_csv
sheet.to_matrix
sheet.to_xml
sheet.to_yaml
```

### Excel (xlsx and xlsm)
`row`をExcelファイルから取り出す場合

```
xlsx = Roo::Excelx.new("./test_data/test_small.xlsx")
xlsx.each_row_streaming do |row|
  puts row.inspect # `Excelx::Cell`の配列
end
```

デフォルトでは空白の`cell`は配列から弾かれます。もしそのままにしたい場合、`pad_cells:`オプションを使用します。

```
xlsx.each_row_streaming(pad_cells: true) do |row|
  puts row.inspect # `Excelx::Cell`の配列
end
```

もし限られた部分のみの`row`を読み込む場合は、`offset`オプションを使用します。

```
xlsx.each_row_streaming(offset: 1) do |row| # `header`である最初の`row`は飛ばします。
  puts row.inspect # `Excelx::Cell`の配列
end
```

```
xlsx.each_row_streaming(max_rows: 3) do |row| # 4つの`row`が追加されます。
  puts row.inspect # `Excelx::Cell`の配列
end
```

`row`に対して`each文`を繰り返す

```
xlsx.each_row do |row|
  ...
end
```

`Roo::Excelx`は下記のような便利なメソッドを使えます。

```
xlsx.excelx_type(3, 'C')
# => :numeric_or_formula

xlsx.cell(3, 'C')
# => 600000383.0

xlsx.excelx_value(row,col)
# => '600000383'

xlsx.formatted_value(row,col)
# => '0600000383'
```

`Roo::Excelx`は下記のようなタイプにアクセスできます。
`celltype`, `comments`, `font information`, `formulas`, `hyperlinks`, `labels`

```
xlsx.comment(1,1, ods.sheets[-1])
xlsx.font(1,1).bold?
xlsx.formula('A', 2)
```

**→[Roo / Ruby on Rails Gem 日本語訳(1)](https://qiita.com/tako_tako/items/6d2aaaa35ccc21fb478e)
→[Roo / Ruby on Rails Gem 日本語訳(3)](https://qiita.com/tako_tako/items/6ec09ccf3d808479ca01)**

## 最後に
**著作権に関して疎いので、この記事が著作権違反にあたらないと認識して投稿しています。
なので、著作権を侵害するつもりもありませんし、もし著作権違反になるようであればすぐにこの投稿を削除します。**

**I am not familiar with copyright, so I am posting this article recognizing that it does not violate copyright.
So I don't intend to infringe copyright, and if it does, I'll delete this post immediately.**
MySQL EXPLAINを調べた

# MySQL Explain

MySQL Explainとは、DBがデータを探す一連の過程を人が読みやすくDB結果セットに示すもの。
MySQL Explainを使って、既存のクエリをチューニングすることができるだけでなく、インデックス戦略策定などのパフォーマンスの最適化のための全般的な業務を処理することができる。

# 使い方

```
EXPLAIN [EXTENDED] SELECT ... FROM ... WHERE ...
```

| 項目       | 説明        |
|------------|-------------|
| id| select IDでSELECTを区別する番号       |
| table	     | 参照するテーブル      |
| select_type	| selectのタイプ      |
| type	| タイプ       |
| possible_keys	| データを照会するときDBで使用できるインデックスリスト          |
| key	| 実際に使うインデックス     | 
| key_len	    | 際に使うインデックスの長さ     | 
| ref	| 中のインデックスと比較するカラム     | 
| rows	    | クエリの実行時に調べる行     | 
| extra	| 追加情報     | 

# 出力結果(例)

```
********************** 1. row **********************
           id: 1
  select_type: SIMPLE
        table: categories
         type: ALL
possible_keys: NULL
          key: NULL
      key_len: NULL
          ref: NULL
         rows: 4
        Extra: 
1 row in set (0.00 sec)
```



# select_type	

SIMPLE : サブクエリや「union」がない最も単純なselect文
PRIMARY :最も外側のselect文
DERIVED :from文の中にあるサブクエリのselect文
SUBQUERY :最も外側のselect文のサブクエリ
DEPENDENT SUBQUERY : 基本的にSUBQUERYのようなタイプで、最も外側のselect文に「依存性」を持つサブクエリのselect文
UNION : union問い合わせ第二select文
DEPENDENT UNION : 外クエリに依存性を持つunion問い合わせ第二select文

# type	    

system：0個または1つのrowを持つテーブル
const：テーブルに条件を満たしているレコードが一つであるとき、定数扱い
eq_ref：primary keyやunique not null columnに生成されたインデックスを使用して、結合している場合 
ref：インデックスで指定されたカラム同士の '='、 '<=>'などの演算子を使用した比較で行われる結合
unique_subquery：1つの結果だけを返す 'IN'が含まれているサブクエリの場合
index_subquery：unique_subqueryと似ていますが、複数の結果を返す
range：特定の範囲のrowsをマッチングさせるインデックスが使用されている場合。 BETWEENやIN、 '>'、 '> ='などが使用される
all：結合時にすべてのテーブルのすべてのrowをスキャンする場合である。もちろん性能が最も良くない。

# extra

| 項目       | 説明        |
|------------|-------------|
| using index| カバーリングインデックス、インデックスデータ構造を利用してデータを抽出       |
| using where| where条件でデータを抽出。typeがALLあるいはIndxタイプと一緒に表現すると、性能が良くないことを意味      |
| using filesort	| データの並べ替えが必要な場合に、メモリやディスク上でのソートの両方を含む。     |
| using temporary	| クエリ処理時に内部的にtemporary tableが使われる場合を意味する       |
Self-supervised learning: The dark matter of intelligence を読む

#Self-supervised learning: The dark matter of intelligence を読む

以下で公開されている記事
https://ai.facebook.com/blog/self-supervised-learning-the-dark-matter-of-intelligence/

Written By
Yann LeCun
VP and Chief AI Scientist

Ishan Misra
Research Scientist

#導入部

## 引用（一部の日本語訳(DeepL)）

記事の導入部の一部を日本語訳(DeepL)で示す

>常識とは、人が新しい技術を習得する際に、一つ一つの作業に対して大量の教えを必要としないことです。例えば、小さな子どもに牛の絵を数枚見せれば、どんな牛でも見分けられるようになります。

・・・

>それは、人間が過去に得た「世界がどのように機能するか」という背景知識に依存しているからです。

## 引用に対するコメント

人は、単なる画像データ等でなく、総合的な経験的な入力で、賢くなっている気は、確かにしますね。

**しかし、一方、（話がずれるが）上記のDeepLの翻訳力をみると、、、
すでに、深層学習が得ているものも、なんとも言えないレベルに到達しているとも言える気もする。**
（あるレベルを超えると、一気に、認められるというか。。。）




#まとめ
記事の内容自体は、面白そうだが、理解できそうにないので、、、、
まずは、導入部ののみ、単に、紹介。
（当たり前だが、アウトプットがわかりやすいものは、すぐに解説記事が出るが、こういうのは、単独ではあまり紹介されることがない気がする。）
【初心者でもわかる】box-shadow以外で影を付ける方法

#どうも7noteです。影はbox-shadowやtext-shadow以外でも付けることができます！

影を付けるなら以下の2つのプロパティが一般的です。

「一般的な影のつけ方」
・ box-shadow
・ text-shadow


これ以外でも影を再現する方法がいくつかあるので紹介。

## シンプルな影を作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/b4e696fb-b6a6-d9c0-777f-b90d51a45c62.png)

```style.css
.card {
  color: #fff;                      /* 文字色を白に指定 */
  background: #549DE7;              /* 背景色を青に指定 */
  border-bottom: 5px solid #356D8F; /* 下の影を設定 */
  border-right: 3px solid #356D8F;  /* 右の影を設定 */
  padding: 50px;                    /* 余白を指定 */
}
```

※rgba指定して、半透明の影にすることも可能。（`rgba(0,0,0,0.5)`等）

## ぼやっとした影を付ける

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/435b1c72-f11f-a9a4-7ab6-cba620e3372d.png)

```style.css
.card {
	color: #fff;
	background: #549DE7;
	padding: 50px;
	position: relative;
}

.card::after {
  content: '';        /* 疑似要素に必須 */
  display: block;     /* ブロック要素にする */
  position: absolute; /* 相対位置にする */
  z-index: -1;        /* 背面に移動させる */
  top: 0;             /* 上から0pxの位置に指定 */
  left: 0;            /* 左から0pxの位置に指定 */
  width: 100%;        /* 親要素と同じ幅にする */
  height: 100%;       /* 親要素と同じ高さにする */
  background-color: rgb(200, 200, 200);    /* 影の色をグレーに指定 */
  filter: blur(15px);                      /* フィルターでぼかす */
  transform: translateY(10px) scale(1.05); /* 位置とサイズを調整する */
  mix-blend-mode: multiply;                /* 乗算で重ねる */
}
```

※IE非対応


## png画像やsvgの形に合わせた影を付ける

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/d6e9bf0b-c04e-40fb-636f-7961096c0973.png)

```style.css
img {
  filter: drop-shadow(5px 5px 8px #666);  /* 画像に合った影を指定（左右の位置 上下の位置 広がり 色） */
}
```

※jpgではなく、透過させたpngやgif、SVGなどに使用できます。


## テキストを立体に見せかける影

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/f0bf0df6-1db1-4227-2096-9765c3f7b096.png)


```index.html
<h2 class="text">TEXT</h2>
```

```style.css
.text {
  font-size: 3em;      /* 程よい大きさに指定 */
  position: relative;  /* 基準位置とする */
  text-align: center;  /* 文字を中央揃えにする */
}

.text::before {
  content: "TEXT";    /* 影にするテキストを指定 */
  font-size: 0.8em;   /* 少し小さくするor大きくする */
  letter-spacing: 8px;/* 文字間を広げる（微調整必要） */
  color: #ccc;        /* 文字色を薄いグレーに指定 */
  opacity: .7;        /* 透明度を0.7に指定 */
  position: absolute; /* 相対位置にする */
  bottom: 3px;        /* 下から3pxの位置に指定（微調整必要） */
  left: 50%;          /* 左から50%の位置に指定 */
  transform: translateX(-40%) skew(-45deg);  /* 表示位置と傾斜を指定（微調整必要） */
  z-index: -1;        /* 背面に移動 */
}
```

過去にこの方法について解説しているので[こちら](https://qiita.com/7note/items/16b0996677c789a12111)もどうぞ。

https://qiita.com/7note/items/16b0996677c789a12111


## まとめ

box-shadowはもう古い、なんて記事があるくらい新しい方法での影の再現の仕方が出ています。
影だからbox-shadow、ではなく適材適所で影も選択する必要がありそうですね。

参考：https://ics.media/entry/200406

#### おそまつ！
~ Qiitaで毎日投稿中!! ~
[【初心者向け】WEB制作のちょいテク詰め合わせ](https://qiita.com/7note)
servletCalc


```index.html
jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>計算さん</title>
</head>
<body>
<form action="/day2_Sarvlet_HP_CalcQ2/calc" method="POST"><%--&nbsp;改行を入れないしてい --%>
<p>x:<input type="number" name="x" value="0">&nbsp;y:<input type="number" name="y" value="0"></p>
<p><label for="puls"><input type="radio" name="ope" value="plus" id="puls" checked>+</label>
<label for="minus"><input type="radio" name="ope" value="minus" id="minus">-</label>
<label for="mul"><input type="radio" name="ope" value="multi" id="mul">*</label>
<p><input type="submit" value="送信"></p>
</form>
</body>
</html>
```

```calc.java
@WebServlet("/calc")
public class calc extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		//index.jsp type="number"のname="y"と"x"を受け取る
		int x = Integer.parseInt(request.getParameter("x"));
		int y = Integer.parseInt(request.getParameter("y"));
		//index.jsp type="radio"の受け取りとname="ope"の受け取り
		//opeのvalueは"plus""minus""multi"の三種類
		String ope = request.getParameter("ope");
		int result = 0;
		String opeStr="";
		switch(ope) {
		case "plus":
			result = x+y;
			opeStr ="和";
			break;
		case "minus":
			result = x-y;
			opeStr="差";
			break;
		case "multi":
			result=x*y;
			opeStr="積";
			break;
		}
		response.setContentType("text/html; charset=UTF-8");
		PrintWriter out=response.getWriter();
		out.println("<!DOCTYPE html>");
		out.println("<html>");
		out.println("<head>");
		out.println("<meta charset='utf-8' />");
		out.println("<title>計算くん</title>");
		out.println("</head>");
		out.println("<body>");
		out.println(String.format("<p>%dと%dの%sは%dです。</p>", x,y,opeStr,result));
		out.println("<p><a href='index.jsp'>戻る</a></p>");
		out.println("</body>");
		out.println("</html>");
	}

}


```
responderなどでSQLAlchemyを使っていてPyLintに怒られたとき

## 前置き

responder、FastAPI。
いいですよねぇ。

アルゴリズム書くくらいしか能がないと思っていたPythonでしっかりWebサービスが作れます。
しかし歴史が浅いことと、フルスタックフレームワークでないこともあって若干敷居が高いのか、記事はまだ少ない印象があります。
小ネタですが日本語の回答がなかったので、Pythonマイクロサービスにぎやかしのため投稿しておきます。

## 現象

SQLAlchemyを利用しているとPyLintに

    Instance of 'session' has no 'add' user'

のような感じで怒られる。
VSCodeで実行しているので自動的にLinterは働き、詳しいエラートレースは見ていないが、検索してみるとエラーコードは、`E1101`らしい。

ちなみにresponderやFastAPIはドキュメントを見る限り、標準でORMの機能を実装していないため、自分で好みのライブラリをimportしてくる必要があり、たまたま自分はresponderとDBの繋ぎ込みにSQLAlchemyを選択した。
したがってresponderに限らず、FastAPIなどのマイクロサービス、生でSQLAlchemyを使用する場合でも同様の現象が発生すると思われる。

RDBMSを使うのは既に人類として認められていないと言われているわけでは無いと信じたい。

## 解決法

検索すると、

    pip install pylint-django

をしろとか

    pip install pylint-flask

しろとか言われる。
しかし自分はdjangoを使っているわけでもflaskを使っているわけでもない。
適当に`--extension-pkg-whitelist`に`sqlalchemy`を入れてみてもヒットしなかった。

結論を言うと、setting.jsonに

    "python.linting.pylintArgs": [
        "--load-plugins",
        "pylint_flask_sqlalchemy"
    ]

を追加すると解決した。

pipとかは要らなかった。
`pip freeze`でもこのパッケージは存在しないので、新しいpipなりVSCodeとは情報が違うのかも。
あと`--load-plugins`のsqlalchemyの引数名分かりにくいよ。
responderやFastAPIではありがちなことだけど、responderで検索しても出てこなくなっちゃうじゃん。
この記事もタイトルにresponderと入れるかどうか迷ったけど、「flaskでSQLAlchemy使っていたらVSCodeに怒られた」とか時代遅れな情報ばかりなので入れることにしました。
フクザツ！

`--load-plugins`の引数`pylint_flask`に関しては無駄なLinterの挙動を抑えるためresponderでは使わない方がいいと思いますが、flaskな人はこの引数だけでもいけるっぽいです。

※注
この問題は比較的最近も議論されていたようなので環境ややりたいことによって解決方法変わるかもです。
詳細な議論は以下参照。
https://stackoverflow.com/questions/53975234/instance-of-sqlalchemy-has-no-column-member-no-member

## あとがき

IDEによるPythonのコード解析は非常に素晴らしいのですが、ライブラリや相対importの相手が見つからないよ問題はなかなか厄介ですね。
まあPythonに限った話では無いと思いますが。

## その日のうちに追記

pylint_flask_sqlalchemyでエラーが出なくなったのはいいものの、型付言語のように未使用の変数をチェックしてくれる機能まで除去されていた。
個人的にこれは欲しいところ。
また調べると、pylint_sqlalchemyというプラグインもあるが、これをpipしたりjsonに記述したりしてもflask版との差がわからなかった。

ある程度雑なlintで良ければプラグインで良いかもしれないが、結局のところカレントディレクトリのpylintrcを編集するのが一番なのかもしれない。

個人的には差し当たってresponderの場合、デフォルトに以下の設定を追加するのが幸せなのではないかと思いました。

    disable=xxx # 色々
            unused-argument, # コントローラの引数reqなど使わないものが多いので
            invalid-name, # pandasやnumpyなどsnake-caseのルールに合致しない命名が一般的なものが多いため
            missing-docstring, # docstring書かないことも多いので
            no-member # sqlalchemyなどライブラリの読み込みエラーを抑止するため

この辺りはmypyやpyrightとの兼ね合いもあるので個々人の好み。
やはりOSSは普及しなければ。
Amazon Elastic Block Store(EBS)

#EBSとは
###**「EC2インスタンスにアタッチして使用するブロックレベルのストレージサービス」**
OSやアプリケーション、データの置き場所など様々な用途で利用される
スナップショット機能による**S3へのバックアップ**や、ディスクの**暗号化機能**を提供
**99.999%**の可用性を備えるように設計されている

##特徴
・**最大容量16TiB**
・アベイラビリティゾーン毎に独立しているため、**同一AZのインスタンスのみ**使用可能
・複数のインスタンスで共有することは**できない***
・S3にスナップショットを取得し、任意のAZに復元できる

##EBS最適化インスタンス
・EBVS最適化インスタンスは、独立した帯域を確保しI/O性能の安定化に繋がる
・ネットワークとは別に独立した帯域を持つってこと

##ブロックストレージの種類
**① SSD**
**(1) 汎用SSD(gp2)**
・ブートボリューム
・負荷が読めないシステム
・小規模なデータベース
・開発・テスト環境
・仮想デスクトップ

**(2) プロビジョンドIOPS(io1)**
・リレーショナルデータベース
　MySQL,PostgreSQL,Oracle,Microsoft SQL Server
・NoSQL データベース
　MongoDB,Cassandra,ElasticSearch
・持続的なIOPSパフォーマンスが必要なアプリケーション

**② HDD**
**(1) スループット最適化HDD(st1)**
・ビッグデータ分析
・データウェアハウス

**(2) コールドHDD(sc1)**
・ログデータ
・アーカイブ
・低頻度アクセスの大量データ

#gp2概要
**・デフォルトのボリューム**
・**100IOPS〜16000IOPS**
・スループットは,1IOPS毎に**256KB/s**
・バーストバケットモデル**5400000I/Oクレジット**まで蓄積できるバーストバケットがボリュームごとに存在する。
・バケットへの流入量は１GiBあたり3IOPSとなる。これを流出量を下回るとバケットざ残高が増える。
・バケットにクレジットが残っていればIOPSを3000IOPSまで引き上げる**バースト**が利用できる。

#io1概要
・**100〜64000IOPS**
・スループットは、32000IOPSで500MB/s、64000IOPSで最大1000MB/s

#st1概要
・シーケンシャルアクセス時に高い性能を発揮。高いスループットを要求する**ビッグデータ処理**に最適
・容量： **500GiB〜16GiB**
・IOPS：**最大500IOPS**
・スループット：容量1TiBあたり**40MiB/s**がベースラインパフォーマンス
　　　　　　　1TiBあたり250MiB/s間で性能を上げることが可能
　　　　　　　スループットの上限値500MiB/sとなる

#sc1
・st1と同様だが高性能が不要な場合。**ログやバックアップのアーカイブ先として利用可能**
・容量：**500GiB〜16TiB**
・IOPS：**最大250IOPS**
・スループット：容量1TiBあたり**12MiB/s**がベースラインパフォーマンス
　　　　　　　1TiBあたり80MiB/s間で性能を上げることが可能
　　　　　　　スループットの上限値250MiB/sとなる

##st1/sc1のバーストバケットモデル
・ボリューム容量1TiBにつき、1TiB間で蓄積できるバーストバケットが存在する。
・流入量、流出量はボリューム対応によって異なる。

##gc2とio1のIOPSカウント
　256KiBまでの連続したアクセスを1IOPSとカウントする。
　例）512KiBアクセスを一回行うと、I/O命令を2回発行


##EBSのパフォーマンスを発揮する要素
**①EC2インスタンス側のスループットを改善する**
　インスタンスタイプの場合、EBS最適化を有効にする
  EBSのスループットの上限値に達していないか確認、達していればインスタンスタイプ変更でスループット改善
**②EBSボリューム側のI/O処理性能を改善する**
**③EBS側のスループットを改善する**

##EBSの監視
・性能→**CloudWatch標準メトリクス(Volume Read/Write Bytes, Volume Read/Write Ops,VolumeConsumedReadWriteOps)**
・容量→**CloudWatchカスタムメトリクス(ディスクの使用量、空き容量)**
・バーストクレジット→**CloudWatch標準メトリクス(BurstBalance)**

間隔はio1は**１分間**、gp2,st1,sc1は**５分間**のメトリクスを送信

##Elastic Volume
・EBSボリュームをEC2インスタンスにアタッチ中もサイズやIOPSを変更可能
・サイズ、ボリュームタイプの変更可能
・IOPSの設定は徐々に変更される
・１度変更すると**6時間**は変更不可

##EBS Snapshot
・定期的にSnapshot作成でバックアップ取得可能
・保存期間は**無制限**
・**リージョン間コピー**：コピーを指示しておけば非同期で行われる
・**リストア**：Snapshotから新規のEBSを作成し、　EC2インスタンスにアタッチされていたものと置き換える

##暗号化
・ボリューム暗号化すると、ボリューム内のデータ、ボリュームとインスタンス間で移動する全てのデータ、Snapshotが全て暗号化される
・EBS作成後に暗号化を実施したい場合はSnapshot経由で暗号化を有効にできる
Spresense SDK v2.1のサンプルコード(Gyro)実行までの手順

基本は公式ページの手順に従っている。
1年ぶりに使ったらすっかり忘れていたので手順見落としの確認や気づきの書きとめ目的。

- [1. 手順](#1-手順)
    - [1.1. MSYS2インストール](#11-msys2インストール)
    - [1.2. VS codeセットアップ](#12-vs-codeセットアップ)
    - [1.3. サンプルコードの実行](#13-サンプルコードの実行)
- [2. メモ](#2-メモ)


# 1. 手順
## 1.1. MSYS2インストール
 - msys2セットアップ
 - spresense開発環境インストール
    - instal-tools.sh
    - .bashrcに”~/spresenseenv/setup”追記
    - ソースコードダウンロード
    - シリアルドライバ
    - シリアルポート確認

## 1.2. VS codeセットアップ
 - 拡張機能「Spresense VSCode IDE」インストール
 - MSYS2との連携(パスの設定)・・・コマンドパレットで「Spresense:msys2」
 - 「Spresenes:ワークスペースセットアップウィザード」でソースコードのフォルダを指定
 - ソース管理にてnuttxとspresenseを「v2.1.0」に設定
 - ポート設定・・・コマンドパレットで「Spresense:シリアルポートの選択」
 - ブートローダ・・・コマンドパレットで「Spresenes:ブートローダの書き込み」
 - ブートローダのダウンロード～書き込み

## 1.3. サンプルコードの実行
-  v2.1でGyroを実行するとき、
    1. SDKコンフィグで新規作成を選択
    2. Examples/gyroを選択しOK
    3. 検索バーで「SENSORS_BMI160_SCU」を __Y__ にする
    ![2021-03-26-23-47-02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/336848/66394bc9-d929-57d2-f46a-afb2e966f40e.png)
    ※「SENSORS_BMI160」は __N__ のままで良い。
    4. 検索バーで「EXAMPLES_GYRO」を __Y__ にする
    ![2021-03-25-09-24-48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/336848/0e5355ee-196e-0571-17c4-0849c3be51ab.png)
    5. 「保存」を押す。
    6. 「Spresenes:ビルドと書き込み」を実行
    7.  コンソールが起動したら「gyro」を入力し実行する
    8.  測定値が出力されたらOK
    9.  終了するときは「Ctrl＋C」や「Spresense本体のリセットボタン」

# 2. メモ
- プログラム実行時センサ(gyro0)にアクセスできないエラー
    (NGの時のコンフィグを用意したので差分とSDKコンフィグの対応場所を探す)
    差分(OK側)：
    - CONFIG_SENSORS_BMI160_SCU=y　・・・(bmi160_scu.cで使用)
    - CONFIG_SENSORS_BMI160_SCU_I2C=y
    上記がSpresense:SDKコンフィグで.configを生成するだけでは設定できない？

->**SDKコンフィグ新規作成の際Example/gyroを忘れていた。**
  また、
    - CONFIG_SENSORS_BMI160
    は有効化不要だった。
※OK時とNG時(ほぼ未設定)の.configファイルの差分
![2021-03-26-23-59-53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/336848/42681e9b-2c15-aea0-1007-85f1e0860bdf.png)
![2021-03-27-00-01-29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/336848/ad624b2a-c6b2-22f0-abb1-2eae2fa8400f.png)

- SDKコンフィグが開けなくなった。  
 1例:make distcleanを実行

# 参考
https://developer.sony.com/develop/spresense/docs/sdk_set_up_ide_ja.html
Active Storageを用いた画像投稿(単数枚)

##目次
①結論
②ActiveStorageとは
③ActiveStorageのインストール方法
④minimagickとは
⑤ImageMagickとは
⑥画像を保存するための準備をする


##①結論
Active Storageをインスールし、ImageMagickをインスールした後gemfileにminimagickとImageProcessingを記述しbundle insatallし、画像の保存をできるように実装する。

##②ActiveStorageとは
Active Storageとは、Rails5.2から追加されたファイルアップロード機能のこと。これを使用すると、ファイルのアップロードを容易にするメソッドを使えたり、画像を保存するテーブルをさくせいすることができる。

##③ActiveStorageのインストール方法

```
rails active_storage:install
```

```
rails db:migrate
```

このとき、データベースで「active_storage_blobs」と「active_storage_attachments」という名前の2つのテーブルを作成される。

active_storage_blobsとは、アップロードファイルのメタ情報を管理するモデルのこと。

active_storage_attachments、該当モデルとblobsの中間テーブルに該当するモデルのこと。

##④ImageMagickとは
画像処理ライブラリです。コマンドラインツールやAPIライブラリとして利用する。非常に多くの画像フォーマットに対応し、豊富かつ高機能な画像処理機能を提供されている。

```php:imagemagickのインストール方法
brew install imagemagick
```
##⑤minimagickとは
画像加工をしてくれるgemのこと

##⑥ImageProcessingとは
画像サイズを調整する機能を提供するGemのこと

##⑦画像を保存するための準備をする
・ActiveStrageのテーブルと該当するテーブルを紐付ける

```php:該当するモデル

class モデル名 << ApplicationRecord 
  has_one_attached :image
end

```

・ストロングパラメータで画像を保存できるようにする。

```
private

  def create_params
    params.require(:モデル名).permit(:カラム名, :image)
  end

```
・画像が貼付されていなくてもエラーがでないようにする

```
<%= image_tag モデル名.image, if モデル名.image.attached?  %>
```
上記のモデル名.image.attached?という意味は画像が存在する場合は、image_tagが読み込まれるようになるという記述。ちなみにimage_tagとは、railsで画像を表示するためのimgタグを作成するヘルパーメソッド。image_tagを使うことにより、簡単にimgタグを作成することができる。

※補足
Active StorageではVariantが呼び出されると、保存された元画像データを指定されたサイズに変換しそのURLを返すことができる。投稿画像が大きすぎる場合、ActiveStorageを導入していると、variantが使用し、リサイズすることができる。

◎参考記事
https://techtechmedia.com/active-storage-rails6/
https://qiita.com/kamohicokamo/items/c13f72d720040cfd796d
Image::Imlib2のインストール WSL


画像を扱うのに、Imlib2を入れたいのだが、なかなか大変
libimlib2だと、CPANのインストールでエラーになるので、libimlib2-devをインストールすること


```
% sudo apt-get install libimlib2-dev
% sudo cpan install Image::Imlib2
```
AWS、5 つの産業向け機械学習サービスとは

#前提
この記事は、日経Robotics、以下のURL
https://xtech.nikkei.com/dm/ROBO/mag/
から、たどれる**2021年2月号**の
『**AWSが製造業向け機械学習サービスに本腰、既設の産業機器を容易に「知能化」**』
という記事（記事の一部が、以下で公開）
https://xtech.nikkei.com/atcl/nxt/mag/rob/18/00003/010400069/
を**契機**に、調べた内容です。
**該当記事の全文は、有料なので、中味、知りません。**


# AWS、5 つの産業向け機械学習サービスとは

https://aws.amazon.com/jp/about-aws/whats-new/2020/12/aws-announces-five-industrial-machine-learning-services/
「AWS、5 つの産業向け機械学習サービスを発表」（投稿日: Dec 3, 2020）

から引用すると、以下の５つらしい。

>* Amazon Monitron は、センサー、ゲートウェイ、機械学習サービスで構成されるエンドツーエンドの機械モニタリングソリューションを提供し、メンテナンスが必要な機器の異常を検知

>* Amazon Lookout for Equipment は、既存の機器センサーをご利用のお客様が AWS 機械学習モデルを使用できるようにし、機器の異常を検知および予知保全を実現

>* AWS Panorama Appliance は、お客様の生産現場にある既存のカメラを活用しコンピュータビジョンを使用した品質管理と職場の安全性向上

>* AWS Panorama ソフトウェア開発キット（SDK）により、産業用カメラメーカーがコンピュータビジョン機能を新しいカメラに組み込むことが可能

>* Amazon Lookout for Vision は、AWS が学習させたコンピュータビジョンモデルを元に、画像やビデオストリームを使って、製品もしくはプロセスの異常や欠陥を検出


# Amazon Monitron

(詳細別途）

# Amazon Lookout for Equipment 

(詳細別途）

# AWS Panorama Appliance

(詳細別途）

# AWS Panorama ソフトウェア開発キット（SDK）

『・・・産業用カメラメーカーが・・・』となっている、SDKなんで、そうでしょうね。
しかし、**カメラメーカー** ？？
(詳細別途）

# Amazon Lookout for Vision

(詳細別途）



#まとめ
特になし
GIFに画像を追加する

このGIFに、

![output2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154305/b851008c-70bc-8de1-e49c-4eef9b7479c3.gif)


この画像を追加して、

![akane_char.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154305/301bee5e-871c-60f3-6171-489f9c16d961.png)

このようなGIFを生成します。

![output.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/154305/e5364bb5-85a0-a582-7b02-e54376318534.gif)

# 環境
- mac OS 13.6.3

# 事前準備
まず準備としてImageMagickを使用できるようにする必要があります。
（インストール方法はImageMagick install等で調べれば出てきます）

# 手順

## 1. GIFを連番画像に分割
画像を挿入したいGIFを以下のコマンドで分割します。
既に連番画像がある場合は飛ばしてかまいません。
`src.gif`はGIFのファイルパス、`output/out_%03d.png`は連番画像を出力するパスです。各自変更してください。

```
convert src.gif +adjoin output/out_%03d.png
```

## 2. スクリプトの変更
以下のスクリプトをベースに変更します。

https://gist.github.com/kanatanomirai/c4cedc807655e7aa3dd6e732386f8cb2

[gist](https://gist.github.com/kanatanomirai/c4cedc807655e7aa3dd6e732386f8cb2)から「Download ZIP」を選択し、ZIPを解凍すると`composite_gif_image.sh`があると思います。こちらのファイルを変更していきます。

```
for i in `seq -f %03g 0 29`
```
上記はファイル名の連番が000~029の場合です。
例えば、連番が001~050の場合は以下のように変更します。

```
for i in `seq -f %03g 1 50`
```

```
convert out_$i.png image.png -gravity southwest -geometry -15-40 -composite output/output_$i.png
```

`out_$i.png`は連番画像のファイルパス、`image.png`はGIFに追加する画像ファイルのパスです。
`-gravity southwest`は追加する画像をGIFのどの場所に配置するかを指定するオプションです。
参考：https://imagemagick.biz/archives/639

> northwest (北西=左上)
north (北=上)
northeast (北東=右上)
west (西=左)
east (東=右)
southwest (南西=左下)
south (南=下)
southeast (南東=右下)
center (中心)

`-geometry -15-40`はオフセットで、`-gravity`で配置した画像の細かい位置を指定できます。
`-15`はX座標オフセット、`-40`はY座標オフセットです。
プラス方向のオフセットにする場合は、`+10`のように+をつけます。
マイナス方向のオフセットにする場合は、`-10`のように-をつけます。

X軸は左側がプラス方向で、右側がマイナス方向です。
Y軸は上側がプラス方向で、下側がマイナス方向です。

`-15 -40`のように、オフセット間にスペースを入れるとエラーになります。

`output/output_$i.png`は出力先のファイルパスです。

```
convert -delay 10 -loop 0 output/*.png output.gif
```

`-delay 10`はGIFの画像間の秒数（1/100秒）です。
この場合は1秒で10枚動きます。
-delayに設定する値を大きくするほどGIFの速度が遅くなります。
例えば、`-delay 100`にすると1秒で1枚動きます。


`-loop 0`はループ回数です。0にすると無制限になります。

スクリプトを変更したら、以下のコマンドを実行します。

```
sh composite_gif_image.sh
```

コマンドを実行したディレクトリに画像が追加されたGIFファイル、`output.gif`が生成されます。
自己紹介+学習計画

#自己紹介
はじめまして、すがぬまです。

世の中に価値を生み出したい、価値を創れるだけの時間的、精神的、身体的に余裕を持った人々を増やしたい。そんな思いを持ってプログラミングを独学で始めました。

自分が学んだことのアウトプット、忘備録、日記的な感じで投稿していきたいと思います

##当面の目標
まずは、基礎固めをします。
・HTML/CSS
・Ruby
・JavaScript
・RDBとSQL
・GitとGitHub
・Ruby on Railsチュートリアル
この辺りをざっと勉強してから、バイト先のシフト管理アプリを作りたいと思っています。
そのあとアジャイル開発みたいに徐々にブラッシュアップしていくつもりです。（使い方あってる？？？）

###最後に
まだまだ駆け出しですが、精いっぱい頑張るつもりです！勉強のアドバイスなどなどありましたら、じゃんじゃんお願いします！！！
discord.py get_member(user_id) が失敗する時は fetch_member(user_id) を使う

[discord.py](https://discordpy.readthedocs.io/ja/latest/index.html) でuser_idから [Member](https://discordpy.readthedocs.io/ja/latest/api.html#member) を取得したかったのですが、
Intentsを設定しているのにも関わらず [guild.get_member(user_id)](https://discordpy.readthedocs.io/ja/latest/api.html#discord.Guild.get_member) がNoneになってしまうバグに遭遇し、
`discord.py get_member 動かない バグ`
`discord.py get_member not working`
などでググっても解決策がヒットせず、自力で解決したため対処法を残しておきます。 

### Intentsを設定したのに直らない
ググってみると [Intentsの設定でmembers=Trueにすれば直りそう](https://zenn.dev/disneyresidents/articles/discordintents) だったのですが
まだget_memberがNoneになってしまい、ハマりました。

## fetch_member()で解決
いろいろ試行錯誤したところ、
`member = guild.get_member(user_id)`
↓
`member = await guild.fetch_member(user_id)`
とすることで無事Memberオブジェクトを取得できました。


Intentsは設定なしでOKなようです。
よく使うHerokuコマンドを振り返ってみた


学習メモとして、Heroku にてよく使用コマンドを振り返ってみました。


#主なコマンド

１　Heroku へログイン（ターミナルベース）

```
heroku login --interactive
```

２　アプリ一覧を確認する

```
heroku apps 
```




３　アプリを削除する

```
heroku apps:destroy --app アプリ名 —confirm アプリ名
```

４　heroku に設定した環境変数を表示

```
heroku config
```

５　Herokuのドメインを確認

```
heroku domains
```

６　環境変数を設定する

```
heroku config:set LINE_CHANNEL_USER_ID=
```



#参考

以下の記事を参考にさせていただきました。

https://qiita.com/shosho/items/41183091769a8693a8a5
忘備録_Logic_1~10までの和


```Sample.java


public class Sample {

	public static void main(String[] args) {
		int x = 1; int y = 10;
		int sum = 0;
		for(int i=x; i<=y; i++) {
			sum +=i;
		}
		System.out.println(sum);
	}
実行
55

}

```
Phoenixで Error: Node Sass does not yet support your current environmentになった話



## 先日phoenixでmix phx.server したらこんなエラーがでた
```
ERROR in ./css/app.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (88)
For more information on which environments are supported please see:
https://github.com/sass/node-sass/releases/tag/v4.14.1
......
......
......
```

急にこんなエラーが出たのでびっくりした...
nodeのバージョンがサポートされてない？？

## 心当たり
強いて言えば、この間vueの勉強をしようとしてnode.jsを入れた。
バージョンを見てみる。

```
node -v
15.x.x
```
おそらくバージョンが高すぎてだめなのだろう。
ダウングレードするしかないな。

## どうせならバージョン管理したいな

### *[この記事良さそう](https://qiita.com/1000ch/items/41ea7caffe8c42c5211c)*

この記事通りにnodenvを入れます。

次に

```
nodenv install 14.x.x
nodenv rehash
```

それからそのプロジェクト内で

```
nodenv local 14.x.x
```

最後に

```
mix phx.server
```
すれば上手くいくと思います。
文系がAI領域に無手で挑む~PART7~ ☆オンライン教育・コロナとAIがもたらした”学び”革命☆

# AIと教育って私は気になるの
現状機械学習を学んでいる私ですが、前職も含め「教育」という分野にも非常に興味があり、今回このセミナーに参加しました。

そこでまとめたことと気づきを共有させていただくことにしました。ちなみにアーカイブまだ見られます！

![スクリーンショット 2021-03-27 19.48.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1031281/960e672e-d027-c55e-29b7-7018955411c5.png)


# 読了時間
読み飛ばせば４秒！

# 読者対象者
上記の通り、AIや教育に興味のある方は、ちょっと思考するきっかけになるかもしれません。
あと、AI使って仕事したいと思い始めた人にも良いなと書いていて思いました！

あ、初学者による初学者向けですので、しょうもないところは何卒ご容赦下さい。　早めの言い訳(*^^*)

それでは！講師の方のご紹介から本題へとどうぞ〜(*´ω｀*)

# 講師の方
本村 健登さん

# どんな人？
株式会社マクニカ
イノベーション戦略事業本部サービスデザイン課
課長兼プロフェッショナルサービス部シニアコンサルタント

2017年以降100件以上のAIプロジェクトを支援。
現在は、これまでの実績とマクニカのAI技術資産を活用したAIサービス「Re:Alize」を立ち上げ、サービス責任者に従事。
顧客のインサイトを見極めること、AIを利用した際の価値・効果の設計を得意とする。
保有資格：JDLA Deep Learning for GENERAL 2018

https://www.macnica.co.jp/

# この講座で何を言いたいか？
###  伸びゆくオンライン教育市場を見据えて、オンライン教育導入の検討を！

そんなことに近いことをおっしゃってました。

# どうしてそう言えるの？
- コロナによる教育サービスの変化

- 子供１人あたりの教育の支出をあげる傾向にある。それがコロナ禍の中でも起きているとのこと。
→子供の数は減ってきているが、一人あたりにかける教育費は年々増加もしている。

- 社会人のオンラインサービスも拡充してきている
→Udemyは全世界で1500万人のユーザー数(3年で7.5倍の伸長)

**ふむ(・∀・)**
コロナによるオンラインは腹落ちしますよね。一人ひとりへの教育の支出が上がると同時に、子供の数は減っているので、全体の支出はトントンなイメージはあります。

社会人の方からは、これからもオンラインによる教育サービスは求められていきそうですよね。　エラソーに言う(´・ω・｀)

# 主に企業側から見たオンライン教育のメリット
- 事業規模の拡大が出来る

- 個別最適な学習プログラムを設計可能

- デジタルデータを活用した根本的な教育コンテンツの質向上

３つ目のデジタルデータというところが**「キー」**になりそうですね。

顧客からのフィードバックが得られることで、最適な教育コンテンツを提供出来る可能性は上がりそうです。
下記にもありますが、今後認知工学というものを用いて、顧客の潜在的なニーズや興味などもいずれ引き出すことが出来るようになりそうです。

**なんで潜在的って言ったかというと**・・・どうしてもフィードバック(いわゆるアンケート)というと、顧客にとって顕在しているものを顧客が発信するイメージがありますが、無意識下においての目線の動きや、表情などが、その人が本当に何に興味を持っているかを導き出してくれるようです。　

(おそらくこういうもの)
https://www.jsise.org/society/committee/2019/1st/TR-034-01-009.pdf

# 導入に向けて何が肝になりそう？

- 受講者や、受講者の親御さんにとっての満足度、納得感を得ること、または受講者への適切なコンテンツの提供
→上述した認知工学を用いて(導入はまだ)
→リアルとオンラインによる教育のギャップも、企業側は気づいて、埋めていく必要があるとのこと

- 企業がAIを導入する障壁をどうクリアしていくか
→コスト、人材

**ふむ(´・ω・｀)**
リアルとオンラインの教育のギャップは今スクールに通っているからこそ、よく聞く声です。
これに気が付かないと炎上しそうです。(真面目に)

# 企業にとってオンライン教育への導入の障壁とは？
 - AIプロジェクトに関する知見がない(上の方はそうでしょうね・・。)
 
 -  目的達成までの投資額が見えず、社内稟議が通らない
  →効果検証を行う前の投資額がでかい(概算で効果検証までに5000万かかることも)　たかっ(^O^)

 - 成功が確信できず他社の事例を探してしまう
 

# 今後の課題は？
- リアルとオンラインにおける教育サービスのギャップを埋める

- ベンダー活動を短期間にする
→短期間で効果検証できる何かしらのアプローチを(そこまでにかかる投資額も明確にする)

- AI人材不足(20%~30%位しか足りてないって言いますよね。)
→若いうち(学生時代)からの教育にかけるしかないかもしれませんね。
(高いレベルで分かりやすく)大人に教えられる人は基本的に違う仕事に就くそうです。

# 講座のざっくりとした結論
- ユーザーとベンダーの相互理解とチームワークが肝。(外注と業者の関係では成功しない。)

→ユーザー側、ベンダー側の事情をお互いに共有して、協力してやっていく

※私はベンダーという言葉の意味がわかりませんでした笑

# 講座に参加してみての感想
①ユーザー側にとって、導入に関わるコストも仕組みもブラックボックスではNG
→職人気質はNGだなと思いました。　てやんでぇ！素人にわかってたまるかぃ！みたいな。

②効果測定を早い段階で示す技術が必要
→プロトタイプを早々と作れる力、知識が求められるのかなと。フルスタックエンジニアというやつでしょうか(?)

③ユーザーとベンダーの協力体制が不可欠
→だからこそアジャイル開発というのがあるんでしょうか？なんとなくそこにつながるような気がしてきました。

# 締め

色々勉強してきて、だから「アジャイル開発」とかがあるんだなと少し分かって(?)きた気がしました。

黙れぺーぺー(´・ω・｀)

以上です！

# ☆用語集☆
### ベンダー
https://tech-camp.in/note/pickup/82901/
ARMアーキテクチャに思ったこと

うろ覚えで書いたし、とりとめのない話になってしまった。(；´Д｀)
なんで書いたかと言うと、FaceBookにARMの広告が表示されていて、CPUについて思うところがあったから。
衝動的にやってしまった。
今は後悔している。


ARMは、一般に採用されている汎用のアーキテクチャの中では、一番新しくて一番簡素で互換性に優れていて、洗練されていると思っている。
CPUアーキテクチャの区分けとしては、RISCプロセッサに分類される。
最初からマルチコア、低消費電力コア、低消費電力アーキテクチャ、簡易な命令セット、命令拡張等を引っ提げて登場した。
当初から必要な全ての機能をデザインして内蔵していたため、設計は極めて簡素になった。
簡素が故に、1クロックあたりの処理能力も高く、消費電力も少ない。
だから、スマホやタブレットに多く採用されているし、スパコンにも採用された実績がある。

これは、肥大化したx86系のプロセッサには真似できない。
nVidiaやAMDのGPUも存在しているし、それらは処理効率も高いが、最初から命令セットが大きい(＝ビット数を消費する＝使用トランジスタが多くなる)ので消費電力も大きい。
以前はSPARCやMIPSやAlphaも存在していたが、SPARCとMIPSは性能でx86系に追いつかれてUNIX系のサポートが薄くなってメインストリームから消え、Alphaは高性能なx86互換を売りにしていて期待も高かったが、これも安価なx86系プロセッサに性能で追いつかれ、あっさり駆逐されてしまった。
他の高効率なx86互換プロセッサも登場していたが、IntelとAMDの開発競争に追いつけず、突き放されてしまった。

ARMの登場は、Android登場の切っ掛けになったと言える。実際には、逆かも知れない。
ともかくARMのアーキテクチャは、時代に求められていたニーズに、ズバリ合致していた。
Androidに採用され、掌に乗るサイズなのにPCに迫る高性能が得られた。
その当時は、マルチコアはx86でもハイエンドでしかなかったため、最初からマルチコアを想定して設計されたARMに、大きく水を開けられる結果になった。
Intelはx86で低消費電力のプロセッサも作っているが、正直メジャーになっているとは言えないし、性能でARMに勝っているとは言えない。

最近のARM互換プロセッサ群は高性能に振ってきているために発熱が大きくなっており、格納する筐体(＝スマホ)の熱設計が追い付いていないと感じる。
過熱した場合の処理は、Androidがプログラムを強制終了して画面の輝度を落とすのが一般的のようだが、その際に低消費電力コアに強制的に切り替わっているのかは分からない。
筐体は落としたりぶつけたりすればすぐに壊れてしまうほど華奢なのに、保護ケースを付けると熱が籠ってしまう。

今のAndroidは、登場時の「軽量で高性能」から「軽量」が外れてしまっているように見える。
Windowsと同じで、プロセッサの高性能化に伴いOSの高機能化が行われ、CPU資源を積極的に使う方向に進んでしまっているように思う。
これは「卵が先か鶏が先か」の議論になってしまうのだが、OS側がCPU資源を積極的に消費するように作られているのは間違いないので、個人的にはAndroid側に改善を要求していきたい。
そうすれば、CPU側もTDPを下げる方向に方針を転換してくれると期待してる。
【AWS】認定SysOps アドミニストレーター – アソシエイト-受験記録

[【AWS】認定クラウドプラクティショナー受験記録](https://qiita.com/shin_moto/items/5d94d89ca4bbb39c4d16)
[【AWS】認定ソリューションアーキテクト-アソシエイト-受験記録](https://qiita.com/shin_moto/items/73ede465476c73da9858)

月一でのAWS資格取得への挑戦、今月はSysOpsアドミニストレーターです。
ソリューションアーキテクトが設計分野であるのに対して、SysOpsアドミニストレーターはAWSでのデプロイ、管理、運用に関する問題が出題されます。

受験の際に同意した受験者行動規範により、試験内容の開示、共有は禁止されていますので、今回も試験に向けて行った準備とか感想とかを記していこうと思います。

## 本題

今回の試験も無事に合格する事が出来ました。
スコアは839でしたので、蓋を開けてみたら結構余裕を持って合格出来たという感じですが、
試験自体1/3は確証が持てずに回答していたので、内心落ちたかと思っておりました。

![スクリーンショット 2021-03-27 18.32.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531606/66b6f2a5-61b2-8f56-f265-2ef60d80e1bb.png)

SysOpsアドミニストレーターアソシエイト試験の新しいバージョン[SOA-C02](https://aws.amazon.com/jp/certification/coming-soon/)が今後の主流となりますが、SOA-C01向けの勉強でここまで来ていたので、今の内に取得してしまいました。

準備期間は今回も4週間程度ですが、学習は土日は3時間くらい、平日はほとんど出来ていませんでしたので、今までで一番自信なく臨んだ試験だったかもしれないです。実質学習時間は15時間程度でしょうか。

・[AWS WEB問題集で学習しよう](https://aws.koiwaclub.com/)

対策はWEB問題集を1.5周解いただけです。SAAをクリアしている人であれば、ベースの知識があるので、その時点で初見の問題でも6割くらいは取れるのではないかと思います。あとは合格ラインまでどこまで問題演習に時間を使うかになります。

SAAでは設計方法について問われましたが、SysOpsでは問題発生時のフォローの仕方とか原因特定方法は勿論、状況に応じた最適な運用方法を選択出来る必要があり、間違った設定への指摘なども出来ないといけません。概念の理解ではなく、より実践的な知識が試されます。試験を終えて、そういった意味では満遍なく理解出来るようにはなっていたかなと思います。

今回もピアソンVUEでの受験でしたが、3月末はテストセンターも繁忙期みたいで、過去一混み合っていました。（緊急事態宣言解除の影響もあったでしょうか）

## まとめ
デベロッパー試験に合格すれば、アソシエイト制覇になるのでまずはそこを直近の目標に。あと、今後の試験対策的な意味でもCloudFormation使ってみないとなあと思いました。
Salesforce Heroku：Salesforce Herokuはじめ

#Heroku作成手順
##参考できるビデオ
https://www.youtube.com/watch?v=Tm2PxwkSTUE

##実例
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/ee9c7473-eef6-a30d-6a6b-589b34f01551.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/9d8dce1e-104b-ff0a-5fa5-597d84bd6ae5.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/6135636f-eba8-6513-1f99-d42f6b0ce9af.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/08710344-4b14-edd6-31c4-890482249f16.png)
以下の三つAdd-onインストール
　・Heroku Connect（Salesforce接続）
　・Heroku Postgres（データベース）
　・Papertrail（ログ、ないの場合エラーがある）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/840ac3c0-740e-8be5-6052-bc5724e9149b.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/e54c6c2a-0a8c-032e-7aec-351da1e7db87.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/3f68aba5-cec7-bd38-6f17-803a99427352.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/5ecf5038-90b1-655a-1b15-a129d9ba3f64.png)
Heroku Connect作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/91c8b2c3-db0c-c137-aa85-093983bb1532.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/9f53b53d-8967-64eb-b045-590ed333d77b.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/6f86a480-83b2-cabc-da52-52d784e39c72.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/b9236249-40ad-1de5-425a-9cfae8e5391d.png)
マッピング作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/e846ab4e-b171-867e-97ad-9ba376d5d89f.png)

HerokuからSalesforceへ同期設定方法
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/e61792f4-9667-a7e5-e00c-554fe75b2ba5.png)