OmniAICreator/Qiita-1.07M huggingface dataset:
esp-idf eclipseでコンパイルする環境を整える

Thanks to:

https://qiita.com/coppercele/items/87f46eaa5d796bd684e8

# 作業環境

- intel な MacBook Pro
- macOS Mojave 10.14.6

# はじめに

公式ガイド通り操作しても、いろいろつまづく。今回はあるファイルの「証明書」？ の期限が切れているとかで、それもうまくいかない原因の一つらしい。

公式やその他で用意されているもののバージョンで、挙動が変わることがあるだろう。そんな時でも本記事が参考になれば幸い。

# とにかく python と git その他を導入

- pythonはpython3がデフォルトで使えるようにする。私の環境では、brewからpyenvで導入した。
- git, cmake, ninja, dfu-util も brew で導入

# まずは esp-idf を導入

https://docs.espressif.com/projects/esp-idf/en/latest/esp32/get-started/index.html#get-started-get-esp-idf

- 公式どおり、CUIで`git clone ...`で導入していく。
- 手順書通り、hello world プロジェクトをコピーして build さて問題発生。なんで普通にできないんだ...

# FAILED: esp-idf/mbedtls/x509_crt_bundle

参考URL

https://github.com/espressif/esp-idf/issues/5322

```bash
/opt/espressif/tools/python_env/idf4.3_py3.9_env/bin/pip uninstall -y cryptography 
/opt/espressif/tools/python_env/idf4.3_py3.9_env/bin/pip install cryptography==3.4.8 
```
を実行してみろ、とある。pipは確かに類似の場所にあった。指示された通り実行。

**再ビルド、書き込み確認OK ふぅ。**

# eclipse導入

https://github.com/espressif/idf-eclipse-plugin/blob/master/README.md

- 手順書通り java 導入。調べてPATHに追加

https://qiita.com/s_hino/items/a185deb4f9fc31c0f5e2

- eclipse本体ダウンロード。上記手順書にあるURLから持ってくる。
- 上記の手順通り、ESP-IDFのプラグイン導入。
- **Installing ESP-IDF**では、ローカルにあるものを指示。
- **Installing ESP-IDF Tools**で、Gitはbrewで導入されたもの。**Pythonはesp-idfの中にあるものを指示。**

# 使ってみて感じたことなど

- よく使っている STM32CubeIDE と似ている。これって... まあわかりやすくてもいいともいう
- ソースの補完は[control]+[space]でSTM32CubeIDEと同じだった。
- ビルド時、保存していないソースは保存してくれる。これは一体型IDEだな。
- workspace 内のプロジェクトは、esp-idf の CUIで再ビルドとかもできる。~~逆が難しいみたい（手順がわからない）~~ esp-idfプロジェクトのインポートもできる（githubのガイド参照）。さらに VSCode w/ ESP-IDF extension でも使える。あとはお好みで、という状況だ。
- sdkconfigをGUIで触れるのは少しわかりやすくていい。（ダブルクリックするだけ）
- ダークモードだと、メニュー等の文字がちょこちょこ見えない。（人によっては大問題？）
- 書き込み時のポートも設定できるので楽。

# 最後に

あとは公式手順書通り、hello world のビルドと書き込みができるようになった。
シリアルモニターがどうも動かないが、別途ターミナルで`idf.py monitor`すれば良いのでスッキリしないけど許容。
Railsチュートリアルを1週してみた感想

#はじめに
**「1週目ですべて理解してやるぞ！！！」**と無謀なことを思わないほうがいいですね…

2021/9/24(金)から2021/10/5(火)まで、約1週間半ほどかけましてRailsチュートリアル6版 1週目を終えました。その感想などを書いていこうと思います。

## 勉強中に意識したこと
できる限りサンプルに出てくるコードはコピペせず、手で入力することを意識しました。
Rubyのコードを書きなれていないこと、また書いていくことでコードを読む力がつくのではないかと思ったからです。
前半〜中盤であまりに理解度が足りていないと感じたため、中盤からは**しっかり1行ずつ読んでいく**ことを意識しました。


##勉強に費やした時間
合計 11日　47時間40分（平均4時間20分/日）
実際には1日1時間しかやらなかった日もあれば、8時間以上やった日もありました。

##Railsチュートリアルに取り組む前の勉強
基本情報技術者試験の参考書を用いたコンピュータサイエンスの基礎、その他書籍などでwebアプリケーションや通信・サーバーについての勉強。その他、Linux標準教科書でLinux。UdemyでGit/Github。
やドットインストール、書籍でHTML, CSS, Saas, JavaScript, jQuery, Rubyの基礎について学習しました。


#環境構築
まず第1章で、Railsの環境構築をしていきます。チュートリアルでは[AWS cloud9](https://aws.amazon.com/jp/cloud9/)の使用を勧められましたが

> とはいえ、いずれはお使いのローカル環境でセットアップする必要が出てきます。
>(引用元：Railsチュートリアル6版 第1章 1.2)

「なるほど！ならば最初からローカル環境で構築してやろうじゃないの！！」と思い、ローカル環境の構築にチャレンジしてみました。gemファイルのバージョンが原因かと思いますが、何度かgemのインストールに失敗し「なにがいけないんだよぉ〜〜〜
」と言いながらエラーメッセージを読んで対策方法を調べて乗越えました。

#少しだけ学習したRuby、初めて触れるRails
Rubyの基礎についてざっと学習していましたが、途中から「このコードは何を書いているんだ？」と思うことがかなりありました。Rubyの勉強不足を感じました。

そして、Railsの便利なコマンドやメソッドがどんどん出てくる度に「？？？？？？？？？」と頭の中は?だらけになりました。
**Rubyの基本的なコードを読む力が足りないせいで、Railsで書いているコードを理解できなかったんです。**


##コードにコメントを書く重要性
最初の方はコメントをほぼ書いていませんでした。

「今書いているのはどこで書いたメソッドなんだろう。」
「このコードはなんのために書いたんだろう。」
そう思うことがたくさんありました。ふと思い立ったときに過去のコードを読むと、コメントが書いてあるコードはすぐに理解できます。

書いているときは理解できていても、いつか忘れる。だからコメントは書かないといけない。
**「間違いなく、いつか困る」**と思いました。

##つまずいた原因
チュートリアルをすすめる中で、何度もエラーが出たり、通るはずのテストが通らないということが発生しました。その原因の99.9%ぐらいはコードの入力ミスでした。

```
@user.メソッド名
```
と入力すべきところを

```
@user_メソッド名
```
と書いてしまったり、、、

```
assert_difference テスト内容
```
を

```
assert_diffrence テスト内容
```
と書いてしまったり…

エラーが出たらまずは自分のコードを確認するのですが、それでも原因を発見できないときは「もしかしてチュートリアルのほうが間違ってるんじゃねぇの!?」なんて思い上がっていました。まぁ、もう1~2週したら自分のミスを発見して情けなさに打ちひしがれるんですけどね。

#この先の学習について
近いうちにチュートリアル2週目に挑戦しようと思いますが、その前にRubyについて再勉強しようと思います。

また、2週目に取り組む際は「コードを丁寧に理解する」「コメントを残す」「ノートやメモをとる」「つまずいたところをまとめる(そしてQiitaなどで発信する)」ことを意識しようと思います。

# 最後に
「とりあえず1週目を完走する」ことだけを意識して取り組んだ結果、どこでつまずいたかもあまり覚えておらず、この感想もまとまりのない文章となってしまいました…

ただ、間違いなく言えるのは「どのような形であれ1週目を終えられた」ことで自信がついた気がします。また、Railsが便利ですごいということを知り、もっと深く勉強してみたいと思うようになりました。

2週目に取り組む際にはもっと記録を残し、この先Railsチュートリアルに挑戦される方へのヒントを残せるようにしたいです。
【Nuxt.js/Vue.js】 v-forの基本的文法

#v-forの基本的文法
###v-forとは
Vue.jsでのループをする方法です。
jqueryにおいての$eachあたります。

###書き方
v-for="(item, index) in ループする要素" :key="キー"

itemはループで取得できる、要素の一つ
indexはループする要素のindex

```
<template>
  <div class="page">
    <ul>
      <li v-for="(item, index) in object" :key="index">
        {{ index }}. {{ item.artist }} :{{ item.title }} :{{ item.releaseDate }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      object: [
        {
          title: "Leave Home",
          artist: "ラモーンズ",
          releaseDate: "1977-01-10"
        },
        {
          title: "Ramones",
          artist: "ラモーンズ",
          releaseDate: "1976-04-23"
        }
      ]
    };
  }
};
</script>
```
###解説
objectをv-forでループ
objectの「title」「artist」「releaseDate」でリスト表示
結果はしたのようになる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/416292/35b17a46-cf25-b4c6-c6e8-63e4633197ab.png)

