OmniAICreator/Qiita-1.07M huggingface dataset:
sam local start-apiでヘッダーが勝手にキャメルケースになるんだが？

表題の通り、sam local start-apiでヘッダーが勝手にキャメルケースになる問題についてです。

こちらにドンピシャの回答があるのですが、内部で使っているFlaskの仕様だそうです。
[Headers are received in Camel\-Case · Issue \#1860 · aws/aws\-sam\-cli](https://github.com/aws/aws-sam-cli/issues/1860)

仕方ないのでNode.jsでは下記ワークアラウンドをしてヘッダーをすべて小文字にして対応しましょう。
（Pythonならissueのコメントにサンプルコードが載っています）

```javascript
const toLowerCaseKey = function(object) {
    let newObject = {};
    for (let key in object) {
        if (object.hasOwnProperty(key)) {
            newObject[key.toLocaleLowerCase()] = object[key];
        }
    }
    return newObject
}
```
RSpecでpry-byebug(binding.pry)が使えなかった時の対応(初歩)

## 環境
Mac OS X
Ruby:　2.7.1
Rails:　6.0.3.4

## 状況
RSpecでテスト書いてるときに、hogehoge.errors[:hoge]の中身ってどうなってるのか気になることがあった。
そこでpry-byebugを使って確認しようと、テストコードの該当箇所にbinding.pryを入れてキャッチしようとしたが、キャッチできずにそのままテストが進んでしまった。

## 原因
pry-byebugのgemがdevelopmentにしか入っていなかったから。

```ruby:Gemfile
group :development do

 gem 'pry-byebug'

end
```

## 対応
pry-byebugのgemをtest環境に入れる（自分の場合はdevelopment環境でも使いたいので以下の場所にいれた)

```ruby:Gemfile
group :development, :test do

 gem 'pry-byebug'

end
```

## 結果
該当箇所で処理がとまり、pry-byebugが使えるようになった！

## 感想
開発環境と本番環境の違いはherokuなどを使っていたのでわかってたのですが、開発環境とテスト環境で違うという感覚が無かったので勉強になりました...
JupyterLabがlocalhost:8888だと真っ白のまま起動しないのでconfigの設定を変えた

# 概要
JupyterLabをバージョンアップしたときに発生した出来事です。
locahost:8888では表示されず、127.0.0.1:8888なら表示されるというちょっと何言ってるかわからない状態になってしまったのでいっそのことlocalhost接続ではなく127.0.0.1をデフォルトにしてしまえという話になります。

# 方法
JupyterLabのconfigに記載します。

まずはconfigを作成する

```
jupyter-lab --generate-config
```

すると~/.jupyter/jupyter_lab_config.pyというファイルができるので開いて該当箇所を編集

```python:jupyter_lab_config.py
## The IP address the Jupyter server will listen on.
c.ServerApp.ip = '127.0.0.1'
```

するとjupyterlabを立ち上げるときにlocalhostではなく127.0.0.1で立ち上がるようになります。
根本的な解決はしていないですが、一旦これで様子見ます。
Java Silver SE11 継承とオーバーライドの間違えやすい部分

Java Silver SE11の問題を解いていて継承とオーバーライドに関する問題を間違えるので備忘録として残す。

大事なのは何の型で宣言されて、何のインスタンスを生成しているか。
メソッドはどのようなアクセス修飾子が付与されているか。

```
public class Main {
    public static void main(String[] args) throws Exception {
        //case A
        Super superClass = new Sub();
        
        //case B
        // Super superClass = new Super();

        Sub subClass = new Sub();
        
        //code 1
        // subClass = superClass;
        
        //code 2
        // subClass = (Sub)superClass;
        
        //code 3
        // superClass = subClass;
        
        superClass.print();
        subClass.print();
    }
}

class Super{
    //case C privateで修飾
    //case D staticで修飾
    void print(){
        System.out.println("Super");
    }
}

class Sub extends Super{
    //case D staticで修飾
    void print(){
        System.out.println("Sub");
    }
}
```
それぞれの実行結果がどうなるか。

- case Aの場合
 - code 1の時<br>サブクラス型の変数subClassにスーパークラス型の変数superClassを代入しているためコンパイルエラー<br>

 - code 2の時<br>スーパークラス型の変数superClassはSubクラスのインスタンス生成しているため、ダウンキャストされて代入される。実行結果はオーバーライドされたメソッドが優先されるので「Sub Sub」<br>

 - code 3の時<br>スーパークラス型の変数superClassにサブクラス型の変数subClassを代入しているため自動的にアップキャストされ、実行結果も同様にオーバーライドされたメソッドが優先されて「Sub Sub」<br>

- case Bの場合
 - code 1の時<br>case Aの場合と同様にコンパイルエラー<br>

 - code 2の時<br>明示的にキャストしているためコンパイルエラーは起こらない。しかし、スーパークラス型の変数superClassはSuperクラスのインスタンスを生成しており、サブクラスの差分を持たないため、ClassCastExceptionがスローされる(実行時エラーが起きる)<br>

 - code 3の時<br>case Aの場合と同様にアップキャストされ、実行結果は「Sub Sub」<br>

- case Cの場合
 - スーパークラスであるSuperクラスのprintメソッドがprivateで修飾されると、オーバーライドされているとみなされず、生成されているインスタンスに関わらず、変数の型のprintメソッドが実行される。<br>

- case Dの場合
 - 両方のprintメソッドがstaticで修飾された場合、変数の型のprintメソッドが実行される。<br>

 - staticで修飾する場合は両方のメソッドを修飾しないとコンパイルエラーになる。<br>
ThymeleafでのControllerからの値受渡し関連の使い方まとめ

###ThymeleafでControllerに/から値受渡しする書き方

ThymeleafはSpring BootでWebアプリを作成するときに便利ですが、formでこの値受渡しをする際のやり方を見つけるのに、色んなサイトをググりまくらないとわからなかったので、自分が解決した方法をまとめました。

##Listの値をthymeleafで表示する

すごく簡単なのですが、`for(String s: list)`の要領で`th:each="s : ${attributeから渡したリスト名}"`を指定して、あとはその下のHTML要素では`s`または`s.name`のようにして呼び出せます。

```user.html
<tr th:each="users : ${usersList}">
        <td><a th:href="|/admin/edituser/${users.userId}|"><span th:text="${users.userId}"></span></a></td>
        <td><span th:text="${users.userName}"></span></td>
        <td><span th:text="${users.password}"></span></td>
        <td><span th:text="${users.passUpdateDate}"></span></td>
        <td><span th:text="${users.loginMissTimes}"></span></td>
        <td><span th:text="${users.unlock}"></span></td>
        <td><span th:text="${users.enabled}"></span></td>
        <td><span th:text="${users.userDueDate}"></span></td>
        <td><span th:text="${users.roleId}"></span></td>
</tr>
```
##基本的なform

###form actionにデータの値を渡したい際：
`th:action=|/${変数名}|`でアクション先を指定可能です。(ちなみに`th:action="@{/${変数名}}")`でもできるのですが、このやり方だとデータの値部分が文字化けっぽくなってしまって(不明)、URIの値がデータ値になりません。)

```edituser.html
<form th:action="|/admin/edituser/${userInfo.userId}|" th:method="post" th:object="${userEditRequest}" class="container-sm">
</form>
```

以上、

###inputボックス内のデフォルト値にデータを渡したい場合

例えばユーザ情報編集画面でデフォルト値に編集前の値を表示したいときは、以下のようにすればできます。
`th:value=${変数名}`

ちなみに自分がハマったポイントとしては、デフォルトでもとの値を表示しつつ、ここの値をそのままControllerに渡したいときです。

大体の場合はinputボックスにデフォルト値を表示したいときは
`<input type="text" th:value="${}" th:name="*{}" />`でやる方法が出てくるのですが、`th:value`と`th:name`を両方同じinputの中に入れてしまうと、表示したときにデフォルト値がなぜか出てきません。。

なので、両方指定したいときは`th:name`の方は`name=""`で指定しましょう。

```edituser.html
<input type="text" th:value="${userInfo.userName}" name="userName"></input><
```

###固定値を表示しつつ、固定値の値をcontrollerで受け取りたいとき

例えばユーザーIDは固定なので編集不可だが、Controller側でこの値をformから受け取りたいときは、`hidden`でformからは非表示にしつつ、これで値を受け取ることができます。これは別にthymeleafに限った小技でもないですが...

```edituser.html
<td>
      	<span th:text="${userInfo.userId}"></span>
      	<input type="hidden" th:value="${userInfo.userId}" name="userId"></input>
</td>
```

###プルダウンで値を指定したいとき

自分の場合は`role`で`admin`と`general`という権限を作成し、そのどちらかをユーザー編集画面ではプルダウンから編集できるようにしつつ、デフォルト選択はもとのデータとしたかったのですが、以下のやり方でできました。ちなみに`<option>`の間の値は`[[${変数名}]]`としないと表示されないので注意。

```useredit.html
<select id="roleIds" name="roleIds">
   <option th:each="roleId : ${roleIds}" th:value="${roleId}" th:selected="${roleId == userInfo.roleId}">[[${roleId}]]</option>
</select>
```
wkhtmltopdfで解像度を指定する

