OmniAICreator/Qiita-1.07M huggingface dataset:
MAMPを起動できない問題の解決

# 今回のエラー
MAMPを使用するにあたり、起動ボタンを押すと以下のようなエラーが表示され起動できなかった。

```
Apache couldn't be started because port 80 is in use by some other software
```

そのまま訳すと、
ポート：８０は他のソフトウェアで使っているから、Apacheは起動できなかったよ
との事。

# 今回行った事
 - 使用中のポートの確認
 - 不要なポートの削除


これで解決した。


## 使用中のポートの確認
　ターミナルで実行


```
% lsof -i:80
```

すると以下のような表示がされた

```
COMMAND     PID         USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
Google      815   (ユーザー名)   48u  IPv6 0x4c3584c45df1bac1      0t0  TCP [~~(省略)].net:http (CLOSED)
Google      815   (ユーザー名)   59u  IPv6 0x4c3584c45df1c0e1      0t0  TCP [~~(省略)].net:http (CLOSED)
httpd     22728   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22729   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22730   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22731   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22732   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22733   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22744   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22751   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22755   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22756   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22757   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
httpd     22758   (ユーザー名)    4u  IPv6 0x4c3584c45df1b4a1      0t0  TCP *:http (LISTEN)
```

上記の```command : httpd``` の部分のNAMEが　*になっているのが怪しそう、
nameも``` * ```で曖昧だし,DEVICE部分全部同じだし、削除しても大丈夫やろ。
と思ったので

該当するPIDを

```
% kill 22728
```
※（22728部分はPID）
のようにして22728~22758までのプロセスを全部削除した。



以上を経て再度MAMPのUIで起動ボタンを押したら起動できるようになった。
URL HACK レポートのフィルタ

ユーザー名でフィルタをしたい時のやりかたを発見。

Nameは機能しないってあったけど、分ければ大丈夫なんですね。
ありがちです。

追加：Lightningではうごかない。

```
/00Oi0000005xrvZ?pv0={!$User.FirstName}+{!$User.LastName}

```


https://www.salesforceben.com/salesforce-reports-url-hack/


https://trailblazers.salesforce.com/answers?id=9064S000000DhGkQAK
Reactなどの開発を効率化する拡張機能を紹介 #VS Code



## 概要
Reactで開発する時何度もComponentを作りますよね。その度に同じコードを打つの大変ですよね？そんな時にオススメの拡張機能（VSCode）がこちら！
**【 ES7 React/Redux/GraphQL/React-Native/JS snippets 】**
下記に画像も載せておきます。

![スクリーンショット 2021-02-24 3.52.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/927983/107d8558-4d4e-e591-231f-cc3ace70fe42.png)

## 使用法
下記のように、index.jsxを作成し`rafce`と入力してEnterを押すと..