他にもv-forでは便利な書き方ができるようです。
わかり次第追記していこうとおもいます
「Eコマース市場」の拡大と技術開発の関係性について分析してみた

#背景
　私は現在小売業に従事しており、初めての寄稿はまず小売関連の記事を書かせていただきたく考えました。拙い記事ではありますが、よろしくお願いします。
　ご存知の通り、昨年度はコロナ禍により社会環境が一変しました。購買環境も大きく変化し、非対面・非接触という利点に着目され、Eコマースの利用が大きく増加することとなりました。経済産業省の[電子商取引に関する市場調査](https://www.meti.go.jp/policy/it_policy/statistics/outlook/ie_outlook.html)を見てもB to CでのEコマース市場規模は実際に伸長しており、多くの方が利用されたことと思います。
　一方Eコマースは、ネットスーパーをはじめとして、まだまだ技術的に未成熟な部分が多く存在している産業でもあり、多くのお客さまにご迷惑をおかけしていることも事実です。そこで、技術者の方が多く記事を投稿されているQiitaであれば、Eコマースまわりの開発を行なっている方もいるのではないかと思い、Eコマースについて、技術開発の面から考察を進めることとしました。

#目的
「Qiita上で"Eコマース"というワードが含まれる記事の数を抽出し、Eコマース市場拡大との相関性を見る」

市場規模の拡大と共に、技術者の方でもEコマースを利用する機会が増加し、より利便性の高いサービスを求めて自ら開発を行うケースも増えるのではないかと考えました。そこで、年別のEコマースに関する記事数と市場規模の相関を見ることで、市場規模の拡大が技術の発展に寄与することを明確化します。

#環境
* node v16.10.0
* Visual Studio Code 1.60.2
* axios 0.22.0

#サンプルコード

```javascript
const axios = require("axios");

async function main() {
  let response = await axios.get(
    "https://qiita.com/api/v2/items?per_page=100&query="+encodeURIComponent("Eコマース")
  );

  for (let i = 0; i < response.data.length; i++) {

   console.log(response.data[i].created_at);
 }
}

main();
```

```javascript
const axios = require("axios");

async function main() {
  let response = await axios.get(
    "https://qiita.com/api/v2/items?per_page=100&page=2&query="+encodeURIComponent("Eコマース")
  );

  for (let i = 0; i < response.data.length; i++) {

   console.log(response.data[i].created_at);
 }
}

main();
```
#抽出結果と考察
実行してデータ整理すると以下の表のようになります。
2021年数値につきまして。10月以降の数値がまだ確定しておりませんので、各年度の1~9月における合計値が全体に占める割合の平均値より、年度計の数値を推定しております。
（執筆日：10月5日）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2100048/ed4b6e5b-f5e0-0ddb-11df-4015f559ad40.png)

ここで、経済産業省の電子商取引に関する実態調査
https://www.meti.go.jp/policy/it_policy/statistics/outlook/ie_outlook.html
より、B to CのEコマース市場に関する数値を引用すると以下の通りとなります。
![スクリーンショット 2021-10-05 7.16.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2100048/85bf184d-c83c-c969-b381-4f361a5de86b.png)

それぞれの数値を元に分析してみますと、
**2018〜2021年の記事件数** [29,53,52,84]について
**2017〜2020年のEC化率** [5.79,6.22,6.76,8.08]とは**相関係数0.966**、
同様に
**2017〜2020年のEC市場規模** [86008,92992,100515,122333]とは**相関係数0.969**
と記事件数と市場規模には、強い相関があることがわかりました。

したがって、市場規模の変化に対して**１年ずれて** 、記事数が変化することがわかりました。

#おわりに
　まずは、自分がイメージしやすいテーマについて記事を書いてみました。
本来であれば、記事の中でどのような言語が使われているか、何を目的とした開発が多いのかについても分析したいと考えておりましたが、力不足につき今回はこの辺りで締めさせていただきます。
以上、お読みいただきありがとうございました。
setodaNoteCTF - Hash 50 

#問題

https://ctf.setodanote.net/

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/39a67bf3-0d4e-2663-19ae-fa401df8db15.png)

#解いてみた

ファイルを見てみると1～90までのファイルがありました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/0167c28f-924f-9f6a-ba4a-b891c8e56a45.png)

hashsumを使って全部のハッシュ値を出します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/29bf9bc8-8f5d-86f3-236c-9d0d5077f705.png)

問題文に書いてあるハッシュ値を検索して一致するファイルを見つけます。

1つ目

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/59cdce85-7ea9-bb05-6ae2-8b48b8c66e70.png)

2つ目

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/4a199fc0-0691-e511-c282-0b396041edc8.png)

3つ目

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/bc89b44e-7683-1e3d-5b77-c0d0cf700bba.png)

それぞれのファイルの中身をつなぎ合わせたら正解でした。
Kubernetes Operatorの開発を学べる資料・ラーニング

特に記載がない場合は無料です。

# ガイド

### OpenShift Container Platform での Operator の使用

https://access.redhat.com/documentation/ja-jp/openshift_container_platform/4.6/html/operators/index

* 日本語

Red Hat社の公式ガイドです。かなり細かいですが日本語なので安心です。

# ラーニング

### Cognitive Class - Kubernetes Operators Intermediate

https://cognitiveclass.ai/courses/kubernetes-operators-intermediate

* 英語
* 6時間
* オープンバッジあり

Operatorの概念、仕組みとoperator-sdkによるGo、Helm、Ansibleのサンプル開発まで。IBM Cloudを使ったハンズオンあり。

### Cognitive Class - Kubernetes Operators Advanced

https://cognitiveclass.ai/courses/course-v1:IBM+CO0302EN+v1

* 英語
* 8時間
* オープンバッジあり

Reconcile、OLM、Scorecardによるテスト等。IBM Cloudを使ったハンズオンあり。

---

（今後追加予定）
setodaNoteCTF - morse_one 30 

#問題

https://ctf.setodanote.net/

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/9190ec32-2bea-598f-1cea-6f50aa18d66b.png)

#解いてみた

ファイルを開いてみます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/347924ad-1cc9-f827-43fe-c4c6b92a642d.png)

まったくわかりませんが、問題がmorseなのでモールス信号っぽい。
DとBとSの3種類があって、モールス信号は「.」と「-」の二つしかなくて残り一つは区切り文字と思われます。
DとBは連続しているところがある。
普通に考えると区切り文字は連続になることはないから区切り文字はSになる。

すると

...- .. -... .-. --- .--. .-.. . -..-
か
---. -- .--- -.- ... -..- -.-- - .--.

になります。

cyberchefを使って変換してみます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17681/74bd8da9-23ee-6d7a-58c8-707910770229.png)


どっちも文字列になってしまったので、順番に入れてみたら最初の方が正解でした。
【rails】GEM simple_calenderで「undefined method `start_time'」エラーが出たときの対処法

#概要

　ポートフォリオ作成時に、RailsのgemであるSimple Calendarを使用しまして、その際に以下の記事を参考にさせていただきました。

・https://qiita.com/isaatsu0131/items/ad1d0a6130fe4fd339d0
・https://qiita.com/AKI3/items/109d54a35c98328d9155

　しかし、undefined method `start_time'のエラーに遭遇し、解決までかなり時間を要してしまいましたので、同じ症状の方がいらっしゃれば、と思い投稿します。

#開発環境
Rails 5.2.5
ruby 2.6.3p62

#遭遇したエラー
　エラー内容は「undefined method `start_time'」です。![エラー画面.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1962097/f4c721dd-c833-b0a5-3e31-a9ca971c86f3.png)

　エラー内容自体はよくあるエラーだと思います。要するに「start_time」というメソッドはありませんぜ、という内容ですね。

　ここで悩んだ原因は、コードを見ていただけるとわかりますが、エラーの出ている31行目に「start_time」とは記載していないからですね。

　では、どこかにstart_timeがあるのか（特に、上記記事で拝見しました、「rails g simple_calendar:viewssimple」のコマンドで生成された4つのViewファイル）と思い調べてみましたがありません。

　このため、相当悩みまして、時間をかなり使いました。

#解決方法
　結論として、解決方法は

simple_calendarの公式Github(https://github.com/excid3/simple_calendar)

から得られました。

 ReadmeのRendering Eventsの欄に、「start_time以外の名前の開始時刻属性を持つモデルがある場合、またはリレーションシップを介してアクセスする場合は、my_model.rbファイルでstart_timeメソッドを定義することで属性のエイリアスを作成でき、上記のように個別に指定する必要はありません。」（Google翻訳ママ)との記載があったため、ModelにStart_timeメソッドを作ればよい、ということがわかったのです。

　ただし、上記二つの記事にはこのような手順が記載されておりませんでした。なぜか。

　それは、この2つの記事では、作者様は時刻に関するカラムを、「start_time」の名前で定義されておられたからですね。
　このことから、「start_time」メソッドを定義する必要がなかったわけです。
　今回、私の場合はsimple_calenderを導入する前にすでにカラムを「start_at」の名前で定義しており（以下にコード）、それに気づかず、また、公式Githubもろくに見ずに実装しようとしたため、上記のエラーとなってしまった、というわけです。

```
def change
    create_table :events do |t|

