OmniAICreator/Qiita-1.07M huggingface dataset:
【Angular Material】Expansion Panelで表示されるアイコンを変更したい

## はじめに
Angular Materialで提供されている「[Expansion Panel](https://material.angular.io/components/expansion/overview)」のアイコン（画像でいうと赤枠の部分）を変更するやり方を共有していく。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/316318/910853c7-3985-ce7b-6c53-f892d48dcc53.png)

## まずはドキュメント通りのコード
```html:panel-example.component.html
<mat-accordion>
    <mat-expansion-panel>
        <mat-expansion-panel-header>
            <mat-panel-title>美食殿</mat-panel-title>
        </mat-expansion-panel-header>
        <ng-container *ngFor="let charaName of bisyokuden">
            <p>{{charaName}}</p>
        </ng-container>
    </mat-expansion-panel>
</mat-accordion>
```

ここから修正していく。

## 既存のアイコンを非表示にする
「[hideToggle](https://material.angular.io/components/expansion/api#MatExpansionPanel)」というオプションがあるのでこれを`true`に設定

```html:panel-example.component.html
<mat-accordion>
    <mat-expansion-panel [hideToggle]="true">
        <mat-expansion-panel-header>
            <mat-panel-title>美食殿</mat-panel-title>
        </mat-expansion-panel-header>
        <ng-container *ngFor="let charaName of bisyokuden">
            <p>{{charaName}}</p>
        </ng-container>
    </mat-expansion-panel>
</mat-accordion>
```
これでまずはアイコンが消える
<img width="525" alt="スクリーンショット 2019-12-22 14.57.06.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/316318/3813bc5d-1629-0573-300e-668ffb5e1116.png">

## `mat-expansion-panel-header`内にアイコンを設定する
```html:panel-example.component.html
<mat-accordion>
    <mat-expansion-panel [hideToggle]="true">
        <mat-expansion-panel-header>
            <mat-panel-title>美食殿</mat-panel-title>
            <mat-icon>add_circle_outline</mat-icon>
        </mat-expansion-panel-header>
        <ng-container *ngFor="let charaName of bisyokuden">
            <p>{{charaName}}</p>
        </ng-container>
    </mat-expansion-panel>
</mat-accordion>
```

これで好きなアイコンに変更できた。
<img width="524" alt="スクリーンショット 2019-12-22 15.09.54.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/316318/0b06e337-b25d-6511-3e80-d9f3f1fb3fed.png">
ちなみに参考リンク先では`mat-panel-description`を使ってやっているが、これをすると右端によらないため、そのまま`mat-icon`を指定してやれば良い。

## 余談
しかしこのままではopen, closeでアイコンが変わらない。
参考リンク先ではそのやり方を紹介してくれているが、複数のExpansion Panelを表示した場合に全てのアイコンが変わってしまう。
> The solution works fine for one mat-expansion-panel. What to do if I have multiple expansion panels? The panelOpenState is a variable that will be shared by every expansion panels. One panel expands, all the icon changes from + to zero because every expansion panels share the same variable panelOpenState. 

質問者も同じことを言っている。続けて、
> I thought one solution: to give every panel a hardcoded id (like panel1, panel2, etc.) and using opened and closed event I can change the value in the <mat-icon> tag.

公式ドキュメントでもやり方は書いてないのでどうやらこの人のいう通り**全てのPanelに固有のIDを振り、`opened` `closed`イベントで`mat-icon`を変更してやる**しか方法は無さそうだ。
いずれその（自分なりの）やり方も記事にする予定。

## 参考
- [How to change toggle icon of mat-expansion-panel?](https://stackoverflow.com/a/56619369)
c#で六曜の計算

# JapaneseLunisolarCalendarを使って計算すると便利です
``` c#
static int RokuyoDate(DateTime clacDay)
{
    JapaneseLunisolarCalendar jpnOldDays = new JapaneseLunisolarCalendar();
    int oldMonth = jpnOldDays.GetMonth(clacDay); //旧暦の月を取得
    int oldDay   = jpnOldDays.GetDayOfMonth(clacDay);//旧暦の日を取得　

    var aaa = jpnOldDays.GetYear(clacDay);
    var bbb = jpnOldDays.GetEra(clacDay);

    //閏月を取得
    int uruMonth = jpnOldDays.GetLeapMonth(
            jpnOldDays.GetYear(clacDay),
            jpnOldDays.GetEra(clacDay));

    //閏月含む場合の月を補正
    if ((uruMonth > 0) && (oldMonth - uruMonth >= 0))
    {
        oldMonth = oldMonth - 1;              //旧暦月の補正
    }

    //ルールとしては
    // (月 + 日) % 6　の結果が六曜になり
    //大安→赤口→先勝→友引→先負→仏滅
    int rokuyo = (oldMonth + oldDay) % 6;
    return rokuyo;
}
```
【Qiita】式をシンタックスハイライトさせる（色を付ける）方法

Qiitaで記事を書くとき、**ファイル名をつけるまでも無いけどシンタックスハイライトさせたい（式に色を付けたい）**と思ったことはありませんか？
本記事ではその方法をメモします。

・シンタックスハイライト無し（式が見づらい）

```
$ array = [2, 5]

$ array.sum.fdiv(array.length)
# => 3.5
```

・シンタックスハイライト有り（見やすい。本記事で目指すもの）

```ruby
$ array = [2, 5]

$ array.sum.fdiv(array.length)
# => 3.5
```

# 結論

\`\`\`ruby
〜式〜
\```

と書けばOKです！（Rubyの場合。php, python, java等でもできました）

冒頭の例だと、
\`\`\`ruby
$ array = [2, 5]

$ array.sum.fdiv(array.length)
\# => 3.5
\```
と書けばシンタックスハイライトされます。
↓↓

```ruby
$ array = [2, 5]

$ array.sum.fdiv(array.length)
# => 3.5
```

熟練者は当たり前に知っていると思うのですが、意外と調べても出てこなかったので残しておきます。
まだまだ駆け出しの身なので、ツッコミなどあればどしどし受け付けてます。

# 〜追記〜
ご指摘をいただいたので追記いたします。
公式の「Markdownの書き方」に、シンタックスハイライトのさせ方がちゃんと書いてありました。

<img width="595" alt="スクリーンショット 2019-12-22 15.29.40.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/465401/3b449265-0134-c425-500c-9558242f0983.png">

私の場合、普段 \`\`\`ruby:qiita.rb とやらずに \`\`\`qiita.rb とやっていたので、
ファイル名を書かない場合に「あれ？どうすれば？」となっていたんですね。

\`\`\`qiita.rb とすればRubyであることを読み取ってくれるQiitaさんの優しさに甘えていたのでした...
Qiitaさん、失礼いたしました。
Javascript FormObjectの空判定

```
const apple = 'りんご';
const lemon = 'れもん';

const formData = new FormData();

formData.append('apple', apple);
formData.append('lemon', lemon);

//ES6未満
let isEmpty = false;
for (let value of formData.entries()) {
 isEmpty = true;
 break;
}

//ES6以降
if(formData.entries().length > 0){
 isEmpty = true;
}
```
k
##参考にさせていただいたサイト
[FormData オブジェクトの中身が見たい！
](https://qiita.com/_Keitaro_/items/6a3342735d3429175300)
[JavaScriptの真偽判定まとめ。JavaScriptの真偽判定まとめ。](https://qiita.com/__mick/items/ea30e3efb1cbff3ae35e)
ループでi++を使うのは止めよう〜++ iがi ++よりも優れていることが多い理由（前置インクリメント vs 後置インクリメント）〜

>こちらの記事は、[Devin Soni](https://medium.com/@devins?source=post_page-----1f906520d548----------------------) 氏により2019年 11月に公開された『 [Stop Using i++ in Your Loops](https://medium.com/better-programming/stop-using-i-in-your-loops-1f906520d548) 』の和訳です。
本記事は原著者から許可を得た上で記事を公開しています。

# イントロダクション


これまでforループを書いたことがあるなら、ループ変数をインクリメントするために、ほぼ間違いなく`i++`を使用したことがあるでしょう。



しかし、なぜそのように選ぶのかを考えたことがありますか？



明らかなこととして、`i++`の結果、iは１大きくなります。それが我々が望むことです。しかし、これを実現するにあたって`++i`や`i++`、ひいては`i = i + 1`といった多くの方法があります。



この記事では、`++i`と`i++`という1を加算する２つの方法を取り扱い、ほとんどの状況で`++i`が`i++`よりも優れていると考えられる理由をご説明します。




# 後置インクリメント(i++)

`i++`方式、または後置インクリメントは最も一般的な方法です。

擬似コードにおいて、後置インクリメント演算子は変数iに対して大まかに次のような振る舞いをします。

```
int j = i;
i = i + 1;
return j;
```

後置インクリメント演算子はインクリメント後の値`i + 1`ではなく、元の値`i`を返す必要があるため、古いバージョンのiを保持しておく必要があります。

これは、通常その値を保持するための追加メモリを不必要に使用するということを意味しており、なぜなら大抵の場合、古いバージョンのiを実際に使用することはなく、単に破棄されるためです。


# 前置インクリメント(++i)

`++i`方式、または前置インクリメントはあまり一般的ではなく、通常、CやC ++などの言語を使用する古くからのプログラマーが使用します。

擬似コードにおいて、前置インクリメント演算子は変数iに対して大まかに次のような振る舞いをします

```
i = i + 1;
return i;
```

特にここでは古いiの値を保持する必要はありません。単に加算して返すだけです。


これはforループの典型的なユースケースと非常に適合しています。この状況では古い値が必要になることが、ほとんどないためです。


# 注意事項


後置インクリメントと前置インクリメントの違いを見て、後置インクリメントではキャッシュされた`i`の値は使用されないため、コンパイラがその行を最適化により除去し、2つの演算子が同等になるということに気づいた方がいるかもしれません。

整数などのプリミティブ型には、これはおそらく当てはまります。

ただし、ユーザー定義型やオーバーロードされた+操作によるイテレータのような、より複雑な型の場合、コンパイラはキャッシュ操作を安全に最適化できない場合があります。



そのため、ほとんどの場合、インクリメントするものの前の値が必要でない限り、前置インクリメント演算子は後置インクリメント演算子よりも優れているか、同等であると考えられます。

# 翻訳協力
Original Author:  **[Devin Soni](https://medium.com/@devins?source=post_page-----1f906520d548----------------------)** 
Thank you for letting us share your knowledge! 

この記事は以下の方々のご協力により公開する事が出来ました。
改めて感謝致します。
選定担当: yumika tomita
翻訳担当: @satosansato3
監査担当: @nyorochan
公開担当: asuma yamada

# ご意見・ご感想をお待ちしております
今回の記事は、いかがだったでしょうか？
・こうしたら良かった、もっとこうして欲しい、こうした方が良いのではないか
・こういったところが良かった
などなど、率直なご意見を募集しております。
いただいたお声は、今後の記事の質向上に役立たせていただきますので、お気軽にコメント欄にてご投稿ください。
みなさまのメッセージをお待ちしております。
Web開発勉強のためWordpressでポートフォリオサイトを開設するまで②〜MAMPローカル環境構築失敗編〜

Wordpressの講座で、ローカルで使用環境を構築するための案内をしていたので、動画に沿って環境構築をしていきました。
PCは動画ではMacを使って案内していましたが、当方Windowsでの環境構築となります。
ちなみに使用PCのスペックは、
・Windows10 HOME バージョン1909
・CPU Cerelon(R) N4000CPU 1.10GHz 1.10GHz
・メモリ　4GB
・ストレージ　HDD1TB
です。（ムダにHDD1TBなのがツッコミどころですw）

まずMAMPをインストールするよう案内されました。
・https://www.mamp.info/
LAMPをもじったオープンソースで、Webサーバーの環境構築が簡単にできるソフトです。
WindowsだからWAMPだよなーと思いつつ無事にインストールまで完了。

動画の案内通り、MAMPのフォルダ内にあるhtdocs内にダウンロードしたWordpress一式を移動。
MAMPを起動させ、ブラウザが起動したのでパスにWordpressのフォルダ名を指定。
この時点でインストール画面が表示されるはずなのですが・・・うまくいかない。
ネットを調べていたところ、wp-config.phpをパスに指定すればオーケーとのことだったのでその通りに操作。
（参考サイト：MAMP・Wordpressセットアップの詳細な手順はこちらのサイトで丁寧に解説されています。）
　・https://bazubu.com/how-to-insall-wp-in-mamp-23798.html
　
無事にセットアップ画面が表示されたので、データベースを作成。
Wordpressのセットアップ手順に従い、データベース名やサイト名を入力。
無事にダッシュボード画面が開きました！わーぱちぱちぱち！

え、ローカル環境構築失敗してないじゃないかって？
そう、タイトル詐欺です。ここまでは。
とりあえずその日はそこまでで操作を終え、翌日にMAMPを起動したところ・・・

あれ？Apacheに緑のランプがつかないぞ？
まあいいかと気にせずWordpressを開こうとするもエラーに。そりゃそうだ。
ネットで調べていたらポート番号が別のアプリケーションと被ってダメなことがあるらしい。
ならばとポート番号をいろいろ変更するも・・・やはりApacheのグリーンライトは点灯せず。
うーむ、困ったなあ・・・と思っていたところ、そういえばUdemyには講座ごとにＱ＆Ａが存在していたことを思い出す。
Ｑ＆Ａを眺めていたところ、同様の質問が何件か。やはりけっこうある現象なのね。
講師の先生が自ら原因を探っていくも、最終的にはXAMPPを使っては？という回答に大半が落ち着いている。~~めんどくさくなったんですね、わかります。~~

ということで、自分もXAMPPをインストールしました。
・https://www.apachefriends.org/jp/index.html
インストール手順は下記のサイトを参考にしました。
・https://bazubu.com/xampp-wordpress-23795.html

MAMPよりボタンとか項目が多いので戸惑うかもしれませんが、基本の流れは一緒なのですんなりインストールできました。
念のためPCを再起動しても問題ないか確認したところ、無事にWordpressのダッシュボード画面を開くことができました！

というわけで、MAMPでうまくいかなかった皆様、その時はXAMPPをインストールしましょう！
僕のDjangoで忘れやすいことのメモ

自分用だから用語とかところどころミスってるかも

##DB作って管理ツールが使えるようにするところまで。（SQLite)
#####1.models.pyにモデルクラスを作る。
Modelクラスを継承させる。

```python
from django.db import models

class 任意(models.Model):
    name = models.CharField(max_length=100)
    quantity = models.IntegerField()
    get_date = models.DateField()
```

#####2.マイグレーションファイルを作る。
ターミナルを起動して
`python manage.py makemigrations アプリ名`

#####3.マイグレーションする。
`python manage.py migrate`


#####4.管理者を作成。
`python manage.py createsuperuser`

#####5.作成したDBを管理者で操作できるように登録
アプリのフォルダのadmin.py

```python
from django.contrib import admin
from .models import #作ったモデルクラス

admin.site.register(#作ったモデルクラス)
```

##datafieldの表示方法の切り替え方
[こちらが非常にわかりやすい](https://dot-blog.jp/news/django-template-date/)

##リダイレクト

```python
from django.shortcuts import redirect

#処理の最後で
return redirect(to='URL')
```

##modelformset
```Python

フォームセット名 = forms.modelformset_factory(
    モデル, form=複製するフォーム)
)
#引数
extra = #空白のフォームを何個出すか
```
html内に埋め込むときは
項目になくても`{{form.id}}`を付ける。これがないとPOSTでエラーになる。
そしてformsetの記載の最後に`{{formset.management_form}}'意味は分からないけど、これがないとフォームが出てこない。
プロジェクトにコンセプトを付けたら色々うまくいった話

## この記事のターゲット
- プロジェクトのリーダーをしている人
- プロジェクトのチームメンバーをしている人
- プロジェクトが何かうまくいっていないと感じている人

<img width="200" alt="怒る人" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/56039a8d-2b7c-f803-21df-566019947005.png">


## はじめに
- あなたが参加するプロジェクトは、**一体感**がありますか？
- 同じ目標を見ているはずが、何か噛み合わないと感じたことはありませんか？


## 結論
プロジェクトに**コンセプト**を付けてみてください

## コンセプトってなんやねん

この記事で言うコンセプトはこんな役割を持っています。

**プロジェクト = 船**
<img width="200" alt="船" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/e7603fc7-f976-5723-7b52-bc89a5682bfd.png">

**目標・ゴール = 目的地やお宝、ひとつなぎの大秘宝**
<img width="200" alt="お宝" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/575527be-3ecd-8bb4-1f52-3f38ff02f35d.png">

**コンセプト = 羅針盤・方位磁針**
<img width="200" alt="羅針盤" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/e415a033-afdf-112d-5b17-dcad30c8afc8.png">

大海原にいる船にとって方位磁針とはどんな存在か、を考えれば簡単。
嵐が来ても、船員が増えても、ルートが二手に別れても目的地を常に指し示し、導いてくれますよね。
<img width="300" alt="羅針盤" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/630e7f69-652c-549d-8229-d7bf47d06c86.png">


## こんなコンセプトを立てました（実例紹介）

#### 1にサクサク、2にワクワク
これは2019年の1年間を費やした下記のプロジェクトのコンセプトです。

- Hanayumeの会員向けマイページのリニューアルプロジェクト
- プロジェクト期間：予定 6ヶ月 ⇨ 結果 12ヶ月
- PJ参加人数：キックオフ時 5名 ⇨ ~~打ち上げ参加者~~ 15名

####コンセプトに込めた思い 
会員向け新マイページは、結婚式の準備を無駄なくサクサク行えることが最重要であり、エッセンスとしてワクワクする要素を入れつつ完成させたいと考えました。

####コンセプトが様々な場面で生きてくる
途中でメンバーが追加・変更となった後でも、コンセプトはそのままにプロジェクトを進行しました。途中参加したメンバーも、コンセプトを非常に意識して動いてくれ「1にサクサク、2にワクワクというのは…」と第3者へ自らの言葉で説明する様子を見かけることもありました。

また、プロジェクトが佳境に差し掛かると、何かと妥協したくなるような苦しい場面が~~毎日のように~~たまに発生していましたが、コンセプトがあることで本当に必要なことは何か、をメンバー全員が考えることが出来ていました。

上記から、コンセプトを設定することでメンバーの見る方向が統一されている、と体感することができたのです。

## コンセプトの効果まとめ

- プロジェクトの人員が追加変更になっても、方向性がぶれない
- プロジェクトメンバーの一人一人が思考したり、選択をする際の軸となる
- 苦しい時や辛い時にも、プロジェクトにとってベストな選択をすることができる

## 終わりに

プロジェクトを成功させたい！と強く願う方の参考になれば嬉しいです。

そして、結婚式をご検討中の方はぜひ、
[ハナユメのスマホ版マイページ](https://hana-yume.net/)を活用して
**サクサク**、そして**ワクワク**しながら結婚式の準備をしてくださいね:santa_tone1::point_up_tone1:
  
![hanayume_btn_ss.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555029/8f8facc2-cc5f-72cf-a36f-33c10091ef5a.gif)

# 私たちのチームで働きませんか？
![alt](https://brides.a-tm.co.jp/wp-content/uploads/2019/11/ATEAM_BRIDES.jpg)
[エイチーム](https://www.a-tm.co.jp/)は、インターネットを使った多様な技術を駆使し、幅広いビジネスの領域に挑戦し続ける**名古屋の総合IT企業**です。
そのグループ会社である**株式会社エイチームブライズ**では、一緒に働く仲間を募集しています！

- [ハナユメ サイト開発グループ](https://jobs.qiita.com/employers/brides-a-tm/development_teams/138)
- [HIMARI開発チーム](https://jobs.qiita.com/employers/brides-a-tm/development_teams/147)
- [技術開発部](https://jobs.qiita.com/employers/brides-a-tm/development_teams/148)

上記求人をご覧いただき、少しでも興味を持っていただけた方は、まずは**チャットでざっくばらんに話**をしましょう。
技術的な話だけでなく、私たちが大切にしていることや、お任せしたいお仕事についてなどを詳しくお伝えいたします！

[Qiita Jobs](https://jobs.qiita.com/)よりメッセージお待ちしております！
Julia のドキュメント生成

まえおき
--------

Julia に関しては全く初心者で[こんなブックマーク](https://github.com/suchowan/bookmarks/blob/master/bookmarks/julia.url.txt)を週１回ペースで更新するくらいのことしかしていません。

オブジェクト指向の言語の API を読みなれていたので Java の Javadoc や Ruby の yard のような形式のドキュメントが Julia でも読めると良いなと思って今回ちょっと試行錯誤してみました。

欲しいのは特定の type について、type で使えるすべての function の説明がなされているようなもの(つまり API 一覧)です。

function 一覧
-------------

type T で使える function 一覧は、

```jl
  methodswith(T)
```

で得られます。

docstring の取得
----------------

一方、function foo に付されている docstring は、

```jl
 @doc foo
```

で得られます[^1]。

ドキュメント生成
----------------

ドキュメント生成はこの２つを組み合わせておこなうことができます。

例えば type Array を使う API 一覧なら REPL 上で、

```jl
  s = Set()
  for m in methodswith(Array, supertypes=true)
    if !in(m.name, s)
      println("@doc $(m.name)")
      push!(s, m.name)
    end
  end
```

のようなスクリプトを動かして、

```jl
  @doc sparsevec
  @doc serialize
  @doc /
    …
  @doc launch
```

のようなアウトプットを出し、これを一旦クリップボードに取り込んだ後、REPL にペーストすればよい。

留意点
------

@doc は function ではなく macro なので、

```jl
    println("@doc $(m.name)")
```

のところを、

```jl
    @doc m.name
```

のように書いてもうまくいきません。@doc に渡されるのが m.name の値ではなく構文だからです。

今回の課題はメタプログラミングに詳しい方ならもっとスマートに自動化できそうなのでご指導いただければと思います。

参考
----

https://stackoverflow.com/questions/39445961/how-can-i-programmatically-access-docstrings
https://github.com/JuliaLang/julia/blob/master/base/docs/Docs.jl

[^1]: 実際にためしてみると引数の型情報は効かないようです。
ESLint v6.8.0

前 [v6.7.0](https://qiita.com/mysticatea/items/377b6ca6558dc253159b) | 次 [v7.0.0](https://qiita.com/mysticatea/items/0931a7d910fcb91733ee)

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">ESLint v6.8.0 has been released:<a href="https://t.co/JXqs24flN0">https://t.co/JXqs24flN0</a></p>&mdash; ESLint (@geteslint) <a href="https://twitter.com/geteslint/status/1208136108267200513?ref_src=twsrc%5Etfw">December 20, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ESLint `6.8.0` がリリースされました。
小さな機能追加とバグ修正が行われています。

このリリースは ESLint 6.x 系 最後のリリースになります。
来月からしばらくの間 `7.0.0` のアルファ版・ベータ版がリリースされます。この日本語版リリースノートは `7.0.0` 正式リリース (日付未定。3月くらい？) までの間はお休みする予定ですのでご了承ください。

質問やバグ報告等ありましたら、お気軽にこちらまでお寄せください。

> 🏢 [日本語 Issue 管理リポジトリ](https://github.com/eslint/eslint-jp)
> 👫 [日本語サポート チャット](https://gitter.im/eslint/eslint-jp)
> 🏢 [本家リポジトリ](https://github.com/eslint/eslint)
> 👫 [本家サポート チャット](https://gitter.im/eslint/eslint)

# 🚀 本体への機能追加

## `.eslintrc.cjs` をサポート

🔖 [RFC043](https://github.com/eslint/rfcs/blob/master/designs/2019-esm-compatibilty/README.md), [#12321](https://github.com/eslint/eslint/pull/12321)

設定ファイルの拡張子として、新たに `.cjs` がサポートされました。

`type:"module"`を持つ package.json の下にある `.eslintrc.js` が ES Module として解釈され、ESLint はそれを扱うことができないためです。

## `--no-error-on-unmatched-pattern` CLI オプション

🔖 [#12377](https://github.com/eslint/eslint/pull/12377)

ESLint はリントが成功すると何も出力しません。そのままではコマンドを typo していて対象ファイルが1つも無い場合とリント成功とを区別できないため、リント対象が1つも無い場合にエラーを表示しています。

```console:例1
> eslint lob

Oops! Something went wrong! :(

ESLint: 6.8.0.

No files matching the pattern "lob" were found.
Please check for typing mistakes in the pattern.

>
```

このエラーを抑制するオプションが追加されました。

```console:例2
> eslint lob --no-error-on-unmatched-pattern
>
```

## `eslint:recommended` 設定から [require-atomic-updates] ルールが削除された

🔖 [#12599](https://github.com/eslint/eslint/pull/12599)

`eslint:recommended`設定から [require-atomic-updates] ルールが削除されました。誤検出が多かったためです。

[require-atomic-updates]: https://eslint.org/docs/rules/require-atomic-updates

## 設定ファイルが `$schema` プロパティを許容するようになった

🔖 [#12612](https://github.com/eslint/eslint/pull/12612)

設定ファイル (特に `.eslintrc.json`) が `$schema` プロパティを持っていてもエラーを投げなくなりました。一部のエディタでは、`$schema` プロパティを適切に指定することで入力補完やエラーチェックが働くようになります。

# 💡 新しいルール

特になし。

# 🔧 オプションが追加されたルール

特になし。

# ✒️ `eslint --fix` をサポートしたルール

特になし。

# ⚠️ 非推奨になったルール

特になし。
3 行の関数で円周率を求める【Python・モンテカルロ法】

# この記事は何
3 行の関数で円周率を求める方法とその解説です。

ルールとして**無理矢理コードを圧縮するのではなく、あくまで自然なやり方で書くこととします。**

##### バージョン情報

python: 3.7.3 
numpy: 1.17.4


# コード

```python:calcPi.py
import numpy as np

def calcPi(n):
  points = np.random.uniform(0.0, 1.0, (n, 2)) 
  inner  = np.hypot(points[:,0], points[:,1]) < 1
  return inner.mean() * 4
```

※最後に`mean()`を使うやり方は@konandoiruasaさんのコメントを参考にしました。

# 解説

モンテカルロ法で円周率を求める方法自体は既知とします。

##### 1行目

`np.random.uniform`により 0 から 1 の範囲の一様乱数を n 行 2 列の array に格納しています。
各行が平面上の点に対応しています。

```python:1行目
points = np.random.uniform(0.0, 1.0, (n, 2))

"""
例えば n=10 のとき

[[ 0.6906296   0.20549271]
 [ 0.13386813  0.77204275]
 [ 0.5970941   0.49659941]
 [ 0.92884413  0.37740529]
 [ 0.49212498  0.13915062]
 [ 0.69357975  0.23229706]
 [ 0.14287715  0.14076891]
 [ 0.20199753  0.49663344]
 [ 0.90105166  0.87612407]
 [ 0.19636323  0.39813228]]
"""
```

##### 2行目

[`np.hypot(x, y)`](https://docs.scipy.org/doc/numpy/reference/generated/numpy.hypot.html)は点`(x, y)`の原点からの距離を返します。

`points[:,0]`は`points`の 0 列目を抽出した array で、つまりは各点のx座標の大きさです。
`points[:,1]`も同様に各点のy座標になっています。

最後に`< 1`とやっているので、arrayの中身が1未満ならTrue, 1以上ならFalseに変わります。
つまり原点からの距離が1未満ならTrue, 1以上ならFalseになっている array が得られます。

```python:2行目
  inner = np.hypot(points[:,0], points[:,1]) < 1

"""
例えば、n=10のとき、
inner == [True True True True False True False True True False]
"""
```

##### 3行目

原点からの距離が1未満の点の個数を、点の総数で割ると`π/4`の近似値が求まるため、
innerの平均を取り4倍したものを返します。
（[コメント](https://qiita.com/POPOPON/items/c557c984a239bab21a9d#comment-4e39f41f904960d4c669)にもある通り`True, False`はそれぞれ計算時`1, 0`に変換されます）

```python:4行目
  return inner.mean() * 4
```

# 実行結果

`seed`を 0 にした場合の実行結果です。

```python
print(calcPy(10))        # => 2.8
print(calcPi(100))       # => 3.32
print(calcPi(1000))      # => 3.302
print(calcPi(10000))     # => 3.1544
print(calcPi(100000))    # => 3.13228
print(calcPi(1000000))   # => 3.142204
print(calcPi(10000000))  # => 3.1421468
print(calcPi(100000000)) # => 3.14170808
```

以上です。間違い等がありましたら教えてください。
Swift UIを試してみた！

初めまして、
ディップでサーバー側のエンジニアとしてgo言語とか書いてます大屋です。

随分前になりますがSwiftUIが出てきて全然試せてなかったのでQiitaにまとめていこうと思います。

## Swift UIとは...
そもそも、SwiftUIですがなんなのかと言いますとiOSアプリ開発における新しいUIフレームワークです。これまでiOSアプリのUIを作る場合、StoryboardにUIパーツを配置し、Auto Layoutで制約をつけたりと慣れれば楽しいのですがStoryboardとViewControllerを行ったり来たりしたり割と辛い部分もありました。

中には全てコードベースでViewを実装する人もいますが、FatViewController(節子問題)になってしまったり、冗長的で分かりにくい実装になってしまいます。そこで、iOSアプリのUI構築をコードベースで完結に記述できる新しいフレームワークとして登場したのがSwiftUIです。

Androidアプリ開発でもJetpack Composeが出てきていたり、Flutterでのクロスプラットフォーム開発であったり、アプリ開発でのViewの部分をコードで書けるUIフレームワークが最近増えてきています。まだまだ商用サービスへの実戦投入は数年後になると思いますがやっていきます。

## 検証環境
まずはSwiftUIを使っていく上での環境構築をしてきます。

- MacOSX Catalina
- Xcode 11.2.1

Xcodeがインストールできたらサンプルプロジェクトを作成します。
プロジェクト名とかはよしなに好きなものを設定で大丈夫ですが、UIフレームワークを選ぶところだけSwiftUIを選んでください。

![スクリーンショット 2019-12-21 23.49.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/126555/00721fc2-f43a-0e01-6949-d7406eb54d2f.png)

サンプルプロジェクトが作成できたらビルドします。
いつものHello, World!が画面中央に表示されていればビルド成功です。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/126555/c80c1a85-561b-a655-01c6-f386fcffaf16.png" width=300 />

きになるコードはこんな感じです。
構造体が二つ定義されていますが、片方の構造体はプレビュー用のものなので実質アプリのUIを記述しているコードは5行だけ！Storyboardと比べるとめちゃくちゃ楽なのがわかります。

```ContentView.swift
import SwiftUI

// ↓UIを構築しているコード
struct ContentView: View {
    var body: some View {
        Text("Hello, World!")
    }
}

// ↓プレビュー用のコード
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
```

## まとめ
SwiftUIはサンプルコード動かしただけですがアプリのUI構築をコードベースで完結にできるのが分かった。商用での利用はまだまだ先になるけど、今後は個人開発にも活かしていきたいのでSwiftUIもっと試していこうと思います。

↓ SwiftUIの公式チュートリアルが結構おすすめらしい。
https://developer.apple.com/tutorials/swiftui
【入門】Laravel×Vue.js②〜実装編〜

#はじめに
**PHPのフレームワークであるLaravel**で作成したアプリケーションに
**JavaScriptのフレームワークであるVue.js**を連携させる方法について説明します。
簡単な機能を実装します。自分のコンポーネントを登録する方法について説明します
**実装する機能
　　メッセージを表示して、ボタンを押すと、メッセージを反転する**

#コンポーネントの作成
まず、`resources/js/components/`内に`HelloComponent.vue`を作成してください
そして、内容を以下のようにしてください

```html:resources/js/components/HelloComponent.vue
<template>
	<div id="app">
	  <p>{{ message }}</p>
	  <button v-on:click="reverseMessage">Reverse Message</button>
	</div>
</template>
<script>
export default {
	  data:function(){
		  return {
		    message: 'Hello Vue!',
		  };
	  },
	  methods: {
	    reverseMessage: function () {
	      this.message = this.message.split('').reverse().join('')
	    }
	  }
}
</script>
```


#コンポーネントの登録
上で作成したコンポーネントを登録しましょう

```javascript:resource/js/app.js
require('./bootstrap');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('hello-component', require('./components/HelloComponent.vue').default);


```

#ビューファイルへの組み込み
ビューファイルの追加したい時に下記を記述してください

```html:hello/index.blade.php
<div id="app">
  <hello-component></hello-component>
</div>
```

以上で実装完了です。

**疑問、気になるところがございましたら、質問、コメントよろしくお願いします！！！**
IFTTTでTwitter to Telegramをしたときの備忘録

#始めに
電車のような交通機関の情報を随時受け取りたいと思って、IFTTTでTwitter垢が呟いた投稿をLINEの自分が作ったグループに送るようにしていました。RSSでやれって？RSSってどう使うか知らないし、IFTTTを使う方が手軽だと思ったので。LINEのアプリはLINE Payとか様々な機能を追加し、メッセージを扱うアプリからよく分からないものに改悪されているので、僕はLINEをなるべく使わないようにしたいと常々思っていました。たまたまTelegramを使ってみる機会があって、これなら代替できそうだ！っていうことになった。

IFTTTアカウント、Telegramアカウントが既に作成されている前提で話を進めます。

このQiitaの記事で分からなければ、この記事の最後に実演している動画のリンクを貼っておくので参照してください。僕お手製です！

#IFTTTとTelegramの認証
初めにIFTTTとTelegramの連携をさせよう。IFTTTで`Telegram`を検索し、`Services > Telegram > Connect`でTelegramが開く。Telegram上で、IFTTTの公式アカウントに提示された方法に従って認証する。`Enjoy!`となっていれば成功ですね。

#別チャンネルで管理したい
これでIFTTT上でAppletsを作成すれば普通に使えるのですが、IFTTTアカウントから全ての内容が流れてくるので、チャンネルを別途作成して管理する方がいいでしょう。

Telegram上で新たにチャンネルを作成します。このときチャンネルはPublicでなければいけません。チャンネル名を便宜上`test`としておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/329632/41cc9954-2754-3e0f-c923-573d86a26596.png)
`Manage Channel > Administrators`で`IFTTT`と検索し招待します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/329632/3c475381-2764-43e3-dee9-33bce1ccafd7.png)
その後、testチャンネルのURLをコピーします。チャンネルを右クリックして`View channel info`からURLをコピーできます。認証で使ったIFTTT垢とのチャンネルに行き、` /connect_channel `を打つ、または選択します。で、コピーしたURLを貼ります。これで準備は完了です。

#Appletsの作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/329632/cc03522a-84c3-f450-6985-e42bd5222fd7.png)
If This Then That

IFTTTでAppletsを作成します。`This > Twitter > New tweet by a specific user`で取得したいTwitter垢を指定します。`Then > Telegram > Send message`を選択します。`Target chat`で作成したtestチャンネルを指定できるようになっています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/329632/b939ee0e-a5f5-97c5-a15d-a5f4ce87aaf2.png)
成功ですね！

#動画のリンク（YouTube）
IFTTTとTelegramを連携させてTwitterアカウントの投稿を取得する。
https://youtu.be/Q49s4OoMjNA
Angularのテンプレート式で便利な存在演算子


#はじめに
Angularではコンポーネントのプロパティをテンプレートにバインディングするために{{...}}式を用います。

```typescript:template-syntax.component.ts
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-template-syntax',
  template: `
  <div>
      <h3>{{ title }}</h3>
  </div>
  `,
  styleUrls: ['./template-syntax.component.scss']
})
export class TemplateSyntaxComponent implements OnInit {

  title = "Angular Application";

  constructor() { }

  ngOnInit() {
  }

}
```

この式を使用する際の注意点や知っておくと便利かもしれない機能についてまとめます。

#テンプレート式で利用できない演算子
- 代入演算子
- new 演算子
- 連結を表す演算子
- インクリメント、デクリメント演算子
- ビット演算子

これらの演算子はテンプレート内部では使用できません。
試しに代入演算子を使用するとParser Errorが吐き出されます。

#オブジェクトのプロパティにアクセスする

テンプレート式ではオブジェクトのプロパティにアクセスすることができます。

```typescript:template-syntax.components.ts
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-template-syntax',
  template: `
  <div>
      <h3>{{ title }}</h3>
      <p>{{ person.name }}</p>
  </div>
  `,
  styleUrls: ['./template-syntax.component.scss']
})
export class TemplateSyntaxComponent implements OnInit {

  title = "Angular Application";

  person = {
    name: 'hoge',
    age: 30
  };

  constructor() { }

  ngOnInit() {
  }

}
```

ブラウザ上にはpersonオブジェクトのnameプロパティのvalueである'hoge'が表示されます。

# 知っておくと便利かもしれない存在演算子

上記の構文を使用する際、personオブジェクトがundefinedの場合、コンソールにエラーが吐き出されます。

こんな時にいちいちオブジェクトのチェックをしてプロパティにアクセスするのは冗長なので存在演算子を使用するとすっきりします。

```typescript:template-syntax.component.ts
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-template-syntax',
  template: `
  <div>
      <h3>{{ title }}</h3>
      <p>{{ person?.name }}</p>
  </div>
  `,
  styleUrls: ['./template-syntax.component.scss']
})
export class TemplateSyntaxComponent implements OnInit {

  title = "Angular Application";

  // person = {
  //   name: 'hoge',
  //   age: 30
  // };

  constructor() { }

  ngOnInit() {
  }

}
```

「person?.name」の部分が存在演算子に該当します。これをやっておけばテンプレート側でオブジェクトの存在チェックをやってくれるので、コンポーネントがすっきりと書けます。

利用頻度は高くないかもしれませんが、知っておくと便利だと思います。
TextFieldタップでDatePickerを呼ぶ


下図のように編集開始時に`DatePicker`を起動させ，時間変更時に変更時間をTextFieldに反映させます．
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82263/cdf73383-8da7-0d10-5747-cdcf7c147942.png" width="400">

まずTextFieldのDelegateを追加します．

```ViewController.swift
class ViewController: UIViewController, UITextFieldDelegate 
```

次に以下のコードを追加hします

```ViewController.swift

var toolBar:UIToolbar!
@IBOutlet var wakeTimeTextField: UITextField!

override func viewDidLoad() {
    super.viewDidLoad()
        
    wakeTimeTextField.delegate = self
    setupToolbar()
}
func setupToolbar() {
        //datepicker上のtoolbarのdoneボタン
        toolBar = UIToolbar()
        toolBar.sizeToFit()
        let toolBarBtn = UIBarButtonItem(title: "DONE", style: .plain, target: self, action: #selector(doneBtn))
        toolBar.items = [toolBarBtn]
        wakeTimeTextField.inputAccessoryView = toolBar
}
    
func textFieldDidBeginEditing(_ textField: UITextField) {
    let datePickerView:UIDatePicker = UIDatePicker()
    datePickerView.datePickerMode = UIDatePicker.Mode.time
    textField.inputView = datePickerView
    datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)
}
    
    //datepickerが選択されたらtextfieldに表示
@objc func datePickerValueChanged(sender:UIDatePicker) {
    let dateFormatter = DateFormatter()
    dateFormatter.dateFormat  = "H:mm";
    wakeTimeTextField.text = dateFormatter.string(from: sender.date)
}

//toolbarのdoneボタン
@objc func doneBtn(){
    wakeTimeTextField.resignFirstResponder()
}

```
YouTubeのチャンネルをまるごと並列で最高画質でダウンロードする方法


```
youtube-dl --get-id <URL> | xargs -n 1 -P 10 youtube-dl -f bestvideo+bestaudio --merge-output-format mp4
```

履歴残して何度も実行するときは、

```
youtube-dl --get-id <URL> | sort -R  | xargs -n 1 -P 10 youtube-dl --merge-output-format mp4 -f 'bestvideo+bestaudio[ext=m4a]' -i --download-archive log.txt  --external-downloader aria2c --external-downloader-args '-c -x 5 -k 2M'
```

#参考

https://qiita.com/shiooooooooon/items/dd86601ebdfe09591686

https://qiita.com/tkymx/items/b2f50c76c03d59129987
【Python】文字列と値の結合のいろいろ

# はじめに
<バージョン>
Python: 3.7.4

Pythonで文字列と値をそのまま結合するとエラーになります。

```python:str_int.py
NAME="Taro"
AGE=15

print(NAME + " is " + AGE + " years old")
```

# 実行結果(失敗例)
文字列と値をそのまま結合出来ないのでエラーになりました。

```text:出力
Traceback (most recent call last):
  File "str_int.py", line 5, in <module>
    print(NAME + " is " + AGE + " years old")
TypeError: can only concatenate str (not "int") to str
```

# 解決策
解決策はいろいろあります。個人的には2がプログラミングっぽくて好みです。
ポイントだけ書いておくと
1：str()を用いて、値(AGE)を文字列に変換する
2：%s=文字列、%d=値を表すのでこれを正しく書かないとエラーになる
4：先頭の「f」を忘れると、変数が代入されずに変数名の文字列がそのまま出力されます
5：「,」で繋げると自動でスペースを入れてくれ、かつstr()を使わなくてよくなります
<2019/12/22：項目5はkonandoiruasa様のご指摘により追加>

```python:str_int2.py
NAME="Taro"
AGE=15

print("1 : " + NAME + " is " + str(AGE) + " years old")
print("2 : %s is %d years old" % (NAME, AGE))
print("3 : {} is {} years old".format(NAME, AGE))
print(f"4 : {NAME} is {AGE} years old")
print("5 :", NAME, "is", AGE, "years old")
```

# 実行結果(成功例)
どれでも上手くいきました。太郎君は15歳なのです。

```text:出力
1 : Taro is 15 years old
2 : Taro is 15 years old
3 : Taro is 15 years old
4 : Taro is 15 years old
5 : Taro is 15 years old
```
phpでcookieやurlを使わずにsession_start()でセッション管理する

phpでcookieを使わずに、session idを手動で設定し、session_start()する方法。

## こんな方向けの話
- アクセス元からsessionを表す or 作ることができる文字列がpostされる（alexaスキルや、google assistatアプリ、line botなどの受け側をphpで作る場合など）
- セッション管理だけの為にRDBMS、nosql系を使いたくない → Webサーバのsession機能を使いたい。

## 制限
セッションIDとして使えるのは「英数字」「カンマ」「ハイフン」のみです。

## コード
```php
<?php
ini_set( 'session.use_cookies', 0 );
ini_set( 'session.use_only_cookies', 0 );
$session_id = "session-id-text"; //この文字列がセッションidとなる
session_id($session_id);
session_start();
?>
```

## サンプル
test1.php

```php
<?php
ini_set( 'session.use_cookies', 0 );
ini_set( 'session.use_only_cookies', 0 );
$session_id = "session-id-text"; //この文字列がセッションidとなる
session_id($session_id);
session_start();
$_SESSION['test'] = "yamada"; //セッションに保存してみる
?>
```

test2.php

```php
<?php
ini_set( 'session.use_cookies', 0 );
ini_set( 'session.use_only_cookies', 0 );
$session_id = "session-id-text"; //この文字列がセッションidとなる
session_id($session_id);
session_start();
var_dump($_SESSION);
?>
```
Microsoft Formsでアンケート作って回答数が閾値超えたらTeamsにメッセージするPower Automate（旧 Flow）を作ってみた

仕事でFormsアンケート作ることになり、試しに作ってみたら…
めちゃくちゃ簡単すぎちゃったのでー
Microsoft Power Automate（旧 Microsoft Flow）使っていろいろ連携出来たら面白そうだなーと思い
とりあえずTeamsにメッセージ送る所までやってみたお話です。

### 前提
- Office365が使えればOK！

### 使用サービス
![スクリーンショット (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/5d21b4f4-0498-5f14-fe35-3fbb765b32a5.png)

- Microsoft Forms
- Microsoft Power Automate（旧 Microsoft Flow）
- Microsoft Teams

## アンケートを作る（Microsoft Forms）
Formsから「新しいフォームの作成」を選び、題名と説明を書きます。
「＋新規追加」ボタンがあるので、アンケートの形式を選択。
”テキスト入力”や”評価”、”リッカート（表形式）”などありますが、今回は”選択肢”を選びます。
![スクリーンショット (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/3911cb0c-71f3-43f8-11ff-0535ca1017f8.png)

アンケート内容は適当に…
※Formsにはオプションとして、背景テーマの変更や開始日／終了日なども設定できます。
![スクリーンショット (3).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/2f11ddc5-661e-1933-593d-eb8a5f4e6362.png)

最後に共有方法を選びます。
「共有」ボタンを押すと、このアンケートの閲覧条件と共有方法を選択できます。
URLリンクやWebページに埋め込むタグ情報をコピーして使用します。
![スクリーンショット (5).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/3ad86602-da23-4217-b384-335d6cf6beef.png)

これでアンケート作成は終わりです。

## Teamsにメッセージする仕組みを作る（Microsoft Power Automate）
※”Microsoft Flow”から”Microsoft Power Automate”に名前が変わりました！
※テンプレートが沢山あるので、初めはテンプレートをベースに作ってみるのが良いかと思います。
新規で作成してみます。まずは、何を起点とするかを決めます。
![スクリーンショット (6).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/85fd037c-3212-7182-5510-a0409442268a.png)

フォームID蘭に先ほど作成した「アンケート」が出てくるので選択するだけ！
![スクリーンショット (7).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/7b876205-22f9-fec0-121a-6e13466c7040.png)

次に「＋新しいステップ」で条件分岐を追加します。
”制御”の”条件”を選択。
![スクリーンショット (8).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/edb4eb86-4d7d-1e39-ae18-cc4d39617e56.png)

Fromsと連携している為、条件式にアンケート結果のデータが使用できます。
今回は【回答数が10件を超えたらTeamsにメッセージを送る】としようと思うので、”応答ID”が”10”を超えたら…という条件式にしました。
※Fromsの項目を使ったり、計算式をカスタマイズできるのでいろんな条件を指定できそうですね
![スクリーンショット (9).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/f1425d57-4620-50ab-e48a-bcb7c4ee5c52.png)

条件分岐なので条件を満たした（はい）場合と、満たさない（いいえ）の場合でアクションを指定できます。
満たした（はい）場合にTeamsにメッセージを送るので、「アクションの追加」からTeamsを選んで”メッセージ投稿”アクションを選択します。
![スクリーンショット (10).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/8383eed9-cc97-af4b-e9f5-2c262f8b3e43.png)

ここでも自分に紐づいているチームがプルダウンメニューに現れるので選択するだけ！
投稿するチャネルやメッセージを設定して「保存」すれば完成！！
![スクリーンショット (11).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/3811115f-428d-7812-1891-594f5c3aecbc.png)

フローに問題ないか”チェッカー”があったり、”テスト”もできるので是非試してみてください

## 確認（Microsoft Teams）
アンケートの回答結果はForms画面の回答タブで確認できます。エクセル出力も出来ます。
Power Automateを使えば、SharePointやDBへ格納も可能です。
![スクリーンショット (12).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/54d07172-1079-7cd2-4577-53c03c0bd6dc.png)

Teamsにメッセージされていることを確認！
![スクリーンショット (13).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533567/2c1a0527-4a58-447c-ce5d-c159262d4c22.png)

## まとめ
Office365にはたくさんの機能やサービスがあり、それらの連携がノンプログラミングで簡単に出来るのはとっても便利！
Power AutomateにはUIフローというRPA機能もあるのでいろいろ試してみたいです！
Raspberry Pi 4とmicro:bitをシリアルで繋ぐ

# RaspberryPi側の準備
## Pythonのシリアルパッケージをインストール
```
$ pip install pyserial
```
以前使っていたラズパイだとインストールが必要でしたが、今回はインストールしなくてもserialが使えました。
何かをインストールした時に入っていたのかも。

## サンプルプログラムの作成

```
import serial
import time

ser = serial.Serial('/dev/ttyACM0', 115200)
while True:
    String_data = ser.readline()
    print(String_data.decode())
    time.sleep(0.5)
ser.close()
```
# micro:bit側のサンプル
![microbit.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/28184/3a148b6e-b53b-934e-7130-b8d96a2eefea.png)

# 結果
micro:bitで取得したセンサ情報をRaspberry Piで無事受け取れました。

```
$ python3 sample1.py


direction:295

accel x:16

accel y:16

accel z:-1024

accel abs:1009

brightness:39

temperature:25

direction:295

temperature:25

direction:296

accel x:32

accel y:32

accel z:-1008
```
Nimで音を再生する方法（Mac）


まずは以下のように実行します。

```
cd github # 任意のディレクトリで良い
git clone https://github.com/bkaradzic/genie
cd genie
make
```

fish の場合は以下のようにパスを通します。

```
cd github
set -x PATH $HOME/github/genie/bin/darwin $PATH
```

```
git clone https://github.com/jarikomppa/soloud.git
cd soloud
cd build
genie xcode10
cd xcode10
open SoLoud.xcworkspace
```

AudioToolboxを追加する必要があります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/33329/61e4b7db-1b5c-0197-d28a-a62de3bff667.png)

ビルドして作成したlibsoloud.dylibを/usr/local/libにコピーする

```
cp ../../lib/libsoloud.dylib /usr/local/lib 
```

```sample.nim
import solouddotnim, times, os

var i, spin = 0

var sl : ptr Soloud

sl = Soloud_create()

discard Soloud_init(sl)

Soloud_setGlobalVolume(sl, 1)


var stream = WavStream_create()
discard WavStream_load(cast[ptr Wav](stream), "test.ogg")

let currentTime = epochTime()
let length = WavStream_getLength(stream)
discard Soloud_play(cast[ptr Soloud](sl), cast[ptr Wav](stream))

while epochTime() - currentTime <= length:
  sleep(100)

Soloud_deinit(sl)

Soloud_destroy(sl)

```

このページのコードのままです。
https://github.com/zacharycarter/soloud-nim/blob/master/examples/00-ogg/Example00_ogg.nim

test.oggを手持ちのmp3に変えて再生することもできます。しかし、必ず標準ターミナルで実行して下さい。
VSCODEでは再生されません。


# 参考
https://gist.github.com/zacharycarter/846869eb3423e20af04dea226b65c18f
Seurat in Linux (インストール)

#概要
SeuratをLinuxで動かそうとしたら、インストールに結構苦戦してしまったのでメモ
OS : Linux mint 19.3 Tricia

#やる
チュート通り、```install.packages("Seurat")```してみるが、依存関係パッケージのインストールができない。
ちょっと調べてみると、どうも```sudo apt install r-base```でインストールできるRのバージョンは3.4と古く、対応してないパッケージがあるみたい。新しいバージョンを入れるにはレポジトリと公開鍵を追加する必要がある。

```
#一旦、Rをアンインストールする
$ sudo apt purge r-base* r-recommended r-cran-*
$ sudo apt autoremove
$ sudo apt update

#公開鍵とレポジトリを追加する
$ sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys E298A3A825C0D65DFD57CBB651716619E084DAB9
$ sudo add-apt-repository https://cloud.r-project.org/bin/linux/ubuntu bionic-cran35/
```
*これで追加すると追加したhttps://cloud.r-project.org/bin/linux/ubuntu bionic-cran35/が何故かhttps://cloud.r-project.org/bin/linux/ubuntu mainとなってしまっているので、[システム設定]→[ソフトウェアソース]から正しいものに変更する。*

そして、再びRをインストール

```
$ sudo apt update
$ sudo apt install r-base
```
これでR 3.6のインストールができた。

これで再度```install.packages("Seurat")```すると、またひっかかる。```ld```コマンドのオプションがないそう。
ターミナルからこれを入れる。```Openssl```も入ってなかったので一緒に入れる。

```
$ sudo apt install liblapack-dev　liblapack3　libopenblas-base　libopenblas-dev gfortran libssl-dev
```

これでも引っかかる。BioManagerから```multtest```を入れる。

```
if (!requireNamespace("BiocManager", quietly = TRUE))
    install.packages("BiocManager")

BiocManager::install("multtest")
```
これで```install.packages("Seurat")```するとSeuratをインストールできた。
extensionの条件付き適合の謎

## ことの発端
条件付き適合を使用して処理を分けつつ共通化していたとき
なぜか条件付き適合ではない方の処理を実行していました。

## 環境
swift 5
Xcode 11.3 

## ソースコード

```swift
protocol Hoge {
    associatedtype Value
    func value(_ value: Value?) -> Value?
}

struct HogeImple<Value> {
    // jQuery風に value が届いたら保存、なければ読込
    func value(_ value: Value? = nil) -> Value? {
        if let value = value {
            self.store(value)
            return value
        }
        return self.read(value)
    }
}

private extension Hoge {
    func store(_ value: Value?) {
        // 保存
        /* !!! String, Codable もこちらにくる!? !!! */
    }

    func read() -> Value? {
        // 読込
    }
}

private extension Hoge where Value == String {
    func read(_ value: Value?) {
        // 文字列の読込
    }
}

private extension Hoge where Value: Codable {
    func store(_ value: Value?) {
        // Codableの保存
    }

    func read() -> Value? {
        // Codableの読込
    }
}
```


## 実験

条件付き適合が動作する条件は何か実験してみました。

```swift
protocol Hoge {
    associatedtype Value
}

struct HogeImple<Value>: Hoge {
    func execute(_ value: Value) {
        self.hoge(value)
    }
}

extension Hoge {
    func hoge(_ value: Value) {
        print("Hoge", value)
    }
}

extension Hoge where Value == String {
    func hoge(_ value: Value) {
        print("String", value)
    }
}

extension Hoge where Value: Numeric {
    func hoge(_ value: Value) {
        print("Numeric", value)
    }
}

let boolHoge = HogeImple<Bool>()
boolHoge.execute(true)
boolHoge.hoge(true)

let strHoge = HogeImple<String>()
strHoge.execute("Value")
strHoge.hoge("Value")

let intHoge = HogeImple<Int>()
intHoge.execute(3)
intHoge.hoge(3)
```


## 結果

Bool型 : 適合条件なし
String型 : `where Value == String`に適合
Int型 : `where Value: Numeric`に適合

execute
`struct HogeImple`内の関数
hoge
`extention Hoge`内の関数

| 型               | 関数               | 結果                |
|:-----------------|:------------------|:------------------ |
| Bool             | execute           | Hoge true          |
| Bool             | hoge              | Hoge true          |
| String           | execute           | **Hoge Value**     |
| String           | hoge              | String Value       |
| Int              | execute           | **Hoge 3**         |
| Int              | hoge              | Numeric 3          |


## まとめ
- 具象型からは extension の適合条件で分岐することができない

これはバグだと思うんですが、どうなんでしょうか？
Railsで制御結合、スタンプ結合、データ結合、メッセージ結合

```ruby

# 制御結合
# @param  [User] user
# @param  [Bool] active_flg
# @return [Hash]
def shape_user_info(user, active_flg)
  # @type [Hash] user_info
  if active_flg
    user_info = user_info(user)
  else
    user_info = default_user_info
  end
  user_info
end

# スタンプ結合
# @param  [User] user
# @return [Hash]
def user_info(user)
  # @type [String]
  first_name = user.first_name
  # @type [String]
  last_name  = user.last_name
  # @type [String]
  fullname   = fullname(first_name, last_name)
  # @type [Integer]
  age        = user.age
  # @type [String]
  mail       = user.mail
  {
    fullname: fullname,
    age:      age,
    mail:     mail
  }
end

# データ結合
# @param  [String] first_name
# @param  [String] last_name
# @return [String]
def fullname(first_name, last_name)
  first_name + last_name
end

# メッセージ結合
# @return [Hash]
def default_user_info
  {
    fullname: "fullname",
    age:      30,
    mail:     "mail"
  }
end
```

間違ってたらごめんなさい🙃
How to test Stripe subscription cycle immediately happen ? without wait next day. ummm maybe noway.

I searched a lot but couldn't find it.

Here's how to test for a trial period, but what you want to do, for example, is to make the next charge for the recurring payment you just made, without waiting tomorrow.
https://stripe.com/docs/billing/testing#trials

It seems that the billing cycle could be changed, but it didn't seem like a new claim would be immediate.
https://stripe.com/docs/billing/subscriptions/billing-cycle#changing

Is there a way to expedite recurring payments? Isn't it in the first place?
I feel that there was somewhere in the documentation written to test in as short a cycle as possible, such as timing recurring payments on days instead of months.

In the first place, I wonder if something that does not conform to the actual behavior of Stripe can not be executed even in tests.
If Stripe itself doesn't have a way to speed up recurring payments, it couldn't be tested.

Stripe has a very kind API and interface, but after doing that Stripe, I found that there wasn't a way to find nothing if I searched so far. Finally.

# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2859








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
機械学習方針　その２

# はじめに
機械学習を始めるにあたり、方針の整理をする。

## ゴール
- 機械学習知識の習得
- E資格
- Kaggleマスター

## 方法とスケジュール
### E資格
- E資格受講（深層学習）
- 自己学習


### kaggleマスター
(検討中）

## 環境
- 学習ノート：Quitta
- プログラミン環境：github & Google Colaboratory

# 最後に
途中であるが、少しづつ整理していく予定。
【Python】リストをコピーすると要素がリンクしてしまう問題の解決策

# はじめに
<バージョン>
Python: 3.7.4

値をコピーする感覚と同様に、リストaをリストbにコピーして、
リストbの真ん中の要素だけ変更したとします。

```python:copy_test.py
a = [1, 2, 3, 4, 5]
b = a
b[2] =5
print(a)
print(b)
```

# 実行結果(失敗例)
なぜかリストaの真ん中の要素も変化してしまいます。

```text:出力
[1, 2, 5, 4, 5]
[1, 2, 5, 4, 5]
```

# 解決策1：copyモジュールを使う
copyモジュールを使うと、リストaとリストbがリンクしなくなります。

```python:copy_test2.py
import copy

a = [1, 2, 3, 4, 5]
b = copy.deepcopy(a)
b[2] =5
print(a)
print(b)
```

# 解決策2：スライスを使う
a[:]と記載すると要素内の全てがリストbに受け渡されます。

```python:copy_test3.py
a = [1, 2, 3, 4, 5]
b = a[:]
b[2] =5
print(a)
print(b)
```

<2019/12/22：shiracamus様より>
copy.deepcopy は 完全なコピーをつくりますが、copy.copy やスライスによるコピーはシャローコピーで、
多重リストの場合には影響が残ります。
→解決策2は多重リストの場合では使えないようです。

```python:copy_test4.py
a = [[1], [2], [3], [4], [5]]
b = a[:]
b[2][0] = 5
print(a)
print(b)
```

ご指摘の通り、多重リストだと結果がリンクしてしまいます。

```text:出力
[[1], [2], [5], [4], [5]]
[[1], [2], [5], [4], [5]]
```

# 実行結果(成功例)
想定通り、リストbの真ん中の要素だけ変更されました。
解決策2には多重リストで使えないという問題があるので、解決策1を使う方が無難なようです。

```text:出力
[1, 2, 3, 4, 5]
[1, 2, 5, 4, 5]
```
【GitHub】SSHキー作成で手こずったこと

## Episode1: 普段使ってるGitHubから警告が来ていた。
```
Potential security vulnerability found in the rack dependency
```
ふぁ！？
怖いのでSSH Keyを設置しておいた方が良いなと思い始めた。
関係ないと思うけど。

→セキュリティチェックのため自動でPullRequestが来るみたい
→Mergeして解決しました。

## Episode2: あ、そんな簡単にできるの？
他の記事をみていたら、なんだかややこしいことがたくさん書いてあったのですが、[先ほどの記事](https://qiita.com/shizuma/items/2b2f873a0034839e47ce)を見たら、「あっ、もうその手順なの？」っていうスピード感でした。

```
ssh-keygen -t rsa -b 4096 -C "example@example.com"
※exampleには自分のメアドを入れる
```

↓

```
$cd ~/.ssh
```

↓

```
$ssh-keygen -t rsa
```
↓　そうすると出てくるので、.pubの名前とパスワードを決める。

```

Generating public/private rsa key pair.
Enter file in which to save the key (/Users/(username)/.ssh/id_rsa):id_git_rsa
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
```
↓

```
$ pbcopy < ~/.ssh/先ほど決めた名前.pub
```
↓

```
https://github.com/settings/ssh
で公開鍵の設定する
```
↓

```
$ ssh -T git@github.com
で接続を確かめる
```

↓

```
でもだめっぽい
ssh: Could not resolve hostname github: nodename nor servname provided, or not known
```
↓

https://teratail.com/questions/15347 を見てみる

↓

```
$ eval "$(ssh-agent -s)"
> Agent pid なんとか
```

↓

```
$ ssh-add ~/.ssh/id_rsa(自分で設定した名前）
```

↓

パスワード聞かれる

おk

接続はできたかもしれないけど、まだプッシュしようとしてもパスワードを聞かれない。
<br>
<br>
<br>
<br>

## Episode0: 詰まった話
### .sshはどこにある？
[ここ](https://qiita.com/shizuma/items/2b2f873a0034839e47ce)を参考にしてGitHubのSSHキーを作成しようとしていた時の話。

鍵を入れるフォルダに移動するところから始まるが

```
$cd ~/.ssh
```

そのフォルダが見つからなくてfindコマンドを使おうとしたが、
[この記事](http://x68000.q-e-d.net/~68user/unix/pickup?find#prgmemo-find-basic)を参考にして
`find .-name 'ssh'`とコマンドラインに打ち込んでもダメだった。

↓

```
find . -name 'ssh'
```

のように、`.`の前後に空白が必要だった。

→ 大量に検索かかってめっちゃ重くなったw


### id_rsaが見つからないって出る...
このせいでSSH接続が終わらない...

そんなとき！
この記事を見つけました
[GitHubでssh接続する手順~公開鍵・秘密鍵の生成から~](https://qiita.com/shizuma/items/2b2f873a0034839e47ce)

```
しかし…
鍵を作るときに名前を指定していれば、うまくいかないかもしれません。
それは、ssh接続の際「~/.ssh/id_rsa」、「~/.ssh/id_dsa」、「~/.ssh/identity」しか
デフォルトでは見にいかないからです。
```

なるほど...!!
`Enter file in which to save the key`と言われていた時に、自分の好きな名前にしていたのが原因でした。
Nuxt.jsのlayoutに変数を渡し、共通ヘッダーのタイトルを動的に変える方法

**「Nuxt.jsのlayoutに各pageから変数を渡す」**

とても簡単そうなことですが、調べてもあまり情報がなくて意外に時間をかかったので紹介します。

## やりたいこと
下記ディレクトリ構成で、layoutに全ページ共通のヘッダーを設置し、ヘッダーに表示するタイトルを、ページごとに設定をしたかったです。
調べたところEventListenerを使う方法([*1](https://qiita.com/jianghan0/items/726b6db7972034435e95#%E5%8F%82%E8%80%83%E6%96%87%E7%8C%AE))、Vuexを使う方法などがありましたが、どちらも理想の使いやすさではなかったので、Vue Routerで行う方法を考えました。

## ディレクトリ構成
```js
layouts
  |- default.vue
components
  |- organisms
      |- CommonHeader.vue
pages
  |- index.vue 

```

### layouts/default.vue

```vue
<template>
  <div>
    <common-header title="タイトル" />
    <nuxt />
  </div>
</template>
<script>
import CommonHeader from '@/components/organisms/CommonHeader'
export default {
  components: { CommonHeader },
}
</script>

```

### components/organisms/CommonHeader.vue

organismsというフォルダ名はAtomic Designを採用した構成です。 ([*2](https://qiita.com/jianghan0/items/726b6db7972034435e95#%E5%8F%82%E8%80%83%E6%96%87%E7%8C%AE))

```vue
<template>
  <header class="header">
    <div class="header-leftSide">ロゴ画像</div>
    <h1 class="header-title">{{ title }}</h1>
    <div class="header-rightSide">メニュー</div>
  </header>
</template>

<script>
export default {
  props: {
    title: { type: String, default: '' },
  },
}
</script>

<style lang="scss" scoped>
.header {
  display: flex;
  justify-content: space-between;
  // ...省略
}
</style>
```

### pages/index.vue
```vue
<template>
  <div>省略</div>
</template>

<script>
export default {
  head() {
    return {
      title: 'TOPページ',
    }
  },
}
</script>

```


## 解決方法
Vue Routerでマッチしたコンポーネントを取得し、コンポーネント内で定義した変数を取得します。

```vue
<!-- layouts/default.vue -->
<template>
  <div>
    <common-header title="title" />
    <nuxt />
  </div>
</template>
<script>
import CommonHeader from '@/components/organisms/CommonHeader'
export default {
  components: { CommonHeader },
  computed: {
    title() {
      const matchedRoute = this.$route.matched[0] // マッチしたrouteを取得
      const headInfo = matchedRoute.components.default.options.head() // 該当routeのdefault componentのhead情報を取得
      return headInfo ? headInfo.title : ''
    },
}
</script>

```

## 注意点
- ネストされたルートの場合、複数のルートにマッチする（親コンポネントが最初にマッチされる）ので、上記のコードを少し変更する必要があります。

## 終わりに
この方法で「理解しやすさ」と「使いやすさ」の目標を達成したと思いますが、もっといい方法があるかな？
他にいい方法がありましたら、ぜひコメントしてください。

## 参考文献
1. https://qiita.com/yama-t/items/b051cd9ea802f69da118
1. https://design.dena.com/design/atomic-design-%E3%82%92%E5%88%86%E3%81%8B%E3%81%A3%E3%81%9F%E3%81%A4%E3%82%82%E3%82%8A%E3%81%AB%E3%81%AA%E3%82%8B/
1. https://router.vuejs.org/ja/guide/#javascript
1. https://github.com/nuxt/nuxt.js/issues/319
#Stripe のサブスクリプション(定期支払い)のサイクルによる請求を即時実行してテストする方法はあるのか？ ないのでは、多分。

割とたくさん探したけれど見つからなかった。

トライアル期間に対してのテスト方法であればこちらに書かれているのだが、やりたいのは、例えば今作成した定期支払いの次の請求を、明日を待たずに実行させることだ。
https://stripe.com/docs/billing/testing#trials

請求のサイクルを変えることもできるようだが、それで新規請求がすぐ発生するわけではないように思えた。
https://stripe.com/docs/billing/subscriptions/billing-cycle#changing

定期支払いの実行タイミングを早める方法はあるのか？そもそもないのではないか？
定期支払いのタイミングを月ではなく日にするなど、なるべく短いサイクルでテストできるように書かれたドキュメントはどこかにあったような気がする。

そもそもの思想において、Stripeの実挙動に沿わないものはテストでも実行できないのではないだろうか。
Stripe自体で、定期支払いのタイミングを早める方法がないのならば、テストもまたできないのではないだろうか。

Stripeはとても親切なAPIやインターフェイスを用意しているが、そのStripeをしてなお、ここまで探しても何も見つからないということは、そもそも方法がないのではないかと、思い至った。最終的に。

欲しいものがいつでもあるとは限らない。目を曇らせるな。


# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2858








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->