htmlファイルをインプットにPDFへ変換してくれる<a href="https://wkhtmltopdf.org/">wkhtmltopdf</a>ですが、解像度を指定しないデフォルトの状態だと1px未満単位で描画されません。
例えばhtmlで1.9pxの線はpdfに1pxとして描画されます。
pdfに1px未満の描画をさせるためには「-d」または「--dpi」をオプションに96以上の値を指定する必要があります。
0.1px単位で描画するには960を0.01px単位で描画する場合は9600を指定します。
詳しくは<a hfer="https://wkhtmltopdf.org/usage/wkhtmltopdf.txt">こちら</a>

## htmlファイル
10.9pxの枠線
![border10.9px.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613298/3e585885-6672-6510-48f0-72da197e08ce.png)

## dpiオプション無しでPDFへ変換
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613298/24ddc1f2-1652-fab9-c936-b6bf8532de08.png)
## dpi=960でPDFへ変換
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613298/719f55d2-831e-deb2-854e-9ba68657b0c9.png)


変換後のPDFを比べると枠線の太さが異なるのがわかると思います。
コロナ禍での未経験からエンジニア転職に成功した上での感想

#前置き
あくまで一個人の感想であり、特定の人物や団体に誹謗中傷はやめてください。
年齢は２０代前半
高卒
文系です。数学への苦手意識は高い。
転職は初
#今の未経験からのエンジニア転職の状況について
正直かなり厳しい状況です。現在、未経験からのエンジニア転職はスクール卒のRubyを少しかじった未経験で溢れかえっており、経験者のエンジニアが欲しい企業と未経験から転職したいエンジニアの需要と供給が合致していません。正直、企業は未経験に技術は求めていないので、高度な技術を使用したポートフォリオは必要ありません。(Docker,CIなど)
そもそもポートフォリオをみていない可能性があります。なぜなら面接でポートフォリオの話題がでることがほとんどありません。なので、未経験が転職するのに必要なのは高度な技術を使用しすごいポートフォリオを作るより、面接対策を徹底したほうが転職できる可能性が高まると今回の転職活動で感じました。現在スクール卒のエンジニアが応募しすぎて、またスクール卒かよと思われるので、スクール卒を隠して独学で勉強しましたと言うと差別化を図れるかもしれません。（他の同期も同じ意見の方が多いです。）
#自分の転職活動について
自分は８月に退職してあるスクールに入校しました。そこから３カ月おなじみのRubyOnRailsを使い11月にポートフォリオが完成した為、転職活動を始めました。１１-１月の間でwantedlyで140件程応募しましたがほとんど書類選考は通りません。１１月にいきなりReact/GOを使用している自社の書類選考が通りましたが３次面接で落ちました。
また振り出しに戻り１２月からまた応募をどんどん出していき、１２月もRailsを使用している自社の書類選考が通りましたが最終でおちました。
そして、また振り出しに戻り１月からまた応募を出してくことでJavaの企業に就職が決まりました。
#自分がしたこと
##ポートフォリオが完成した後rspec、factorybot、Capybaraでテストを書いて、リファクタリングをしました。
これは１１月に受けた企業がテストを重視する企業だったので行いました。CapybaraでE2Eテストを書いたり、N+1問題をなおしたり、クラスメソッドやインスタンスメソッドを使用してDRYコードを目指したり、Viewでロジックをなるべく書かないなど意識しました。自分としてもテストやDRYコードを意識してリファクタリングを行った方がいいと思います。なぜなら、もし面接する企業がgithubのコードをみてくれた時に他の人との差別化も図れますし、現職のエンジニアの方に聞いても、高度な技術のポートフォリオを作っているがテストも書いておらずコードも読みにくい人よりかは、テストやDRYコードを意識してリファクタリングを行っているひとの方が評価できると述べていました。
##SQL
Rails以外の言語を触ってみてわかるのですが、RailsはSELECT文をほとんど書かなくていい為、SQL文など意識したことはありませんでしたが、N+1問題などを解決する時に必要だなと感じ勉強しました。
使用した参考書: すっきりわかるSQL入門
２周ぐらいしてほとんど理解しました。
##フロントも勉強してみようと思い、JavascriptのES2015の書き方を学習したあとreactでtodoアプリ、twitterクローンを作成しました。
SQLも学習し、バックのRailsしか触ったことがなかったので、学習しました。やっぱりrailsは簡単だなと感じました。正直フロントの方がおもしろかったです。
フロントを自分は学習しましたがおすすめはしません。
##QiitaでアウトプットやTwitterで100daysOfCodeを行った
Qiitaで自分が覚えておきたいことなどアウトプットしました。Twitterで100daysOfCodeを行い100日間コードを毎日書き続けると言うものでしたが、熱がでたこともあり、毎日は無理だなと感じ自分ルールで毎日はやめました。Qiitaに投稿したり、100daysOfCodeを行っていると面接の自己紹介のときアピールすることができます。100daysOfCodeを行っていると自然と勉強しないといけないと思うようになるのでおすすめです。
##Rubyでビンゴを作成
好きな言語でビンゴのプログラムを作成するものがありました。
標準出力と標準入力すら知らない自分には最初まったくわかりませんでしたが、４日間ほど、毎日寝て食べる以外は全て、そのプログラミングにフルコミットしました、自分はrailsしか触っていなかったので、Rubyだけでやると色々勉強できてかなり実力がついたと思いました。プログラミングの勉強を初めて一番楽しかったです、パズルを解いてるかのような感覚で没頭しました。二重配列や標準出力と標準入力をわからない人は挑戦してみるといいかもしれません。
#おすすめのルート
独学やスクール卒でも共通でポートフォリオが完成した後は面接対策をメインに置きながら、テストやDRYコードを意識してリファクタリングしつつ、SQLなどを学び、2カ月以内に転職できたら理想です。
しかし現実はそう甘くないとおもいます。現在すぐに転職できたと言っている人は、相当スペックが高い人、運がいい人、Web制作の会社に就職した人だと思います。
#スクール
正直スクール入ろうか検討している方は深く考えた方がいいです。スクールの転職保証などあてになりません。SESを否定するわけではありませんが、SES企業しか紹介してもらえないのが現実です。あと、関西ではrailsを使用している企業が少ないです。求人をみても関西はPHP/Javaの二強です。なので関西で就職したくてスクール卒の方はRailsの企業に就職するのは厳しいと考えた方がいいです。
#最後に
本当に転職活動しんどかったです。Wantedy、Greenなどで応募しまくりましたが、ほとんど書類選考で落ちます。自分を否定されてるようで辛かったです。転職期間は毎週面接を受けました。１１、１２といいところまで行った企業も落ちて振り出しに戻った為、年末年始は久しぶりに勉強をやめてやけ酒しました。
今も未経験から転職活動をしている方たちにこの記事が参考になれば幸いです。
未経験から転職活動は辛くて、厳しいですが頑張りましょう。心の底から未経験の仲間を応援しています。
Fragmentから他のフラグメントへの画面遷移

## FragmentからFragmentへの遷移
画面遷移の動きは、以下のようになります。

![画面収録-2021-01-21-10.13.11.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/953777/68363404-41b2-3c9b-aa1d-87ae09c053d5.gif)

動きとしては、
・MainActivityにFragment01(WelcomeFragment)を表示
・Fragment01からFragment02(MainFragment)へ遷移
・Fragment02からFragment03(SubFragment)へ遷移

---

## サンプルコード

```kotlin:WelcomeFragment
class WelcomeFragment: Fragment(R.layout.welcome_fragment) {

    private var _binding: WelcomeFragmentBinding? = null //
    private val binding: WelcomeFragmentBinding get() =  _binding!!

    override fun onViewCreated(view: View, saveInstanceState: Bundle?) {
        super.onViewCreated(view, saveInstanceState)
        this._binding = WelcomeFragmentBinding.bind(view)

        binding.next.setOnClickListener{
            findNavController().navigate(R.id.action_welcomeFragment_to_mainFragment)
        }
    }
}
```

```kotlin:MainFragment
class MainFragment:Fragment(R.layout.main_fragment) {

    private var _binding: MainFragmentBinding? = null //
    private val binding: MainFragmentBinding get() = _binding!!

    override fun onViewCreated(view: View, saveInstanceState: Bundle?) {
        super.onViewCreated(view, saveInstanceState)
        this._binding = MainFragmentBinding.bind(view)

        binding.nextTwo.setOnClickListener{
            findNavController().navigate(R.id.action_mainFragment_to_subFragment)
        }
    }
}
```

```kotlin
class SubFragment: Fragment(R.layout.sub_fragment) {
    private var _binding: SubFragmentBinding? = null
    private val binding: SubFragmentBinding get() = _binding!!

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        this._binding = SubFragmentBinding.bind(view)

        binding.nextLastButton.setOnClickListener {
            Toast.makeText(context,"よくできました",Toast.LENGTH_SHORT).show()
        }
    }

    override fun onDestroyView() {
        super.onDestroyView()
        this._binding = null
    }
}
```