・・・・・・・（略）・・・・・・・

      t.datetime :start_at

・・・・・・・（略）・・・・・・・

end
```

　解決したときのコードはこちらです。simple_calendarに表示させたい内容が入っているModelに、「start_time」メソッドを作成しています。


```
class Event < ApplicationRecord
  #以下を追記
  def start_time
    self.start_at #self.の後はsimple_calendarに表示させるためのカラムを指定
  end
end
```

　これで実装できました！
![simplecalender完成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1962097/dfc978c3-9e32-1a46-d266-d68686873aa9.png)

　以上、公式サイト・Github等はよく確認しましょう、と教訓になりました。
　また、この場を借りて、上記二つの記事の作者様に感謝いたします。大変参考になりました。導入等は上記記事を見られれば、問題なく実装できるかと思います。
　この他にもっとクールな解決方法をご存じの方は、ご一報いただけると幸いです。
VBA Collection の使い方

#Collectionと配列　比較

Collectionとは、複数のデータを格納することができるオブジェクトのこと。
配列とは、同じデータ型のデータを配列として1つにまとめた変数のこと。


####Collectionメリット
・変数のデータ型を統一させる必要がなく配列よりも簡単に記述でデータを格納していくことができる
・リストの管理が簡単


####配列メリット
・二次元配列と同じセル範囲を用意することで、一度に書き込みができる
※二次元配列・・・縦と横の２つの次元をもった配列のこと

` 複数のデータをExcelとやり取りする場合は配列
VBA内でまとまったデータを管理するときはCollectionオブジェクト` 


#Collection（コレクション）の宣言

```
Dim コレクション名 as New Collection
```
または

```
Dim 変数名 As Collection
Set 変数名 = New Collection
```

#アイテムの追加
```
With コレクション
    .Add Item:="アイテム1", Key:="i1"
    .Add Item:="アイテム2", Key:="i2"
    .Add Item:="アイテム3", Key:="i3"
    .Add Item:="アイテム4", Key:="i4"
    .Add Item:="アイテム5", Key:="i5"
End With
```

※keyは省略可能

:::note warn
コレクションの要素にKeyを指定しない場合はインデックスは”１”から始まる
:::

#アイテムの削除
```
コレクション名.Remove(インデックス番号あるいはキー名)
```
CSSのIDとセレクターの使い分け

#IDとClassの違いて何？
IDで決めたなめは複数使い分けができない。
それに対してクラスは複数同じ名前を使うことができる。

IDを使うところは主にヘッダーやメイン、フッターまたはJSの記述で使うやつのみ

```
<header id=header>
    <div class="images">
    </div>
</header

```

クラスは上記以外のdivタグでまとめたグループの名前とかみたいです。
CSS設計て大事！！
【Python】enumerateの使い方

# enumerateメソッドはlist, tuple, dictionaryに全部適用されます。
普通のfor文要素しか取り出せないが、
enumerateだと要素とindexの両方とも取り出せます。

### 1. List
```python
db_names = ['MySQL', 'PostgreSQL', 'SQLite', 'MariaDB']

for index, db_name in enumerate(db_names):
    print(index, db_name)

"""
結果:
0 MySQL
1 PostgreSQL
2 SQLite
3 MariaDB
"""
```

### 2. Tuple
```python
db_names_tp = ('MySQL', 'PostgreSQL', 'SQLite', 'MariaDB')

for index, db_name in enumerate(db_names_tp):
    print(index, db_name)

"""
結果:
0 MySQL
1 PostgreSQL
2 SQLite
3 MariaDB
"""
```

### 3. Dictionary 
#### 3.1 keyだけ取る
```python
students = {"John": 'Computer Science', 
            "Clare": 'Biology', 
            "Adam": 'Chemistry'}

for index, name in enumerate(students):
    print(index, name)
"""
結果:
0 John
1 Clare
2 Adam
"""
```
#### 3.2 keyもvalueも取る
```python
for index, (name, major) in enumerate(students.items()):
    print(f'Student_id:{index}, {name}\'s major is {major}.')

"""
結果
Student_id:0, John's major is Computer Science.
Student_id:1, Clare's major is Biology.
Student_id:2, Adam's major is Chemistry.
"""
```
(name, major)の説明: 
dictionary.itemsの戻り値は: listとして(key, value)のtupleが格納されます。

```python
print(students.items())
dict_items([('John', 'Computer Science'), ('Clare', 'Biology'), ('Adam', 'Chemistry')])
```

以上です。
GitHubコマンドまとめ

#　GitHubコマンドまとめ

## はじめに
GitHubのコマンドの備忘録。
コマンドのみまとめています。
随時更新予定です。

### ローカルでGitを使えるようにする
```
　　＄ git init
```
### ファイルの変更（追加/変更/削除）を確認する
```
 $ git status
```

### 変更履歴を残す
```
 4 git add ファイル名（全ファイルの場合は「.」）
```

### 変更履歴を保存する
```
 $ git commit -m "コメント"
```

## masterブランチからmainブランチへ変更する(最初だけで良い)
```
 $ git branch -M main
```

## ローカルの変更をリモートに更新する
```
 $ git push origin ブランチ名
```

## ブランチを確認する
```
 $ git branch 
```

## ブランチを作成する
```
 $ git branch ブランチ名
```

## ブランチを切り替える
```
 $ git checkout ブランチ名 
```

## ブランチ作成と切り替えをまとめて行う
```
 $ git checkout -b ブランチ名
```

## リモートの変更をダウンロードする
```
 $ git fetch origin
```

## ダウンロードしたものをローカルへ反映
```
 $ git merge ブランチ名
```

## リモートの変更をダウンロードして反映をまとめて行う
```
 $ git pull ブランチ名
```
デバイスとAzure Event Hub間の通信をのぞき見するツール

---

**通信を見る記事一覧**

* [デバイスとAzure IoT Hub間の通信をのぞき見するツール](https://qiita.com/matsujirushi/items/ff55ee0ff134fdae72be)
* [デバイスとAzure IoT Central間の通信をのぞき見するツール](https://qiita.com/matsujirushi/items/192ab655b7f94510072a)
* デバイスとAzure Event Hub間の通信をのぞき見するツール

---

Azure Event Hubに送られてきたメッセージを見るツールを探しました。

。。。

全然、見つからない。:fearful:

唯一、見つかったのはコレだけでした。

# Azure Event Hub Explorer

Visual Studio Codeに入れて使うツールです。
マイクロソフト公式のツールでは無いようですが、なかなか便利。というか唯一！？

<img width="600" alt="image.gif" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/109634/e46a4435-46b3-bf47-4b63-681ed2f133a2.gif">

* [インストールサイト @ Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=Summer.azure-event-hub-explorer)
[Rails]親データと関連付を行なったデータを全て取得する

[1.はじめに](#1-はじめに)
[2.実装](#2-内容は)
[3.おわりに](#3-おわりに)

#1. はじめに
いつも全ての値を取得するにはモデル名.allすればいいから簡単だと思っていたら関連付の値を取得するのに意外と苦労したのでまとめます。
#2. 実装
通常

controller

```rb
def index
 @インスタンス = モデル名.all
end
```

これで全ての値を取得することが可能でしたが。関連付けを行なっている場合はそうは行きません。


例として``Userモデル``と``Postモデル``を想定します。

User

```rb
class User < ApplicationRecord
  has_many :posts
end
```

Post

```rb
class Post < ApplicationRecord
  belongs_to :user
end

```

UserとPostの関連づいた情報を取得していきます。
情報を取得するには``joins``を使用します


**関連付いた情報を取得**


```rb
  def index
    @users = User.joins(:posts)
  end
```
・``joins``を使用することでUserとPostが結びついた情報を持ってきてくれる。
・結合先(Postモデル)の情報がいらない場合はこれでOK

**UserとPost両方の情報を取得**

```rb
@users = User.joins(:posts).select("users.*", "posts.*")
```
・``select``を使用することでカラム(postsカラム)も取得できる。

``joins``ではテーブルを結合して表示してくれる便利なものです。
結合には２種類あります。

1, 内部結合
2, 外部結合

**1, 内部結合**
**User**とPostのidが一致するものだけを結合して表示させます。

**外部結合**
UserとPostのidが一致しない値も表示します。

今回は内部結合だけ実装しました。
#3. おわりに
RailsのmodelはSQLを意識することなく操作できるとどこかで見たけど、SQLの知識があった方が理解が早いし、何より面白いと感じました。
TypeScriptで代数的データ型

## これしかできないと思っていたこと
```typescript
type Noodle = 
  | "Soba"
  | "Ramen"