![ezgif.com-gif-maker (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/927983/1ddb3f4d-5200-8477-e491-286d1827b7a8.gif)

このように、アロー関数のStateless Functional Componentの雛形ができます！

## まとめ
対応している拡張子はjs,jsx,ts,tsxです。
ReactだけでなくRedux,GraphQL,React-Nativeで他にも様々なコマンドがあります。
詳しくは[公式のドキュメント](https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets)を見てみてください！
Object.keys(obj).reduceで新しいオブジェクトを作る


あるオブジェクトがある。

```
const fruits = {
 apple: '赤',
 orange: '橙',
 lemon: '黄'
}
```

このオブジェクトのキーを利用して新しいオブジェクトを作りたい時に`Object.keys(obj).reduce`を使用する。

```
const fruit2 = Object.keys(fruits).reduce((acc, key) => ({
 ...acc,
 [key]: '果物'
}), {})

// { apple: '果物', orange: '果物', lemon: '果物' }
```

reduce関数は第1引数に配列一つ一つに対して実行したい処理を、第2引数に初期値を設定する。
Alibaba Cloud イノベーションセンター : デジタル経済とデジタル社会の融合を加速

この記事では、アリババクラウドイノベーションセンターが、革新的な起業家のためにデジタル経済とデジタル社会の融合を加速させる計画について語っています。

アプサラカンファレンス2020のリプレイを[こちらのリンク](https://www.alibabacloud.com/apsara-conference-2020/live-streaming?spm=a2c65.11461447.0.0.79b5744eD33mO0)からご覧ください！

9月17日に開催された[Apsara Conference 2020](https://www.alibabacloud.com/apsara-conference-2020/?spm=a2c65.11461447.0.0.79b5744eD33mO0)では、アリババクラウドイノベーションセンターのゼネラルマネージャーであるLi Zhongyu氏が素晴らしいスピーチを行い、アリババクラウドのイノベーションとアントレプレナーシップの成果を共有しました。杭州、済南、重慶、合肥の会場では、アリババクラウドがどのようにデータインテリジェンスを活用して産業のデジタルトランスフォーメーションを推進しているのかをライブでシミュレートし、各都市で紹介しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/647921/0d2f8df4-ba02-25b0-77b0-a68711c0f87d.png)

李振奎氏は、「アリババクラウドイノベーションセンターの目標は、テクノロジーを基盤とした中小企業（SME）に好まれるイノベーションプラットフォームになることです。その事業には、Alibaba Cloud Accelerator、Innovation-Enabling Platform、Industry Innovation Centerが含まれます。アリババクラウドは、企業がアリババのエコシステムに密接に統合し、クラウドとデバイス起業家精神のための産業エコロジーを開発するのを支援しています。また、地方政府の政策と産業資源を組み合わせて、垂直イノベーションセンターの基盤を発展させます。

アリババクラウドはなぜイノベーションと起業家精神のインキュベーションを実施したいのでしょうか。李振奎氏は、こう述べています。「アリババは常にイノベーションと起業家精神の夢に向かって実践してきました。電子商取引からクラウドコンピューティングまで、アリババはビジネスとテクノロジーのインフラを構築し続けています。同時に、イノベーションに必要な生態資源、基本サービス、基礎技術を集約し、開放しています。そうすることで、中小企業の若い革新的な起業家が事業を始める際の問題が少なくなるでしょう。」

アリババクラウドは、イノベーションと起業家精神をインキュベートすることで、多くの成果を上げてきました。アリババは、中国のスタートアップとイノベーションのための実証センターの第一陣で唯一のインターネット企業です。現在、33の都市と地域に60以上のイノベーションセンター、4つの生態基地、3つの国家メーカースペースがあります。イノベーションを実現するプラットフォームであるアリババクラウドは61万社のスタートアップ企業にサービスを提供しており、毎年260以上のオンラインおよびオフライン活動を行っています。パンデミックの影響で、プラットフォーム上では186回のイノベーションと起業家精神のライブ放送と21回のクラウドロードショーが開催されました。

李振奎氏 「アリババクラウドは100社以上のスタートアップをインキュベートし、融資率は64％に達しました。AIスタートアップインキュベーターからは、参加者の企業評価が718億に達し、1,000社以上の業務提携が促進されました。」



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/647921/32444c5a-3cf4-72c1-bda3-a80ec9e0fcc1.png)

↑上の写真。アプサラカンファレンスでのライブ接続

また、カンファレンスでは、2020年浙江省オープンデータイノベーションコンテストの表彰式をレビューしました。会議では、ゲストは杭州の潜在的なユニコーンスタートアップ企業と話をし、重慶のアリババクラウドイノベーションセンターと合肥の支店会場と接続しました。

ビッグデータの時代、データ技術は社会統治モード、経済発展、人々の生活と幸福の核心要素となっています。データインテリジェンスは、個人の判断と経験主義に基づくあいまいなガバナンスから、洗練されたデータ駆動型のデジタルガバナンスへとデジタル経済を変革していくでしょう。より具体的には、データインテリジェンスもデータ要素や伝統産業と統合され、顕著な乗算効果を発揮するようになるでしょう。今後もアリババクラウドはデジタルインテリジェンスの架け橋となり、革新的な起業家のデジタル経済とデジタル社会の融合を加速させていきます。

*本ブログは英語版からの翻訳です。オリジナルは[こちら](https://www.alibabacloud.com/blog/alibaba-cloud-delivers-innovation-and-entrepreneurship-results-at-the-apsara-conference_596785)からご確認いただけます。一部機械翻訳を使用しております。翻訳の間違いがありましたら、ご指摘いただけると幸いです。*

*アリババクラウドは日本に２つのデータセンターを有し、世界で60を超えるアベラビリティーゾーンを有するアジア太平洋地域No.1(2019ガートナー)のクラウドインフラ事業者です。
アリババクラウドの詳細は、こちらからご覧ください。
[アリババクラウドジャパン公式ページ](https://www.alibabacloud.com/ja)*
【コピペ用】 useReducer 最小サンプル

```
import React, {
  FC,
  Reducer,
  useReducer,
} from 'react'

interface State {
  hi: string
}

type Action = { type: 'hi', name: string } | { type: 'foo' }

const reducer: Reducer<State, Action> = (state, action) => {
  switch (action.type) {
    case 'hi':
      return { ...state, hi: action.name }
    case 'foo':
      return { ...state, hi: 'nishi' }
    default:
      throw new Error('Impl err')
  }
}

const initialState: State = {
  hi: 'nishi'
}

const App: FC = () => {
  const [state, dispatch] = useReducer(reducer, initialState)

  return (
    <button onClick={() => dispatch({type: 'foo'})}>{state.hi}</button>
  )
}
```
2021年版 Windows10にMySQL Workbenchをインストールする(手こずった話もあるよ)

# はじめに
こんにちは。GitHubで職務経歴書を管理して、WantedlyとかにURL貼り付けといたら、すごい細部まで読んでいただいてスカウトを送ってくださった方がいて、朝からうれしい気持ちでいっぱいです:smile: 筆者です。

さて、先日仕事用のPCが不調でして、新しいPCを用意していただいたので、現行のPCの設定やアプリケーション等の移行を行っているのですが、その際に**MySQL Workbench**のインストールしたのでその手順を記そうと思います。

また、ちょっと手こずったの点もありますのでそちらにも触れていこうと思います。

# 手順
## 1. インストーラーをダウンロードする
以下からどうぞ。きっとアクセスしたときの最新版のダウンロードリンクがあります。
https://dev.mysql.com/downloads/workbench/

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/e160d278-8c0a-baf0-0c9a-e7d744b91541.png)

## 2 インストーラー起動する
**<font color="red">ここでなんか言われた:thinking:</font>**
![1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/c6bf7d3d-12c5-50b5-434c-cb08d1235836.png)

## 3. 足りないって言ってる`Visual C++ Redistributable for Visual Studio 2019`をダウンロードする

1. もう一度ダウンロードページを開いて以下ボタンを押下する
![MySQL-Download-MySQL-Workbench.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/d88ceb32-5be5-059b-f2f1-5a81ba2dab11.png)


2. `Visual C++ Redistributable for Visual Studio 2019`をダウンロードする
    => 日本語版あるのでそちらがおすすめです:smile:
![MySQL-Download-MySQL-Workbench (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/2e297cd0-adea-bf6b-d9a6-636b8262cc8a.png)

## 4. `Visual C++ Redistributable for Visual Studio 2019`をインストールする

## 5. 再度MySQLのインストーラーを起動する
これでおわりです:relaxed:

# 続編
今回は旧PCから新PCに接続情報の移行もしたのでそれも記そうと思います。

## 1. 旧PCで接続情報をExportする
以下ボタン押下でzipファイルでExportされます。
![q.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/c4449108-3cfd-f261-3a80-e6c14a28dbcf.png)

## 2. 新PCで接続情報をImportする
先ほどExportしたzipファイルをImportします。
![q.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/b3e6d0f9-613f-3bbd-6075-a88f9369233f.png)

**<font color="red">ここでなんか言われた:thinking:</font>**
![q.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/a01a21cf-6166-3397-0c90-2f4235f67c0c.png)

## 3. なんかバグっているみたいなので、旧PCで動いていたバージョンまでダウングレードする
**8.0.23** => **8.0.16** までダウングレードしました。

ダウングレードはの仕方は、一度MySQL Workbenchをアンインストールした後、再度ダウンロードページを開いて、以下タブをクリックし、ご所望のバージョンを指定して、再度インストーラーをダウンロードして、インストールを行います。

![MySQL-Download-MySQL-Workbench (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/86984/a65287a2-a132-3668-6ce2-c0597ff5f8c3.png)

# おわりに
無事にすべての接続情報を移行できました！
ただ、今までと同じようにDBに接続するためには、同一場所に秘密鍵を置いたりしないとなので、一つずつ見ないといけないのはあります:sob:

それでは！
PHPで順列を求める

```php
$x = $argv[1];
echo "x:$x\n";
$n = strlen($x);
$arr = array();
for ($i=0;$i<$n;$i++) {
    array_push($arr, substr($x, $i, 1));
}
$rets = array();
function ppp($i, $arr, $s="")
{
    global $rets;
    if (count($arr) == 1) {
        array_push($rets, $s.$arr[0]);
    } else {
        $s .= $arr[$i];
        array_splice($arr, $i, 1);
        for ($j=0;$j<count($arr);$j++) {
            ppp($j, $arr, $s);
        }
    }
}

for ($i=0;$i<count($arr);$i++) {
    ppp($i, $arr)."\n";
}
var_dump(array_unique($rets));
```
Python(AzureML)からAKSを構築する～初心者がKubernetesでアプリをデプロイするまで2 ～

#目的
[前回](https://qiita.com/eisai-bs/items/bdeeb26be766ffbdee24)
まずは、開発とデプロイの環境を整えましょう。

###kubernetesについて
Kubernetesを使えるサービスは以下の通りですね。
Azure：AKS
AWS：EKS
Google Cloud：GKE

筆者はAzureを使っているので、AKSをベースに記載していきます。
Kubernetes(以降、K8S)の開発に入れば、どれを使おうともほぼ変わらないと思います。


##AKSの構築
Azure Portalからも作るのが一般的ですが、Azure CLIやPythonのライブラリazureml.core.computeからも作れます。

- [クイック スタート:Azure CLI を使用して Azure Kubernetes Service クラスターをデプロイする](https://docs.microsoft.com/ja-jp/azure/aks/kubernetes-walkthrough)
- [Azure Kubernetes Service クラスターを作成してアタッチする](https://docs.microsoft.com/ja-jp/azure/machine-learning/how-to-create-attach-kubernetes?tabs=python)

今回は、色々な事情からAzureMLのpythonライブラリを使用したいと思います。
[前回](https://qiita.com/eisai-bs/items/bdeeb26be766ffbdee24)作成したAzure VM環境から以下のPythonコマンドでAKSを作成します。
注）成功した時点から課金が始まります。

```python:create_aks.py
from azureml.core.compute import AksCompute, ComputeTarget

prov_config = AksCompute.provisioning_configuration(
  agent_count=3,
  vm_size='Standard_D4a_v4',
  location='japaneast'  
)

aks_name = 'myaks'
aks_target = ComputeTarget.create(
  workspace = ws,
  name = aks_name,
  provisioning_configuration = prov_config
)

aks_target.wait_for_completion(show_output = True)
```

なるべく安く、しかも画像を扱う深層学習を扱いたいので、メモリのVMはStandard_D4a_v4を使用しました。
Standard_D4a_v4のスペック

| vCPU | RAM | 一時ストレージ |
|:-----------|------------|------------:|
| 4       | 16GiB        | 100GiB |

また、K8Sの機能を発揮するためにノードは3としています。
この構成で、2021年1月現在で無停止で月々5万円強のコストとなります。
なので、使わないときは停止しておきましょう。

7～8分程度で、AKSが作成されます。
AKSが作成されると、AKSようのリソースグループが新たに作成されます。

![aks_azure_portal.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/761310/ebfb55de-ea7d-46fc-27aa-0609ad124901.png)

作成されたリソースグループに、指定したノード分の仮想マシンと仮想ディスク、ネットワークインターフェースのリソースが作成されていることが分かります。
※この図には、のちに作成するウェブアプリのためのリソースも含まれています。

###クラスタへの接続
Azure CLIが使用できるコマンドラインから、以下のコマンドでAKSクラスタに接続します。

```shell:
az aks get-credentials --resource-group myResourceGroup --name myAKSCluster
```

myResourceGroupはAKS作成時に生成されたリソースグループではなく、AKSを管理するリソースグループを指定します。
このコマンドを使用することで、AKSへのアクセス情報を記載した設定ファイルが、~/.kube/configに作成されます。
したがって、以降は、AKSを新たに作らない限り、このコマンドの実行は不要です。

試しにkubectl get nodeコマンドで、生成されたノードを確認してみましょう。

```sh
kubectl get node
NAME                       STATUS   ROLES   AGE    VERSION
aks-agentpool-12345678-0   Ready    agent   14m45s   v1.17.9
aks-agentpool-12345678-1   Ready    agent   14m45s   v1.17.9
aks-agentpool-12345678-2   Ready    agent   14m45s   v1.17.9
```
ノードが3つ生成されていることが分かります。
ノードの数は後から自由に変更可能です。
0にすることもできますが、復旧が困難となるため、やめましょう。
kubectlは、かなり権限の広いコマンドで以下のようにすべてのノード、コンテナを削除することも可能ですが、環境破壊者なので、使わないように注意しましょう。

```sh
# 使っちゃだめ
kubectl delete node --all
kubectl delete pods --all
kubectl delete services --all
```

(続く)
ユーザーに割り当てられた権限セットを見つけるためのクエリ


```
SELECT Id、PermissionSetId、PermissionSet.Name、PermissionSet.ProfileId、PermissionSet.Profile.Name、AssigneeId、Assignee.Name FROM PermissionSetAssignment WHERE PermissionSet.Name = 'Custom PermissionSet Name'
```

https://help.salesforce.com/articleView?id=000319607&type=1&mode=1
MySQLで複数レコードのUPDATEを行う【作成中】

[複数行同時にUPDATEしてみる](http://katzplus.com/centos-6/mysql/%E8%A4%87%E6%95%B0%E8%A1%8C%E5%90%8C%E6%99%82%E3%81%ABupdate%E3%81%97%E3%81%A6%E3%81%BF%E3%82%8B/)
クライアントサーバーモデルについて　〜初心者向け〜

# はじめに

初学者（自分も含めて）の方にとって、**『ウェブサービスがどのように動いているのか』**理解する事はコーディングしていく上でも、また、就職活動を行う上でも改めて大事になってくると考えたのでこの記事を書きました。

知識量は人それぞれだと思うのでなるべく用語解説を加えながら説明していきます

分かりづらいところがあったらコメントいただければ、ASAPで修正します。haha


#クライアントサーバーモデルとは

端的に表すと、次の一文で説明できます。

**”クライアントとサーバでそれぞれ機能を分け、それらをコンピュータネットワークで繋いだモデルである”**


　　　　　　　　　　　　　　　　↓図で表すとこんな感じ↓
![クライアントサーバーモデル.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/928468/b9af3d7e-20bd-5e37-2e77-2c2de8a5243b.png)



あんま、ピントこないので、それぞれ説明していきます！

まず、`クライアント`とはウェブブラウザ、または、デスクトップアプリケーションを指しています。つまり、自分たちが、PC上で動かしているものだと考えた方がわかりやすいですね。

次に`サーバー`とは、ファイルの保管・情報の読み取り、処理・情報の取り出しなど、簡単に言うとデータを保管している役割を果たしています。

また、サーバーにはいくつか種類があって、大きく`①物理サーバー`、`②仮想サーバー`の2種類に分けられます。（次の文は興味があれば見てください）

`①物理サーバー`は、いわゆるオンプレミスなど、自分でサーバーを買ってそのサーバーを共有または、専用で使用する方法を指します。
ただ、サーバーは高額なので、少し利用したいと言うニーズには向かない特徴がありますね。

`②仮想サーバー`は1台の物理サーバー上で複数台のOSを動かすことで、複数ある仕様で稼働させる仕組みのことです。物理的にはないけど、OSを仮想的に利用しているイメージですかね。これは、AWSを利用するケースが多いです。（後日、記事書きます！）

#処理の流れ

ブラウザ上から、ボタンをクリックするなど何らかのアクションをすると、ブラウザから`リクエスト（要求）`と言うものがサーバーに送られます。

それを受けたサーバーは、リクエストに応じた、画像なり情報なりをブラウザ上に`レスポンス（応答）`として返して、みんながクリックした画像を見れるようになるわけです。

もう一回、画像で流れを把握。。。

![クライアントサーバーモデル.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/928468/b9af3d7e-20bd-5e37-2e77-2c2de8a5243b.png)


と、こんな感じで、裏では処理が行われています！


簡単にですけど、説明していきました。またなんかあればコントください！！お疲れ様でした！
tmuxの最小限のコマンド

## tmuxの最小限のコマンドはこれ

まずは以下の5つの操作で9割をしめる。

```bash
$ tmux ls # セッション一覧を表示
$ tmux new -s セッション名 # 新しいセッションをつくる
$ tmux a -t セッション名 #　すでに存在するセッションにアタッチする
```

セッションに接続しているときに使うコマンド

|コマンド | 機能 |
|--------|------|
|ctl-b d| デタッチ |
|ctl-b [ | スクロールができるモード。 q で終了|

スクロールだけはめちゃくちゃ癖があるのはしかたない。

セッションを殺すとかのコマンドもあるけど、セッションにアタッチしてからexitコマンドでセッションそのものがなくなるからほとんど使わない。
JavaScriptについて

本日は、プログラミング言語のJavaScriptについて
簡単に説明させていただきます。

### JavaScriptとは
プログラミング言語の1つで、クライアントサイドにおいて力を発揮する言語です。
「ブラウザ上でのアプリケーションの使いやすさ」や「リクエストの送り方の工夫」
をJavaScriptは担っています。
つまり、見た目を良くしたり、使いやすくする事ができます。

### 役割
JavaScriptとはブラウザ上で実行される言語です。
以下の事ができるようになります。

1.ページ遷移なしで、画面の表示を切り替えることができる
JavaScriptを使うと、ページ遷移の度に通信時間が発生せずに使え
ユーザーのストレスが軽減される。

2.画面を更新をせずに、サーバーと通信できる
これは、非同期通信というやつです。
非同期通信とはブラウザが再読み込みされることなく、
ブラウザの一部分のみが更新される通信方法のことです。
例えば、LINEのメッセージなんかは再度読み込みせずに
メッセージが送られているので、非同期通信で送られていますね。

JavaScriptを使用すると、使いやすく見た目も良くなる
アプリケーションが作れるようになりました。
きっといろんな事ができると思うので深堀すると面白そうですね。
複数モデルを使うdeviseのauthenticateについて

#WHY
オリアプで複数のモデルを作成したときコントローラーのbefore_action :authenticateですこし詰まったとこがあるので

-----
##やりたいこと

コントローラー内

```ruby
class ShopItemsController < ApplicationController
  before_action :authenticate_user!,only: [:search]
  before_action :authenticate_shop!,only: [:new,:create]

  def search
  end

  def new
    @shop_item = ShopItem.new
  end

  def create
    @shop_item = ShopItem.create(shop_item_params)
  end

  def show
    @shop_items = SearchItemService.make_items(@shop.shop_items)
  end

#〜省略〜
```

deviseで「shop」と「user」という二つのモデルを作成した。
ShopItemsコントローラーを作成し、これらのアクションのうち、showアクションに至っては、<b>「user、もしくはshopどちらかがログインしていれば行える」</b>といった処理にしたい

##問題
仮に

```ruby
  before_action :authenticate_user!,only: [:show]
  before_action :authenticate_shop!,only: [:show]
```
とした場合、userのログイン状態のときは「:authenticate_shop!」が、
shopログイン時は「:authenticate_user!」が起きてしまう。

「:authenticate_user_shop!」と言う書き方ができるという記事を見つけたが、自分の場合はどうもエラーがおきてしまう。

##解決
自分でauthenticateメソッドを作る
やりたいことをもう一度確認してみると、
<b>「user、もしくはshopどちらかがログインしていれば行える」

どうやらif文を使えばいけそうな気がする。
ということでアプリケーションコントローラーにメソッドを定義していく。

application_controller

```ruby
def authenticate_any!
  if shop_signed_in?
      true
  else
      authenticate_user!
  end
end
```
##解説

```ruby
if shop_signed_in?
      true
```
showアクションを行う際にまずはshopがログインしているかを行う
ログインしていればshowアクションを使うことができるためtrueを返す。

```ruby
else
   authenticate_user!
end
```

shopでログインしていなかった場合、「authenticate_user!」を行う。
これでuserでもログインしていなければログインページへ遷移させることができる。

最後にShopItemsコントローラーに記述する

```ruby
before_action :authenticate_any!,only: [:show]
```

------
二つのモデルを作成する場合いろいろな問題出てきてしまいますが、今となってはいろんなことを知ることができるのでよかったとおもってます。今回参考にした記事です
https://laptrinhx.com/rails-devise-fu-shumoderuwo-guan-lisuru-jino-before-action-25820567/
比率の検定についてのあれこれ

比率の検定をするにあたり、ちょっと色々と調べた。

比率の検定って色々ある。
とりあえずデータはこんな感じで観測点数がそれぞれ入ってる。

|--|Yes|No|
|:-:|:-:|:-:|
|群1|L1|L2|
|群2|U1|U2|

具体的な数字としては、L1、L2、U1、U2はそれぞれ、22, 26, 11, 40。

- [ピアソンのカイ二乗検定](https://ja.wikipedia.org/wiki/%E3%82%AB%E3%82%A4%E4%BA%8C%E4%B9%97%E6%A4%9C%E5%AE%9A)
- [イェイツのカイ二乗検定] (https://ja.wikipedia.org/wiki/%E3%82%A4%E3%82%A7%E3%82%A4%E3%83%84%E3%81%AE%E3%82%AB%E3%82%A4%E4%BA%8C%E4%B9%97%E6%A4%9C%E5%AE%9A)
- [フィッシャーの正確確率検定](https://ja.wikipedia.org/wiki/%E3%83%95%E3%82%A3%E3%83%83%E3%82%B7%E3%83%A3%E3%83%BC%E3%81%AE%E6%AD%A3%E7%A2%BA%E7%A2%BA%E7%8E%87%E6%A4%9C%E5%AE%9A)
- ダミー変数を割り当てて、平均値の差の検定

基本的にはフィッシャーの正確確率検定が良いようだ。

他の参考資料としてはhttps://biolab.sakura.ne.jp/proportion-test.html


# ピアソンのカイ2乗検定
```r
chisq.test(matrix(c(L1,L2,U1,U2),nco=2,byrow = T))
```
結果

```r
	Pearson's Chi-squared test with Yates' continuity correction

data:  matrix(c(L1, L2, U1, U2), nco = 2, byrow = T)
X-squared = 5.5051, df = 1, p-value = 0.01896
```

# イェイツのカイ二乗検定
### 補正ありの場合
```r
prop.test(c(L2,U2),c(L1+L2,U1+U2),correct =T)
```
結果

```r
	2-sample test for equality of proportions with continuity correction

data:  c(L2, U2) out of c(L1 + L2, U1 + U2)
X-squared = 5.5051, df = 1, p-value = 0.01896
alternative hypothesis: two.sided
95 percent confidence interval:
 -0.4434519 -0.0418422
sample estimates:
   prop 1    prop 2 
0.5416667 0.7843137 
```
### 補正なしの場合
```r
prop.test(c(L2,U2),c(L1+L2,U1+U2),correct = F)
```
結果

```r
	2-sample test for equality of proportions without continuity correction

data:  c(L2, U2) out of c(L1 + L2, U1 + U2)
X-squared = 6.5515, df = 1, p-value = 0.01048
alternative hypothesis: two.sided
95 percent confidence interval:
 -0.42323133 -0.06206279
sample estimates:
   prop 1    prop 2 
0.5416667 0.7843137 
```
# フィッシャーの正確確率検定
```r
fisher.test(matrix(c(L1,L2,U1,U2),ncol=2,byrow = T))
```
結果

```r
	Fisher's Exact Test for Count Data

data:  matrix(c(L1, L2, U1, U2), ncol = 2, byrow = T)
p-value = 0.01828
alternative hypothesis: true odds ratio is not equal to 1
95 percent confidence interval:
 1.182808 8.209687
sample estimates:
odds ratio 
  3.040688 
```

# ダミー変数を割り当ててt検定（ウェルチの検定）
Ansは各観測について、Noに1を、Yesに2を割り振ったもの。Classは群。
以下のようなデータ構造を想定。

|Sample|Class|Ans|
|:--:|:--:|:--:|
1|L|1
2|L|2
3|U|2
4|U|1
5|U|2
:|:|:


```r
t.test(this.data$Ans~this.data$class)
```

```
	Welch Two Sample t-test

data:  this.data[[Q2.list[i]]] by this.data$class
t = -2.6066, df = 91.286, p-value = 0.01068
alternative hypothesis: true difference in means is not equal to 0
95 percent confidence interval:
 -0.42754871 -0.05774541
sample estimates:
mean in group Lower mean in group Upper 
           1.541667            1.784314 
```
Apache 概要3 セキュリティ対策

1■ゼロデイ攻撃対策
-
背景：
Apacheの最新バージョンやセキュリティパッチ？が配布された際に、即座に対応することは難しい。
すると、脆弱性をついたゼロデイ攻撃を仕掛けられてしまうことがある。
そういったリスクに備えサーバのバージョン情報を隠蔽することはとても大切。

対策1：公開されるサーバ情報を隠蔽するには下記コマンドでどこまで情報を公開するか設定を行う
ServerTokens Productonly
上記のコマンドではProductonlyを引数とすることで公開される情報をapacheという名前だけに絞っている。
対策2:エラーメッセージのフッタに出てくる情報も隠蔽する
ServerSignature off

対策3:apacheだとばれない為にApache特有のURLにおけるスラッシュ対策を行う
AllowEncodedSlashes On

対策4:.htaccessを無効にする
.htaccessでは、ユーザによるapacheの操作が可能になってしまうので無効にする
<"Directory /">
    AllowOverride None←.htaccessによる設定の上書き禁止
<"/Directory">
対策5:ユーザホームの公開を限定する(ログイン管理とかに使われるのかな？)
コンテンツの公開を禁止するユーザの特定
<IfmModule mod_usedir.c>
    UserDir Public_html
</Ifmodule>

その他：ドキュメントルートの変更や画像リンクの直利用を禁止など

2■HTTPSの実装
-
①mod_sslのインストール
HTTPSを利用する場合は、mod_sslモジュールをインストールする必要がある。
②公開キー/秘密キー/サーバ証明書の用意
【重要！暗号化通信を行うだけなら、CAにサーバ証明書を発行してもらう必要はない！】
mod_sslには公開キーや秘密キー、サーバ証明書のファイルが用意されているらしい。
opensslコマンドで作成していく。
③apacheの設定の修正
「#Include conf/extra/httpd-ssl.conf」
↓
「Include conf/extra/httpd-ssl.conf」
*シャープを外している
④サイトへアクセス
*自己署名で作成した場合はエラーになる
証明書を信頼する設定にすればアクセスできるのか？？
CAでの発行についても今度調べる
3■サービス妨害攻撃対策
-
エックスサーバー(XServer)で SSH接続し、PHP のバージョン切替えと WP-CLI のインストールをするまでの手順

SSH接続は設定済みで、エックスサーバーにシェルログインできる状態からの手順

## ログイン

* パスフレーズ(鍵作成の際設定したやつ)をキーチェーンに保存  
  `ssh-add -K ~/.ssh/秘密鍵_rsa`  
  (これをしないと毎回入力が必要)
* ログイン時にいる場所：/home/サーバーID (=ホームディレクトリ)
* PHPのバージョンをチェック `php -v` → "PHP 5.4.16 (cli)"  
  ※ "Webサイトごとに設定しているPHP" と "SSHでログインするサーバーで利用するPHP" は異なる  


## PHPを最新版に切替え

* `find /opt/php-*/bin -type f -name 'php'`で、使用可能なPHPのバージョン一覧をチェック
* ホームディレクトリにいる状態で、`mkdir bin`
* エイリアスを貼る `ln -s /opt/php-7.4/bin/php bin/php` (最新版を設定、7.4 だと、7.4.x の最新版？)
* `cp ~/.bashrc ~/.bashrc.bk_2021-03-10` バックアップ
* `vi ~/.bashrc` で編集。i で編集モードに。
  "# User specific aliases and functions" の後に "export PATH=$HOME/bin:$PATH" の行を追記
  escキー、`:wq` で保存
* `source ~/.bashrc` 変更内容を反映
* `php -v` PHP 7.4.13 (cli) となっていたらOK


参考：[XSERVER（エックスサーバー）のSSHでPHPのバージョンを7に変更する方法 | Minory](https://minory.org/xserver-ssh-php7.html)



## WP-CLI のインストール

ホームディレクトリ下のbin の中に WP-CLI をインストール

* `cd bin`
* `curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar` wp-cli インストール
* `chmod +x wp-cli.phar` 実行権限付与
* `echo 'alias wp="~/bin/wp-cli.phar"' >> ~/.bashrc` wp コマンドが使えるように wp にエイリアス
* `source ~/.bashrc` 変更内容を反映
* `wp --info` で wp-cli の情報を確認できたらOK
* (wp-completions.bash (wp-cli 入力補完) のインストール) ※自分はdashで十分なので使わない

参考：[エックスサーバーにWP-CLIをインストール - Qiita](https://qiita.com/kurudrive/items/17d39404baf8cb6e162e)


[» wp-cli コマンド一覧](https://qiita.com/oreo3@github/items/3fafed000c15545ac34b)
はじめてのアダプティブカードデザイナー

# はじめに
Teamsに投稿するリッチなメッセージ、アダプティブカードを作成する場合、
JSON形式ですし、作成しているときに「今どんな感じなんだろう。。。」と心配になります。
そんなとき、[アダプティブカードデザイナー](https://www.adaptivecards.io/designer/)を使用すると簡単にアダプティブカードを作れます。

# 使い方
## とりあえずURLにアクセスする
これがURLをたたいた時の初期表示でした。ごちゃってしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/c3bf661c-2fd3-ebda-05c6-240ec1c38624.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/16dece81-7091-cbfc-90bc-f508af0c44c2.png)

・黄色：配置できるエレメント
・オレンジ：アダプティブカードのデザイナー
・黄緑：作ったアダプティブカードのソース
・水色：カードに配置しているエレメント。選ぶと右にプロパティが表示される。
・ピンク：アダプティブカードに渡すサンプルデータ。

## 新しいアダプティブカードを作成する
### 左上の「New Card」を選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/f5bc3cbe-8258-1642-cf64-49ca2dfa0771.png)
### テンプレートを選択
今回は1から作ってみたいので中央の「Blank card」を選択します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/bf7bdfa7-9721-dcf4-a62e-9626b61b64c6.png)
### アプリを選択する
今回はTeamsに投稿するので、Microsoft Teams - Lightを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/0c09baa8-3164-2c6b-b588-75c08c0949c7.png)
こんな画面になりました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/0d27fbb7-28ef-c911-2134-896333e4acd9.png)
### エレメントを配置する
画面左側のエレメントを選んで、配置していく
テキストと画像を配置した例
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/db8e0fb3-f8f7-b5f3-4075-811dc8f8c0be.png)
### エレメントのプロパティを設定する
お祝いカードを作っていきます。
#### TextBlock
TextBlockを選択すると、プロパティがTextBlockのプロパティになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/ab01918d-eced-8a72-d4f9-64b55b451969.png)
文字の色やサイズなど変更できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/7b106d34-7936-684f-f47a-392539542f89.png)
#### Image
設定したい画像のURLをURLプロパティに設定します
この画像はMicrosoftの公式にもリンクがありました[GIPHY](https://giphy.com/)から取得しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/d70bf389-15a5-3319-6c67-f053816968e7.png)
### できあがり！
CARD PAYLOAD EDITORの部分のソースをコピーして、
Power Automateにコピペしてください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/895455/84318136-8841-75e3-25be-7c37c5682919.png)

ちなみに今回作ったカードのソースは以下の通りです。

```json
{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.2",
    "body": [
        {
            "type": "TextBlock",
            "text": "HAPPY BIRTHDAY！！",
            "wrap": true,
            "color": "Accent",
            "weight": "Bolder",
            "size": "ExtraLarge",
            "fontType": "Monospace",
            "horizontalAlignment": "Center"
        },
        {
            "type": "Image",
            "url": "https://media.giphy.com/media/L1bPUAMXIqXpPoWk9R/giphy.gif"
        }
    ]
}
```

# おわりに
次はVisual Studio Codeのプラグインも試してみたいです
mGear3.7.8がリリースされたのでMacにインストールしてみた。【備忘録】

mGearっていうMayaのプラグインがリリース。

なおかつ、それのセミナーが開催されるとのことなので、事前学習も兼ねて、最新版をインストールしてみました。

ちなみにセミナーはこちらです。
[ダイキンCGセミナー Vol.15ゲーム開発者視点による、Rig制作ツールmGearの機能紹介～基礎編～](https://www.comtec.daikin.co.jp/DC/event/202103-rig-mgear-sem.html?utm_source=Dkclick&utm_medium=Dkmail&utm_campaign=202103-rig-mgear-ondemand&__CAMVID=eGPoCcFifHEghh&_c_d=1&uns_flg=0&__urlmid=5353409&__CAMSID=FPoCCFIfHeghH-00&__CAMCID=dAyrpIPpAG-593&adtype=mail)


[mGearのダウンロードはこちら](https://github.com/mgear-dev/mgear_dist/releases)
![スクリーンショット 2021-03-10 9.31.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/136274/229780ab-f658-94ad-2d0b-b6cc694590fb.png)

下の方にある `mGear3.7.8.zip` をダウンロードします。

保存場所はどこでもOKです。


##MacでMayaのドキュメントフォルダを探す

mGearのインストールはMayaの環境変数ってのを書き換える必要があるので、まずはそれが書かれたファイル、 `maya.env` の場所を探します。

で、私はMac初心者なので、「MacでMayaのドキュメントってどこにあるんや？」

って部分から調べました。

[【Mac版】MAYAにスクリプトを追加する方法 | ナツヲカケル−兼業クリエイター雑記−](https://summering26.com/maya-mac-adding-scripts/)

この記事を参考にして、Macにおける、Mayaのドキュメントフォルダを探してみます。

どうやら、 `Finder>移動>ライブラリー>Preference`の中にあるらしいですね。

ちなみに`『移動』`ってのは、左上のアイコンです。
※画像参照
![スクリーンショット 2021-07-17 9.48.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/136274/894b08a3-0211-9de3-5656-1e80f620469f.png)
MACに慣れてないと、この画面外にメニューがあるってやつ、、、
忘れるんですよね〜

```bash
Finder>移動>ライブラリー(optionキーを押してる間だけ出てくる)>Preference>Autodesk>maya>バージョン名(私の場合は2020)>Maya.env
```

この`Maya.env`の中身を変更していきます。

https://youtu.be/sOkAEen_IuQ

中身をどう変更するのかは、公式動画を参考にしてます。
どうやら、mGearがおいてあるパスを指定するだけのようです。

##maya.envファイルを変更
早速`Maya.env`ファイルを変更していきます。

```bash
MAYA_MODULE_PATH=/Users/work/maya/mgear_3.7.8
```

このように記述して保存。
Mayaを開き直します。

？？
mGear、出てきません。

あれか、スラッシュ(`/`)がバックスラッシュになってないからかな？
って思い、`¥`に変更して再挑戦。

```bash
MAYA_MODULE_PATH=¥Users¥work¥maya¥mgear_3.7.8
```
これでも無理でした。
さらに調査。

WindowsとMacでは違うんかな？って思い、
「Mac mGear」で検索。
下記の動画が見つかりました。

https://youtu.be/ifuTtJaxxDM

動画いわく、`mgear_3.7.8/release` までパスを指定しないとダメっぽいです。
参考通りにやってみます。

```bash
MAYA_MODULE_PATH=/Users/work/maya/mgear_3.7.8/release
```

すると、メニューに `mGear` の項目が追加されました！

感動！
![スクリーンショット 2021-03-10 9.12.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/136274/6ce6416e-3cdd-aa59-0572-71ff8669a184.png)


これで `mGear` を使った、モジュラーリギングの研究ができますね。
インストールで詰む人多そう...
何かのお役に立てれば幸いです。
## 所感
そういや以前にmGear3.6をWindowsPCに入れた際、同じようなことがあったような気が、、、。

これは公式さん、どこかしらに追記しててほしいですよね...
いや、もしかしたらどこかに書いてあるんかな？
私が見落としてるだけ？

まぁその可能性も大いにあるので、そうだったらスイマセン。

もっと環境変数とか、モジュールシステムってやつを理解しないとアカンな。
作る側の意図が解ればこちらも対応できる。
次はその辺を調査しましょうかね。

2021/03/11追記

https://youtu.be/Wf-JCkBVqKM

すいません。

どうやらmGear3.7.8以降はドラッグ＆ドロップでインストール可能らしいですね。
以前よりかなり簡単に導入出来るようになってました。
vi ファイルの最下部に移動して行を追加してinsertモードに変更する

# 目的

- viでファイルを編集するときに矢印キーで最下層に移動しており非常に時間がかかっていたのでショートカットをメモ的にまとめる

# 方法

1. ファイル展開後に「Shift」 + 「g」を押下する。
2. 「o」を押下して一行追加してinsertモードに変更する。
システムエンジニアのタイプをイノベーター理論に当てはめて5つに分類してみた

以前から技術に対するエンジニアの関わり方には様々なタイプがあると思っていたのですが、イノベーター理論に当てはめて考えてみたら個人的にかなりしっくりきたので記事にしてみました。

”システムエンジニア”とひとくくりにするのではなくタイプの違いを認識することで、エンジニア同士のコミュニケーションが円滑に進んだり、職場でのポジションやキャリアプラン、エンジニア採用のターゲットを絞り込むときなどにも役に立つかもしれません。

※※※注意※※※
私の経験のみをソースとしているため、一個人の意見として読んでいただければ幸いです。

# イノベーター理論とは

アイデアが普及・拡散する過程でそのアイデアを採用するタイミングなどによって5つのカテゴリに分けたものです。
詳細は wikipedia などを参照してください。

以下、wikipediaから5つのカテゴリについて引用します。

> ロジャースは革新性に基づき、社会システム内の個人を分析・分類した成果が認められている。アイデアが普及・拡散する過程の採用者を標準的な5カテゴリに分け、これら採用者の数を時間軸にわたってプロットすると累積度数分布の曲線がSカーブとなることを発見した[2] 。各カテゴリは採用順に「イノベーター」「アーリーアダプター」「アーリーマジョリティ」「レイトマジョリティ」「ラガード」と呼ばれている[1]。

>イノベーター（Innovators：革新者）
新しいアイデアや技術を最初に採用するグループ。リスクを取り、年齢が若く、社会階級が高く、経済的に豊かで、社交的、科学的な情報源に近く、他のイノベーターとも交流する。リスク許容度が高いため、のちに普及しないアイデアを採用することもある。全体の2.5％。

>アーリーアダプター（Early Adopters：初期採用者）
採用時期が2番手のグループ。オピニオンリーダーとも言われ、他のカテゴリと比較すると周囲に対する影響度が最も高い。年齢は比較的若く、社会階級は比較的高い。経済的に豊かで、教育水準は高く、社交性も高い。イノベーターよりも取捨選択を賢明に行い、オピニオンリーダーとしての地位を維持する。全体の13.5％。

>アーリーマジョリティ（Early Majority：前期追随者）
このカテゴリの人は一定の時間が経ってからアイデアの採用を行う。社会階級は平均的で、アーリーアダプターとの接点も平均的に持つ。全体の34.0％。

>レイトマジョリティ（Late Majority：後期追随者）
このカテゴリにいる人は、平均的な人が採用した後にアイデアを採用する。イノベーションが半ば普及していても懐疑的に見ている。社会階級は平均未満で、経済的な見通しは低く、社会的な影響力は低い。全体の34.0％。

>ラガード（Laggards：遅滞者）
最も後期の採用者。他のカテゴリと比較すると社会的な影響力は極めて低い。変化を嫌い、高齢で、伝統を好み、社会階級も低く、身内や友人とのみ交流する傾向にある。中には、最後まで流行不採用を貫く者もいる。全体の16.0％。

https://ja.wikipedia.org/wiki/%E6%99%AE%E5%8F%8A%E5%AD%A6

# エンジニアのタイプ
## イノベーター
新しい技術やライブラリ、プログラミング言語を開発しているエンジニア。
研究開発色が強いエンジニアから、最近だとOSSのコミッターなどがこのタイプにあたる。

職場での役割は技術顧問やフルタイムコミッターになることが多い。

## アーリーアダプター
新しい技術を真っ先に試すエンジニア。
新しい技術という性質上、一次ソース(公式サイトなど)から情報を得ることが多い。
リリース直後のものは不具合を踏むことがあるが、それすらも楽しみ、OSSならプルリクを出すタイプ。
Twitter等でアウトプットする人が多い。

業務でも新しい技術を積極的に採用するので、技術選定に裁量のある環境を好む。
職場での役割はテックリードなど技術をリードするポジションが適切。
このタイプのエンジニアが職場にいると組織自体の外部露出が活発になるイメージがある。

## アーリーマジョリティ
アーリーアダプターの情報を得て、新しい技術を試すエンジニア。
アーリーアダプターのブログなどのアウトプットを参考にしつつ、一次ソースも確認する。
OSSのバグを踏んだ時に、issueを見つけて解決するのを待つタイプ。

アーリーアダプター同様、業務でも新しい技術を積極的に採用するので、技術選定に裁量のある環境を好む。
アーリーアダプターに比べるとボリューム層なので、職場での役割はテックリードなど技術をリードしたり、開発をリードしたり様々なポジションを担う。
技術への関心が強いので業務知識一辺倒の職場だと合わない可能性が高い。

## レイトマジョリティ
新しい技術にあまり興味はなく既存システムや過去の経験から開発するタイプ。
新しい技術は業務を通して間接的に学ぶため、使うことができたとしても技術自体の知識は不足していることがある。
このタイプのエンジニアだけで新規開発を行うと過去の経験から作るため、一昔前の技術スタックになることがある。

既に大枠が出来上がっているシステムに機能開発していくことが得意。
職場での役割は開発をリードするポジションが適切。
レイトマジョリティもボリューム層であり、エンジニア組織のグロースには欠かせない存在。

## ラガード
クローズドな環境にいて、新しい技術を学ぶ必要がほとんどないエンジニア。
古い技術を使い続けるため、技術に対して新しく学ぶ必要はなく、業務知識で戦うタイプ。

技術は同じものを使い続け、業務知識の量で勝負する環境で力を発揮する。
深い業務知識が必要な職場で長きにわたり活躍することが期待される。
Angular勉強会 #8  ディレクティブ④ 自作構造ディレクティブ

## おさらい: ディレクティブとは
- ディレクティブとは、Angularのテンプレートの中で用いる特殊な指令である
- Componentと違い、HTMLの属性のように記述するという特徴がある
    - 実は正確に言うとComponentはDirectiveの一種
- ディレクティブを用いることで、効率的なViewの制御を行うことができる
- ディレクティブには、属性ディレクティブと構造ディレクティブがある

---

## 構造ディレクティブの自作


---
## 今回作る構造ディレクティブ
- 設定されたCondtionがtrueなら表示し、ｆａｌｓｅなら消す
- つまり、`NgIf` の逆

---
## 構造ディレクティブの仕組み
- おさらい1： 属性ディレクティブの作成では、そのディレクティブが関連付けられた要素を参照することができた

```ts
@Directive({
  selector: '[appHighlight]'
})
export class HighlightDirective {
    constructor(el: ElementRef) {
       el.nativeElement.style.backgroundColor = 'yellow';
    }
}
```

- おさらい2: 組み込みの構造ディレクティブでは、Angularが自動的に `ng-template` という要素を挿入し、そのテンプレートを操作することで、構造の変更を行っていた

> `*` は省略記法で、フルでは以下のような記載が必要になる。本来ngIfはng-templateが持つプロパティである。

```html
<ng-template [ngIf]="show">
  <p>test</p>
</ng-template>
```

---
## 構造ディレクティブの仕組み

- 構造ディレクティブでは、要素そのものではなく、その要素を含んで挿入されるテンプレートや、テンプレートが配置されるコンテナの参照を取得することができる

```ts
  constructor(
    private templateRef: TemplateRef<any>, // 挿入されるテンプレート
    private viewContainer: ViewContainerRef // テンプレートが挿入されるコンテナ
  ) {}
```

- これらの参照を利用することで、構造そのものを組み替えるような操作が実現できる

---
## 構造ディレクティブを動作させる
Conditionを引数として取得するようにし、動作させるようにする

```ts
  @Input() set appUnless(condition: boolean) {
    // 表示が必要で、かつまだ要素が生成されていないときには、要素を生成して挿入する
    if (!condition && !this.hasView) {
      this.viewContainer.createEmbeddedView(this.templateRef);
      this.hasView = true;
    } else if (condition && this.hasView) {
      this.viewContainer.clear();
      this.hasView = false;
    }
  }
```
【Rails】エラーメッセージでフォームのレイアウトが崩れる


# 現象：バリデーションエラー後の画面で入力フォームが崩れる

PFへこのようなお問い合わせフォームを設置しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/953011/288d104b-f88f-224f-c7f4-46eaa6f01c7a.png)


入力する名前とメッセージへそれぞれ次のようにバリデーションを記述

```ruby:app/models/contact.rb
class Contact < ApplicationRecord
  validates :name, presence: true
  validates :message, presence: true, length: {maximum: 200, minimum: 2}
end
```

バリデーションが効いているかどうか、いざお試し⋯！！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/953011/8b006c44-ee92-dbce-db62-8b55b6d1028c.png)


入力フォームが崩れてしまいました。


# 原因： 自動挿入される「field_with_errors」

エラー発生後のhtmlを検証ツールで確認すると、inputタグ(名前入力フォーム)とtextareaタグ(メッセージ入力フォーム)を囲むように新たなdivタグが出現していることがわかりました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/953011/2b77f806-b2a3-7562-0ac4-fb59f1b00cec.png)

出現したdivタグはclass="field_with_errors"とクラスがつけられています。

```html
<div class="field_with_errors">
  入力フォーム
</div>
```

調べてみると、エラーが発生した際、railsは自動で、エラーメッセージを含むフィールドをfield_with_errorsクラスを持つdivタグで囲んでくれるのだそうです。
それを利用することで、field_with_errorsを指定してCSSを調整することで"エラーが発生しているフォームを赤くして目立たせる"のようなことができるようになるのか！


> Railsでは、エラーメッセージを含むフィールドは自動的にfield_with_errorsクラスを持つdivタグで囲まれます。これを利用して、エラーメッセージをもっと目立たせるようにcssルールを定義しても構いません。
[Rails をはじめよう / 5.10 バリデーションの追加 – Rails ガイド より](https://railsguides.jp/getting_started.html#%E3%83%90%E3%83%AA%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E8%BF%BD%E5%8A%A0)

今回はRailsが自動生成してくれたdivタグに囲まれてしまったことでフォームのレイアウトが崩れてしまっていました。

# 解決策： 2通り　

参考にした記事によると解決方法は2通りあるようです。

1. 自動挿入されないようにする
2. 挿入されたクラスのスタイルを編集する

##  ① 自動挿入されないようにする

Railsが自動挿入しないようにする設定はconfig/application.rbに次のように記述することでできるよう。
(わたしは今回こちらの方法で試していないので、これで上手く行かなかったらすみません⋯！)

```ruby:config/application.rb
module SampleApp
  class Application &lt; Rails::Application
          # 他省略..
    config.action_view.field_error_proc = Proc.new { |html_tag, instance| html_tag }
  end
end
```

この方法はRailsが提供してくれている機能を自ら使用できなくするものです。
他のページへ影響する懸念があったため私は2つめの方法を採用しました。

##  ② 追加されたクラスにCSSでスタイルを当てる

新たに追加されたdivタグへレイアウトが崩れないようなCSSを適応させてあげることで解消できました。

```css
.field_with_errors {
  display: contents;
}
```
私の場合はdisplay: contents;を追加してあげることで治りました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/953011/f1eb3401-787a-6a24-c3b4-9c8f3d704824.png)


もし、これで治らなくても検出ツールでいろいろ当ててみてレイアウトが崩れない方法を探してみてください。

# 学んだこと
「Rails側が自動でやってくれる」
こんなに便利なことはないですね。いたれりつくせり。

しかし、便利な半面、「Railsはどんなときにどんなことをやってくれるのか。」そして、「その裏ではどんなことが起こっているのか。」
をちゃんと知っておかないと予想外のところではまってしまうと感じました。

学習するときは"便利"に甘えず、仕組みまで理解するよう意識したいと思います。

# 参考にした記事

次の記事により解決までたどり着けました。
https://yukimasablog.com/rails-field-with-errors

公式でfield_with_errorsについて記述があるページです。（ほんの少し）
https://railsguides.jp/getting_started.html#%E3%83%90%E3%83%AA%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E8%BF%BD%E5%8A%A0


ここまでお読みいただきありがとうございました！
Qiitaで見出しレベル(h1〜h6) と 右側メニューの表示のされ方

記事タイトル：「Qiitaで見出しレベル(h1〜h6) と 右側メニューの表示のされ方」
h6までページ内リンクになる。

<font color=darkgray>※右側メニュー(ページ内リンク)の表示のされ方を見るためなので 下記で言及しているh1と記事タイトルとの同一性は無視</font>

- h1〜h6はそれぞれhtmlでいう`<h1>`〜`<h6>`タグ相当
- htmlで記事タイトル`<title>`タグ = Qiita投稿記事の『タイトル』 

htmlでは**１つの記事につき h1は1つ**が推奨で (*これはSEO的な側面* )
　それに倣う書き方をするとしたら：〈h1見出し1つ〉
　■case1 `<title>`内容 = `<h1>`内容、となり推奨でもある(ハズ)。
　備考) htmlやSEOをかじったりしてるとここら辺が気になる ≪私見です≫

　特に意識しない書き方をするなら: 〈h1見出し複数可〉
　■case2 `<title>`内容 ≠ `<h1>`内容、となる。
　備考) 内容がhelp記事etcのような性質のものならこの書き方が合ってるかも ≪私見です≫

実際は `<title>` ≒ `<h1>`も、`<title>` ≠ `<h1>`も、エラーというわけではない。多分GoodかNG(NotGood)かのちがい…？？
　備考) ｢case1｣であっても｢case2｣であっても、だ

# h1見出し
ここはh1見出しの本文。<font color=darkgray>特に見出しの頭に何もつけない書式/書き方(prefixなし)</font>
## h2見出し
ここはh1見出し > h2見出しの本文 
### h3見出し_1st
ここはh1見出し > h2見出し > h3見出し_1stの本文
### h3見出し_2nd
ここはh1見出し > h2見出し > h3見出し_2ndの本文
#### h4見出し
ここはh1見出し > h2見出し > h3見出し > h4見出しの本文
##### h5見出し
ここはh1見出し > h2見出し > h3見出し > h4見出し> h5見出しの本文
###### h6見出し
ここはh1見出し > h2見出し > h3見出し > h4見出し > h5見出し > h6見出しの本文

- - -
- - -
# ■ h1見出し
ここは■ h1見出しの本文。<font color=darkgray>見出しの頭に何かしらマークつける書式/書き方(prefixあり)。マークは何でもいい(=任意)、おそらく絵文字でもいい。マークを同じやつに揃えてもいいし、揃えなくてもいい。この例では見出しレベルによって適当に変える。</font>
## ★ h2見出し
ここはh1見出し > h2見出しの本文 
### ☆ h3見出し_1st
ここはh1見出し > h2見出し > h3見出し_1stの本文
### ☆ h3見出し_2nd
ここはh1見出し > h2見出し > h3見出し_2ndの本文
#### ○ h4見出し
ここはh1見出し > h2見出し > h3見出し > h4見出しの本文
##### ※ h5見出し
ここはh1見出し > h2見出し > h3見出し > h4見出し> h5見出しの本文
###### ※※ h6見出し
ここはh1見出し > h2見出し > h3見出し > h4見出し > h5見出し > h6見出しの本文

- - -
- - -
# 1. h1見出し
ここは1. h1見出しの本文。 <font color=darkgray>技術書関連とかhelp項目関連とか『理系のヒトが書いたな…！』と感じる見出しの書式/書き方 ≪私見です≫
**⚠️** 「- (ハイフン)」と「_ (アンダーライン)」は入れ替えた表示かも…？？
**⚠️** 「. (ドット)」のところは「: (コロン)」だったりするかも…??</font>
## 1_2. h2見出し
ここは1. h1見出し > 1_2. h2見出しの本文 
### 1_2_3-1. h3見出し_1st
ここは1. h1見出し > 1-2. h2見出し > 1-2-3. h3見出し_1stの本文
### 1_2_3-2. h3見出し_2nd
ここは1. h1見出し > 1-2. h2見出し > 1-2-3. h3見出し_2ndの本文
#### 1_2_3_4. h4見出し
ここは1. h1見出し > 1_2. 見出し > 1_2_3. h3見出し > 1_2_3_4. h4見出しの本文
##### 1_2_3_4_5. h5見出し
ここは1. h1見出し > 1_2. 見出し > 1_2_3. h3見出し > 1_2_3_4. h4見出し > 1_2_3_4_5. h5見出しの本文
###### 1_2_3_4_5_6. h6見出し
ここは1. h1見出し > 1_2. 見出し > 1_2_3. h3見出し > 1_2_3_4. h4見出しの > 1_2_3_4_5. h5見出し > 1_2_3_4_5_6. h6見出しの本文

- - -
- - -
# ■ h1見出し
ここは■ h1見出しの本文。<font color=darkgray>右側メニュー的にはいいかもだけど実際の見出し表示で以下の書式/書き方は、…、…ナイかな！ ≪私見です≫</font>
## └ h2見出し
ここは■ h1見出し > └ h2見出しの本文 
### ├ h3見出し_1st
ここは■ h1見出し > └ h2見出し > ├ h3見出し_1stの本文
### └ h3見出し_2nd
ここは■ h1見出し > └ h2見出し > └ h3見出し_2ndの本文
#### └ h4見出し
ここは■ h1見出し > └ h2見出し > └ h4見出しの本文
##### └ h5見出し
ここは■ h1見出し > └ h2見出し > └ h4見出しの本文 > └ h5見出しの本文
###### └ h6見出し
ここは■ h1見出し > └ h2見出し > └ h4見出しの本文 > └ h5見出しの本文 > └ h6見出しの本文
渡辺さんの特許「多変数(量子耐性)暗号✖️ブロックチェーン」で「発言歴が消えない」「絶対に乗っ取られない」「事業者をみんなでチェックする」民主的なSNS（事業創造パートナー求む）

**以前紹介した量子耐性暗号の特許に関するプレスリリース**


読んでくださった方ありがとうございます！


まだの方はこちらから読めます↓


>[量子耐性ブロックチェーン、および、その実装技術の完成について](https://prtimes.jp/main/html/rd/p/000000001.000069149.html)


>[渡辺さんの特許「多変数暗号方式＝量子耐性」が備わるとブロックチェーンは真価を発揮して最強になる](https://note.com/kosaka_/n/nba6d69d8b5d5)


>[強いて言えばこれは「ポストゼロ知識証明」という発明。事業者やユーザーは量子コンピュータによる未来の攻撃に対し完璧にリスクフリーになる](https://note.com/kosaka_/n/n6a54e3498cea)


順調に閲覧数も伸びていて感謝の限りです。


それはさておき上の投稿を書いたときから何やらSNS界隈が騒がしくなってます。**特にアメリカで**。


ポリティカルな話は横に置いといて、**従来の大手SNSは社会に大きな価値をもたらしたのは紛れもない事実**だと思います。そこは素直に敬意を表します。


これほどまで個人が簡単に発言し世界中に声を届けられるなんて、20年前に誰が予想してたでしょうか。


前に「お金はそれ自体が価値ではなく寄付や決済で移動したときに価値が生まれる」ことについて書きましたが、SNSに流通する「情報」も似てるのかもしれません。


**ただし、その移動の仕方や目的をちょっと間違えると逆に価値を失う**。


そいうことが昨今のSNSに対する批判にあらわれてるように思います。


まあ、批判するのは簡単ですがやっぱり僕たちは子供の世代にいい世界をバトンタッチしなきゃならないわけですよ。


僕はその意味で渡辺さんの**多変数（量子耐性）暗号**の特許はSNSやデータを民主化する技術として、日本が世界に誇れる資産だと思っています。


**多変数暗号アルゴリズムでインターネット上のデータは民主化される（主権がやっとユーザー側に移る）**


この技術を誰が使うかによっては、今思い付かないような新しい価値を生むとも思います。


たとえばSNS。


「発言主のプライバシーが100％護られる」


「発言主のアイデンティティも100％正確に証明できる」


「発言歴が100％残り成りすましも100％できないので詐欺や誹謗中傷の抑止になる」


「ユーザーみんなでSNS事業者をチェックする仕組みができる」


いろんなことに応用できる可能性があるので**ゼロ知識証明を超えるこの暗号技術を僕は世界標準にしたい**。


発明者の渡辺さんと僕は毎週金曜の夜、東横線の日吉駅で会ってミーティングしてますので「私SNS作れますよ」という方は、ぜひ一緒にワイガヤしましょう（もちろんSNS以外のプロでも！）。


==================


**アクセスが多い他の記事**


**【多変数(量子耐性)暗号方式の特許を使って事業創造したい方求む！】**
- 標準化されるべきメイドインジャパンの知財です。
- ブロックチェーンの強力な補完技術でもあります。
- キーワードは＝**データ管理の主権をユーザー側に**。
- GAFAM超えを目指せます。

>→[記事①:渡辺さんの特許「多変数暗号方式＝量子耐性」が備わるとブロックチェーンは真価を発揮して最強になる](https://note.com/kosaka_/n/nba6d69d8b5d5)


>→[記事②:渡辺さんの特許「多変数(量子耐性)暗号✖️ブロックチェーン」で「発言歴が消えない」「絶対に乗っ取られない」「事業者をみんなでチェックする」民主的なSNS（事業創造パートナー求む）](https://note.com/kosaka_/n/n76c259e42f65)


>→[記事③:強いて言えばこれは「ポストゼロ知識証明」という発明。事業者やユーザーは量子コンピュータによる未来の攻撃に対し完璧にリスクフリーになる](https://note.com/kosaka_/n/n6a54e3498cea)

**【僕の略歴】**
- 新潟で面白いことやりましょう！
>→[記事①:何かワクワクできることを一緒にやりましょう](https://note.com/kosaka_/n/ne312cba752ba)


>→[記事②:新潟で面白いことやりましょう！](https://note.com/kosaka_/n/na8dc65342b29)


>→[記事③:地方ベッドタウンの宅地210坪を「坪47円」で買えた理由とその秘訣](https://note.com/kosaka_/n/nab5e7d013d28)


**【連絡先】**
- 遠慮なくメールください！
- メール→ tadahide@protonmail.com
- ライン→ tora3307tora
- twitter→@Tadahide_Kosaka
AWS Shield とは

## 勉強前イメージ

シールドってことは盾？
firewall的なサービスかな

## 調査

### AWS Shield とは

AWS Shield はAWSで実行されるアプリケーションをDDoS攻撃から保護するマネージドサービスになります。
AWS Shieldには種類が2種類あり、適切に設定することが出来ます。

### そもそもDDoS攻撃って何？

DoS攻撃とDDoS攻撃ってよく聞きますが、その違いも含めて記載します。

- DoS攻撃

Denial of Service Attack の略で、
サービスを不能にすることを目的として行われる攻撃の1つで、
`単一リソースから` の攻撃になります。

![dos 2021-03-08 AWS Shield とは - diagrams.net - Google C.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/e5281c36-fa7c-c22a-936b-471c65377978.png)


- DDoS攻撃

Distributed Denial of Service Attack の略で、
サービスを不能にすることを目的として行われる攻撃の1つで、
`分散された複数のリソースから` の攻撃になります。

![ddos 2021-03-08 AWS Shield とは - diagrams.net - Google C.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/d190e907-5c30-f7dd-5d7c-5a20fa7e98cf.png)

### AWS Shieldの種類

AWS Shieldには以下の2種類があります。

- Standard

AWSを利用している時点で自動的に適用されており、
無料で利用することが出来ます。
L3,L4のDDoS攻撃を保護し、悪意のあるトラフィックがあれば検知を行います。

- Advanced

こちらは有料で利用することが出来ます。
アプリケーションレイヤー(L7) のDDoS攻撃も検出することができ、
より大規模なDDoS攻撃に対する緩和が可能になります。
専門サポートも受けられます。

### AWSコンソール上では？

WAF & Shieldとして、
AWS WAF, AWS Firewall Managerも同じコンソールの中にグルーピングされています。

![1AWS WAF - Google Chrome 2021-03-08 23.28.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/c78e9259-9669-5f5e-8c6b-6e6e9ab72449.png)


AWS Shield に進むと、
いきなりAdvanced購入しますか？と出てきます。

`Note: After you subscribe to this service, you unsubscribe only by calling support.`
購入すると、解除はサポートへ電話しないといけないみたいです。

![2AWS Shield - Google Chrome 2021-03-08 23.31.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/96294807-430c-86cf-058e-1ea7cbdfcb4e.png)

### AWS Shield と AWS WAFとの違い

以下それぞれ簡単に特徴を書いたものです。

- AWS Shield : `DDoS攻撃` を緩和する
	- アプリケーションレイヤー(L7)のDDoS攻撃を緩和できる
	- L3,L4のDDoS攻撃を緩和できる

- AWS WAF : `webの攻撃を複数` 防げる
	- アプリケーションレイヤー(L7)の攻撃を防御する
		- SQLインジェクション攻撃
		- クロスサイトスクリプティング攻撃
		- OSコマンドインジェクション攻撃
		- DDoS攻撃
	- L3,L4は対象外

L7のDDoS攻撃を緩和する点では一緒だが、
L4,L3のDDoS攻撃も防げるのが `AWS Shield`
webの攻撃を複数防げるのが `AWS WAF`
なので、用途によって使い分けが必要です。

## 勉強後イメージ

イメージ合ってたー
DDoS攻撃に特化したサービスなのね！

## 参考

- [AWS Shield のよくある質問](https://aws.amazon.com/jp/shield/faqs/#:~:text=AWS%20Shield%20%E3%81%AF%E3%80%81AWS%20%E3%81%A7,%E3%81%AB%E6%9C%89%E5%8A%B9%E5%8C%96%E3%81%95%E3%82%8C%E3%81%BE%E3%81%99%E3%80%82)
- [【AWS Shield とは？】初心者にもわかりやすく解説](https://www.wafcharm.com/blog/aws-shield-for-beginners/)
- [AWS Shieldを導入するメリット7選紹介｜料金体系とは？](https://www.fenet.jp/aws/column/aws-beginner/321/)
- [【AWS WAF vs AWS Shield】初心者にもわかりやすく解説](https://www.wafcharm.com/blog/aws-waf-vs-aws-shield-for-beginners/)
MySQL基礎（関数, INSET, UPDATE, DELETE）

#関数

```
SELECT 
 likes / 3 AS hoge, 
 FLOOR(likes / 3) AS floor,
 CEIL(likes / 3) AS ceil,
 ROUND(likes / 3) AS round
FROM 
 posts;
```
- ASはテーブルに名前をつけられます。

1. postsテーブルの中のlikesを3で割ったレコードを表示（小数点が表示される）
1. postsテーブルの中のlikesを3で割り端数を切り捨てたレコードを表示
1. postsテーブルの中のlikesを3で割り端数を切り上げたレコードを表示
1. postsテーブルの中のlikesを3で割り四捨五入したレコードを表示

##CONCAT, RENGTH
```
SELECT CONCAT(message, ' - ', likes) FROM posts;
SELECT message, LENGTH(message) AS len FROM posts;
SELECT message, CHAR_LENGTH(message) AS len FROM posts;
```
1. postsテーブルの中のmessage -- likesを連結させる
1. postsテーブルの中のmessageの文字数を表示（日本語非対応）
1. postsテーブルの中のmessageの文字数を表示（日本語対応）

##日付
```
SELECT created, YEAR(created) FROM posts;
SELECT created, MONTH(created) FROM posts;
SELECT created, DAY(created) FROM posts;
  
SELECT
  created,
  DATE_FORMAT(created, '%M %D %Y %W') AS data
FROM
  posts;
```
1. postsテーブルの中の年を表示
1. postsテーブルの中の月を表示
1. postsテーブルの中の日を表示
1. postsテーブルの中の英語で年、日、月、曜日を表示

##UPDATE（更新）
```
UPDATE posts SET likes = likes + 5 WHERE likes >= 10;
UPDATE 
  posts 
SET 
  likes = likes + 5 ,
  message = UPPER(message)
WHERE 
  likes >= 10;
```
1. postsテーブルの中のlikes中で10以上のものを5足した数値にする
1. postsテーブルの中のlikes中で10以上のものを5足した数値し、messageを大文字にする

##DELETE(削除), INSERT INTO(登録)
```
DELETE FROM posts WHERE likes <= 10;
DELETE FROM posts;
TRUNCATE TABLE posts; --削除後idを1から生成する
INSERT INTO posts (message, likes) VALUES ('hoge', 10);
```
1. postsテーブルの中のlikes中で10以上のものを削除する
1. postsテーブルの削除
1. postsテーブルのidを1から生成する（もし、使わなければidが削除した続きになる）
1. postsテーブルの中のmessageにはhogeをlikesには10を登録する

##カラムの追加、カラムの削除、テーブル名の変更
```
ALTER TABLE posts ADD book VARCHAR(255) AFTER id;
ALTER TABLE posts DROP message;
ALTER TABLE posts CHANGE likes points INT;

DROP TABLE IF EXISTS messages; --もしmeeagesがあれば削除する
ALTER TABLE posts RENAME messages;
```
1. postsテーブルの中にbookをVARCHAR(255)型でidの後ろにカラム追加する
1. postsテーブルの中のmessageカラムを削除する
1. postsテーブルの名前をmessagesテーブルに変更する
Apache:概要2 モジュール

目的：大枠をとらえるため
参照：サーバ構築の実際がわかる Apache[実践]運用/管理

1■拡張モジュール
-
定義：
拡張モジュールとはApacheの負荷削減のために作られた考え方で、用途に応じて利用の可否をユーザが決められる。
できること：
拡張モジュールでは、ユーザ認証・アクセス制限・HTTPSプロトコルの実装などほかにも様々なことができる。
弱点：モジュールが増えすぎると、メモリの負荷が大きくなる

1-1■拡張モジュールには動作フェーズが存在する
-
クライアントの通信の際に発生する下記3フェーズで拡張モジュールが活用される
a.リクエスト解析フェーズ
→リクエストヘッダの解析やファイルの置き換えなど
b.セキュリティフェーズ
→認証やパスワードチェック
c.レスポンス解析フェーズ
→サーバから送信するデータの準備

1-2■拡張モジュールは2種類ある
-
拡張モジュールには、静的モジュールとDSOモジュールの2つが存在する
機能的には、スタティックリンクとダイナミックリンクと同じ考え方のようだ。

・静的モジュール
インストール時に組み込まれ、切り離すことができない。
切り離したり、追加するにはapache自体の再インストールが必要
しかし、読み込む必要がないため早い。
・DSO
インストール時には組み込まれず、[load module]ディレクティブで読み込まれる。
読み込む必要があるため、少し遅くなる。
必要なモジュールのみ運用すれば、静的モジュール利用に比べてメモリ消費が少ない
*mod_so(知らない)モジュールは静的モジュールに入っている必要がある。

1-3■拡張モジュールをどのように実行するのか？
-
拡張モジュールを利用するには下記の準備が必要になる
①モジュールの読み込み
LoadModule モジュール識別子　モジュールファイル
※モジュールファイルはディレクティブで指定したディレクトリの相対パスか
　絶対パスを指定(よく分からない)
②モジュールがhttpd.conf上から削除された場合に備え、ifmoduleを設定
ifmodule:モジュールがロードされている場合のみ、ブロック内のディレクティブを有効にする
　　　　　外部ファイルもブロックに入れることができるので、外部ファイルの無駄な読み込みも防止できる
2■環境変数
ディレクティブには環境変数が使えるらしい
Apacheの内部だけで有効になっていて、利用するときは%{環境変数}という書式で書くらしい
仕組みがまだわかっていないが、環境変数を引数としてCGI上で使うことで
連動させることができるらしい

重要っぽいがCGIを利用したことはないため、理解度は薄かった。

思っていたより覚えることが多そう。
使ってれば慣れるのかな？
Pythonのclass定義に関する基礎

#◆本記事の概要
Summary of this article.

この記事ではPythonの基礎について記載します。
勉強は主にProgateを用いて行いました。
また、英語勉強のために日本語とともに英語で記載しています。
拙い英語ですが、温かい目でご覧になってください。

This article describes the basics of Python.
I mainly studied using progate.
Also, this article is written in English along with Japanese for studying English.
Although it is poor English, please take a warm look.

#◆Classの継承

pythonはオブジェクト指向のプログラミング言語です。
定義したClassを継承することができます。
Classを継承する側を子クラス、継承される側を親クラスと言います。
子クラスは親クラスのメソッドを使用することができます。

Python is an object-oriented programming language.
It can inherit defined class.
The side that inherits class is called the child class,
the side that is inherited class is called the parent class.
Child classes  can use methods of the parent class

#◆メソッドのオーバーライド
親クラスで定義したメソッドを少し変更して用いたい時があります。
その時に便利なのが、子クラスでの「メソッドのオーバーライド」です。
オーバーライドを行うと、子クラスのインスタンスは親クラスのメソッドではなく、子クラスのメソッドを呼び出すようになります。

There are times when you would like to slightly modify the method defined in the parent class.
"Overwrite" in the child class is useful, when the time.
The child class is called instead of parent class by instance in the child class, if you over write/

##例 - Example
###親クラス
```
class MenuItem():
    def info(self):
        return self.name + self.price
```

###子クラス
```
class Food(MenuItem):
    def info(self):
        return self.name + self.price + self.calorie
```

上記のようなクラスがあると、子クラスのinfo()が呼び出されるようになります。

"info()" in the child class is called, if you have a class like the one above.

#◆`__init__`とは

classを定義した後、初めに"`__init__`"メソッドを定義することが多いかと思います。
これは、classが呼び出されたときに、自動的に呼び出されるメソッドになります。
例として以下のclassを定義します。

You will often define the "`__init__`" method first after defining the class.
The method is called automatically when the class is called.
As an example, define the following class.
##例-example
```
class Food():
    
    def __init__(self, name, price, calorie):
        self.name = name
        self.price = price
        self.calorie = calorie
```

そして上記のclassを呼び出してインスタンスを作成したとします。

And suppose you call the above class to create an instance.

```
food1 = Food("ハンバーガー", 500, 700)
```

そうするとfood1インスタンス作成時に"`__init__`"が呼び出されます。
そのため、self.name, self.price, self.calorieには、引数が格納されます。
また、selfはインスタンスを指します。

Then, the "`__init__`" will be called when you create food1 instance.
So, arguments are stores in "self.name, self.price, self.calorie".
Also, self means an instance.

#◆super()とは

オーバーライドしたメソッドの中でsuper()を使うと親クラスを呼び出すことが可能です。
super().[メソッド名]を記載することで、親クラスで定義したインスタンスメソッドを使用することが可能です。
これにより親クラスと子クラスで重複したメソッドを記載する必要がなくなります。

It is possible to call the parent class by using super () in the overridden method.
By describing super (). [method name], it is possible to use the instance method defined in the parent class.
Therefore, you don't need to write same method in the child class and the parent class.

##例

```
class MenuItem():
    def __init__(self, name, price):
        self.name = name
        self.price = price
```

```
class Food(MenuItem):
    def __init__(self, name, price, calorie):
        super().__init__(name, price)
```
環境構築　M1モデルのMac用　Homebrewの導入

#環境構築準備

#1. 
finderの虫眼鏡アイコンから「Terminal.app」または「ターミナル」と入力して検索。

#2. 
ターミナルという黒い見た目のアプリが表示されるので、二本指でタップしてメニューを表示。


#3. 
メニューから「情報を見る」を選択する

#4. 
「Rosettaを使用して開く」にチェックを入れて閉じる

#5.
ターミナルを再度起動する。
MySQLを5.7→8.0にしたらDjangoで1130, "Host 'IPアドレス' is not allowed to connect to this MySQL server"と出るエラー

MySQL8ではDBに「-(ハイフン)」が使えないだけだった...。

settings.pyがこうなっていないか確認しよう。

```
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'xxx-db',                      #「-」はNG!
        'USER': 'xxxxx',
        'PASSWORD': 'xxxx',
        'HOST': 'db',
        'PORT': '3306'
    }
}
```

3/15追記
下記も実行する必要がある

```
# mysql -u root -p
mysql> grant all on *.* to 'ユーザー名'@'%';
mysql> create database DB名;
```