---

## View bindを使用しているため、以下をbulidに追加する

```gradle
android {
  ...
  buildFeatures {
      viewBinding true
  }
}

/* または
android {
  ...
  viewBinding {
      enabled = true
  }
}
*/
```


---

追記：Fragmentにコンストラクタで、以下を渡してますが、推奨されていないようです。

```
R.layout~
```

---

### Reference:
https://developer.android.com/topic/libraries/view-binding?hl=ja
.(ドット)の意味が勉強できたエラー：Uncaught Error: Cannot find moduleの話

こんにちは。
現在JavaScriptを勉強中です。
今回はUncaught Errorに出くわしたのでその話をしたいと思います。

結論から申し上げますと、すごくしょうもない理由でした(笑)


# 経緯
Ruby on Rails アプリケーションにでJavaScriptを実装している段階で、すでに作成されているapplication.jsに読み込ませるJavaScriptファイルを記述しました。
ローカルサーバーにて、挙動を確認しようとしたところ、下記のようなエラーが出ました。

```
application.js:10 Uncaught Error: Cannot find module '../sample.js'
    at webpackMissingModule (application.js:10)
    at Object../app/javascript/packs/application.js (application.js:10)
    at __webpack_require__ (bootstrap:19)
    at bootstrap:83
    at bootstrap:83
webpackMissingModule @ application.js:10
./app/javascript/packs/application.js @ application.js:10
__webpack_require__ @ bootstrap:19
(anonymous) @ bootstrap:83
(anonymous) @ bootstrap:83
```

# 仮説
①webpackMissingModuleとあるので、またgem関連でエラーが生じているのかなと思い、bundle installを実施するも改善なし。
②読み込ませたいJavaScriptファイル内の記述がおかしいのかなとも考えましたが、そもそも読み込まないエラーなのであればその線は無い・・・。
③エラー内容をよく見ると、webpackMissingModuleの後に、`(application.js:10)`とあり、application.jsの10行目がおかしいのでは？と捉えられる・・・。

# 解消方法
結論としては、読み込ませる**JavaScriptファイルの配置ミス**でした。

application.jsの10行目を見ると、私はこのように記述をしていました。

```
require("../sample")
```

それに対して、実際のsample.jsファイルはこのような配置になっておりました。

app
　javascript
　　channels
　　packs
　　　sample.js

ファイル配置の書き方、見にくかったらすみません・・・。

上記のようにpacksのなかにsample.jsが存在しており、かつapplication.js内での読み込ませる記述が`("../sample")`となっていたため、今回のエラーが発生したようです。

したがって、sample.jsファイルを1つ上位ディレクトリ、javascriptディレクトリ直下に配置し直したところ、エラーは改善されました。

# 考察

今回私は何も考えずにパスの指定を

```
require("../sample")
```

としてしまいました。

このパスの指定における　**.(ドット)と..（ドットドット）**の意味をしっかり把握しておりませんでした。

**.(ドット)**→現在のディレクトリを表す。今回の場合であれば、application.jsが存在するディレクトリ、packsになります。
**..(ドットドット)**→現在のディレクトリより1つ上位のディレクトリを表す。今回の場合、application.jsが存在するディレクトリの1つ上位、javascriptディレクトリになります。

パスの指定というのは色々複雑で混乱してしまいますね。
とてもしょうもない理由で発生したエラーでしたが、誰かの参考になればとても幸いです。

ご覧いただきありがとうございました！
Linux とは？

#Linuxって何？
LinuxはOSの一種で、コンピュータを動かすための基本ソフト

OSの種類
・Windows
・macOS
・Linux
・Android

#シェルって何？
シェルはLinuxのCLIを提供するソフトウェア。ユーザーとLinuxカーネルの仲介役（カーネルのインターフェイス）をしている

＊CLIとは、キーボードからコマンド入力し、文字列として結果を出力するインターフェイス

##シェル画面
ユーザー名、ホスト名、プロンプトがシェルでは表示せれている。プロンプトは「コマンド入力を待ってるから、コマンド入力してね」というシェルが持っている記号

##ターミナルとシェル
Linuxを操作するときはターミナルにコマンドを入力する
ターミナルは入出力の画面を提供するソフトウェア。
なのでターミナルとシェルは別物なので注意！

・ターミナルは画面を担当するソフトウェア
・シェルはコマンドを解釈するソフトウェア
List IAM Roles sorted by rarely-used in one-liner

<!-- List IAM Roles sorted by rarely-used in one-liner -->

「残滓化している IAM Role の掃除をしたいので、候補を抽出したい」
こういった要望が弊社社内で聞こえてまいりましたので作ってみました


```bash
aws iam list-roles --query 'Roles[].{RoleName:RoleName}' --output text | xargs -I{} aws iam get-role --role-name {} --query 'Role.{RoleName:RoleName,RoleLastUsedDate:RoleLastUsed.LastUsedDate}' --output text | sort -k1,2
```

結果

```
2020-02-12T02:16:00+00:00       AWSServiceRoleForOrganizations
2020-07-06T08:27:16+00:00       Mycompany-LambdaIAMRole-XXXXXXXXXXXX
2020-07-06T08:29:55+00:00       Mycompany-LambdaIAMRole-XXXXXXXXXXXXX
...
2021-01-21T02:50:46+00:00       aws-controltower-CloudWatchLogsRole
```