```

本格的な関数型言語と違って、それそれの選択肢にパラメーターはつけられないのかと思っていたら。。

## 実際はできること
Discriminated Union を使うことで、似たようなことができた。

```typescript
interface Soba {
  kind: "Soba",
  sobaRatio: number,
}

interface Ramen {
  kind: "Ramen",
  taste: "Jiro" | "Trad" | "Others"
}

type Noodle = 
  | Soba
  | Ramen

const x: Noodle = ...
if (x.kind === "Soba") {
  ...
} else if (x.kind === "Ramen") }
  ...
} else {
  const _: never = x
}
```
網羅性チェックはできるが、パターンマッチングはない。
Power Automate Desktop: 値の存在が不明な場合のフィルター方法

# 背景

リスト使うなら、Where とか使えるって思いますよね。
当然探して、お！あったあったって見つけたのが [リストから項目を削除](https://docs.microsoft.com/ja-jp/power-automate/desktop-flows/actions-reference/variables#removeitemfromlist) 

で、使おうとしたら・・・存在しないデータはフィルター出来ない！って怒られたのが始まり・・

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/4d6fde4c-93d4-b770-4823-8dd21f265d62.png)

元々、Excel のセルデータをソートして、先端と終端を利用しようとしたら、空セルがあったので除外したかったんですが、当然空じゃない場合もある。
しょうがないから回避策を考えてみたってのが成り行き

# 結論

1. 弾きたいものを結合してから、弾こう（フィルター）
  - 無ければ、追加してから弾けばいいだけ。有っても全部弾けばなくなるしね😁
![2021-10-05_15h40_44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1645569/d2182f8c-c9d1-6206-ea44-eff8bef407e9.png)

```robin:Null弾きの例
SET List TO [1, 2, 3]
Variables.MergeLists FirstList: List SecondList: [Null] OutputList=> List
Variables.RemoveItemFromListByValue Item: Null ItemMatchAllOccurrences: True List: List NewList=> List
```
:::note
補足
【リストから項目を削除】は「すべての項目を削除」をOn にすること
:::

# 思考の変遷記録

1. HasItem() てきなものを利用して条件で実施を決める
  - あれ？？？無いの？List.Find()とかそういうのないの・・・血眼に探しても無いですね😅 <br>
  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1645569/d020d3b0-01fe-8472-6dea-df7e709a9dc7.png)
1. それじゃぁ・・Loop かぁ・・
  - でも遅いから嫌だなぁ・・と暫しトイレ・・・・で、上の結論へ。

# あとがき

色々詰まるところはあるけれど、Win Actor なんかより遥かに使いやすいですね（最近はよくなってるとの噂も・・

# Keyword

how to filter the value which may not exist

https://docs.microsoft.com/ja-jp/power-automate/desktop-flows/actions-reference/variables#removeitemfromlist
Djangoからherokuへデプロイ時のSECRET KEYの設定（Win10）

# 問題
Djangoで作成したアプリをherokuへデプロイしようとしたときに、SECRET KEYが反映されずに困った。

# 解決方法
SECRET KEYの括弧やアンド [ (, ), & ] が原因で認識しているみたい。
上記の記号を""（ダブルクオート）で囲むことでherokuにSECRET KEYの環境変数を指定できた。

```bash
& 'heroku' @('config:set', 'SECRET_KEY=eoik6-"&"dnr9elgmrt7-%3hu_"&"37$3hg!9c6x!^khjr3!z*z"&"b4')
```
(SECRET KEYはそれぞれのアプリのもので設定)

参考:
https://stackoverflow.com/questions/32130105/setting-environment-variable-in-heroku-via-powershell-with-special-characters?rq=1


# 環境
PowerShell（Bashでは反映できなかった）
Django 3.2.7
Python 3.9.5
【Git】git stashを使ってファイルを一時退避させる

#はじめに
現在作業途中だけど、他のブランチで別の作業を行わなければならないから、現在の作業はコミットせずにファイルを一時退避させたいというときに、`git stash`を使います。
`git commit`していないファイルが対象なので、`git add`はしていてもしていなくても退避させることができます。

#コマンド

##git stash
・ワークツリー及びステージにあるファイルを一時退避させます。
・前回のコミット後に新規作成されたファイルは退避に含まれません。
・saveはあってもなくても良いです。
・複数回`git stash`を行うと、`stash{0}` `stash{1}` `stash{2}`といった感じで何回目のstashかが分かるようになります。

```git:ターミナル
git stash
git stash save
```
##git stash -u
・`git stash`と異なり、前回のコミット後に新規作成されたファイルも退避に含まれます。

```git:ターミナル
git stash -u
```

##git stash list
・一時退避させた作業の一覧を確認することができます。

```git:ターミナル
git stash list
```

##git stash apply
・一時退避させた作業の復元を行います。

```git:ターミナル
git stash apply              //最新の作業（1番直近で退避した作業）を復元
git stash apply stash{1}     //stash{1}という特定の作業を復元
git stash apply --index      //addされたものはaddされたままの状態で復元
```

##git stash drop
・一時退避した作業を削除します。

```git:ターミナル
git stash drop               //最新の作業（1番直近で退避した作業）を削除
git stash drop stash{1}      //stash{1}という特定の作業を削除
git stash clear              //すべての作業を削除
```
Power Automate Desktop: null を利用する方法

# 何故？

リスト内部に空データがあった場合に除外して処理したかった為

条件で「空」指定は簡単ですがリストならフィルターした方が速いですしね。

あと、リスト自体に空データを定義する場合、Comma 連続定義しようとするとエラーになりますが、Null変数なら可能


## 追記 2021/10/13

> 空の文字列を入力するには、式 %""% を使用します。

この方法でもっと簡単にできたようです・・🤣
まぁ、見やすさという点で、Null変数も・・

https://docs.microsoft.com/ja-jp/power-automate/desktop-flows/how-to/sql-queries-excel

# 概要

わかれば簡単過ぎですが、どこにも情報がなかった・・みんなどうしてるんですかね？

- 未初期化変数（Null変数）を用意して参照するだけ。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1645569/a851fbb8-195c-27f1-3a10-6fbb17b4a1f7.png)

:::note warn
警告
Set Variables ではないです。入出力変数ですのでお間違いなく
:::
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/10b3f1ee-1afe-d550-ade5-c00392d98d80.png)


## 実際の利用例

List, JSON の定義

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/47383268-af31-c73c-be40-7df6d1979fc4.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/feba1359-e77a-7a9a-5735-b5a7fc023c09.png)

```robin:利用例のサンプルコード
SET List TO [Null, 1, 2, 3]
SET IsNullItem TO List[0] = Null
SET JsonObject TO { 'Cells': [{ 'Name': 'hoge', 'Value': 'hige' }, { 'Name': 'hoge', 'Value': Null }] }
SET IsNullObj TO JsonObject.Cells[1].Value = Null
```

# PowerUsersでの質問

エスケープシーケンスの化け物みたいな定義してます・・
最初はこれを利用しようとしたんですが・・Listでは使えなかったんですよね。

```robin:NullDefinitionForJSON
> %'\"\"'%
```

https://powerusers.microsoft.com/t5/Power-Automate-Desktop/How-do-you-check-for-Null-in-Power-Automate-Desktop-versus-empty/td-p/1045958

# Keyword

how to initialize variables with null, or to check for Null
RspecでAWS SDKでS3の署名付きURL発行のテストをする (Ruby on Rails)

# はじめに
仕事で、Ruby on Railsを用いてS3から署名付きURLを発行する処理を実装しました。

こちらの記事を参考にして行いました。

https://qiita.com/takeyuweb/items/b32dd7487d724faac1f

そしてRspecのテストを行おうとしたのですが、以下の記事を参考にして詰まってしまったためまとめたいと思います。

[Ruby AWS SDK v2 でS3の署名付きURLを発行する](https://qiita.com/takeyuweb/items/b32dd7487d724faac1fe)

# 問題

以下のコードを実装して、テストを行おうとしました。

```s3_download.rb
s3 = Aws::S3::Client.new
signer = Aws::S3::Presigner.new(client: s3)
signer.presigned_url(:get_object, 
                     bucket: 'your-bucket',
                     key: 'path/to/object')
```

しかし、Rspecでどのようにスタブを使えばよいかわからず、また検索しても記事が少なかったのです。

# 解決方法

以下のようなテストを書くことで解決しました。 context以下から書いています。

```test_request.rb
let(:url) { 'test_url' }

before do
  signer = instance_double(Aws::S3::Presigner)
  allow(Aws::S3::Presigner).to receive(:new).and_return(signer)
  allow(signer).to receive(:presigned_url).and_return url
end

it '署名付きURLが返ってくること' do
  result
  expect(response.body).to include url
