OmniAICreator/Qiita-1.07M huggingface dataset:
Unity 2D でAndroidアプリ作成時のCanvasサイズ変更

自社の勉強会でUnityを使ったAndroidアプリを作成することがあり、
その際に躓いた事象と解決策について記事にさせていただきます。

見やすいようにスクショ等も張りたかったのですが、
別ツールをインストールする際にUnityをアンインストールしたため
文章のみの記事となります。ご容赦ください。

#Unityのバージョンと作成したアプリ

Unityは2020年の6月にインストールしたので、
バージョンとしては2019年12月22日リリースの**Unity 2019.4.17**を使用しました。

作成したアプリについては、f-murakamiさんという方の記事
[3時間で作れる割り算電卓アプリ by Unity](https://qiita.com/f-murakami/items/28e523b3f5fd12010b80)
を参考にいたしました。

#躓いた点
基本的には問題なかったのですが、
ボタンを配置するためのCanvasオブジェクトのサイズが横長になってしまい（縦長にしたかった）、Canvasの端からのピクセル数で座標指定で配置している各オブジェクトのレイアウトがぐちゃぐちゃになり、解消までに数日を要しました。

#誰か同じ事象に遭遇していないか検索
誰か同じような事象に遭遇していないか検索をかけてみたところ、いくつも記事が出てきました。
いくつかの記事で共通している作業としては、

1.CanvasのInspectorにあるUI Scale Modeの値をScale With Screen Sizeへ変更
2.同じくCanvasのInspectorにあるReference Resolutionの値で画面の固定サイズを変更

といった感じでした。実際に閲覧したページの1つが以下です。
[【Unity】ＵＩを端末に合わせたサイズに調節する](https://dojican-lab.blogspot.com/2015/08/unity.html)

#Reference Resolutionの値入力欄が活性にならない！
上記ページやほかの記事も閲覧して試してみたのですが
私の環境だとどうしてもCanvasのInspectorにあるReference Resolutionの値入力欄が非活性のままでCanvasのサイズを変更することができませんでした。
(原因等については不明のままです、、、)

#解決策
その後、他の設定値をいじっていき、以下の操作で何とかCanvasのサイズ変更にこじつけることが出来ました。

1.CanvasのInspectorにあるRender Modeの値をWorld Spaceへ変更
2.Rect Transformの項目が活性になるため、WidthとHeightでCanvasサイズ調整

自分への備忘もかねてこの記事を作成しましたが、
同じ事象に遭遇した方の解決の一助になれば幸いです。

#参考ページ
・[3時間で作れる割り算電卓アプリ by Unity](https://qiita.com/f-murakami/items/28e523b3f5fd12010b80)
・[【Unity】ＵＩを端末に合わせたサイズに調節する](https://dojican-lab.blogspot.com/2015/08/unity.html)
ポートフォリオのREADMEを書くときの工夫

#はじめに
　ポートフォリオ用にアプリケーションを作成し、READMEを記述したので、そのときに気をつけたことを紹介します。

##😁アクセント程度に絵文字を使う
見出しの前に内容に合った絵文字を入れました。ただし、中には表示されない絵文字もあるので、その絵文字が思い通りに表示されているのか確認が必要です。

##画像やgifを入れて、実装されている機能を見せる
簡単にスクショ&gifを取れるアプリ
[Gyazo](https://gyazo.com/download?lang=ja)

ちなみに、マークダウン記法で画像を挿入するには、

```markdown
![ここに文字](ここにURL)
```
##本当に改行できてる？
箇条書きのリストであれば、勝手に改行されるが、自分が任意のところで改行したいときは、
単に、Enterを押しても改行されません。これは、マークダウン記法の仕様です。
改行をするには、<font color=red>改行したいところに半角スペースを2つつける</font>ことです。
【Python】複数の画像の代表値をとる【Numpy】

# 目的
複数の画像の各ピクセルの代表値を使って画像を生成する。
例えば10枚の画像の平均画像を作りたい。

# 準備
## ライブラリのImport
```python
import numpy as np
from scipy import stats
```
## 画像
10枚のRGB画像。
10枚の平均画像、中央値画像、最頻値画像をそれぞれ生成する。

```python
imgs.shape    # (10, 128, 128, 3)
```
# 平均
x.shapeでaxisに設定したい軸を確認できる。

```python
img_mean = np.mean(imgs, axis=0)
img_mean.shape    # (128, 128, 3)
```
# 中央値
```python
img_median = np.median(imgs, axis=0)
img_median.shape    # (128, 128, 3)
```
# 最頻値
numpyに最頻値を求めるライブラリがないのでscipy。
他にいい方法あるかも。

```python
# 返値がmodeとcountの2つあるのでmodeだけ拾う
img_mode = stats.mode(imgs, axis=0)[0]

# 形を他の代表値画像と合わせる
img_mode.shape    # (1, 128, 128, 3)
img_mode = img_mode.reshape(128, 128, 3)

img_mode.shape    # (128, 128, 3)
```
アルゴリズムまとめになる予定

「思い立ったが吉日…」ということで今日からアルゴリズムの勉強をしようと思います．
これから，勉強した内容のアウトプットとして，記事を書いていきます．
それぞれの記事のリンクを貼ったりして，これをまとめ記事にしていきます．
【初心者でもわかる】CSSで水玉の背景を作る（整列・ランダム風）

# どうも7noteです。CSSで水玉模様を作ります。

背景パターンを画像で作るのもいいですが、CSSで再現することもできます。

## 規則性のある水玉模様の背景

```style.css
body {
  background-image:
    radial-gradient(#7bded9 20%, transparent 20%),
    radial-gradient(#7bded9 20%, transparent 20%);
  background-size: 40px 40px;
  background-position: 0 0, 20px 20px;
}
```

**結果**
![sample1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/71db663f-959d-3c32-ac68-e0f5f45e56a4.png)


## ランダム風に見える水玉模様の背景

```style.css
body {
		background-image:
			radial-gradient(290px 300px , rgba(123,222,217, 0.5) 20%, transparent 20%),
			radial-gradient(800px 780px , rgba(123,222,217, 0.5) 20%, transparent 20%),
			radial-gradient(1000px 990px , rgba(123,222,217, 0.5) 20%, transparent 20%),
			radial-gradient(400px 380px , rgba(123,222,217, 0.5) 20%, transparent 20%),
			radial-gradient(750px 750px , rgba(123,222,217, 0.5) 20%, transparent 20%),
			radial-gradient(100px 100px , rgba(123,222,217, 0.5) 20%, transparent 20%);
		background-size: 
			1230px 1280px,
			810px 910px,
			1470px 990px,
			1200px 1700px,
			1520px 1200px,
			1100px 1300px;
		background-position: 
			-300px -550px,
			-200px 100px,
			50px 510px,
			-200px -550px,
			-180px -250px,
			130px -150px;
}
```
**結果**
![sample2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/3b1b08d9-a765-618a-5ffa-647234576128.png)

複数のバラバラのサイズの丸い背景を重ねて作ります。
重なった部分が綺麗に見えるように色は16進数ではなくrgbaで書くことで重なり部分が綺麗に見えます。

![movie.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/7f77b91b-fbef-a378-ea7d-eefecfaf0298.gif)
※スクロールしたらこんなかんじ

色もバラバラに変えても綺麗ですね。

![sample3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/d2074583-6d1e-2a17-fb68-1d8db2ded8f3.png)

## まとめ

水玉模様はcanvasやjsを使った方法もあるようです。
適材適所で画像にしたり、CSSで作ったり使い分けるのがいいかなと思います。

アニメーションと組み合わせて水玉模様をふわふわさせたり、回転させたりしても面白いサイトができるかもしれませんね！

参考：https://www.esz.co.jp/blog/2766.html

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

kintoneで英語を読んでくれる英語勉強ツール作ってみたので紹介します👀

# アプリの準備

| フィールドの種類| フィールドコード| フィールド名| メモ |
|:-:|:-:|:-:|:-:|
|スペース|spSuteki||詳細画面の読み上げボタンにします|
| 文字列(1行)  | 英文 | 英文|   |
| 文字列(1行)  | 和訳  |和訳|   |
| 文字列(1行)  | 読み上げボタン| 🔊（絵文字のスピーカー） | 一覧画面用の読み上げボタンにします。値は空にしておきましょう。  |

## 一覧画面

JavaScriptを使ったカスタマイズで普通の一覧に読み上げボタン（🔊）をつけます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/a3866d7c-73b9-892a-144a-4257b9dfb2f9.png)

## 詳細画面

詳細画面ではスペースに読み上げボタン（🔊）を設置します。
単語登録用のアクションボタンがあってもいいですね👀そのへんはお好みで。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/27b1b795-6bad-7bbd-14d1-c2ae76b94c04.png)

# JavaScriptを書く

## 英語で読み上げる
こちらを参考にさせていただきました👀
https://developer.mozilla.org/ja/docs/Web/API/SpeechSynthesisUtterance
https://qiita.com/hachisukansw/items/c2b9bf2f0e137af39f38

```js
const readEng = (stcEng) => {
  const u = new SpeechSynthesisUtterance();
  u.text = stcEng;
  u.lang = "en-US";
  u.rate = 1.0;
  speechSynthesis.speak(u);
};
```


## 一覧画面

アプリの準備で作っておいた文字列(1行)をボタンに変身させます。
（わざわざフィールドを作らず、英文フィールドの前後に追加しても良いかも知れない。）

```js
kintone.events.on(["app.record.index.show"], (event) => {
  //ボタンを置きたいフィールドの情報を取ってくる
  const sp = kintone.app.getFieldElements("読み上げボタン");
  event.records.forEach((r, idx) => {
    //ボタンを作る
    const btn = document.createElement("button");
    btn.textContent = "🔊";
    sp[idx].firstChild.appendChild(btn);
    //ボタンをクリックしたときの動作
    btn.onclick = () => {
      readEng(r.英文.value);
    };
  });

  return event;
});

```

## 詳細画面

ボタン設置してみましたが、わざわざクリックするのは面倒な気がしたので・・・
スペースキー押しても読んでくれるようにしました。

```js

kintone.events.on(["app.record.detail.show"], (event) => {
  //ボタン設置
  const sp = kintone.app.record.getSpaceElement("spSuteki");
  const btn = document.createElement("button");
  btn.textContent = "🔊";
  sp.appendChild(btn);

  //ボタンをクリックしたときの動作
  btn.onclick = () => {
    readEng(event.record.英文.value);
  };

  //スペースキー押しても読み上げる
  document.onkeydown = (e) => {
    if (e.code === "Space") {
      readEng(event.record.英文.value);
    }
  };

  return event;
});
```

# できあがり

gifだから音声でないけど・・・👀雰囲気でも伝わればいいかな。

やった！これで、英語の勉強がはかどりますね！
が、がんばります！
![eng.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/ac74d5ee-3fd8-1a65-a823-a5d5a766078b.gif)

# おまけ
## 読み上げボタンの位置
読み上げボタンを英文フィールドに追加しても、別に悪くはないかな！👀✨✨
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536148/c988daa2-e431-60d9-ff45-5be942540813.png)

## 他の言語で読み上げたいとき

英語以外の言語を勉強したいよ～！ってときは
langプロパティに好きな言語コードを設定します。
↓たとえば中国語ならこんな感じ！

```js
const readChn = (stcChn) => {
  const u = new SpeechSynthesisUtterance();
  u.text = stcChn;
  u.lang = "zh-CN"; //←ここで読み上げる言語が変更できるよ
  u.rate = 1.0;
  speechSynthesis.speak(u);
};
```

読み上げたい言語は↓こちらを参考にされるといいかも？
https://www.benricho.org/translate/languagecode.html
【環境設定】eslint×prettier

##導入方法

```
$ npm uninstall --save-dev tslint
$ rm tslint.json //tslint削除
$ npm install --save-dev eslint prettier
$ npm install --save-dev @typescript-eslint/eslint-plugin eslint-plugin-prettier prettier-eslint eslint-config-prettier
```



```
$ npx eslint --init
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/313771/886a8cae-c218-db2b-074d-5d736ecb2640.png)


##【使い方】
```
#該当ディレクトリまで移動
$ npx eslint app.ts
```


- 同じ階層にある全てのtsファイルにまとめてeslintを実行する時

```
$ npx eslint *.ts
```

- さらに修正もかけたい時

```
$ npx eslint *.ts --fix
```

##【コミット時にESLintを実行】
・設定でコミット時にEslintを実行することも可能です。[記事](https://qiita.com/soarflat/items/06377f3b96964964a65d)


###メリット
- コマンドの実行忘れを防げる
- バグを混ざる可能性をさげられる（エラーを解決できたらコミットできる設定にする）

###デメリット
- コミットまでの時間がかかる


参考記事（いつもありがとうございます）
--- 

https://qiita.com/soarflat/items/06377f3b96964964a65d
https://zenn.dev/kozukata1993/articles/c6476f652a8b7e576db4
CloudWatchEvents（EventBridge）でFailedInvocationsが発生した時のエラーログの場所はCloudTrail

CloudWatchEvents（EventBridge）でタスクを実行した時に、`FailedInvocations` というエラーが発生した際のログの探し方です。


# FailedInvocationsとは

CloudWatchEvents（EventBridge）で、cronのように定期的にLambdaを実行したり、[ECSでバッチを起動](https://qiita.com/moya_dev/items/244147157b5911d9fa7f)したりができますが、その際に呼び出しが失敗した時に発生するイベント（Metrics？）の事です。

[Troubleshooting CloudWatch Events \- Amazon CloudWatch Events](https://docs.aws.amazon.com/AmazonCloudWatch/latest/events/CWE_Troubleshooting.html)

> You can use the following alarm to notify you when your CloudWatch Events rules are broken.

設定が壊れてる時に発生するようです。

CloudWatchのメトリクスで、確認する事ができます。

「イベント」を選択するか、検索ボックスで「FailedInvocations」と入れれば良いです。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32169/54131413-8431-0d15-e85c-87bf60a6750e.png)


# ログの場所

上記の通り、`FailedInvocations`が発生した事は確認できるのですが、なぜ発生したかはCloudWatchでは確認できません。CloudWatchLogsでも確認できません。

ではどこかと言うと、`CloudTrail`で確認ができます。CloudTrailはAWSでの設定変更やイベントのログを残す監査系のサービスです。
[AWS CloudTrail とは \- AWS CloudTrail](https://docs.aws.amazon.com/ja_jp/awscloudtrail/latest/userguide/cloudtrail-user-guide.html)


CloudTrailのイベント履歴を開いたら、イベント名->`RunTask` で検索すると、CloudWatchEventが実行した時のイベントログが確認できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32169/cd0ad99c-80d7-f4e2-9daa-f19d7b683ca8.png)

時刻とエラーコードを頼りに該当のイベントを探して詳細を確認します。

頑張ってjsonのログを探すと、errorMessageが書かれています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32169/0309d545-be47-3321-b9ba-cd9c476ae673.png)

この例だと、Networkの設定がおかしいという事がわかります。


# 参考

[amazon web services \- Cloudwatch failedinvocation error no logs available \- Stack Overflow](https://stackoverflow.com/questions/48602856/cloudwatch-failedinvocation-error-no-logs-available)
暮らしを良くするIoT① 〜テレビに近づくな！〜

はじめての投稿です。
今年は母艦もMacBook Pro M1 にしたので（10年ぶりのmac更新）
発信を積極的にしてみようかなという目標です。

仕事でIoTデバイスの開発をしていますが、
自分の子供たちにも電子工作ちっくなものに触れさせようという事で
「暮らしを良くするIoT」と銘打ち、
自宅の困った事を電子工作を使って解決していこうと思いました。
##困りごと
子供がテレビの近くから離れない。目が悪くなる！
##解決方法
テレビに近づいたら怒られるようにする。（怒り疲れたので）
##設計
手持ちのデバイスを色々見回して、下図のような感じで設計。
![001.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/920910/598b87ab-9b89-6cc3-955b-65636018815e.png)

| 使用デバイス | 用途 | 備考 |
|:-----------|:------------|:------------|
| RaspberryPI 3B+       | ハブ        | 仕事でラズパイ４を使うようになって余った         |
| Arduino Uno     | センシング      | 最近スペック的に余り使わない       |
| 　超音波距離センサ       | 距離検知        | Grove用のセンサが転がっていた         |
| Google Home Mini         | 音声出力          | 家でNature Remoに繋いで使っている           |
※　余りものの消費を一番に考えているので、非効率な部分はご容赦。
##開発
仕組みはラズパイとUnoをシリアル接続して、
近い距離になったらシリアルに「近づきすぎよん」と送信し、
ラズパイからWifi経由でGoogle Homeに音声を送り怒らせるという感じです。
以下、参考にして組み合わせました。

-ArduinoとNode.jsでシリアル通信で文字列を送受信するスクリプト
https://qiita.com/sifue/items/69d8a6f56671588ce1ba
-RaspberryPi で castv2-client を使ってGoogleHomeをしゃべらす
https://qiita.com/nori-dev-akg/items/751e7d9bf2728afda28a
##結果
無事、子供をビビらせる　＆　電子工作に興味を持たせる事に成功。
ただし面白がって、わざと喋らせようとして近づく不具合が発生中。
※　超音波距離センサだと直線しか取らないので、人感センサに変えれたら良さそう。
Ransackでor検索機能を作る。

## 使用環境
```
rails 6.0.2
ubuntu (WSL)
```

## 手順
### gemインストール
```Gemfile
gem 'ransack'
```
`bundle`を忘れずに。

### 内容の検索
`post_controller`は既に作ってあるものとします。

```posts_controller.rb
  def index
    unless params[:q].blank?
       #入力された単語を空白で分割
      split_keyword = params[:q][:content_cont].split(/\p{blank}/)
    end
    @q = Post.ransack(content_cont_any: split_keyword)
    @posts = @q.result
  end
```
入力（検索ワード）があるか調べる。
ここがないとエラーになると思う。

```.rb
unless params[:q].blnak?
```

### 検索フォーム
```posts/index.html.slim
 = search_form_for @q, class: 'mb-5 search-container' do |f|
   .form-group.row
     = f.search_field :content_cont, placeholder: "キーワードを入力してください", class: "form-control"
     = f.submit class: "btn btn-outline-primary"

```
Google Cloud アップデート (1/1-1/7 2021)

あけましておめでとうございます！！！今年も一緒にGoogle Cloudで楽しみましょう:)

### Composer: [Jan 5, 2021](https://cloud.google.com/composer/docs/release-notes#January_05_2021)
- 次のバージョンからDAGをスケジューラで処理してからwebサーバに投げる[DAG serialization](https://cloud.google.com/composer/docs/dag-serialization)が、新しく作るとデフォルトで有効になるよ！

### Data Loss Prevention: [Jan 6, 2021](https://cloud.google.com/dlp/docs/release-notes#January_06_2021)
- どんなデータソースからでもDLPに非同期でスキャンできて、スキャン後のアクション(BQやPub/Subに投げるとか)が使える[Hybrid jobs](https://cloud.google.com/dlp/docs/concepts-hybrid-jobs)が使えるようになったよ！

### Config Connector: [Jan 6, 2020](https://cloud.google.com/config-connector/docs/release-notes#January_06_2021)
- 1.34.0がリリース！
- 他のリソースで作成したIAMメンバを参照できる``IAMPolicyMember``が追加されたよ！
- ProjectとFolderが親のIDを変えることで移動できるようになったよ！
- その他ComputeDisk、BackendBucket、GCS、IAM周りで色々更新

### ディスクレーマ
- アップデートの内容はあくまでも個人の理解していることを書いています。正しい内容はリリースノート等を確認下さい。
- リリース内容できるだけ拾うようにしているのですが、抜けていそうなリリースノートが追加するのでぜひ教えて下さい！(一覧[ここ](https://qiita.com/kenzkenz/items/ac18a359b803dbb6b490)で更新してます。)
[EC-CUBE4]serviceファイル内でユーザのログイン状態を判別する方法

# 環境
EC-CUBE 4.0.5
symfony 3.4.42
php 7.3

# 実行方法
```php

// appを取得
$app = \Eccube\Application::getInstance();
// user情報を取得
$user = $app['user'];
// ゲストユーザは"anon."が格納される
if ($user != "anon.") {
 
  // 会員限定で行いたい処理

}
```

これでログイン状態のユーザ（会員）を判別して処理を行えるうようになります。

# 参考に

## isGranted('ROLE_USER')は使えない
こちらはAbstractControllerを継承しているController内でしか使えないです。
twig内で使うような`is_granted('ROLE_USER')`も使えません。

## 他の実行例 
[こちら](https://xoops.ec-cube.net/modules/newbb/viewtopic.php?topic_id=22199&forum=11)の記事にある
`$this->app->user()`を使って取れる場合もあるようですが、私の環境では取れませんでした。
遺伝的アルゴリズムの概念をキリンに例えて解説

# はじめに
本記事では、まずは遺伝的アルゴリズムの概念を理解することを趣旨に記述していきます。

この記事で流れがつかめたら以下の記事で数字を使って理解してみると良いです。
[OneMax問題を例に遺伝的アルゴリズムを見る（概要編）](https://qiita.com/ruemura3/items/708684f9eed6567552c9)

# 遺伝的アルゴリズムとは
Wikipediaから引用すると

> 遺伝的アルゴリズム（いでんてきアルゴリズム、英語：genetic algorithm、略称：GA）とは、1975年にミシガン大学のジョン・H・ホランド（John Henry Holland）によって提案された近似解を探索するメタヒューリスティックアルゴリズムである。人工生命同様、偶然の要素でコンピューターの制御を左右する。4つの主要な進化的アルゴリズムの一つであり、その中でも最も一般的に使用されている。

何言ってるかわかりませんね。

簡単に言うと「生物が遺伝によって進化する過程をモデルとしたアルゴリズム」です。

例えば、キリンは首と足の長い動物ですが、大昔は違った姿をしていたと言われています。

大昔のキリンはみんな首と足が短かったそうですが、ある時「突然変異」により首と足の長いキリンが生まれました。

低いところの葉っぱはみんなが食べるからどんどんなくなりますが、高いところにある葉っぱは首の長いキリンしか食べられないので簡単に食糧を得ることができます。
さらに、足が長いと走るのも早いので肉食動物に捕まることも少ないです。
自然への「適応度が高い」ということです。

すると首と足の長いキリンは他のキリンより生き残りやすくなります。
そしてこの首と足の長いキリンが子供を作ると、子供に首と足の長さが「遺伝」し、やはり生き残りやすくなります。

これを繰り返す中で首と足の短いキリンはどんどん「淘汰」され、キリンはみんな首と足が長くなったと言うわけです。

![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3537343732382f66616464396338342d336236302d653736392d383037342d3730396265386464643366362e676966.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/41621983-2a42-a48e-6b47-f20fec875540.gif)


この一連の流れをモデルにしたアルゴリズムによって問題の最適解を出そうと言う手法を1975年にミシガン大学のジョン・H・ホランドさんが提案したんですね。

# 遺伝的アルゴリズムの流れ
キリンの例を基に遺伝的アルゴリズムの流れを見てみましょう。

## ① 個体集団の作成
まず個体集団を作ります。足と首の長いキリンから短いキリンまで適当にたくさん作ります。

キリンの集まりを「個体集団」、キリン一匹一匹を「個体」、それぞれのキリンを形成しているものを「遺伝子」と呼びます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/fb9a5041-d72a-b5b4-4d15-9ccb8af723c7.png)

## ② 個体の評価
個体をそれぞれ評価して優劣を付けます。

今回の評価ポイントは「生き残りやすさ」です。前述したように首と足が長ければ長いほど生き残りやすくなるため”Good!”になります。
もちろん問題によってこの評価ポイントは変わってきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/cf2ab6be-3294-5fcc-cad8-32360abb57f8.png)

## ③ 個体の選択
評価の高いものを次の世代へと受け継ぐために残します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/dfba2fa8-0c00-3643-a7e2-05d8aa025bec.png)

## ④ 交叉
③で選択された個体同士で子供を作ります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/a6e14b12-340d-93fe-4907-8aa2b0a3eb83.png)

## ⑤ 突然変異
④で作成された新たな個体集団の中のごく一部に突然変異を起こします。

今まで「首と足の長さ」ばかりに着目してきました。
でも②で述べたように、今回の評価ポイントは「生き残りやすさ」です。
もしかしたら胴も長い方が生き残りやすいかもしれません！（胴が長いと動き辛そうなのでそんなことはないでしょうが、ものは試しです。）

この様に進化の多様性を保つために新たな風を吹き込むことを突然変異といいます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/574728/2f658ee2-acc0-3f45-6fd4-bd5bf4981f6d.png)

## ⑥ ②〜⑤を繰り返す
⑤でできた個体たちにまた②の個体の評価を行い、優秀なキリンからまた子供を作ります。

このように②〜⑤を何度も繰り返していると、どんどん優秀なキリンが多くなり、最後の世代まで繰り返したらその中で最も評価の高い個体を最適解として導き出します。

# まとめ
今回はキリンを例にして遺伝的アルゴリズムの流れについて見てきました。遺伝的アルゴリズムがどんなものかについて理解していただけたでしょうか？

以下の記事ではOneMax問題という問題を遺伝的アルゴリズムで解く流れを説明しています。見てもらえばよりイメージが付きやすいと思います。
[OneMax問題を例に遺伝的アルゴリズムを見る（概要編）](https://qiita.com/ruemura3/items/708684f9eed6567552c9)

[Twitter@ruemura3](https://twitter.com/ruemura3/)
スタックコンテキストについて

##目的
- z-index使用時に、重なり順が想定と違っていた
- 重なりの仕組みについて整理する

##スタックコンテキスト
- スタック(stack)は積み上げる、コンテキスト(context)は文脈という意味
- positionをstatic以外、かつz-indexを指定した場合に生成される集まりのとこ
- z-indexを使用することで、同じスタックコンテキストの要素同士の重なり順を指定できる

##実例
CSSとHTMLはこんな感じ（色や位置の記述は割愛）

```HTML
<div class="squares">
  <div class="square square-red">z-index:2</div>
  <div class="square square-green">
    z-index:3
    <div class="square square-blue">z-index:1</div>
  </div>
</div>
```

```CSS
.squares {
  position: relative;
}

.square {
  position: absolute;
  width: 10rem;
  height: 10rem;
}

.square--red {
  z-index: 2;
}

.square--blue {
  z-index: 1;
}

.square--green {
  z-index: 3;
}
```

![スクリーンショット 2021-01-06 22.53.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/863747/94c5775a-4f41-857e-0cc6-c53770326752.png)


・z-indexが1の要素が、一番上に表示されている
・これは、z-indexが3の親要素が起点となっているから
・各要素の重なり順序は下表のようになっている

|色|z-index|スタックコンテキスト|重なり順|
|:---|:---:|:---|:---|
|赤|2|root| root→赤(z-index:2) |
|青|1|緑|緑(z-index:3)→青(z-index:1)|
|緑|3|root|root→緑(z-index:3) |

青はz-index:3の緑を起点としているため、一番上に表示される

##まとめ
z-indexを使用するときは、起点に注意しよう
命名規則の◯◯ケースについてまとめてみた

# 動機
初投稿です。

vue.jsを学習していく中でコンポーネントや変数の命名に様々な書き方があるようなのでまとめてみました。

#本題

### キャメルケース
小文字で書き出し、単語ごとに最初の文字を大文字にして記述する書き方
ラクダ（camel）のコブのように見えることが由来だそうです。


```
camelCase
```

### パスカルケース
大文字で書き出し、単語ごとに最初の文字を大文字にして記述する書き方
アッパーキャメルケースとも呼ぶ。

```
PascalCase
```

### ケバブケース
全て小文字で書き、単語と単語を「 - （ハイフン）」で繋ぐ書き方
ケバブのように串刺しになっているように見えることが由来。

```
kebab-case
```

### スネークケース
全て小文字で書き、単語と単語を「 _（アンダースコア） 」で繋ぐ書き方
蛇がニョロニョロしているように見えるのが由来なのでしょうか？
 
```
snake_case
```

# 参考
- https://ja.wikipedia.org/wiki/%E3%82%AD%E3%83%A3%E3%83%A1%E3%83%AB%E3%82%B1%E3%83%BC%E3%82%B9

- https://qiita.com/ngron/items/ab2a17ae483c95a2f15e

- https://qiita.com/yimajo/items/a3fac0026c07ec538fc2
【Rails】FontAwesomeを導入する方法

#はじめに
FontAwesomeをrailsで導入するってすごく簡単なのに、簡単すぎるせいか、やり方を記載しているものを見つけにくかったので、こちらに記載します。
私はgemをインストールしてみたり、yarn add〜してみたりして２時間ほど潰れました(笑)
※初学者による記載ですので、誤りがあればご指摘願います。

#導入方法
まずFontAwesomeのアカウントを作成します。
[Font Awesome](https://fontawesome.com/)

ログインして、下の写真にあるManage Kitをクリックします。

![スクリーンショット 2021-01-07 21.03.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/771363/72bf052f-05f4-c29c-076e-6238b17d567f.png)


そうすると下の写真のページに行くので、黒く塗り潰してある部分(本来は英数文字が書かれています)をクリックします。
![スクリーンショット 2021-01-07 21.04.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/771363/c879983d-dc78-f0e3-553e-b87644d302e4.png)

Copy Kit Code!でコードをコピーします。

![スクリーンショット 2021-01-07 21.04.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/771363/c5654f88-09dd-0de3-1c6d-74cd94f38443.png)


ここまで完了したら、Railsに戻ります。
`app/views/layout/application.html.erb`へ先ほどのコードを記載します。

![スクリーンショット 2021-01-07 21.28.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/771363/c51e3dc9-f2da-8662-bc5f-5df6c70da771.png)

これでFontAwesomeが動くはずです！
FontAwesomeのコードを記載してみましょう！



【参考】

Qiita: [【無料教材】Tailwind CSS & Rails6でQiitaを模写してみた【バックエンド演習に利用可】
](https://qiita.com/soeno_onseo/items/ac34debbd459374331a7)Youtube: [【Ruby on Rails】Font Awesomeをrailsのボタンに導入する　Adding Font Awesome to Ruby on Rails](https://youtu.be/vqA7p44YUTY)
M1 Mac node.js v15 と Intel Mac node.js v14 で package-lock.json の lockfileVersion が違う

Apple Silicon M1 arm64 aarch64 Mac 環境の node.js v15 では、
npm v7 によって package-lock.json が `"lockfileVersion": 2` になる。

従来の Intel x64 amd64 Mac 環境などの node.js v14 では、
npm v6 によって package-lock.json が `"lockfileVersion": 1` になっていた。

v14 と v15 を併用する場合は、npm のバージョンを揃えたほうが良さそう。
当面 production で npm v6 を使うなら

```sh
npm install -g npm@6
```

として、M1 Mac 側を v6 にダウングレードすることで、バージョンを揃えることができる。
Web三層構造

#【Web三層構造】

AWSなどのクラウドを学習する際にもWeb三層構造の知識が必要だと感じました。
簡単に調べられた限りでまとめてみました。
ご指摘などありましたら、是非よろしくお願い致します。

##ミドルウェア

アプリケーションとOSの中間的な処理を行うソフトウェア。
ある機能に特化したOS（サーバ上）とアプリケーションを補助するソフトウェア

##三階層

<strong>Webサーバ</strong>

フロントエンドにあり、ユーザーと直接やり取りを行うサーバ
ユーザーがWebブラウザからリクエストした内容を受け付けて処理

<strong>APサーバ</strong>

WebサーバからのリクエストをRubyなどを実行して処理
DBにアクセスしてデータを要求することもある。

<strong>DBサーバ</strong>

主にバックエンドでデータの管理
Webサイトに必要なユーザーデータや商品データなどを保存

※WebアプリケーションはDBにアクセスし、必要なデータの抽出や加工処理を実行

<strong>・このような流れである。</strong>
Webサーバ→APサーバ→DBサーバ
Webサーバ←APサーバ←DBサーバ

（静的サーバは、Webサーバのやり取りのみ。）

##OSSによるWeb三層アプリケーション

Webシステムの構成要素を三層に分割し、独立したモジュールとして設計

<strong>・一般的な構築例</strong>

・Webサーバ : プレゼンテーション層を担当（controller view）

　ブラウザからのHTTPリクエストを処理し、必要に応じてAP層に処理を委譲
　また、AP層から処理結果を受け取り、ブラウザに返す。

・APサーバ : アプリケーション層を担当（model）

　プレゼンテーション層からの要求に応じてビジネスロジックを処理
　必要に応じてデータ層にアクセスし、データの検索、保存など行う。

・DBサーバ : データ層を担当

　データを管理する。
　AP層に対してデータの検索、抽出、保存などのI/Fを提供

※MVCでは、プレゼンテーション層周辺に着目

###・メリット

疎結合のようなメリットが得られる。
・セキュリティ高い。
・メンテナンスがしやすい。
・コストを抑えられる（データ更新のコストのカット）
・大量の処理を可能
・処理速度の向上
・管理しやすい（一部ずつ実行可能）
ECSでタスクスケジューリングする時に最新のrevisionのタスク定義を参照する方法

ECS環境（Fargate含む）でバッチを動かす場合の選択肢として、ECSのScheduleTask機能を使う方法があります。
この方法で、常に最新のtask定義(task_definitions）の最新を参照する方法について説明します。


# ECSのタスクスケジューリング機能について

[Amazon ECS タスクのスケジューリング \- Amazon Elastic Container Service](https://docs.aws.amazon.com/ja_jp/AmazonECS/latest/developerguide/scheduling_tasks.html)
[Amazon ECS ScheduledTaskで実現するスマートなDockerベースのバッチ実行環境 \- コネヒト開発者ブログ](https://tech.connehito.com/entry/2017/09/13/171914)
[AWS ECSを使ったバッチサーバ環境を試してみる \- Qiita](https://qiita.com/pokotyan/items/36ab249db0e8aeb16e76#ecs%E3%81%AEscheduletask%E3%82%92%E7%99%BB%E9%8C%B2%E3%81%97%E3%81%A6%E3%81%84%E3%81%8F)

ECSでバッチを動かす場合、いくつか選択肢がありますが、ECSのScheduleTask（スケジューリング）機能が便利です（詳しくは上記をリンクを参照ください）。ScheduleTaskを使うと、cron的に定期的にタスクを立ち上げて、定期的に処理を実行する事ができます。

このScheduleTaskはECSと統合されていますが、実際には`Amazon EventBridge`のrule機能になります。さらに、`Amazon EventBridge`は、`CloudWatch Events`という名前だったもので、まだ`CloudWatch` のコンソール画面から操作が可能です。

# 最新を参照する＠AWSコンソール画面

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32169/967409b2-d2c0-572a-eafc-1ef3005bd234.png)

画面でいうとここで「最新」を選べば、起動時に最新のrevisionのtask_definitions（タスク定義）を使って、タスクが起動します。

が、ここで一つ罠がありまして、前述の通り、

**ECSのスケジューリング機能 ≒ Amazon EventBridge ≒ CloudWatch Events** 

でして（≒の表現は誤解を招きそうですがこの記事の趣旨では無いので軽くスルーしてください）、同じ設定が、

- ECS
- EventBridge
- CloudWatch

の3画面で可能となっています。

この3画面のうち、**ECSの画面から追加しようとした場合は、「最新」の選択肢がでてきません**。残念。

![Amazon_ECS.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32169/caebc59c-adfd-ffdd-fd46-4e76e6982df4.png)

というわけで、EventBridgeかCloudWatchの画面から作成する必要があります。

おそらくそのうち対応されると思いますがご注意ください。


# 最新を参照する＠terraform

terraformだとこのようになります（抜粋なのでこのままじゃ動かないかも）。
resourcの名前はcloudwatchなので注意が必要です。

```terraform
resource "aws_cloudwatch_event_rule" "rule" {
  name = "name"
  schedule_expression = "cron(30 * * * ? *)"
}

resource "aws_cloudwatch_event_target" "target" {
  target_id = "name"
  rule      = aws_cloudwatch_event_rule.rule.name
  arn       = aws_ecs_cluster.main.arn 
  
  ecs_target {
    launch_type      = "EC2"
    task_count       = 1
    task_definition_arn = "arn:aws:ecs:ap-northeast-1:XXXXXXXX:task-definition/name" # ここがポイント
  }
}

```
ポイントは、`task_definition_arn`でして、ここでrevisionを指定しなければ、画面で「最新」を選んだことになります。

revisionを指定する場合は

```
arn:aws:ecs:ap-northeast-1:XXXXXXXX:task-definition/name:15
```
のようになります。



# 補足

Terraform v0.13.5 で動作確認しました。
LaravelのPaginateでエラーが出たワケ

## はじめに
初めてLaravelを触ってみました。プログラミング初心者らしすぎる凡ミスですが、記録的として残したいと思います。

## 環境
PHP 7.4
Laravel 6.20.8

## エラー内容
```
BadMethodCallException
Call to undefined method App\XXX(model)::links() (View: /work/resources/views/XXX.blade.php)
```

## Paginateメソッドについて
Laravelにはページネーションがデフォルトで備わっています。
例えば

```php:UserController
$users = User::orderBy('created_at', 'desc')->paginate(10);
return view('user.index', ['users' => $users ]);
```

```php:users.blade.php
@foreach($users as $user)
{{ $user->name }}
@endforeach

{{ $users->links() }}
```

これだけで、10件ごとにユーザー名が表示されるページネーションが簡単にできます。

## 今回のエラーの原因
Laravelでは、テーブル名を複数形、モデルを単数形にするというルールがありますが、今回私はどうしてもinfoという不可算名詞を使用したかったため、任意の名前でテーブル名を設定しました。
ですので、viewのforeachをこれまで書いていたものと同様、Laravelに頼りすぎて何も考えず下記のように書きました。

```php:example.blade.php
@foreach($info as $info)
{{ $info->name }}
@endforeach

{{ $info->links() }}
```

すると先程のエラー。
変数がオーバーライドされるので、当たり前ですね...下記のように変更（例）しました。

```php:example.blade.php
@foreach($info as $information)
{{ $information->name }}
@endforeach

{{ $info->links() }}
```
無事ページネーションができました。

## おわりに
恥ずかしながらLaravelの便利さ故に詰まってしまいました。自分で任意の名前でテーブル名を設定できますが、できれば変なところで詰まりたくないので、Laravelではできるだけ命名規則に従っておこうと思います。

## 参考
https://readouble.com/laravel/6.x/ja/pagination.html
Homebrew 警告への対処（Another active Homebrew update process is already in progress）

こんにちは。
Homebrew 利用時に、下記の警告が現れました[^1]。
```"Another active Homebrew update process is already in progress"```

* しかし下記のように調べても、関連プロセスは見当たりませんでした。
  * ```$ ps aux | grep homebrew | grep -v grep```

##### このような場合への解決策 #####
このような場合、```locks``` ディレクトリの存在が真の原因とのことで、削除により復旧しました。
```$ rm -rf /usr/local/var/homebrew/locks```

なお linuxbrew の場合には、
```$ rm -rf /home/linuxbrew/.linuxbrew/var/homebrew/locks```

[^1]: 参考：「[Homebrewが突然エラーを出すようになった時の対処](https://qiita.com/silverskyvicto/items/4b87ceaad3f526a958b9)」、「[$ brew upradeを実行したら権限系のエラーが出た](https://qiita.com/miriwo/items/1addf6c1e26271a82fee)」
[Swift] スタティックプロパティ(static)を使ってみて分かったこと

#はじめに
今回は、スタティックプロパティを理解するためにインスタンスプロパティも一緒に動かしてみたので、
比較しながら理解を深めていけたらなと思います。
#試してみたコードの説明
比較のためにインスタンスプロパティaとスタティックプロパティbを用意します。
関数getは、aとbの値の変更内容を表示するためのものです。


```swift
struct Sample {
    var a = 0
    static var b = 0
    
    func get() -> String {
        return "aが\(a)、bが\(Sample.b)"
    }
}
```

###インスタンスプロパティaを変更してみた

```swift
//3種類のインスタンスを作成します。
var S1 = Sample()
var S2 = Sample()
var S3 = Sample()

//もちろん結果は同じです。
S1.get()  //"aが0、bが0"
S2.get()  //"aが0、bが0"
S3.get()  //"aが0、bが0"

//S2だけ変更を加えてみます。
S2.a = 3   

//S2.aの部分のみが変更されています。
S1.get()  //"aが0、bが0"
S2.get()  //"aが3、bが0"
S3.get()  //"aが0、bが0"
//変数aにアクセスしようとすると、S1.aかS2.aかS3.aになる。
//インスタンス化したものに紐づいてアクセスするので、値の変更があった場合はそのインスタンスごとに変更になる。
//結果を見てもS2.aだけ変更されている事がわかる。
```
###スタティックプロパティbを変更してみた

```swift
Sample.b = 6  

//全てのbが変更されている。
S1.get()  //"aが0、bが6"
S2.get()  //"aが3、bが6"
S3.get()  //"aが0、bが6"
//staticプロパティのbにアスセスするには、Sample.bになる。S１.bとアクセスする事はできない。
//インスタンスではなく、元の型自身に紐づいているプロパティである事がわかる。
//変更結果をみても、元になる型の内容を変更していることになるので、全ての値が変更されている事がわかる。
```
【Ruby】3桁の整数を取得しif文を使って条件分岐 ( digitsメソッド )

## 概要

[前回書いた記事](https://qiita.com/suzu12/items/d0b53838353d6a6e651e)で使用した **digitsメソッド** を使って3桁の整数を位ごとに分けて条件分岐をするという問題を解いてみました。前回とは少し視点が違うので理解を深めるのには良いと考え記事にさせていただきました。

## 目次

- 実践
    - 問題
        - 条件
    - 解答

- 補足
    - 変数numの処理結果
    - 変数sumの処理結果

- まとめ

- 参考文献

## 実践

#### 問題

>3桁の整数があります。その整数の 「百の位・十の位・一の位の和」 を出力し、10の倍数との差を出力するプログラムを書いてください。

**条件**

- 10の倍数との差が 2 以内であれば`True`
- それ以外であれば `10の倍数との差は◯です`
- ただし、10の倍数との差が近い方を出力する。


#### 解答

```ruby
def near_ten_multiple(i)
  num = i.digits.take(3)   # 1の位, 10の位, 100の位を取得し変数numに格納
  sum = (num.sum) % 10     # 3桁の合計を取得し1の位を取得

  if sum <= 2 || sum >= 8  # 2以下 または 8以上のとき
    p 'True'
  elsif sum >= 5           # 5, 6, 7 のとき
    p "10の倍数との差は#{ 10 - sum }です"
  else                     # 3, 4 のとき
    p "10の倍数との差は#{sum}です"
  end
end

# メソッド呼び出し
near_ten_multiple(117)   # 1 + 1 + 7 = 9
near_ten_multiple(111)   # 1 + 1 + 1 = 3
near_ten_multiple(123)   # 1 + 2 + 3 = 6

# ターミナル出力結果
# "True"
# "10の倍数との差は3です"
# "10の倍数との差は4です"
```

## 補足

#### 変数num の処理結果

`digits.take(3)` で引数で指定した位の数だけ1の位から順番に取得しています。今回は合計を取得したいだけなのであまり順番に関しては考慮しなくて良いですが、このような取得結果になっています。

```ruby
num = i.digits.take(3)

#ターミナル出力結果
# 117 => [7, 1, 1]
# 111 => [1, 1, 1]
# 123 => [3, 2, 1]
```

#### 変数sum の処理結果

**sum** で合計値を出したあとに `% 10` をすることで **1の位を取得** しています。
たとえば、`24`という数字があったとします。`%10` をすると

`24 ÷ 10 = 2 余り 4`になります。この余りが **1の位** になります。

```ruby
sum = (num.sum) % 10

#ターミナル出力結果
# 9
# 3
# 6
```

## まとめ

- 整数を10で割ったときの余りは **1の位** になる

## 参考文献

- [Ruby 2.7.0 リファレンスマニュアル ( Integer#digits )](https://docs.ruby-lang.org/ja/2.7.0/method/Integer/i/digits.html)

- [【Ruby】10の位と1の位を取得する方法](https://qiita.com/suzu12/items/d0b53838353d6a6e651e)
【R】二元配置分散分析

Rで統計解析するための備忘録的なやつです。

#使用するデータ

[統計の時間](https://bellcurve.jp/statistics/course/10059.html)

このサイトの例題を使ってみます。

まずはデータフレームを作ります。

```R
Soil <- factor(c("A","A","A","A","A","A","A","A","A","A","A","A",
                 "B","B","B","B","B","B","B","B","B","B","B","B"))
Fertilizer <- factor(c("100","100","100","200","200","200","300","300","300","400","400","400",
                       "100","100","100","200","200","200","300","300","300","400","400","400"))
Yield <- c(14.5, 15.1, 14.1, 16.5, 16.1, 15, 17.8, 19, 15.2, 18.1, 20.2, 17.2,
           16.2, 15.3, 17.5, 18.6, 16.9, 18.6, 21.7, 20.5, 19.4, 23.6, 24.9, 25.5)
df <- data.frame(soil=Soil, fertilizer=Fertilizer, yield=Yield)
```

#二元配置分散分析

**aov()**関数を使います。

**aov()**関数の書式は、``aov(目的変数 ~ 説明変数, data = データフレーム名)``です。

目的変数以外のデータフレームに含まれる残りの変数をすべて説明変数とするのであれば、
``目的変数 ~.``と表記することもできます。

繰り返しの無いデータの二元配置分散分析では、観測値に対する因子Aおよび因子Bの主効果の優位性を調べることができます。

一方、繰り返しのあるデータの二元配置分散分析では、因子Aおよび因子Bの各主効果の優位性に加えて、因子Aと因子Bとの交互作用についても調べることができます。

交互作用項を含めるときは**因子A*因子B**を追加します。

今回の場合は``soil*fertilizer``を加えます。

コードは以下のようになります。

**summary()**関数で分散分析表を出力します。


```R
AOV <- aov(yield ~ soil + fertilizer +soil*fertilizer, data = df)
summary(AOV)
```

実行結果

```R
> AOV <- aov(yield ~ soil + fertilizer +soil*fertilizer, data = df)

> summary(AOV)
                Df Sum Sq Mean Sq F value   Pr(>F)    
soil             1  66.33   66.33  46.333 4.21e-06 ***
fertilizer       3 126.64   42.21  29.485 9.40e-07 ***
soil:fertilizer  3  17.79    5.93   4.142   0.0237 *  
Residuals       16  22.91    1.43                     
---
Signif. codes:  0 ‘***’ 0.001 ‘**’ 0.01 ‘*’ 0.05 ‘.’ 0.1 ‘ ’ 1
```

#最終的なスクリプト

```R

# Rをきれいにする
rm(list = ls())

# データフレームの作成
Soil <- factor(c("A","A","A","A","A","A","A","A","A","A","A","A",
                 "B","B","B","B","B","B","B","B","B","B","B","B"))
Fertilizer <- factor(c("100","100","100","200","200","200","300","300","300","400","400","400",
                       "100","100","100","200","200","200","300","300","300","400","400","400"))
Yield <- c(14.5, 15.1, 14.1, 16.5, 16.1, 15, 17.8, 19, 15.2, 18.1, 20.2, 17.2,
           16.2, 15.3, 17.5, 18.6, 16.9, 18.6, 21.7, 20.5, 19.4, 23.6, 24.9, 25.5)
df <- data.frame(soil=Soil, fertilizer=Fertilizer, yield=Yield)

# 二元配置分散分析（aov()関数）
AOV <- aov(yield ~ soil + fertilizer +soil*fertilizer, data = df)
summary(AOV)
```

#参考：二元配置分散分析（lm()関数、anova()関数）
Rでは**lm()**関数と**anova()**関数を組み合わせても分散分析を実行できます。

```R
LM <- lm(yield ~ soil + fertilizer +soil*fertilizer, data = df)
anova(LM)
```

実行結果

```R
> LM <- lm(yield ~ soil + fertilizer +soil*fertilizer, data = df)

> anova(LM)
Analysis of Variance Table

Response: yield
                Df  Sum Sq Mean Sq F value    Pr(>F)    
soil             1  66.334  66.334 46.3332 4.214e-06 ***
fertilizer       3 126.638  42.213 29.4850 9.403e-07 ***
soil:fertilizer  3  17.791   5.930  4.1423   0.02373 *  
Residuals       16  22.907   1.432                      
---
Signif. codes:  0 ‘***’ 0.001 ‘**’ 0.01 ‘*’ 0.05 ‘.’ 0.1 ‘ ’ 1
```
Laradock環境でUnable to load FFProbeのエラー


workspaceじゃない方のphp-fpmのコンテナでエラーが出てる可能性がある。

動画編集ライブラリffmpegをphpでラップしたのがPHP-FFMpeg。
PHP-FFMpegをlaradock内で使用する。

# エラー内容

この辺りのエラーが出てる場合の対処方法。

https://stackoverflow.com/questions/29916963/laravel-unable-to-load-ffprobe
https://github.com/PHP-FFMpeg/PHP-FFMpeg/issues/45


# 対処方法

```
docker-compose exec php-fpm bash
apt update
apt-get -y install ffmpeg
```

コンテナ内でffmegがあるかをチェックしたら、あれば動くはず。


```
which ffmpeg
```
SFSymbolsを大きさと色を変えて表示する

## はじめに
SFSymbolsを使うことでApple純正アプリでよく見かける画像を簡単にアプリに取り入れることができます。はじめ方については[こちら](https://qiita.com/Hyperbolic_____/items/f619ba4d56d721c9a0c9)で書いています。

```swift
let image = let image = UIImage(systemName: "mic")
```
これだけでマイクアイコンを簡単に貼り付けられます。

## 大きさと色を変える

```swift
let image = UIImage(systemName: "mic", withConfiguration: UIImage.SymbolConfiguration(pointSize: 30, weight: .light, scale: .default))?.withTintColor(.black, renderingMode: .alwaysOriginal)
```

`pointSize`で大きさを、`withTintColor`で色を変更できます。ボタンを押した際の細かいエフェクトは`renderingModel`でいじれます。
terraformで「Error: Failed getting task definition ClientException: Unable to describe task definition. "XXXXX"」

terraformで、

```
Error: Failed getting task definition ClientException: Unable to describe task definition. "XXXX"
```

というエラーが出た時の対応です。


# エラーが発生するtfファイル

```terraform
resource "aws_ecs_task_definition" "test" {
  // 省略
}

# Simply specify the family to find the latest ACTIVE revision in that family.
data "aws_ecs_task_definition" "test" {
  task_definition = aws_ecs_task_definition.test.family
}
```

一見問題なさそうですが、新規作成の時にエラーが発生します。

# 対応
```terraform
resource "aws_ecs_task_definition" "test" {
  // 省略
}

# Simply specify the family to find the latest ACTIVE revision in that family.
data "aws_ecs_task_definition" "test" {
  task_definition = aws_ecs_task_definition.test.family
  depends_on      = [aws_ecs_task_definition.test] // 追加
}
```

この様に、`depends_on`で依存関係を明示してあげるとうまくいきます。


# 参考

[data\.aws\_ecs\_task\_definition: Failed getting task definition · Issue \#1274 · hashicorp/terraform\-provider\-aws](https://github.com/hashicorp/terraform-provider-aws/issues/1274)
[aws\_ecs\_task\_definition \| Data Sources \| hashicorp/aws \| Terraform Registry](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/data-sources/ecs_task_definition)

※この記事を書いている段階で、terraformのドキュメントのexample通りに書いてもこの事象が発生します

# 補足

Terraform v0.13.5 で動作確認しました。
コピペで乗り切るエンジニアがSwiftUIを勉強してみた（環境構築編）

こんにちは！  

転職をして会社で扱うPCがMacだったので、
社畜の私はMacBook Proを買いました。

この時期、M1搭載のMacがYoutubeで色々話題ですが、
何か分からないけど使えないソフトとかあったらどうしよう。。。と
Intel CoreのMacを買いました。

さて、せっかくMacを買ったということで、
MacでできてWindowsでできないことといえば、
#### そう！ iOSアプリの開発！

何も分かりませんが、やってみないと分からないということで、
まずは環境構築をやってみます。


## 環境構築
Swift UIを使えるように実装していきます。

### Xcodeのインストール
「App Store」より「Xcode」をインストールしていきます。
![スクリーンショット 2021-01-07 19.36.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/6621e955-46d7-7c7a-47b9-976eb911b66b.png)
![スクリーンショット 2021-01-07 19.35.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/c43a6cf5-2e4c-0f07-56ea-5129fd5cbda7.png)

これでバッチリです！！（たぶん）

### テストコードを作る
さて、実行環境ができたので
テストコードといえば、「Hello world」の実行ですね。
（「Hello world」と画面に表示するだけ）


「Create a new Xcode project」をクリックします。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/ecb89c53-6ec7-9174-5e9c-c9d0056e4587.png" width="500px">



次に「iOS」->「App」を選択し、「Next」をクリックします。
![スクリーンショット 2021-01-07 19.56.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/97db6591-b655-5c52-2197-21efa5a7eb6e.png)

次に以下を指定して「Next」をクリックします。
* Product Names
プロジェクトの名前。アプリ名の初期値にもなる。
* Team
Apple Developer Web サイトを利用できるユーザーや組織名。
（勉強用ということで適当でー）
* Organization Identifier
任意の値でOK。ただし、iOS アプリの配布を想定した名前。
（こちらも適当でー）
* Interface
「SwiftUI App」を指定する。
* Language
「Swift」を指定する。
![スクリーンショット 2021-01-07 19.44.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/aebd2672-d923-5562-d3b1-b35a0db11c47.png)

そのまま「Create」をクリックします。
![スクリーンショット 2021-01-07 19.44.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/504e4426-6a80-659f-ab76-d76ebb32960b.png)

そうすると。。。
プロジェクトが立ち上がるので、そのまま「▶️」をクリックします。
![スクリーンショット 2021-01-07 19.45.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/397237af-81da-3f42-295a-1b48ee38b5ef.png)

しばらく待っていると、シミュレーターの画面に「Hello, world!」が！
おぉーー！これでOK！！（きっと）
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009893/84d767d0-5681-f7fc-02c0-8d281ca1b346.png" width="300px">


次回は「Hello world」のソースについて
ふわっと理解で触れていきます。
ROSでDOBOT Magicianを動かす

#環境
ubuntu20.04
ROS noetic

#手順


##1 ROSのインストール

[ROS講座02 インストール](https://qiita.com/srs/items/e0e0a9dc3f94c2d3348e)

##2 dobotパッケージのインストール

- パッケージをインストール

```bash:インストール&ビルド
cd ~/catkin_ws/src
git clone https://github.com/wcaarls/dobot.git

#依存パッケージのインストール
sudo apt-get install libqt5serialport5*
```

- dobot_driverのCMakeLists.txtに```set(CMAKE_CXX_FLAGS "-fPIC")```を追加(dobot_apiをリンクする場合は必要みたい)

```cmake:dobot/dobot_driver/CMakeLists.txt

cmake_minimum_required(VERSION 2.8.3)
project(dobot_api)

set(CMAKE_CXX_FLAGS "-fPIC") #追加

find_package(catkin REQUIRED COMPONENTS
)

find_package(Qt5 REQUIRED COMPONENTS
  Core
  Network
  SerialPort
)

...

```
- ビルド

```
##noetic(ubuntu20.04)以外
sudo apt install python-catkin-tools
catkin build 

##noetic(ubuntu20.04の場合はこちら)
sudo apt install python3-osrf-pycommon python3-catkin-tools
catkin build 

```


##4 動作確認
- DobotMaicianの電源を入れ、PCとDobotMagicianをUSBケーブルで接続

- roscoreの立ち上げ

```bash:
roscore
```

- サーバの立ち上げ(/dev/ttyUSB0 はDobotMagicianのポート名に合わせる)

```console:
rosrun dobot_driver DobotServer /dev/ttyUSB0 
```

- 以下のコマンドでDobotMagicianがホーミングすればOK

```bash:
rosservice call /DobotServer/SetHOMECmd "{}"
```

##5 パッケージ構成
dobot_api:C++ dobot API ライブラリ
dobot_driver:dobot APIをROSのcmd_velやserviceに対応するためのラッパー
dobot_bringup:dobot_driverにcmd_velやserviceの司令を送り動作させるサンプルプログラム

##6 メモ
dobot_apiを直接使用して,自作のプログラムから純粋なC++のAPIからdobotを制御することもできます。その場合はdobot_driverのCMakeLists.txtとソースが参考になります
TypeScriptのenumを型変数として受けて制約を加えたい時の方法


# 結論
数値enumは `extends number`, 文字列enumは `extends string` すればよい

```.ts
function F2<Collection extends string | undefined>(item: Collection) {
    return item;
}
F2<Colors | undefined>(undefined);
F2<Colors | undefined>(Colors.Blue);
```

(TypeScript version: v4.1.3)

# 前提
TypeScript で enum 型を使うべきでなく union type を使うべきなのは承知しています。
参考: https://www.kabuku.co.jp/developers/good-bye-typescript-enum

それでもライブラリの兼ね合いなどでenumに依存せざるを得ないため、enumでの型の挙動を調べたメモになります。

enumの挙動についてはこちらの記事が相当詳しかったです。
https://2ality.com/2020/01/typescript-enums.html

# 実験

文字列enumと数値enumを用意します

```.ts
export enum Colors {
    Red = 'red',
    Green = 'green',
    Blue = 'blue',
}

export enum Numbers {
    One = 1,
    Two = 2,
}
```

とりあえず型変数で受けてみます

```.ts
function F1<Collection>(item: Collection) {
    return item;
}

// 数値enumでは strict check にならない
F1<Numbers>(Numbers.One); // ok
F1<Numbers>(1); // よくないことにok（なので数値enumは非常に使うべきでない）

// 文字列enum で strict check ができる
F1<Colors>(Colors.Red); // ok
F1<Colors>('blue'); // error
// Argument of type '"blue"' is not assignable to parameter of type 'Colors'.
```

本題。これに制約を加えます。
単純に undefined も指定できるようにしてみます。

```.ts
function F2<Collection extends string | undefined>(item: Collection) {
    return item;
}

F2<Colors>(Colors.Blue); // ok
F2<Colors>(undefined); // これは単に型変数の指定が間違っている
// Argument of type 'undefined' is not assignable to parameter of type 'Colors'.(2345)

F2<Colors | undefined>(undefined); // ok
F2<Colors | undefined>(Colors.Blue); // ok
F2<Colors | undefined>('blue'); // error
// Argument of type '"blue"' is not assignable to parameter of type 'Colors | undefined'.(2345)

// ↓2つはもちろんだめ
F2<Colors | undefined>(1); // error
F2<Numbers | undefined>(1); // error

```

というわけで `extends string` すれば文字列enumを受けることができるみたいです。

一応数値enumのほうも置いておきます。

```.ts
function F3<Collection extends number | undefined>(item: Collection) {
    return item;
}

F3<Numbers | undefined>(Numbers.One); // ok 
F3<Numbers | undefined>(undefined); // ok 
F3<Numbers | undefined>(1); // よくないことにこれも通る
F3<Numbers | undefined>('hoge'); // error
// Argument of type '"hoge"' is not assignable to parameter of type 'Numbers | undefined'.(2345)

```
gnuplot２次元コンター図

#gnuplotで２次元コンター図を描く方法

コンター図ならpm3dを用いればよい．とくに２次元図ならset pm3 mapを打つ．

```
set pm3d
set pm3d map
set ticslevel 0
set cbrange[0:100]
set palette define (0 "blue", 50 "white", 100 "red")
#set palette rgbformulae 22, 13, -31
#set palette define (20 "white", 100 "red")
set grid
set xtics  0.01
set ytics  0.01
set size ratio 1.0
set key left below

set cblabel "Temp [℃]"
set xlabel "x [M]"
set ylabel "y [M]"
#splot "result/result.txt" with pm3d ti " "
```
gnuplot連番ファイルを扱う

#gnuplot

以下の連番ファイルを順に開いてグラフを自動生成したい．
result_01_0.1.txt
result_01_0.2.txt
↓
result_05_0.9.txt
result_05_1.0.txt

for分とsprintfを使用すればよい．

```
do for [I=1:5]{
 do for [J:1:10]{
  FILENAME_IN=sprinf("./result_%02d_%2.1f.txt", I, J/10.0)
  FILENAME_OUT=sprinf("./result_%02d_%2.1f.png", I, J/10.0)
  plot FILENAME_IN 
  set term ongcairo size 100,100
  set output OUTFILENAME_OUT
}
}
```

####コメント
%02d で 01, 02, 03, ..., 10 となる
%2 なら 1, 2, 3, .., 10 となる
ワンラインでfor分は do,{}は不要である．
%10.2fなら全部で１０桁用意して小数点以下に2桁を配分．
J/10ではinteger自動的にintegerとして認識される．
文字列にタイトル，ファイル名などを入れておれけばスマート．

以下テンプレート

```

#!/user/bin/gnuplot
#3次元plot

set ticslevel 0

#set cbrange[20:120]
#set palette define (20 "blue", 60 "white", 120 "red")
#set palette define (0 "navy",1 "blue",2 "dark-violet",3 "red",4 "yellow")
set palette rgbformulae 22, 13, -31

#set palette define (20 "white", 100 "red")
#set grid
set xtics  0.01 font "Times,10" offset 0,-1,0
set ytics  0.01 font "Times,10" offset 1,0,0
set ztics  0.01 font "Times,10" offset 0,0,0
set size ratio 1.0
set key left below

set cblabel "{/Times-New-Roman=10 Temp [℃]}"
set xlabel "{/Times-New-Roman=10 X [M]" offset 0,-1,0
set ylabel "{/Times-New-Roman=10 Y [M]" offset 1,0,0
set zlabel "{/Times-New-Roman=10 Z [M]" offset 0,0,0
set view equal xyz
set cbtics 10 font "Times,10" offset 1,0,0
#set colorbox  user origin 0,0
set format cb "%.2f"

set arrow from 0.00,0.00,0.00 to 0.04,0.00,0.00 nohead lw 1 lc black front
set arrow from 0.00,0.04,0.00 to 0.04,0.04,0.00 nohead lw 1 lc black front
set arrow from 0.00,0.00,0.04 to 0.04,0.00,0.04 nohead lw 1 lc black front
set arrow from 0.00,0.04,0.04 to 0.04,0.04,0.04 nohead lw 1 lc black front

set arrow from 0.00,0.00,0.00 to 0.00,0.00,0.04 nohead lw 1 lc black front
set arrow from 0.04,0.00,0.00 to 0.04,0.00,0.04 nohead lw 1 lc black front
set arrow from 0.04,0.04,0.00 to 0.04,0.04,0.04 nohead lw 1 lc black front
set arrow from 0.00,0.04,0.00 to 0.00,0.04,0.04 nohead lw 1 lc black front

set arrow from 0.00,0.00,0.04 to 0.00,0.04,0.04 nohead lw 1 lc black front
set arrow from 0.04,0.00,0.04 to 0.04,0.04,0.04 nohead lw 1 lc black front
set arrow from 0.04,0.00,0.00 to 0.04,0.04,0.00 nohead lw 1 lc black front
set arrow from 0.00,0.00,0.00 to 0.00,0.04,0.00 nohead lw 1 lc black front


splot for [j=0:100:5] "result/result_05_0.020.txt" every ::: (j*201+0) :: (j*201+200) with pm3d not

do for [N_FIN=05:16]{
do for [H_FIN=20:38:2]{
FILENAME = sprintf("result/result_%02d_%4.3f.txt",N_FIN,H_FIN/1000.0)
OUTFILENAME1 =sprintf("img_png/result_%02d_%4.3f.png",N_FIN,H_FIN/1000.0)
OUTFILENAME2 =sprintf("img_emf/result_%02d_%4.3f.emf",N_FIN,H_FIN/1000.0)
TITLE    = sprintf("n_{fin} = %02d, h_{fin} = %4.3f",N_FIN,H_FIN/1000.0)
set title TITLE
splot for [j=0:100:5] FILENAME every ::: (j*201+0) :: (j*201+200) with pm3d not
set term pngcairo size 600,600
set output OUTFILENAME1
replot
#set term x11

set term emf enhanced
set output OUTFILENAME2
replot
set term x11

}}

```
以上
【Python】icrawlerで簡単に画像を集めよう！

機械学習の画像集めにicrawlerを利用したのでその紹介です。

# icrawlerとは
pythonでwebクローリングを行い、画像を集めるためのフレームワークです。
非常に短いコードを記述するだけで画像を集めることができます。
# インストール
pip

```
$ pip install icrawler
```
anaconda

```
$ conda install -c hellock icrawler
```
# 使い方
```
from icrawler.builtin import BingImageCrawler

crawler = BingImageCrawler(storage={"root_dir": './images'})
crawler.crawl(keyword='猫', max_num=100)
```
- `root_dir`に画像の保存先ディレクトリを指定します。
- `keyword`に集めたい画像のキーワードを指定します。
- `max_num`に集める画像の枚数を指定します。
- `BingImageCrawler`の部分を他のImageCrawlerに変えることもでき、GoogleやFlickerも利用できます。
    - 利用可能なもの → https://icrawler.readthedocs.io/en/latest/builtin.html

# Google利用時に`json.decoder.JSONDecodeError`が出る際の対処法
1. google.pyを見つけます。
 - 例(anaconda利用): `C:\Users\hoge\anaconda3\envs\env1\Lib\site-packages\icrawler\builtin\google.py`
 - pip でインストールしている場合はパッケージの場所を検索できるのでそこから辿ってください
    - https://qiita.com/t-fuku/items/83c721ed7107ffe5d8ff
2. google.pyの`parse`メソッドを下記に変更します。
 - `parse`メソッドは144行目あたりにあります。

```
def parse(self, response):
        soup = BeautifulSoup(
            response.content.decode('utf-8', 'ignore'), 'lxml')
        #image_divs = soup.find_all('script')
        image_divs = soup.find_all(name='script')
        for div in image_divs:
            #txt = div.text
            txt = str(div)
            #if not txt.startswith('AF_initDataCallback'):
            if 'AF_initDataCallback' not in txt:
                continue
            if 'ds:0' in txt or 'ds:1' not in txt:
                continue
            #txt = re.sub(r"^AF_initDataCallback\({.*key: 'ds:(\d)'.+data:function\(\){return (.+)}}\);?$",
            #             "\\2", txt, 0, re.DOTALL)
            #meta = json.loads(txt)
            #data = meta[31][0][12][2]
            #uris = [img[1][3][0] for img in data if img[0] == 1]
            
            uris = re.findall(r'http.*?\.(?:jpg|png|bmp)', txt)
            return [{'file_url': uri} for uri in uris]
```

# 参考
https://github.com/hellock/icrawler
https://github.com/hellock/icrawler/issues/65
オペレーティングシステムをWindows 10ににアップグレードするとファイルが削除されま

　この記事は、Windows 10へのアップグレードにより失われたファイルを復元するための可能な解決策を提供することで役立ちます。

　Microsoftが新しいオペレーティングシステムWin10をリリースすると、多くのコンピューターユーザーがWindows 7/8などのシステムをWindows 10にアップグレードします。 残念ながら、アップグレード後、一部のファイルが欠落していることがわかりました。 そのため、インターネット上で「Windows 10へのアップグレード後にファイルが削除されますか？」または「<a href="https://jp.bitwar.net/course/delete/2631.html">Windows 10へのアップグレード後にファイルが失われますか？</a>」と尋ねるユーザーが多くいます。


　何らかの理由でWindows 10にアップグレードするとファイルが失われることが確認されていませんが、ファイルが失われるケースはますます増えています。

　しかし、心配しないでください！ オペレーティングシステムのアップグレードによるファイル損失の問題も発生している場合、この記事では、Windowsのアップグレードにより失われたファイルを復元するためのいくつかの可能なソリューションを提供します。


オペレーティングシステムのアップグレードによるファイル損失の解決策


　Windows 10へのアップグレードにより失われたファイルを救出するのに役立つ多くの方法があります。 問題の解決に役立つことを期待して、いくつかの一般的なソリューションをリストしました。


解決策1：ユーザーフォルダーからのレスキュー


　Windows 10にアップグレードした後、ファイルが失われたか削除されたと思うかもしれません。ただし、ファイルは「ユーザー」フォルダーに配置される場合があります。不足しているファイルを内部で見つけることができます。


　ステップ1：Winロゴキー+ Xを同時に押して、[エクスプローラー]をクリックします。

　ステップ2：ローカルディスクCを選択し、[ユーザー]をクリックします。

　ステップ3：ここで、パブリックフォルダーを選択し、不足しているファイルを検索します。


<strong>解決策2：古いユーザーアカウントを確認して取得する</strong>


　多くの場合、ファイルまたはフォルダーはWindows 10で作成された新しいデフォルトアカウントに移動されます。ただし、古いアカウントは引き続きアクティブですが、デフォルトのアカウントとして設定されていません。この場合、以下の手順に従ってデータを復元してください。


　ステップ1：Winロゴキー+ Xをもう一度押して、[コンピューターの管理]をクリックします。

　ステップ2：ここから、[ローカルユーザーとグループ]を選択し、ユーザーフォルダーを開きます。 Administratorという名前のユーザーが古いWindows 7/8のユーザーである場合、アイコンがこのアイコンの上に下向きの矢印でマークされ、オプションが無効になっていることを示します。

　ステップ3：ここで、このアカウントを有効にするには、[管理者]オプションをダブルクリックして[コンテンツ]ページを開きます。

　ステップ4：その後、アカウント非アクティブ化オプションのチェックを外し、現在のアカウントからログアウトし、Windows 10で管理者としてログインします。


　このメソッドは、アカウントが無効にされたために隠されたファイルを取得できます。 Windows 10のアップグレードにより失われた以前のすべてのファイルとフォルダーを確認できます。

   詳しくは、「<a href="https://jp.bitwar.net/course/delete/2631.html">[Q＆A] オペレーティングシステムをWindows 10ににアップグレードするとファイルが削除されま</a>」をご参照ください。
2021年版 GitHub 誤ってリポジトリを削除して復元した方法



#はじめに
GitHubをあまり理解していなかったからこそやらかした投稿になります。
ポートフォリオを作成していた際、Github上からリポジトリを誤って全て消してしまいました。
同じような経験があればこの記事を是非、参考にしてください。

#解決方法は２つあります!
2つご紹介しますが早く復元した方を先に書きます。

#解決方法 1(レスポンスが一番早いです)
Githubのお問い合わせフォームに連絡する！！ただそれだけです！！
下記URLをクリックして下さい。

https://support.github.com/contact?tags=rr-restore


###必要事項を記入して下さい
下記のスクショを参考して下さい。
Subjectは`Request to restore the repository`で良いと思います。
![“スクリーンショット” 2021-01-07 18.56.16.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698439/c78ebb7e-9e64-851c-5a9f-3caaf9a45244.jpeg)

###How can we help?には何を書けばいいの?
英語で記入しなければならないので例文を参考にして下さい。

```
//Githubのニックネーム/リポジトリ名は自分用に変更して下さい!!

Hi, GitHub Team
I accidentally deleted a "Githubのニックネーム/リポジトリ名" repository. 
Can you resurrect it?
```

その後、しばらく待つとGitHub Developer Supportからメールが届きます。
こんな感じです。
![“スクリーンショット” 2021-01-07 19.04.45.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698439/bbba6a17-59fd-4eb3-7bf4-e563305e5c25.jpeg)

返信に大体10分ぐらいで返信が来ると思います。メールがきたらリポジトリを見て復元されているか確認をして下さい。
解決方法1の手順は以上になります!!

#解決方法 2 (復元に1時間ほどかかります)
###手順1
ユーザー設定下記のHPをクリックします
https://github.com/settings/profile 

###手順2
左メニューの Repositories をクリックします。
![“スクリーンショット” 2021-01-07 19.14.26.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698439/38128b43-9ae4-27ea-60fc-6f5b35a0da0e.jpeg)


###手順3
Deleted repositories タブをクリックします。
削除したリポジトリ一覧が表示されるので、復元したいリポジトリの Restore ボタンを押します。
![“スクリーンショット” 2021-01-07 19.15.31.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698439/988e3f4e-1d97-e425-1499-8239f1147b7b.jpeg)

###注意!!
操作は簡単で復元はできますが
`削除したリポジトリ一覧に表示されるまで、最大1時間くらいかかる場合があるそうです`
公式に書いてありました。精神的にタフな方はこちらの解決方法で良いかもしれません。


#最後に
今後、このような失敗を減らすためにGitHubを勉強しなければならないと思いUdemyで勉強中です・・・
危うくgithubクラッシャーになりかけました・・・