`RoleLastUsed.LastUsedDate` で並べています
[AWS CloudShell](https://aws.amazon.com/jp/blogs/news/aws-cloudshell-command-line-access-to-aws-resources/) でも動作OKです:smiley:
(※Roleの数が90弱の環境で確認済み)
クラス名から高さをとってcss変数に入れる　メモ

###高さを取得

html部分

```app.vue
<template>
　//高さを取ってきたいとこ
  <v-app ref="app">
    <v-main>
      <nuxt />
　　　　//使うとこ
      <div class="aaa"/>
    </v-main>
    <the-footer />
  </v-app>
</template>
```

クラス名から要素の高さをとる時

```app.vue
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
  data () {
    return {}
  },
  mounted () {
    //appがクラス名
　　//変数appHeightに取得した高さを代入
    const appHeight = this.$refs.app.$el.clientHeight
   //css変数(--height)に代入
    document.documentElement.style.setProperty('--height', `${appHeight}px`)
  }
})
</script>
```

取ってきた要素の高さを使う時

```app.vue

<style lang="scss">

.aaa {
  //ここで使う
  height: var(--height, 100vh);
  background-color: red;
}

</style>

```
雰囲気で使っていたgitをちゃんと学んでみる

#何の記事？
[Git： もう怖くないGit！チーム開発で必要なGitを完全マスター](https://www.udemy.com/course/unscared_git/)を一通りやってみた感想を書きたいと思います。

# 筆者のレベル
一通りgit,GitHubを使ったことはあり、言われたことは調べながらなら出来るが、margeとrebaseってどっちがどうメリットがあるんだっけ？みたいな感じです。

# 何が学べるか？
gitの使い方はもちろん
* gitをなぜ使うか
* gitでファイルのバージョンを管理すると何が嬉しいのか
* gitの歴史
* GitHubってなに？
ってところから解説してくれるので本当にgitについて何も分からない人が初めて学ぼう！って時に非常に有用な講座だと思います。
それでも不安という方は[Git：はじめてのGitとGitHub](https://www.udemy.com/course/intro_git/#overview)という講座を先にやると良い旨が書かれているのでそちらをやってみることをお勧めします。

gitがどのようにファイルを保存しているかなど、gitを使うだけではなく中でどうなっているかも詳しく解説されているのでgitの使い方自体は分かるよって人にも学びがある講座かと思います。

# 一通りやってみた感想
gitのデータ構造がどうなっているかを通して理解を深めるように組み立てられているところが素晴らしいと思いました。
ステージに追加する時にgit addを叩いた際裏側では何が起きているかなどをイメージしやすいようにイメージ図とコマンドを対応づけて解説しており厳密には正確ではないところもありますが、イメージを掴むには非常に役立つと思います。
![スクリーンショット 2021-01-21 12.58.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/144491/569a037e-d01d-4d50-5f7e-d7a486064da7.png)

ネット上の多くの記事では「なぜ動くのか・どう動いているのか」ではなく「こうすれば動くよ！・こういう場合はこのコマンドを使うよ！」という内容の記事が多いのでそれらの記事で挫折した方でも別の視点から解説されたこの講座が理解の助けになるかもしれません。

これまでgitは難しそうで避けていた方、使っているけどなんとなくcommit,push,pullだけしているみたいな方は是非この講座をやってみることをお勧めします。
PL-900 - Microsoft Power Platform Fundamentals の受験記

#受験の経緯
+ 1/4 所属する会社にて、後輩にPL900の受験を進めるにあたり、まずは自分が取得したほうが良いのではと思いたち受験を決意。
+ 受験可能日を検索したところ、地方在住で、当月の受験可能日が、1/15のみ。仕方がないので2週間後で予約。（最近は在宅受験の方も増えてきているようなのですが、準備が少し面倒だということを聞いたので試験センターでの受験としました。）

#私のPlatform知識
+ 昨年５月末ぐらいから、特命を受けてPowerPlatformの提案・開発・導入にも従事。と言っても作成したものはあまり多くないです。その中でも担当は、主にポータルとPowerAutomate。キャンパスアプリとモデル駆動アプリの作成経験は少ない。PowerBIは、研修で１日体験した程度。powervirtualagentsは、未使用。

#PL-900に向けての学習
1. MSLearn
認定試験申し込み[サイト](https://docs.microsoft.com/ja-jp/learn/certifications/exams/pl-900)にあるラーニングパスの「[Microsoft Power Platform の基本](https://docs.microsoft.com/ja-jp/learn/paths/power-plat-fundamentals/)」を一通り実施。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/418815/c670769c-d96e-8c8b-0371-d2c35bd0e264.png)

1. Udemy
とりあえず申し込んじゃったので、1/5 学習教材を探して、Udemyの教材にたどりつき、以下を購入。
PL 900 Microsoft Power Platforms- 5 practice tests
https://www.udemy.com/course/pl-900-microsoft-power-platforms-5-practice-tests/
　
こちらは、４０問前後のテストが、５個ある形でした。
ちなみに英語ですが、ブラウザの自動翻訳を使えば問題なく使用できます。実際の試験の日本語訳も変な日本語が出題されることがあるので、試験対策にもなります。（日本語⇔英語の変換とその単語意味を比べる作業）
また、1/5は、ちょうど新春セールでお買い得でした。
　
まずは、一通り５個分のテストを実施してみて自分の実力を把握
　→　結果は、５０～６０％ぐらいの正答率。（試験に対応するには、まだまだ細かな知識が足りないと実感）
その後、MSLreanや、Docsを読むなどして、間違った個所を再学習し、最終的には正答率が１００％近くなるまで実施しました。
　
※Udemyのテスト形式や回答確認は見やすくて良かったのですが、間違った問題だけを、再テストできないのが少し面倒でした。できるようになるともっと素晴らしいのに～って思いながら、間違った問題番号だけを拾って回答していました。

1. Youtube
PL-900 Exam Power Platform Fundamentals PL900 Course
https://www.youtube.com/watch?v=iEYJ7feM_TM&list=PLhLKc18P9YOAw_Iuo68yy47_HDoH7AT1N
こちらの動画でも一通り学習。英語ですが、実際の操作画像やチャプターの終わりにあるチェックテストなど自分の知識向上に役立ちました。

1. Docs
Microsoft Power Platform ドキュメント
https://docs.microsoft.com/ja-jp/power-platform/
こちらの内容の拡充も素晴らしいです。わからないことは、これで調べると納得いくことが多いです。

#試験結果と感想
+ 何とか一発合格
+ この試験に限らず、テスト問題を実施して単語を覚えて、知識だけあれば合格できるというものではなく、実際に触っていて、使っていないと合格点に達することができないように感じました。（Udemyの学習が無駄というわけではありません。試験パターンの認識や、自分の苦手個所を洗い出し、学習精度を高めるためには十分役に立ちました。）
+ 受験される方は、とにかく触ってみる、アプリを作ってみることをお勧めします。

最後まで、お読みくださってありがとうございます。
誤植や、不適切な記述等ありましたら、ご指摘いただけますとありがたいです。
【React初心者】Warning 「 Each child in an array or iterator should have a unique "key" の対処方法

#はじめに
yosukeです！
先日、私が所属するevoluの自社サービスとしてリリースした「 [小説執筆アプリ - Mono - ](https://www.mono-kaki.site/) 」のUIを急遽Reactで作り直しちゃおうとなり、０からReactを学びながら実装に励んでおります！

##状況
小説のタイトルのeditページ更新処理を行う関数コンポーネント内でmapを使いform内で更新対象のカラムをループ描画させた

##結果
問題なく動作はするがデベロッパーツールのコンソールに表題のエラーが表示される




##結論
「配列に、一意の「キー」が必要です」とのことなので、ループ処理領域のFormタグにkeyを渡して解消

```Typescript:edit.tsx　コンポーネント単体でキー指定
  return (  
            //省略

  {users.map((user) =>
          <Form key={(user.id)}>

            //省略

     )}

```




こんな感じでkey属性に一意の値を渡してあげれば解消します。

```Typescript:edit.tsx　親コンポーネント側に子コンポーネントを呼んでキー指定する場合
return (
    <>
      {users.map((user) =>
        plot.plot_contents.map((plot_content) =>
          <PlotEditForm
            name={user.name}
            key={user.id}///これ！
          />
        ))}
```
コンポーネントをpropsでやりとりしている場合は親コンポーネント側でkeyを指定してあげます。


詳しくはこちら
https://facebook.github.io/react/docs/lists-and-keys.html
これを読むと、listで書かれてますがFormも同じで、返されるDOMはidを持つことで不要なレンダリングを避けたりできるとのこと。
「ユニークなidをkeyに渡すことでパフォーマンス低下対策をしている」という感じですかね。


参考doc：https://facebook.github.io/react/docs/lists-and-keys.html
DynamoDB Enhanced Client にて、なぜかインデックステーブルに対してアクセスしてしまう

# エラー内容
エラー文は以下の通り。

```java
java.lang.IllegalArgumentException: A sort key value was supplied for an index that does not support one. Index: $PRIMARY_INDEX
```
# 結論
属性に対するゲッター・セッターの定義がおかしい。（敗北N回目、、、）

# 対処
適切なゲッター・セッターを設定しましょう。
具体的には以下の2点をチェック。

- メソッド名
- 引数の型

# 発生状況
筆者の場合は以下のような形で発生しました。

```java
@DynamoDbBean
@Setter
public class Foo {

  private String name;
  private String date;

  @DynamoDbAttribute("name")
  public String getName() {
    return name;
  }

  @DynamoDbAttribute("date")
  public String getDate() {
    return date;
  }

  public setDate(Date date) {
    this.date = new SimpleDateFormat("yyyy-MM-dd").format(date);
  }

}
```

原因は`Foo#setDate(Date)`ですね。
テーブルのメタデータにはゲッターとセッターを設定する必要があります。
`@DynamoDbAttribute`アノテーションで設定する場合は、メソッドの名称と引数の型を、フィールドと合わせる必要があります。
フィールド`date`は`String型`で定義されていますが、セッターでは`Date型`を受け取ってしまっています。
Lombockの`@Setter`アノテーションで生成されるセッターとはシグネチャが異なるので共存可能であり、`Foo#setDate(String)`も定義されています。
しかし、テーブルのメタデータとしては`Foo#setDate(Date)`が拾われてしまうようです。
そこからなぜか、インデックステーブルへアクセスしようとし、エラーが発生してしまうようですね。
【フロントエンド開発】初投稿

# 初めに
フロントエンドでチーム開発をしています。
チーム開発でのあれこれや、プロジェクトで使用している技術関連の話題を投稿していきます。

## 使用している技術関連
* React
* javascript/CSS/HTML
* typescript
* Electron
* ASP
* Git
* AWS
* GraphQL
* Node.js
* ReactNative/expo

# 目的
開発中に躓き調査した内容や、新しい技術を取り入れた場合に苦労したことなどを
個人のナレッジにとどめず共有していくことを目的としています。
Azure IoT Hub の イベントハブ互換エンドポイントに Node.js で subscribe

次のプログラムを改造して、イベントハブ互換エンドポイントを使うようにしました。
[Azure IoT Hub に Node.js で subscribe](https://qiita.com/ekzemplaro/items/9933236f6c2ab3dee121)
Hub に subscribe しているので、その Hub 内の Device に届いた総てのメッセージが表示されます。Device の認証が、SAS トークンでも、CA 証明書でも、どちらも表示されます。

```js:azure_endpoint_subscribe.js
#! /usr/bin/node
// ---------------------------------------------------------------
//	azure_endpoint_subscribe.js
//
//					Jan/21/2021
//
// ---------------------------------------------------------------
'use strict'
const dotenv = require('dotenv')
const { EventHubConsumerClient } = require("@azure/event-hubs");

dotenv.config()

const endpoint_connectionString = `${process.env.ENDPOINT}`

var printError = function (err) {
  console.log(err.message)
};

var printMessages = function (messages) {
  for (const message of messages) {
    console.log("Telemetry received: ")
    console.log(JSON.stringify(message.body))
    console.log("")
/*
    console.log("Properties (set by device): ");
    console.log(JSON.stringify(message.properties));
    console.log("System properties (set by IoT Hub): ");
    console.log(JSON.stringify(message.systemProperties));
    console.log("");
*/
  }
}

// ---------------------------------------------------------------
async function main() {
  console.error("*** azure_endpoint_subscribe.js *** start ***")

  const clientOptions = {
  }

  const consumerClient = new EventHubConsumerClient("$Default", endpoint_connectionString, clientOptions)

  consumerClient.subscribe({
    processEvents: printMessages,
    processError: printError,
  })
}

main().catch((error) => {
  console.error("Error running sample:", error)
})

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

```text:.env
ENDPOINT="Endpoint=sb://ihsuprodkwres017dednamespace.servicebus.windows.net/;SharedAccessKeyName=iothubowner;SharedAccessKey=vL1ze1abcdefgh48cMK7l6nv6+o37k2s9F70SD+LLZUs=;EntityPath=iothub-ehub-iot-bb-344012-58f0012d36"
```

Azure Portal で　エンドポイントの値を取得

![endpoint_jan21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/e5dcbcd4-a7f9-806a-96b0-4bcf52b32803.png)
Railsチュートリアルはじめます

#はじめに
2020年12月末からプログラミング学習を始め、2021年1月21日現在で以下の学習を終えました。

* HTML&CSSコース (#Progate)
* はじめてのHTML (#ドットインストール)
* はじめてのCSS (#ドットインストール)
* JavaScriptコース (#Progate)
* 詳解JavaScript 基礎文法編 (#ドットインストール)
* Rubyコース (#Progate)
* Ruby入門 (#ドットインストール)
* SQLコース (#Progate)
* MySQL入門 基礎編 (#ドットインストール)
* MySQL入門 応用編 (#ドットインストール)
* はじめてのGitとGitHub (#Udemy)

# 学習を通じて
今までは日々の学習をTwitterでアウトプットしていましたが、Qiitaでのアウトプットも挑戦しようと思います。
Railsチュートリアルの学習で以下のアウトプットをしていく予定です。

* できるようになったこと
* わからない→わかったまでの解決方法
* 感想や意気込み

また、Qiitaでのアウトプットを通じて、以下のスキルを伸ばしていきたいと考えています。

* マークダウン方式をできるようになる
* 140文字以上のアウトプットに慣れる

#さいごに
* もっとこうしたほうがいいよ！
* ここのエラーはこういう意味だよ！

などなど…お気づきの点がございましたら、コメントいただけると大変励みになります。
どうぞよろしくお願い申し上げます。
Ubuntuで監視に便利なコマンド[通信速度、CPU負荷率、ディスク、電源]

##通信速度を監視する

nloadをインストール

```
sudo apt install nload
```
nloadを実行

```
nload
```
実行結果
![Screenshot from 2021-01-21 11-51-55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/040f311b-50da-3e0c-e174-2175e12bfbbf.png)

##CPU負荷率を監視する

htopをインストール

```
sudo apt install htop
```
htopを実行

```
htop
```
実行結果
![Screenshot from 2021-01-21 11-57-45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/a3c95d55-1b5b-c2b2-eb7f-a2fa6e339138.png)

##ディスクを監視する

iotopをインストール

```
sudo apt install iotop
```
iotopを実行

```
sudo iotop
```
実行結果
![Screenshot from 2021-01-21 12-04-31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/1f0e7ee5-a016-99a5-9de2-2a2675a931a5.png)

##電源を監視する

powertopをインストール

```
sudo apt install powertop
```
powertopを実行

```
sudo powertop
```
実行結果

![Screenshot from 2021-01-21 12-07-19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/edab5371-ed9a-9a1e-3f79-cc5c4f9a4503.png)
自分が競プで書いたやつまとめ

3桁の数字を100の位10の位1の位に分ける

```php:keta3.php
　int s_1,s_2,s_3,number;
  cin >> number;
  s_1 = number/100;
  s_2 = (number - s_1*100)/10;
  s_3 = (number -s_1*100 - s_2*10);
  cout << s_1 + s_2 + s_3 << endl;
```
四捨五入

```php:sisyagonyu.php
int main() {
  int a,b;
  cin >> a >> b;
  cout << (a+b+1)/2 << endl;
}
```
1/2を加えれば0.5未満は0.9未満、0.5以上は1以上になる
「1時間以内に作成されたレコードのみ一覧」が思ったより大変だった話

# はじめに

- キンコミにも書いたけどqiitaにも記事残します
- 「1時間以内に作成されたレコードだけの一覧が欲しい」と言われてつくりました
- 気楽に受けたけど思ったより大変でした

# 自己紹介です
[![main_image.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/564c7de8-6fc7-61c7-a97f-f8d0a7c9943d.jpeg)](https://www.maru-t.co.jp/painting_brush/)

- ｲｼｲｹﾝﾀﾛｳです
- 刷毛をつくっている会社の兼業情シスです
- kintone認定資格は3つとも取得済です

![アソシエイト.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/761a3907-f9f7-4da5-c5e9-9ae9e9d90e04.png)　![アプリデザイン.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/3fa2bf0c-e0f9-f8ea-a9fb-88611caa545b.png)　![カスタマイズ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/476db7b8-509f-a484-7913-2dd61afa63f2.png)

- その他にITストラテジストやシステム監査技術者などの国家資格をいくつか取得しています
- kintoneのカスタマイズは社内向けのみで、プラグインは作ってません（作れません）

# やりたいこと

formBridgeから登録されたレコードのうち、直近1時間以内に登録されたもののみをkViewerで表示したい

# 動くまでの経緯

1. 「本日登録されたレコードのみ表示」は標準機能でできるが、時間単位だと現在日時との比較しかできない
1. 作成日時に1時間加えた「1時間後」フィールドを作って、「1時間後 >= 現在日時」という絞り込み条件にすると、1時間以内に作成されたレコードだけが表示されるハズ
1. 「1時間後」を計算フィールドで作成 → 作成日時 + 60 * 60
1. 計算フィールドは現在日時と比較できない！
1. 日時フィールドに作成日時の1時間後を入れる js を記述
1. formBridgeからの登録なので app.record.create.submit が動かない！
1. formBridge側で fb.events.form.mounted に書く → やっと動いた

# formBridge実装

``` javascript
  fb.events.form.mounted = [ (state) => {

    // 1時間後日時の生成
    const now = new Date();
    const afterAnHour = new Date();
    afterAnHour.setHours(now.getHours() + 1);

    // 1時間後日時のセット
    state.record.afterAnHour.value = afterAnHour;

    return state;
  }];
```

# kViewer実装

![kViewer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/0730213c-f3dc-cb8b-078c-736b238e049a.png)

# おわりに

- 厳密にはフォームがマウントされた日時から1時間後なので、開きっぱなしのフォームから登録されたら1時間以内でも一覧から消えちゃう
- もっと簡単なやり方あったら教えてください
- そしていつものですが、塗装用ローラーもつくってます

[![main_image (1).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105085/d20f1b7b-355a-1524-829f-71fcd21bdfed.jpeg)](https://www.maru-t.co.jp/painting_roller/)
bundle install　エラー



実行環境:
Winodows 10 Pro (64bit)
Vagrant 2.2.14
Ubuntu 16.04.6 LTS
Docker 18.09.7
ruby:ruby 2.7.2p137
Docker のコンテ内でRubyのsinatraライブラリをインストールするために
bundle install を実行したところ、以下のエラーが発生しました。
````

````
Fetching source index from https://rubygems.rog/

Retrying fetcher due to error (2/4): Bundler::HTTPError Could not fetch specs from https://rubygems.rog/

Retrying fetcher due to error (3/4): Bundler::HTTPError Could not fetch specs from https://rubygems.rog/

Retrying fetcher due to error (4/4): Bundler::HTTPError Could not fetch specs from https://rubygems.rog/

Could not fetch specs from https://rubygems.rog/
```
以下のコマンドを実行したら解決したという情報を入手
````

````
gem update --system
````
再度インストールを実行。変化がありません。

wget https://api.rubygems.org/specs.4.8.gz を実行してダウンロードできるか試しましたが、これは成功しました。
ドメインの IP アドレスを調べました。
````

````
root@dfed40fdb477:/var/www# host api.rubygems.org
api.rubygems.org is an alias for rubygems.org.
rubygems.org has address 151.101.2.132
rubygems.org has address 151.101.130.132
rubygems.org has address 151.101.194.132
rubygems.org has address 151.101.66.132
rubygems.org has IPv6 address 2a04:4e42::644
rubygems.org has IPv6 address 2a04:4e42:200::644
rubygems.org has IPv6 address 2a04:4e42:600::644
rubygems.org has IPv6 address 2a04:4e42:400::644
rubygems.org mail is handled by 10 mxb.mailgun.org.
rubygems.org mail is handled by 10 mxa.mailgun.org.

````
hostファイルに記述しました。

````
151.101.2.132  api.rubygems.org
151.101.130.132   api.rubygems.org
151.101.194.132  api.rubygems.org
151.101.66.132  api.rubygems.org

2a04:4e42::644 api.rubygems.org
2a04:4e42:200::644 api.rubygems.org
2a04:4e42:600::644 api.rubygems.org
2a04:4e42:400::644 api.rubygems.org
````
インストールが正常にできました。
Automation360 - OCRアクションの日本語向け調整

## Automation360 OCRアクションの日本語向け調整

Automation360のOCRアクションは、ABBYY社のエンジンが用いられています。
最近のリリースでは、下記の様にロケールとして「日本語」を選択することが可能となっていますが、
正直、満足できる認識結果にはならないかと思います。

| OCRアクション |
|:-:|
|  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/e16ef565-8fcc-16e7-99bb-c7d7ce18d570.png) |

そこで、
ロケール選択の上にある、プロフィールを作成して適用してみます。
色々パラメータがあるのですが、まず、言語を指定しています。
> TextLanguage=JapaneseModern

ABBYYには、JapaneseとJapaneseModernという２種類があり、それぞれ、もともと日本語向けに作られていたJapaneseモデルと、用語の数は少ないが古い文献等で使われるような文字を中心に省くことで精度の向上が図られたJapaneseModernというモデルがありますので、ここではJapaneseModernを設定しています。
他にも、各種パラメータがありますので適宜調整しています。認識対象によっては対象フォントの指定も変えたほうが良いかもしれません。

```AbbyyProfile.ini
[ObjectsExtractionParams]
DetectPorousText = TRUE
DetectTextOnPictures = TRUE
EnableAggressiveTextExtraction = TRUE
FastObjectsExtraction = FALSE
ProhibitColorImage = FALSE
RemoveGarbage = TRUE
RemoveTexture = FALSE

[PageAnalysisParams]
DetectPictures = TRUE
EnableTextExtractionMode = TRUE
ProhibitModelAnalysis = FALSE

[PrepareImageMode]
CorrectSkew = FALSE
DiscardColorImage = FALSE
UseFastBinarization = FALSE

[RecognizerParams]
FastMode = FALSE
TextLanguage=JapaneseModern

[SynthesisParamsForDocument]
DetectDocumentStructure = TRUE
DetectFontFormatting = FALSE

[SynthesisParamsForPage]
DetectFontFormattingAtPageLevel = TRUE
DetectTextColor = TSPV_Yes
```

## プロフィール摘要の効果は？

はい、一目瞭然ですね。
皆さんも、プロフィール活用してみてください！
（A360(A2019)画面上「プロフィール」と訳されてるのでそう書いてきましたが、「プロファイル」の方がしっくりくるのは私だけ？？）

| 対象 | ロケール指定のみ | プロフィール有り |
|:-:|:-:|:-:|
| ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/ad7f9dc0-c703-4c9a-3590-e4a17ec68e7a.png)  |  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/dcf66a00-2aa6-7a2a-7f21-2856dec9e71b.png) | ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/efc9cb1a-928a-643d-8425-bc0fadd3ef56.png)  |
Postgresで日付から曜日を取得する方法

#extract関数を使用する

extract関数してdow (曜日)を数値で取得できます。
関数の詳細は<a href="https://www.postgresql.jp/document/7.2/user/functions-datetime.html#FUNCTIONS-DATETIME-EXTRACT">こちら</a>

>曜日（0～6、日曜日が 0、timestamp の値のみで使用可）

という仕様なので、arrayの先頭が日曜になるように対応させればOKです。

```
SELECT
　(array['日','月','火','水','木','金','土'])[EXTRACT(dow FROM timestamp_column)]
FROM table;
pyppeteerで別タブを取得する

puppeteerはよく見るのですが
memo


```python
    result_page_future = asyncio.get_event_loop().create_future()
    browser.once(
    |   'targetcreated',
    |   lambda target: result_page_future.set_result(target)
    )

    _link = await page.J('a.hoge')
    await _link.click()

    newtab_page = await (await result_page_future).page()
    await newtab_page.close()
````
Deniteのmatcher/clapでエラーが発生

## サマリ

- プラグインをアップデートしたらDeniteのfilterがうまく動かなくなってしまった。
- 原因を調査したところ、vim-clapにアップデートがあり、それにDeniteが対応した事が原因だった。
- vim-clapを再ビルドして、Vimを再起動したら解消された。

## 詳細

まずはエラーが出ていないか確認

```vim
:messages
```

```python
 [denite] TypeError: fuzzy_match() takes at most 5 positional arguments (6 given)
```

というメッセージがあり、引数が想定より多く渡されているのがわかった。

メッセージ内にあった下記の該当箇所を見てみると
`~~/denite.nvim/rplugin/python3/denite/filter/matcher/clap.py", line 61`

確かに、`fuzzymatch_rs.fuzzy_match()` というメソッドに引数が6個渡されていた。

`fuzzymatch_rs`が何なのかgrepしてみると

```python
clap_path = Path('{}/pythonx/clap/fuzzymatch_rs{}'.format(
                self.vars['clap_path'], ext))
```

となっており、clap内のメソッドであることがわかった。
ここで、vim-clapにアップデートがあったんだなと気がつく。

そこで、`:help denite-filter-matcher/clap`を参考にclapを再ビルド。
解消に至った。
なるほどSassという話。

# はじめに
昔知り合いの方にSassが便利だの言われていました。
今回はSassをほんの少し学習したのでアウトプットします！

# Sassってなんですか？CSS？？？
Sassで不思議に思っていたのは、「Sass」と「Scss」の
2種類の書き方があって少しめんどくさそうだなと思っていましたが実際はめんどくさくなくて便利でしかありませんでした！

Sass記法はセレクタやクラスの後に{  }を使わないでインデントで書いてくみたいです。

Scss記法はCSSの書き方で入れ子にしていく書き方です！progateで学習している自分はこのScssの書き方でやってきます！

##Sassのメリット
-　CSSよりも記述量を減らせる
-　コードを再利用できる
特に記述量を減らせるのは何よりもありがたいですね！
##Sassの書き方

```qiita.scss
    .button {
     display: inline-block;
     padding: 8px 24px;
     color: white;
     opacity: 0.8;
     background-color: #f778b8;
     box-shadow: 0 5px #e04893;

      &:hover{
       opacity: 1;
       }

      &:active{
       position: relative;
       top: 7px;
       box-shadow: none;
       }
    }
```

こんな感じです！buttonクラスの中にhoverとactiveがネストされてます！
ポイントは「&」ですねー、&つけると「button：hover」みたいになります！

なのでボタンの上にカーソルが乗っかると透明度が変わって、ボタンをクリックするとactiveの変化が起きます！
#結論
Sass学習する前はcssの学習無駄になるのかな？とか思ってたりしてましたがとんでもないですね！
これからもSass使ってきます！！
Firebase Authentication で このアプリは確認されていません とエラーが出た時 Firebase UI

こんな感じのエラーが出た時

![画像1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/262297/d39d131d-9f39-d60c-69d1-738736b08398.png)

これを

```
ui.start('#firebaseui-auth-container', {
  signInOptions: [
    {
      provider: firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      scopes: [
        'https://www.googleapis.com/auth/contacts.readonly'
      ],
      customParameters: {
        // Forces account selection even when one account
        // is available.
        prompt: 'select_account'
      }
    },
    {
      provider: firebase.auth.FacebookAuthProvider.PROVIDER_ID,
      scopes: [
        'public_profile',
        'email',
        'user_likes',
        'user_friends'
      ],
      customParameters: {
        // Forces password re-entry.
        auth_type: 'reauthenticate'
      }
    },
    firebase.auth.TwitterAuthProvider.PROVIDER_ID, // Twitter does not support scopes.
    firebase.auth.EmailAuthProvider.PROVIDER_ID // Other providers don't need to be given as object.
  ]
});
```

こうする

```
ui.start('#firebaseui-auth-container', {
  signInOptions: [
    {
      provider: firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      scopes: [
        'email'//ここを変える
      ],
      customParameters: {
        // Forces account selection even when one account
        // is available.
        prompt: 'select_account'
      }
    },
    {
      provider: firebase.auth.FacebookAuthProvider.PROVIDER_ID,
      scopes: [
        'public_profile',
        'email',
        'user_likes',
        'user_friends'
      ],
      customParameters: {
        // Forces password re-entry.
        auth_type: 'reauthenticate'
      }
    },
    firebase.auth.TwitterAuthProvider.PROVIDER_ID, // Twitter does not support scopes.
    firebase.auth.EmailAuthProvider.PROVIDER_ID // Other providers don't need to be given as object.
  ]
});
```

と出なくなるはず
【Rails チュートリアル】"NoMethodError (undefined method `activation_digest=' for  #<User:0x00000003156938>

# "NoMethodError (undefined method `activation_digest=' for  #<User:0x00000003156938>

について

何故か本番環境だけで、このエラーがみられた

**user.rb**

```
    def activate
      self.update_attribute(:activated,    true)
      self.update_attribute(:activated_at, Time.zone.now)
    end
```

とself.をつけ忘れてた

何故、ローカルだと問題なかったのか、、、
push declined due to email privacy restrictions

# 事象 : GitHubにプッシュして怒られた
- 環境
    - macOS Big Sur バージョン11.1
    - git version 2.28.0

```bash
$ git push
Enumerating objects: 3, done.
Counting objects: 100% (3/3), done.
Delta compression using up to 4 threads
Compressing objects: 100% (2/2), done.
Writing objects: 100% (2/2), 282 bytes | 282.00 KiB/s, done.
Total 2 (delta 1), reused 0 (delta 0)
remote: Resolving deltas: 100% (1/1), completed with 1 local object.
remote: error: GH007: Your push would publish a private email address.
remote: You can make your email public or disable this protection by visiting:
remote: http://github.com/settings/emails
To https://github.com/{ユーザ}/qiita-shitagaki.git
 ! [remote rejected] master -> master (push declined due to email privacy restrictions)
error: failed to push some refs to 'https://{ユーザ}:{トークン}@github.

```

## 原因 : 非公開のメールアドレスでのコミットをプッシュしているから
```text:メッセージの訳
電子メールのプライバシー制限によりプッシュが拒否されました
```
そういえばそんな変更したな・・・

> Block command line pushes that expose my email
> If you push commits that use a private email as your author email we will block the push and warn you about exposing your private email.
> (ざっくり訳)
> メールを公開するコマンドラインプッシュをブロックする
> プライベートメールを作成者のメールとして使用しているコミットをプッシュすると、プッシュをブロックし、プライベートメールを公開することを警告します。
> ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/159761/e089558e-78b6-6fb1-2203-4092806e22c6.png)

### 対応 : 違うメールアドレスを設定してやり直す

```bash
# 1. コミットを取り消す
$ git reset --soft HEAD^

# 2. 非公開にしたのとは違うメールアドレスを設定する
$ git config user.email '{違うメールアドレス}'

# 3. 今一度コミットする
$ git commit -m 'Qiitaに投稿した。'
[master 177393c] Qiitaに投稿した。
 1 file changed, 22 deletions(-)
 delete mode 100644 いろいろなログの場所.md

# 4. プッシュする
$ git push
Enumerating objects: 3, done.
Counting objects: 100% (3/3), done.
Delta compression using up to 4 threads
Compressing objects: 100% (2/2), done.
Writing objects: 100% (2/2), 305 bytes | 152.00 KiB/s, done.
Total 2 (delta 1), reused 0 (delta 0)
remote: Resolving deltas: 100% (1/1), completed with 1 local object.
To https://github.com/{ユーザ}/qiita-shitagaki.git
   d631d06..177393c  master -> master
```
slacker.error: not_allowed_token_typeで困っている君へ

# error: not_allowed_token_type ???
PythonのSlackBotライブラリを使ってbotを作っていた所、このエラーが出た。
色々調べた結果、このエラーはSlackのbot作成のリンクが原因っぽい。
とりあえず解決したので書く。

# なにも考えず以下のリンクからbotを作成
https://slack.com/apps/A0F7YS25R-bots

リンクを開くと、こんな画面が出てくるので「Slackに追加」を選択
![qiita_slack_error.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250163/7181921e-935e-f8a8-a076-824d0315b78c.png)

適当に自分がつけたい名前をつける。例：「awesome_bot」
ボットインテグレーションを追加を選択
![qiita_slack_error2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250163/1404ff49-9e94-6f08-ffe4-781457555d52.png)

この！！APIトークンこそが！！君が欲しかったものだよ！！！！
![qiita_slack_error3_paint.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250163/95ded257-b9ee-6115-bd65-b4450c92c17d.png)


このTokenをPythonならSlackbotライブラリとかにぶち込めば、
not_allowed_token_type エラーは消えるはず。
では。


参考URL
https://hiro99ma.blogspot.com/2020/03/slackrtm20200311.html
AWSのRDSを削除したのに課金され続けてしまった話。。。原因が分かった。。。

AWSのRDSを使いアプリを作成していましたが、
結構月額が高いし、あまり使わなくなったので
RDSを削除しました。



ですが、なぜが、まだ課金されている???

![スクリーンショット 2021-01-21 11.10.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355517/7a58f18b-3a94-b0ad-4023-77f7d6e28c5c.png)


なぜ？？？？？

### 結論：スナップショットが残っていると課金し続けるようです。。。



https://ap-northeast-1.console.aws.amazon.com/rds/home?region=ap-northeast-1#snapshots-list:

スナップショットが残っている人は削除しましょう！！！！！！

やはり
AWSは奥が深いですね。。。
CloudFormationでApiGatewayのログを有効化に必要な諸々の設定をする

共通の設定が必要なのでどっかに書く

```yaml
Resources:
  APIGatewayPushToCloudWatchLogsRole:
    Type: AWS::IAM::Role
    Properties:
      Description: "Allows API Gateway to push logs to CloudWatch Logs."
      AssumeRolePolicyDocument:
        Version: 2012-10-17
        Statement:
          Effect: Allow
          Principal:
            Service: apigateway.amazonaws.com
          Action: sts:AssumeRole
      ManagedPolicyArns:
        - arn:aws:iam::aws:policy/service-role/AmazonAPIGatewayPushToCloudWatchLogs

  ApiGatewayAccount:
    Type: AWS::ApiGateway::Account
    Properties:
      CloudWatchRoleArn: !GetAtt APIGatewayPushToCloudWatchLogsRole.Arn
```
結局ScrollViewのConstraintってどうつければいいの？

> 1. UIScrollViewの上下左右をUIViewControllerのViewに合わせる
2. ContentViewの上下左右をContent Layout Guideに合わせる
3. ContentViewの横幅をFrame Layout Guideに合わせる(Equal Widths)
4. ContentViewにオブジェクトを追加して高さを確定させる

> 名前の通り、Content Layout GuideはUIScrollViewの中身、Frame Layout GuideはUIScrollViewのフレーム領域を示します。
> https://qiita.com/owen/items/2fab4a4482834b95e349

## つまづきやすかったこと
### ContentView は自分で UIView を追加して作る
UIViewで囲むのがセオリーとは思うものの、ちょっとAppleさん不親切‥

### Content Layout Guide の制約に注意
ContentView に Content Layout Guide の上下左右の制約をかけるとき、ちゃんと画面いっぱいに伸ばしてCtrlで制約を引っ張ってもなぜか+315や+812とズレがつく。見た目では気づきにくいが、これを0に修正しないとスクロールしないので注意。
![スクリーンショット 2020-12-31 18.48.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242610/372fea40-5dd5-c943-4c5e-5de724005fde.png)
![スクリーンショット 2021-01-21 10.35.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242610/5b55b9dc-346d-3717-8de3-8cebdaa8c7a9.png)


### 高さを確定させよ
中のコンテンツの一番下の要素にContentView.bottomとのconstraintを付けないと高さ確定しないので怒られる。

## よくある間違い？
### ContentViewのbottomをFrame Layout Guideに合わせてしまう
正しい設定では中の要素が少ない時に下側がスカスカに空いてしまう場合がある。それを埋めようとContentViewのBottomをFrameに合わせると、FrameはiPhoneの上下左右の見えてる部分らしく、本来もっと下に伸びるべきContentViewのBottomがiPhoneの底で止まってスクロールしなくなる（伝われ）。
![スクリーンショット 2021-01-21 10.35.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242610/c7c770e4-2263-d157-9500-483a83fc46ed.png)
中身が少なく下が空いてしまうときは、ContentViewとScrollViewの背景色をあわせて空いてないように見せるしかないのかしら？
STM32L010F4P6と液晶、ACM1602K-NLW-BBWでHello Worldを表示2(信号線3本)


x 原因は、わからないが液晶がちらつく場合は、ウェートを調整してね!!


STM32L010F4P6でmbedを使い16文字2行液晶に
Hello Worldを表示するプログラム

74hc164シフトレジスターを使用した。
液晶とのピン数を節約した。信号線10本から
信号線3本に減らした。

1 CLK クロック端子(緑)
2 RSDATA RS端子とデータの共有端子
3 E 読み込み書き込み同期信号


![h_con39.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/cd6261b3-1d70-14f1-ebb1-f4ea341e2573.jpeg)



```c++

#include "mbed.h"
 
//*          *****  *****       ***  * *
//*         *       *    *     *   * * *
//*         *       *    *     *   * * *
//*         *       *    *     *   * * *
//*         *       *    *     *   * * *
//********   *****  *****       ***  * *
 
#define swclk1  PA_5    //A4
#define swdio1  PA_7    //A6
#define en1     PA_4    //A3
 
DigitalOut swdclk(swclk1);
DigitalOut swdio(swdio1);
DigitalOut en(en1);
 
//Serial pc2(USBTX, USBRX); // tx, rx
 
int v;
int rs;
void seg1()
{
    swdio=((v>>7)&1);swdclk=1;swdclk=0; //7
    swdio=((v>>6)&1);swdclk=1;swdclk=0; //6
    swdio=((v>>5)&1);swdclk=1;swdclk=0; //5
    swdio=((v>>4)&1);swdclk=1;swdclk=0; //4
    swdio=((v>>3)&1);swdclk=1;swdclk=0; //3
    swdio=((v>>2)&1);swdclk=1;swdclk=0; //2
    swdio=((v>>1)&1);swdclk=1;swdclk=0; //1
    swdio=((v>>0)&1);swdclk=1;swdclk=0; //0
    swdio=rs;   //delay(500);
    en=1;       //delayMicroseconds(40);
    wait_ms(1);
    en=0;       //delay(500);
}
 
 
int main() {
    
    //pc2.baud(9600);
   
    //pc2.printf("Hello World!");

    swdio=0;
    for(int i=0;i<10;i++){
        swdclk=1;
        wait_ms(15);
        swdclk=0;
        wait_ms(15);
    }
    
    //ファンクションセット1
    rs=0;
    v=0x30;seg1();
    wait_ms(5);
 
    //ファンクションセット2
    rs=0;
    v=0x30;seg1();
    wait_ms(1);
 
    //ファンクションセット3
    rs=0;
    v=0x30;seg1();
 
    //ファンクションセット 2ラインモード
    rs=0;
    v=0x38;seg1();
 
    //表示オフ
    rs=0;
    v=0x08;seg1();
 
    //画面クリア
    rs=0;
    v=0x01;seg1();
    wait_ms(2);
 
    //エントリーモードセット
    rs=0;
    v=0x06;seg1();
 
    //表示オン
    rs=0;
    v=0x08+0x04;seg1();
 
    //@文字の表示
    rs=1;
    v='@';seg1();
    wait_ms(2); 
 
    //1ライン目にカーソルを移動
    rs=0;
    v=0x80+0x00;seg1();
    wait_ms(2); 
    
    int ii;
    char ss1[]="Hello World !";
    ii=0;
    while(ss1[ii]!=0){
        //文字の表示
        rs=1;
        v=ss1[ii];ii++;seg1();
        wait_ms(2); 
    }
 
    while(1) {}
}


```

![143DDF63-9A6A-4ABB-B125-45A51949CDEF.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/1fcfcf95-7581-a065-e8f3-e0c5507fcc9a.jpeg)

![led_sift_1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/2e7a9f68-5e49-19d9-ba61-89d8e6d723d2.jpeg)
Git $ git log の表示の先頭コミットを指定する

# 目的

- `$ git log`コマンドの表示を特定のコミット先頭に表示する方法をメモ的にまとめておく。

# 方法

- 下記コマンドを実行して特定のコミットを先頭にコミットログを表示する。

    ```terminal
    $ git log コミットID
    ```
【Laravel】(備忘録)Formファサードを使ったselectbox作成

###LaravelのVersion

```
$ php artisan --version
Laravel Framework 6.20.12
```

#やりたいこと
"選択して下さい"の様なoption(尚且つvalueはnull)を含んだselectboxを作りたい。

まずはパッケージのインストール。

```
$composer require laravelcollective/html:6.*
```

これでFormファサードが使えるようになり、最終的にこの形になった。

```sample.blade.php
{{ Form::select('sample_id', \App\Sample::select('id', 'sample_name')->where('user_id', Auth::id())->get()->pluck('sample_name', 'id')->prepend("選択して下さい", ""), $sample_id) }}
```

```SampleController.phpのメソッド
~
public function sample($sample_id = null) {
~
```

工夫した点としては、Auth::id()を使ってユーザ固有のsampleを取り出せるようにしたことと、
Form::select()の第三引数はselectboxの初期選択位置なので、sample_idとし、
Controllerの引数のデフォルト値をsample_idとすることで、初期選択は未選択でも既に登録されてる値でも対応できるようにした。

pluck()がいるのか微妙だし、この一行少し長いなと思ったり。
まだまだ勉強が必要です。


参考：
Laravel5.4でFORMファサードを利用する方法
https://qiita.com/FrogWoman/items/1fb35cf46181b6b7d3be
Bingの検索結果が新規タブで開かれる

#結論
お前、ChromiumEdgeの設定やなくて、Bingの設定やったんやな。

1. Bingで検索
2. 右上ハンバーガーメニューから、設定 > 詳細
3. 検索 > 検索結果 から「新しいタブまたはウィンドウに検索結果のリンク先を開きます」などのチェックを解除


#普段はGoogle
Bingを使う理由、それは...Microsoft365との相性がよさそうだから。
あとは、Googleは賢くなりすぎて、英語で検索しても日本語ページが出てくるから。
Bingは右上あたりに、「Switch to Bing in English」ってあるので、すぐ変えられる。

まぁ、ここ最近はUSで検索してくれるようにクエリパラメータを調整したGoogleのURLを検索エンジンとして登録しておいて、アドレスバーに「us」と入れてから検索すると、そのエンジンが選択されるようにしてしまったけれど。

Edgeに乗り換えるまでBingなんて使ってこなかったから（出た当時は面白半分で使った記憶がある）、気がつくのに遅れてしまった。
RailsアプリをAWSにデプロイするまでにすごく苦労したので教訓メモ

# 何コレ
ポートフォリオを作成する上で以下の環境構築を行っていたが、個人的にとても苦労したので備忘録として残しておきたいと思い書いた。

## 設定環境
AWS EC2(1年間無料で使えるインスタンス)
AWS RDS
Ruby 3.0.0
Rails 6.1.1
puma 5.1.1
mysql 5.7

アプリはまだRails newしただけの状態

## 使った教材
こちらの記事を参考に環境構築を行った。わからない単語などは都度調べながら。
https://qiita.com/take18k_tech/items/5710ad9d00ea4c13ce36
記事自体はタイトルの通り、知識としては今は無くとも環境構築できるのではと思う(インフラ大事だからいずれはもっと学習するつもり)。

## 何が苦労したのか
主に以下の点でとても苦労した。

・記事とおりやっているが、capistranoの設定あたりから壮大につまずく
→これは記事が悪いわけでは無く(それ以外はすんなり設定できたので非常に感謝している！)、環境というのはどうしても個々で異なるので、あまり鵜呑みにせず、できたらラッキーぐらいの心持ちで参照した方が良かったなと思った。
具体的な箇所は後述。

・エラー解決しようと検索するも英語記事ばかり
→当然といえば当然なのかもしれない。日本語記事無いかな〜と甘えたことばかり考えていた。
解決策は英語記事(特にgithubのissue)に載っていることが多かったと思う。初学者ありがちだと思うが、本当に英語に慣れないといけないなと。

## 具体的につまずいた箇所①
・デプロイ先のサーバーにリポジトリをpushできない
→少し前にRails newしたアプリなら、マスターブランチ名が`master`かもしれない。
しかし最近デフォルトのブランチ名が`master`→`main`になってしまった為、このままではpushできないという話。
https://capistranorb.com/documentation/getting-started/configuration/
こちらを参考に英語と戦いながら設定を変更すればうまくいく！

## 具体的につまずいた箇所②
・デプロイしてみたら`--daemon`が無効だと怒られる
→エラー内容そのままですが、デーモンプロセスが無効と表記されている。

```ruby:&#x20;daemon無効エラーログ
05:38 puma:start
      using conf file /var/www/hogehoge/shared/puma.rb
      01 $HOME/.rbenv/bin/rbenv exec bundle exec puma -C /var/www/shikaku_sns/shared/puma.rb --daemon
      01 bundler: failed to load command: puma (/var/www/hogehoge/shared/bundle/ruby/3.0.0/bin/puma)
      01 /var/www/hogehoge/shared/bundle/ruby/3.0.0/gems/puma-5.1.1/lib/puma/cli.rb:50:in `initialize'
      01 :
      01 invalid option: --daemon
      01  (
      01 OptionParser::InvalidOption
      01 )
      01
長いので割愛。hogehogeはアプリ名
```

なるほどわからん、となりコミュニティで質問したところ、こちらを紹介いただく。
https://github.com/seuros/capistrano-puma#systemd
ここらを見ることで解決の糸口を見つけることができた！
(今思うと、コミュニティにいらっしゃる強者エンジニアの方はほとんどgithub(一次ソース)を真っ先にみていることがわかった。)

## 具体的につまずいた箇所③
・Capistranoを使ったデプロイができない！
→参考記事の中では、
`capistrano3-pumaのバージョン5にpumaを再起動できないバグが出ている`
とあります。確かにrestartすると以下のようなエラーが表示。

```ruby:&#x20;restartエラーログ
01:03 puma:restart
      01 sudo /bin/systemctl restart puma
      01 Failed to restart puma.service: Unit is not loaded properly: Invalid argument.
      01 See system logs and 'systemctl status puma.service' for details.
以下長いので割愛
```

マジかーと思い、途方にくれていたが、このままではイカンと思いコミュニティで恐る恐る質問。
このエラーは以下の記事で無事解決！
https://qiita.com/AQeNku/items/81ddae388d8615125a24

# 今回得られた教訓

(1)エラーをきちんと読む
エラーが出たわかんね〜、で済ませない。
この記事が自分にはとても有効。質問する際はこちらを念頭に質問する。
https://qiita.com/rhiroe/items/4349b9f412364aa2c729

(2)エラー内容を見て、まずは一次ソースを検索する
自分がつまずいた箇所は何もGithubのusageに詳しく載っていたりしたので。それ以外にも例えばAWSに関するエラーだったらAWSの公式ドキュメントを見る。そこを見て何言ってんだこいつ？みたいになってしまったらQiitaなどの記事を見るのは悪くなさそう。

(3)質問して返ってくることをあまり期待しない
メンタサービスなどを利用している場合は別だが、無料のコミュニティで質問をしても絶対に返ってくる保証は無い。
世の中の人たちそんなに暇では無い。基本的には自分で考えては検証し、また考えては検証の繰り返しを行うマインドセットを持っていないと多分この先もダメ。

まだまだ先は長いのでドンドン進む