end
```

また`before do`を無くして、itのなかに`allow`を書いても同じことが実現できます。(ただしrubocopに怒られる)

```test2_request.rb
it '署名付きURLが返ってくること' do
  allow_any_instance_of(Aws::S3::Presigner).to receive(:presigned_url).and_return url
  resutl
  expect(response.body).to include url
end
```

ちなみに例外は以下のように起こしてます。

```test_request.rb
allow(signer).to receive(:presigned_url).and_raise(StandardError)
```

# おわりに

テストを書く人は多いかなと思ったのですが、あまり記事がなかったのでまとめてみました。
署名付きではなくS3から単純にダウンロードしてくるパターンはあったのでそちらが多いのでしょうか。

公式のドキュメントがどのように対応しているかよくわからなかったので、同じ問題で困っている方の参考になれば幸いです。

# 参考
- [Ruby AWS SDK v2 でS3の署名付きURLを発行する](https://qiita.com/takeyuweb/items/b32dd7487d724faac1fe)
- [クライアントレスポンス、およびエラーをスタブする](https://docs.aws.amazon.com/ja_jp/sdk-for-ruby/v3/developer-guide/stubbing.html)
- [rspec-mocks の and_raise で嵌った](https://tnakamura.hatenablog.com/entry/2015/02/02/rspec_mocks_and_raise)
- [allow_any_instance_ofを書き換える理由](https://zenn.dev/murakamiiii/articles/eddd69f3dcde18)
【Swift】モーダルを下スワイプで閉じられなくなった（iOS15）

# どういうことか

例としてWebViewControllerをモーダルで表示している。
――で、こんな感じ。

![21fef13bf9d8a29223897b8a8bcec9c9.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413699/3c88c034-07cf-bba1-ad56-ae12e9ed5184.gif)

閉じることができない。もどかしい。

## なぜか

iOS15から**ハーフモーダルがライブラリなしに実装できるようになった**ためだと思われる。
結論から言うと、閉じるためのハンドル（取っ手）をつける記述を書かないと閉じることができない。

```swift
if let sheet = webViewController.sheetPresentationController {
    // コレ
    sheet.prefersGrabberVisible = true
}
```

![6d944162d9481716dac92ec82983611b.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413699/3fc51a7f-0116-c83a-a3f1-c17493606354.gif)

取っ手が出て閉じられるようになった。
iOS15のみの対応であるため、2021年10月現在実際に書かれるコードはこんな感じになるだろう。

```swift
if #available(iOS 15.0, *) {
    if let sheet = webViewController.sheetPresentationController {
        sheet.prefersGrabberVisible = true
    }
} else {
    // Fallback on earlier versions
}
```

## ちなみに

ハーフモーダルにするのはたったこれだけ。

```swift
if #available(iOS 15.0, *) {
    if let sheet = webViewController.sheetPresentationController {
        sheet.detents = [.medium()]
    }
} else {
    // Fallback on earlier versions
}
```

![8055a396d1dcb26b4a6cf935c16990e3.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413699/7e0601a5-8aab-1d51-22e5-80ee3ffcc04a.gif)

ハーフモーダルにすると枠外タップで閉じることができる。フルモーダルは枠外タップ閉じることができない。
調べてないけど、閉じる（あるいは閉じない）設定もあるかもしれない。

一応公式

https://developer.apple.com/documentation/uikit/uisheetpresentationcontroller

おわり(´・ω・｀)
プライベートgitlabのcontainer registyを使う

ローカルに立てたgitlab container registryへdocker pushして、さんざん404エラーを食らったのでメモを残しておきます。

エラーの例。

~~~bash
> docker push myname.local/group1/subgroup1/app01:latest
The push refers to repository [myname.local/group1/subgroup1/app01]
aedce5ed85dc: Preparing
e2eb06d8af82: Preparing
error parsing HTTP 404 response body: invalid character '<' looking for beginning of value: "<!DOCTYPE html>\n<html>\n<head>
<以下略>
~~~

# ポイント

registryで使用するホスト名(ポート番号込み)を、gitlab/dockerで一貫させないとハマります。

# 環境

## 動作環境
- gitlab-eeはテスト用なのでdockerで動かした(重要な環境での使用はおすすめしない。all in one containerの構成にはおじさんなので抵抗がある。キッパリ)。
- OS:Ubuntu 21.04
- docker:version 20.10.7, build 20.10.7-0ubuntu1~21.04.1 (ubuntuが配ってるdocker.ioパッケージ)
- container image:gitlab/gitlab-ee:14.3.2-ee.0
- gitlabはnon https
- gitlab側の認証はsshではなくてhttp

# 設定

## gitlab.rb  
registry_external_urlに、dockerを動かしてるホストの名前と、80番以外のポートを指定し、更にgitlab_railsも設定(以下"myname.local"をdocker動作ホストのhostname fqdnに置換してください。fqdnでなくてもいいんじゃないかと思いますが私はfqdnで指定しました)

~~~gitlab.rb
registry_external_url 'http://myname.local:5050'
gitlab_rails['registry_enabled'] = true
gitlab_rails['registry_host'] = "myname.local"
gitlab_rails['registry_port'] = "5050"
~~~ 
  
## docker  
registryが非httpsなので、ホストで動作するdockerdにそれを教えてあげる。service側で引数に設定しても動くんじゃないかと思うが、/etc/docker/daemon.jsonで設定した。ポート番号まで込みで教えてあげるのがポイント。defaultで存在しているエントリlocalhost:32000はいらん気がするがとりあえず残した。

~~~daemon.json
{
    "insecure-registries" : ["localhost:32000","myname.local:5050"] 
}
~~~

# 実行コマンド

## docker run  
基本的には[マニュアル](https://docs.gitlab.com/ee/install/docker.html)通りだが、上記gitlab.rbで指定したポートも転送指定する。22番も重複するので変えている。(gitlab.rbでssh止めるほうがいいと思うが、やりかたがすぐにはわからなかったのでpublishで曲げて楽した)
諸々面倒なことを特権で逃げてます。
当たり前ですが変数GITLAB_HOMEは適当に設定してあげてください。

~~~bash
> docker run -it --privileged --hostname myname.local --publish 443:443 --publish 80:80 \
--publish 2022:22 --publish 5050:5050 --name gitlab \
--volume $GITLAB_HOME/config:/etc/gitlab --volume $GITLAB_HOME/logs:/var/log/gitlab \
--volume $GITLAB_HOME/data:/var/opt/gitlab gitlab/gitlab-ee
~~~

## docker login, build, tag, push

docker login/build/tag/push は、ポート番号まで込みで実行する。
loginの場合、ポート指定なし(80で動作)でもSuccessするが、それではpushしたときに404になる。
Passwordはgitlabで発行しておいたtokenを指定する。token発行時にregistry read/write権限は必須だとは思うがそれなしだとどうなるかは未検証。めんどくさいのでrepository read/write含めて全部付与したという・・・

~~~bash
> docker login myname.local:5050
Username: hogehoge
Password:
WARNING! Your password will be stored unencrypted in /home/xxx/.docker/config.json.                                        
Configure a credential helper to remove this warning. See                                                                    
https://docs.docker.com/engine/reference/commandline/login/#credentials-store
Login Succeeded
~~~

image名にも一貫性を持たせる必要がある。docker tagはこんな感じ。

~~~bash
> docker tag myimage myname.local:5050/group1/subgroup1/app01:0.1 
~~~

必然的にdocker pushも、ポート番号込みのイメージを使うことになります。一貫してますね。

~~~bash
> docker push myname.local:5050/group1/subgroup1/app01:0.1
~~~

おしまい。
AWSにNext.jsを簡単にデプロイする方法2選

# はじめに
awsには多様なサービスが存在し、Next.jsをデプロイするだけでも無数の方法があるので個人的に良さそうと思った2つを紹介します。
どちらもawsが触ったことがないひとでも使うことができ、安価に始められ、本番投入できるということを基準にしています。


 


---
# 動作させるソースコードについて

デプロイするソースコードは2パターンどちらも以下になります。
https://github.com/hal256/next-hosting-test/tree/main

以下コマンドでプロジェクトを作成し、ssr用のページを作成しただけのプロジェクトです。

```
yarn create next-app --typescript
```


---

# パターン1 AppRunner
ECS(Fargate)を少ない設定で動かせるようにしたサービス
Github等と連携してpush to deploy or ECRから自動pullしてデプロイが可能で使い心地としてはherokuに近い
FargateはVPCやELB作成したりとやることがかなり多い。参考→(https://aws.amazon.com/jp/cdp/ec-container/)
さらに上記図に加えてCodepipeLineを使ってCodebuildでソースコードからDockerイメージの作成、CodeDeployを使ってECSサービスにデプロイをするCIを作成する必要がある。

AppRunnerではURLの図にある
 - VPC
 - Subnet
 - ELB
 - ECSクラスター
 - Cloudwatch
あたりを自動で作成し、デプロイしてくれる。
Codepipelineで行っていた、ソースコードからDockerイメージの作成、Fargateへデプロイも可能

---

pros
 - 結局Dockerのマネージド・サービスを使いやすく、わかりやすくしただけなので何がどう動いているか明確
 - 死活監視、cpu使用率を元にしたオートスケールまで簡単に設定可能
 
cons 
 - 常時デーモンを起動しリクエストを待ち受けるので最低利用金額が後述amplifyより高め(とはいえ、Fargate使うよりは安い)
 - cdnは自分で設定しないといけないのでアセットファイルはcdnから、配信したい場合は少し手間




---
## パターン2 amplify
Next.js、Nuxt.js等のフロントエンドウェブアプリケーションを構築するための開発プラットフォーム。
デプロイ部分だけ抜き出すとvercelに近い？
AppRunner基本的にはソースコードのビルド、デプロイしかできない一方、amplifyはデプロイだけでなくcontentfulのようなheadless cms系の管理画面が数クリックで作れたり、認証系のサービスとつなぎこみがしやすくなっていたりとNext.jsを使ったWebサービスを作りやすくする機能が盛りだくさんなのが特徴的

デプロイ部分だけをみても、AppRunnerと同じようにGUIから設定するだけで動くので提供される管理画面を使わなくても選択肢としては良さそう


---

pros 
- リクエスト回数、デプロイ回数を元に利用料が計算されるので、最低利用金額は$0に近い状態で始められる。
- デプロイするだけでcdnが使用されているので速い(はず)

cons 
- たまに遅い？AppRunnerのほうが安定した速度が出ている。
- 裏側でlambdaが動いている関係上RDSを使うのはアンチパターンになるのでmysqlが基本的には使えない。(RDS Proxyを使えば一応可能だが設定は若干手間)



---

## 結局どっちが良いのか？
どちらも設定がかなり簡単で、アクセス数を元にしたスケールが容易であることには変わりはないのでアプリケーション自体の設計をクラウドネイティブに寄せるかどうかで変わりそう。
クラウドネイティブアーキテクチャにする場合はやはりamplifyにするのが良さそう。
amplifyでホスティングと管理画面作成、coginitoで認証して....等などするには向いている。

lambda？なにそれ？というメンバーが多い場合、管理画面もソースコードで管理してテストカバレッジ100%です！というプロジェクトがすでに完成している場合はAppRunnerのほうが向いている。
DokcerコンテナにしてしまえばGCPやAzureに移行も可能なので、ベンダーロックインが嫌という場合はAppRunnerにするしかなさそう。
web開発におけるディレクトリ構造について、、

なぜ、ディレクトリ構成を考える必要があるのか
  ・ディレクトリ直下に異なる拡張子やファイルが散在してしまう
  ・設計中にディレクトリ構成の見直しをすると、その都度URLやパスの設定を修正する必要が出てくる。
ディレクトリ構造
/ application
  / css
  / js
  / images
  index.html


・ファイル移動したらURLやパスを再設定する
  <link rel="stylesheet" href="〇〇〇.css">
        変更後 ↓
  <link rel="stylesheet" href="./css.〇〇〇.css">

・画像ファイルの再指定
<img src="〇〇〇.jpg" alt="〇〇〇" />
        変更後 ↓
<img src=".image/〇〇〇.jpg" alt="〇〇〇" />

・JSファイルの再指定
<script src="〇〇〇.js"></script>
          変更後 ↓
<script src="./js/〇〇〇"></script>

その他ディレクトリ構成例
  ・font・・・外部のフォントデータを入れるディレクトリ
    aaa.ttf, bbb.ttf
  ・scss・・・sassで作成したファイルを入れるディレクトリ
  ・vendor・・・外部からのライブラリを入れるディレクトリ
    jquery, fontawesome など

・webサイトのディレクトリ構造とその命名規制に悩む
・assets：複数形で個人。会社の財産・資産
・public：公開の・共有の
・modules：モジュール
・commons：共通
・resources：資源・供給源・物資

・CSSや、JSををまとめたフォルダの生をどうするか
・フォルダの中身が意味するところで、具体的につける派
  style, script, image, include, file, download, document, archive, font, web-fonts, library
・上記の両方が混在してしまう
・ライブラリやおプラグインなどをどこに置くか
・gruntやsassなどのメタ言語の登場で、コンパイル前のことも考えないといけなくなってくる。

結論
・dest  -- コンパイル結果
・src  --  コンパイル前
・index.html
・assets -- コンパイル後に残らないフォルダは、先頭に「_」をつける
・_coffee -- Coffeescript
・_sass  -- Sass
  ・lib  -- Sassの共通ライブラリ
  ・vendor  -- 外部ライブラリ。
  ・js
  ・css
  ・img


・webサイト１ページにつき、１HTMLファイル
【PHP】$_SERVER['HTTP_REFERER']リファラを使用してアクセス元によって処理を振り分ける

## $_SERVER['HTTP_REFERER']とは

**$_SERVER**とはPHPのスーパーグローバル変数でサーバ情報および実行時の環境情報が入っています。

**HTTP_REFERER**は$_SERVERで取得できるインデックスのひとつで現在のページに遷移する前にユーザーエージェントが参照していたページのアドレスを取得することができます。

以下のコードでHTTP_REFERERを取得します。

```php
$_SERVER['HTTP_REFERER']
```

ただし、リファラは確実に取得できるものではないので注意が必要です。

## アクセス元によって処理を分ける

`$_SERVER['HTTP_REFERER']` を使ってチェックしたいURLによって処理を振り分けます。

```php
// リファラーの取得（セットされていない場合はnull）
$referer = isset($_SERVER['HTTP_REFERER']) ? $_SERVER['HTTP_REFERER'] : 'null';

if (preg_match("/チェックしたい文字列/", $referer)) {
	// 一致した時の処理
	
}
else {
	// それ以外の時
	
}
```

## 参考

PHP: $_SERVER - Manual

[https://www.php.net/manual/ja/reserved.variables.server.php](https://www.php.net/manual/ja/reserved.variables.server.php)
HTML5からの決まり事

HTML5からの決まり事
  ・ブロック要素とインライン要素による分類の廃歯
  ・コンテンツモデルカテゴリーの登場 ７つ
  ・トランスペアレント・コンテンツ {
    / 親要素のコンテンツ・モデルを引き継ぐ
  }
  ・パルパブル・コンテンツ {
    / 内容にhidden属性が指定されていないコンテンツを一つ以上持つ必要がある。
  }
  ・セクショニング・ルート {
    /セクションのルートとして扱われる要素のことで、これに属するル要素は独自のアウトライン（段階構造）を持つことができるのが特徴

  }

HTML5においけるタグ分類の考え方
 ・HTML5では、ブロック or インライン概念はなくなり、文章構造の表現を重視したコンテンツカテゴリという考え方でHTMLタグを分類している。

 カテゴリの計７つ
 ・メタデータコンテンツ  meta, command, link, base, script, style, titleなど
 ・フローコンテンツ  bodyタグ内で使用するタグの大半
 ・セクショニングコンテンツ {
   ・セクションを区切ることができるタグ
    article, aside, nav, section, hgroup
 }
 ・ヘッディングコンテンツ {
   h1~h6のような見出しとなるタグ
 }

 ・フレージングコンテンツ {
   /インライン要素と呼ばれていたタグは基本的にフレージングコンテンツ
 }
 ・エンべディッドコンテンツ {
   / 文書内に埋め込みを行うタグのこと
   / audio, canvas, embed, iframe, img, math, object, svg, video
 ・インタラクティブコンテンツ {
   /ユーザーの操作に反応するタグ。
   a, button, details, embed, iframe, label, select, textarea
 }
Ubuntu 20.04LTSにNVIDIA GPU(複数枚)をセットアップ

# 既存ドライバの無効化
これを行わないと`The Nouveau kernel driver is currently in use by your system～`が表示されインストールが完了しない

```conf:/etc/modprobe.d/blacklist-nouveau.conf
blacklist nouveau
options nouveau modeset=0
```

# 再起動
```bash
sudo update-initramfs -u
sudo reboot
```

# NVIDIAドライバインストール
```bash
apt-get -y install gcc make
wget "https://us.download.nvidia.com/XFree86/Linux-x86_64/470.57.02/NVIDIA-Linux-x86_64-470.57.02.run"
bash NVIDIA-Linux-x86_64-470.57.02.run
```

# ドライバ認識確認
```bash
nvidia-smi
Tue Oct  5 11:47:22 2021
+-----------------------------------------------------------------------------+
| NVIDIA-SMI 470.57.02    Driver Version: 470.57.02    CUDA Version: 11.4     |
|-------------------------------+----------------------+----------------------+
| GPU  Name        Persistence-M| Bus-Id        Disp.A | Volatile Uncorr. ECC |
| Fan  Temp  Perf  Pwr:Usage/Cap|         Memory-Usage | GPU-Util  Compute M. |
|                               |                      |               MIG M. |
|===============================+======================+======================|
|   0  NVIDIA GeForce ...  Off  | 00000000:01:00.0 Off |                  N/A |
|  0%   42C    P0     1W /  38W |      0MiB /   981MiB |      0%      Default |
|                               |                      |                  N/A |
+-------------------------------+----------------------+----------------------+
|   1  NVIDIA GeForce ...  Off  | 00000000:02:00.0 Off |                  N/A |
| 35%   39C    P0    N/A /  75W |      0MiB /  4040MiB |      0%      Default |
|                               |                      |                  N/A |
+-------------------------------+----------------------+----------------------+

+-----------------------------------------------------------------------------+
| Processes:                                                                  |
|  GPU   GI   CI        PID   Type   Process name                  GPU Memory |
|        ID   ID                                                   Usage      |
|=============================================================================|
|  No running processes found                                                 |
+-----------------------------------------------------------------------------+

```

# 補足事項
GPUのPCI Expressの挿す位置、順序によっては1枚目しかドライバが当たらない場合があるので、その場合は挿す位置、順番を変えて再試行すること
[Ruby] ExceptionとStandardErrorの違いを確認する

## :gear:  はじめに
PythonやJavaでは一括でエラーをキャッチする際に、Exceptionクラスでキャッチしてしまいます。
ところが、RubyではExceptionではなくStandardErrorでキャッチするのが通常のようです。


## :gear: StandardError で捕捉されるエラー

__サンプルコード__

```rb
begin
    raise NoMethodError
rescue StandardError => e
    puts "#{e.class} is a StandardError"
rescue Exception => e
    puts "#{e.class} is a Exception"
end
```

__実行結果__

```
NoMethodError is a StandardError
```

さらに、キャッチするエラーを明示的に指定しない場合もStandardErrorが捕捉されます。

__サンプルコード__

```rb
begin
    raise NoMemoryError
rescue => e
    puts "#{e.class} is a StandardError"
rescue Exception => e
    puts "#{e.class} is a Exception"
end
```

__実行結果__

```
NoMethodError is a StandardError
```


## :gear: Exceptionで捕捉されるエラー

__サンプルコード__

```rb
begin
    raise NoMemoryError
rescue StandardError => e
    puts "#{e.class} is a StandardError"
rescue Exception => e
    puts "#{e.class} is a Exception"
end
```

__実行結果__

```
NoMemoryError is a Exception
```

## 独自例外の作成時もStandardErrorを継承する
Mavenでとりあえずダウンロードだけしたい場合

## mavenでjarを落としたいだけ

詳しい使い方とかパッケージ管理がしたいのではなく、.jarとかをmaven経由で関連パッケージと一緒にダウンロードしたい場合の俺用メモ

Windows
まずはmavenをダウンロードしてPath設定
[ダウンロード](https://sukkiri.jp/technologies/devtools/maven/apache-maven-installwindows.html)

プロキシが必要な場合は
conf/setting.xmlのproxysの所に記述

落としたいパッケージのmaven用アドレスを取得
例えばAWS関係のパッケージだと
[V2のMVNのリポジトリ](https://mvnrepository.com/artifact/software.amazon.awssdk/s3/2.17.51)
や[V1のリポジトリ](https://mvnrepository.com/artifact/com.amazonaws/aws-java-sdk-s3/1.12.79)
辺りに情報があるので「グループID:アーティファクトID:バージョン」を利用して
mvnでgetする

```
mvn dependency:get -Dartifact=software.amazon.awssdk:sdk-core:2.17.35 -Ddest=./
mvn dependency:get -Dartifact=com.amazonaws:aws-java-sdk-s3:1.12.79 -Ddest=./
```

※落とす場所は無指定だとユーザフォルダにダウンロードされる
Power AutomateでSharePoint Onlineにニュース リンクを追加する（SharePoint REST API利用）

#はじめに

[前回の記事](https://qiita.com/MiyakeMito/items/daac741625c9fc58686e)では、Power Automate（Power Appsも利用）から、Share Point Onlineへ「ニュースの投稿」をする方法を記載しました。

今回は、Power Automateから、Share Point Onlineのニュースリンクを追加する方法を記載します。
（完全に、「ニュースの投稿」する方法を調査しているときの副産物です笑）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/63e3b638-2217-ba57-a239-0b6f1fe033dd.png)


ニュースリンクにはyoutube動画なんかも追加できます。すごいですね！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/6f91335d-2fc2-6a64-dff1-adf0608334cc.png)


**しかし、本文の文字数制限があるため「ニュースの投稿」と使い分けする必要があります**


#ニュースリンク追加フロー作成（Power Automate）

####ニュースのURLの指定

リンクするWebサイト上のページURLを設定します。
テスト的に「作成」を利用していますが、フローのパラメータとして指定すれば、Power Appsから呼び出せたりします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/12659efd-42c7-de8e-590a-672754ae5d61.png)


####ニュースリンクへの設定値を取得

ニュースリンクには、

- タイトル
- 説明
- プレビュー画像　
- ニュースサイトへのリンク

を設定します。
これらの値を自身で設定しても良いのですが、SPOで自動的に取得することも可能です。
今回はこの機能を利用します。

Sharepointの[SharePoint に HTTP 要求を送信します]を選び、
[サイトのアドレス]には投稿するサイトを選択
[方法]にはGETを選択

URLには

__api/SP.Publishing.EmbedService/EmbedData?url='[サイトのURL]'&version=1&bannerImageUrl=true_

具体的には

```
_api/SP.Publishing.EmbedService/EmbedData?url='@{outputs('作成')}'&version=1&bannerImageUrl=true
```

を指定します。

![{5DB2ECAB-E045-4E79-BEA6-90E21F38D16E}.tmp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/a1bd5478-0b52-4b17-ce48-948cb21d6fdc.png)


以下データが取得可能です。
![{5DB2ECAB-E045-4E79-BEA6-90E21F38D16E}.tmp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/259ee6ca-9fa9-9843-c155-8e31df06b947.png)


####ニュースリンクを追加

最後にニュースリンクをSPOサイトに追加します。

Sharepointの[SharePoint に HTTP 要求を送信します]を選び、
[サイトのアドレス]には投稿するサイトを選択
[方法]にはPOSTを選択

URLには

```
_api/sitepages/pages/reposts
```

ヘッダーは下記です

| 項目 | 値 |
|:-:|:-:|
|  content-type | application/json;odata=verbose  |
| accept  |  application/json;odata=verbose |

ボディには下記を設定します。

```
{
  "__metadata": {
    "type": "SP.Publishing.RepostPage"
  },
  "OriginalSourceUrl": "@{outputs('SharePoint_に_HTTP_要求を送信します')?['body']?['d']?['Url']}",
  "BannerImageUrl": "@{outputs('SharePoint_に_HTTP_要求を送信します')?['body']?['d']?['ThumbnailUrl']}",
  "Title": "@{outputs('SharePoint_に_HTTP_要求を送信します')?['body']?['d']?['Title']}",
  "Description": "@{outputs('SharePoint_に_HTTP_要求を送信します')?['body']?['d']?['Description']}",
  "IsBannerImageUrlExternal": true,
  "ShouldSaveAsDraft": false
}
```

![{5DB2ECAB-E045-4E79-BEA6-90E21F38D16E}.tmp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/32872a69-cdbe-c63f-0caa-a208f4e5b4e1.png)

#動作

サイトのURLを指定しフローを実行すると、ニュースリンクが作成できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480768/6cb23efa-0694-c101-5adc-4348778e5a44.png)
【Rspecエラー】Could not find a valid mapping for 

##環境
Ruby 3.0.2
Rails 6.1.4.1
devise　4.8.0

##状況
Rspec実行時に下記のエラーで怒られた
（deviseのテスト設定済）

```
Failure/Error: sign_in user
     
     RuntimeError:
       Could not find a valid mapping for #<Employee id: ...>
```

```app/models/user.rb
class User < ApplicationRecord
  has_one :employee, dependent: :nullify
end
```

```app/models/employee.rb
class Employee < ApplicationRecord
  belongs_to :user, optional: true
end
```

```spec/factories/employees.rb
FactoryBot.define do
  factory :employee, aliases: [:user] do
    firstname { "test" }
    lastname { "employee" }
    sequence(:number) { |n| "1#{n}" }
    sequence(:email) { |n| "tester#{n}@example.com" }
  end
end
```

```spec/requests/XXXXX_spec.rb
RSpec.describe "/XXXXX", type: :request do
  describe 'GET /XXXXX' do
    let!(:user) { create(:employee) }
    subject { get '/XXXXX' }

    before do
      sign_in user
      subject
    end
    it 'ログインしている従業員を取得すること' do
      expect(response).to have_http_status(200)
    end
  end
end
```

##解決方法

原因：factorybotでuserを作成していないから。employeeのエイリアスとしてuserを指定したら行けると思っていた

```spec/factories/users.rb
FactoryBot.define do
  factory :user do
    name { 'test employee' }
    sequence(:email) { |n| "tester#{n}@example.com" }
  end
end
```
React + Reduxを基本からまとめてみた【4】【Actions】

##Fluxフロー図
![flux_flow.png]
(https://camo.qiitausercontent.com/cdd0824a85a48f51dacc8ec20fa5cf5ce6ec8093/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3434303539332f33313139643830622d383163642d633664382d636233312d6132383837386261313738312e706e67)

##Actionsとは

- 要求を受けて変更を依頼<br/>⇨ Actionsを書いてstateの変更を依頼する

##Actionsの役割

- アプリからStoreへデータを送るためのpayload(データの塊)を渡す役割<br/>⇨ アプリから受け取ったデータをReducersへ渡す

##なぜActionsを使うのか
- 純粋にデータを渡す処理だけを記述するため
- どのstateをどのように変更するのかについてはReducersに任せる

##Actionsの書き方

1. Action typeを定義してexport
2. typeとpayloadを記述する
3. プレーンなobjectを返す
 
######※Actionsは、プレーンなobjectを返す!!

```Sample.js
//1. Action typeを定義してexport
export const SIGN_IN = "SIGN_IN";

export const signInAction = (userState) => {
//3. プレーンなobjectを返す
  return {
//2. typeとpayloadを記述する
     type: "SIGN_IN",
     payload: {
       isSignedIn: true,
       uid: userState.uid,
       username: userState.username
    }
  }
};
```



##参考サイト
[日本一わかりやすいReact-Redux入門#4...Actionsを書いてstateの変更を依頼しよう]
(https://www.youtube.com/watch?v=0JKkLZHmWxk)
[React- Redux 入門]
(https://qiita.com/shtwangy/items/4f9993ade64c3c6858d3)
【Rails6】Webpacker::Manifest::MissingEntryError を解消する



### 1.使用環境


* mac.os Catalina バージョン10.15.7 

  * Ruby 3.0.1 

  * Rails 6.0.4.1
   * psql (PostgreSQL) 13.4
   * node 16.10.0
   * npm  7.24.0



###2.実際のエラー

Webpacker can't find application in ...
Webpacker がファイルを探せていないこと原因です

Webpackerとは簡単にいうとRuby on Rails上でJavaScript開発をするために必要なファイルのまとまりです。
Node.jsで、サーバーサイドで動きます。

![スクリーンショット 2021-10-05 17.08.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1858392/86a7e44c-04ad-1f9a-aa1c-386cb0f792b5.png)





###3.試したこと

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>を削除するとエラーは消えますがjavascriptが読み込めなくなります。

```app/views/layouts/application.html.erb
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
```


####4.結果
node -v16.10.0 からnode -v14.18.0
にダウングレードし、新しくアプリを作成すると解消されました。



#####node最新の安定バージョンへのアップグレード
```
sudo n stable
```
#####特定のバージョンへの変更
```
sudo n 14.18.0
```
明確な理由はわかりませんが
僕の場合はnodeのバージョンが原因でした。






参考

nodeのversionは[こちら](https://try2explore.com/questions/jp/10158901)の記事を参考にしました。
【備忘】EC2のタイムゾーンをJSTに変更する

### EC2はJSTじゃないんですね
さすがグローバル企業

- EC2のrootユーザで作業

`localtime`の編集

```console
$ sudo su -
# cp -p /usr/share/zoneinfo/Japan /etc/localtime
# cat /etc/localtime 
TZipYp;~~JDTJSTTZif2
                        e¤ppYp;ۭLMTJDTJST
JST-9
```

`clock`の編集

```console
# vim /etc/sysconfig/clock
ZONE="Asia/Tokyo"
UTC=False
# date
Tue Oct  5 20:07:47 JST 2021
```
いいバッチ処置とは

ちょっと話題に上がったのでメモる。

- 冪等である
- 引数でいろんな値(start値、end値)を注入できるようにする。
    - 💡(メール送信、プッシュ通知の送信の場合)引数で追加の送信者を加えられるようにし、自分を送信対象に含める
    - 💡失敗時に次に実行するコマンドを出力する
複数アカウントのAWS CodeCommitを管理する時のgit clone時tips

自分で3回調べ直したので手順メモ。

# 背景
- AWS CodeCommitにあるリポジトリをcloneしたい
    - 利用するAWSアカウントが複数あるため、 `git config --global` したくない
    - （もっとスマートな方法もありそうだが）都合よく切り替えるため初回git clone時に追加の操作を足す。


## 参考
大枠はこちらの方法です。

https://qiita.com/nekonoprotocol/items/b4bc9565f2babaf3e781

# todo

### 1. AWS Credencial設定

```bash
aws configure --profile wasshoi
```

「wasshoi」部分は案件に応じてお好みで。

### 2. gitに対してまずは素直にglobal設定

```bash
git config --global credential.helper "!aws codecommit --profile wasshoi credential-helper $@"
git config --global credential.UseHttpPath true
```

### 3. リポジトリを使いたいディレクトリ配下で特定Credencialを読ませる
direnvを利用。

https://qiita.com/kompiro/items/5fc46089247a56243a62

```bash:設定。
mkdir ~/projects/wasshoi/
cd ~/projects/wasshoi/
vim .envrc
```

```bash:.envrc
export AWS_PROFILE=wasshoi
export AWS_DEFAULT_REGION=ap-northeast-1
```

```bash:反映。
direnv allow
```

### 4. ひとまず素直にgit clone

```bash
git clone https://git-codecommit.ap-northeast-1.amazonaws.com/v1/repos/sample-repo
cd sample-repo
```

git clone用のurlはAWSコンソールから拾ってこれる。今回とってくるリポジトリは「sample-repo」という名前としておく。

### 5. 個別にgit設定

```bash
git config credential.helper "!aws codecommit --profile wasshoi credential-helper $@"
git config credential.UseHttpPath true
```

該当リポジトリ配下の `.git/config` に追記される。

### 6. gitのglobal設定を削除

```bash
vim ~/.gitconfig

↓
# ファイル内の以下箇所を削除してしまう
[credential]
	helper = !aws --region ap-northeast-1 --profile wasshoi codecommit credential-helper $@
	UseHttpPath = true
```

### 7.完了。
その他、mac端末の事情として以下対応するケースもあるがそれはまた別の話。

https://qiita.com/szk3/items/f346d5c1804653d8b35a

---

direnv設定など冗長に見える部分もあるが、まあ自環境での事情を加味したやや個人的な手順としてご容赦。
AsciiDoc メモ

Asciidoc で自分がよく使うのにすぐ忘れてしまう記法のメモです。
随時追加予定


## 注意とか入れる (Admonitions)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51316/7e3bce6a-a932-9cb9-beaf-32dee54ed6b3.png)


```
[NOTE]
.Title
====

`NOTE` 以外に、`TIP`、`IMPORTANT` 、`CAUTION` 、`WARNING` がつかえます
====
```


## 折りたたみ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51316/72610201-964f-360d-73a1-c01745558645.png)


```
[%collapsible]
.詳細ログ
====
[source]
----
111.222.333.100 HOME - [2000/01/01 01:08:00 -0800] "GET /book/ad.htm HTTP/1.0" 200 198 "http://example.com/book/index.htm" "Mozilla/4.01 "
111.222.333.100 HOME - [2000/01/01 01:08:40 -0800] "GET /book/ad.htm HTTP/1.0" 200 28083 "http://example.com/book/index.htm" "Mozilla/4.01 "
111.222.333.100 AWAY - [2000/01/01 01:08:50 -0800] "GET /book/ad7.gif HTTP/1.0" 200 9332 "http://example.com/book/index.htm" "Mozilla/4.01 "
111.222.333.100 AWAY - [2000/01/01 01:09:10 -0800] "GET /book/click.htm HTTP/1.0" 200 207 "http://example.com/book/inddex.htm" "Mozilla/4.01 "
----
====
```

## テーブル

### 普通のテーブル

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51316/8552d032-cb9e-c3f1-1771-b81aae326d30.png)


```
.テーブルタイトル
|===
| a | b | c

| A
| B
| C

| あ
| い
| う

|===

```

### CSV読み込み

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51316/2a868aad-6927-6c17-4bdd-ad30179482f4.png)



```
[format="csv"]
|===
include::test.csv[lines=2..3]
|===
```


### ページ内へのリンク

`[[my-anchor]]` でアンカーの埋め込みと、`<<my-anchor>>` で参照ができます。
`<<my-anchor,text>>` でラベルを設定できます。 

```

xxxxxについては、<<my-anchor,ここ>> を参照してください




== 参照先 [[my-anchor]]

xxxxx

```