OmniAICreator/Qiita-1.07M huggingface dataset:
既存のRailsアプリケーションにのせるフロントのフレームワークを比較した話


## 背景
既存のRailsのアプリケーションにフロントのフレームワークを導入する運びとなりまして、有名どころ3つをチェックポイントに沿って比較しましたのでその話を残しておきます。
今回はこういうやり方で比較したよ、という話なので、もしフレームワークを選ぶことになった際は参考程度に読んでいただき、その時々の状況やプロジェクトに応じて比較方法は変更すればよいと思います。なのでこれが正解というわけではないです。調査結果に誤りがある場合もあると思いますので、調査は自分で公式のものを見てちゃんと行った方がよいです。

## 比較したフレームワーク
今回比較、検討したフレームワークは以下の3つです。

- Vue.Js
- React
- Angular

ちなみにAngularは、今回導入しようとしているアプリはそんなに大規模というわけではなかったので、ある程度のところでAngularの調査は切り上げ、VueとReactに絞りました。

## チェックポイント
今回「まあこれが分かれば比較できそうかもしれない」と考えてチェックポイントをチーム内で相談し決めました。

- フレームワークの概要（特徴）
- 主なプログラミング言語
- 最新バージョン
- 学習難易度
- パッケージサイズ
- GUI
- 既存機能の実装難易度
- Heroku上の動作時における不具合等
- コード管理のしやすさ
- 開発手法
- ドキュメント
- 他フレームワークへの以降性
- ローカル環境構築のしやすさ

## 比較方法
期間:2週間
調査人数：エンジニア3~4名

チームメンバーで上記のチェックポイントを分担し、確認を行っていきました。その際の情報共有はGoogleドキュメントを使用し、適宜必要に応じてHangoutを行いました。

## 比較結果

| チェックポイント | Vue | React | Angular |
|:-----------|:-----------|:------------|:------------|
| フレームワークの概要（特徴） | OSSフレームワークでコミュニティにより開発・メンテ。GUIのコンポネントのみ提供。必要であれば他のライブラリをインストールする       | Facebook社により開発・メンテされている。GUIのコンポネントのみ提供する。必要であれば他のライブラリをインストールする        | Google社により開発・メンテ。フロントエンド用のMVCフレームワーク |
| 主なプログラミング言語 | EMACS6 | EMACS6 | Typescript|
| 最新バージョン（調査当時）  | 2.6| 16.13| 10 |
| 学習難易度  | 容易：GUIのコンポネントとライフサイクルを理解すれば問題ない。CSSコードはコンポネントの中に記述してもいい | 容易：GUIのコンポネントとライフサイクルを理解すれば問題ない。| 難：GUIの作成方法以外、フレームワークのコンポネントを理解する必要がある|
| パッケージサイズ（約） | 80KB | 100KB | 500KB |
| 既存のサイドパーティ    | Vue Material Kit, Vuetify, Vue Material, Quasar, Bootstrap-Vue    | Raect Material Kit, Material UI, React Bootstrap, Ant Design, Semantic UI React     | mdbootstrap, material, ng-bootstrap   |
| 既存機能の実装難易度 | APIを新たに作成する必要がある。    | Vue同様 | ー  |
| Heroku上の動作時における不具合等 | deployして検証    | deployして検証     | ー      |
| コード管理のしやすさ | コンポネントで分かれているためコード管理はしやすい    | Vue同様 |ー      |
| 開発手法 | オブジェクト指向    | コンポネント指向| コンポネント指向  |
| ドキュメント | 日本語あり   | 日本語バージョンは英語の直訳   | 日本語あり      |
| 他フレームワークへの以降性 | 独自フォーマットであるため、開発が進むと後戻りは困難    | Vue同様     | フルスタックなため代替は困難      |
| ローカル環境構築のしやすさ | 導入時の設定は少し困難だが、そこが完了していれば容易    | Vue同様     | ー      |


## 比較結果
既存機能を実際に開発してみて検証をし、ドキュメントを読んで比較した結果今回はVue&Vuetifyになりました。チームメンバーにVueの経験がある人が多かったのも一つです。
【妄想】最強のWordPressインフラを考えてみる。

#とりあえず夢詰め込んでみる。
・コンテンツ容量≒ディスク容量を考えなくていい
・DB容量を考えなくていい
・DBのリソースマネジメントしなくていい
・DBのメンテナンスしなくていい
・スパイクトラフィックもヘビートラフィックも捌ける
・訪問ユーザーが少ない時は最低限のコストに自動的に変動

###ワガママ過ぎじゃない？

#とりあえず夢構成かんがえてみた
![001.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536700/9934327c-9a67-7350-5add-bb99d8135a1c.jpeg)
**OSはAmazon Linux2想定。**

#EC2やらWordPressインストールやら
↓見て。
[【超初心者向け】WordPressをAmazon EC2インスタンスにインストールする](
https://qiita.com/moomindani/items/9968df0d4396564bf74c)

一点。今回DBはRDSを利用するので、wp-config.php内の以下項目をAurora Serverlessのホスト名に変更する。

```

/** MySQL のホスト名 */
define('DB_HOST', 'xxxxxx.cluster-yyyyyyyyyyyy.ap-northeast-1.rds.amazonaws.com')

 ```

#Cloudfront設定
↓見て。
[WordPressサイトをCloudFrontで配信する]
(https://qiita.com/Ichiro_Tsuji/items/38592e737257cb45ca13)

WordPressの設定画面で間違えてCloudfrontのホスト名ではなく、
独自ドメインを登録してしまった時に解決策を探してた時に見つけた記事。
ちょうどCloudfrontの設定も書いてくれてた。

ってか、一回間違えたらWEBからアクセス出来なくなる上に、
完全復旧には設定ファイルどころか**DBも書き換えなきゃならない**って罠過ぎん？？？？？

#EFSの設定メモ
マウントヘルパーをインストール　→　マウント　→　ちゃんと付いてるかチェック

```html
$sudo yum update
$sudo yum install -y amazon-efs-utils
$sudo mount -t efs fs-123456:/ /var/www/html
$df -h
```

#所感
WordPressの設定で色々と蹴躓いたけど、それ以外は何の問題も発生せずに構築出来て拍子抜けした。
問題無くサイトも編集できるし、費用は本当に最低限で済むし最強では…？
出来れば誰も見てない時はAurora Serverlessが落ちてくれれば言うことなしだけど、
**なんかずっと起動してて料金が発生してた。**
ちゃんと5分アイドル状態なら落ちる設定になってたはずなんだけど不思議…。
これは要検証しておきたい。

まぁでも、何にせよこれでCloudformation組んだらWordPress環境これで良くねってなりそう。
Aurora Serverlessが高いなーって思ったら、Cloudfront＋EC2+EFSだけでも十分いけそうだし。

#20201014追記
Aurora Serverless単体で起動して試してみたところ、
きっちりキャパシティユニットが0になって停止していたのを、
WordPressにDB設定した途端にCPU使用率が10～15％使用しっぱなしになり、
アイドル状態にならなくなりました。

普段WordPressを利用されている方には当たり前なのかもしれませんが、
WordPressってDBサーバーのリソース常時使ってるんですね…。

となると、最低でも1ACU分($72.00/month)は必要になってくるのね。。
それでも、Multi-AZとかリードレプリカを使う構成よりもコストメリットはありそうですが。
Azure Devops + Eclipse Azure Tools で Push できなくなったときのメモ


# 現象

Azure Devops に対してCommit しようとすると、正しくログインできているはずなのに Can't connect to any repository : not authorized となって困った。

```
Can't connect to any repository: https://xxx.visualstudio.com/yyy/_git/zzz (https://xxx.visualstudio.com/yyy/_git/zzz: not authorized)
```

# 解決方法

1. [Project] - [Team] - [Remote] - [Configure Push to Upstream] を開く
2. 何もせず保存して閉じる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/110265/439e1da7-a04e-5244-31aa-d6f22d3d31b7.png)

# 所感

Eclipse プラグインのバグなのかもしれない。
もしくは、PCのアカウントパスワードを変更したことで保存されていた情報が正しく読み取れなかったのかもしれません。


以上
[Outlook]日報メールをPythonで自動作成してみた

# 概要
この[サイト](https://www.crie.co.jp/chokotech/detail/282/)より、日報のテンプレートは作れるけど、
件名に今日の日付を**自動**で入れることができない！

日報メールを自動作成してほしい！と思い、実行に移してみた

# コード
```Python
import win32com.client
import datetime


# メール送信
object = win32com.client.Dispatch("Outlook.Application")
mail = object.CreateItem(0) 
mail.BodyFormat = 1

# 宛先の設定　To,CC,Bcc
mail.To = "yyy@vvv.com"
# mail.cc = "yyy@vvv.com"
# mail.Bcc = "yyy@vvv.com"

# 今日の日付を取得
today = datetime.datetime.now()
# メールの件名
mail.Subject = "日報[{}月{}日]".format(today.month,today.day)

# メールの本文
mail.Body = """\
お疲れ様です。
日報を送ります。

＜やったこと＞

＜わかったこと＞

＜次にやること＞

以上です
"""

 # 作成したメールの表示
mail.Display(True)

 # メール送信
# mail.Send()
```

# 実行結果
<img src='https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/763295/aa602002-a2fa-9e4e-7e23-e7297f1f860b.png' width=150%>

- メールを作成することができた！

# まとめ
日報メールを自動作成することができた！

# 参考
[メールのテンプレートを呼び出せるようにしておくには (Outlook)](https://www.crie.co.jp/chokotech/detail/282/)
[【python】outlookでメール送信](https://qiita.com/watyanabe164/items/e1c21af0127497b74b2a)
Gentoo に Nginx をインストール

こちらでインストールした LXD 上の Gentoo に Nginx をインストールする方法です。
[LXD で Gentoo を使う](https://qiita.com/ekzemplaro/items/9d63d0af9afada83a2fa)
ブラウザーでアクセスすると次のような結果を得ます。
![gentoo_nginx.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/8d6d659c-690c-b030-1bcb-36b978a82ac8.png)

1) /etc/portage/make.conf に次を追加

```text:/etc/portage/make.conf
（省略）
NGINX_MODULES_HTTP="fastcgi gzip"
```

2) Nginx をインストール

```bash
sudo emerge --ask www-servers/nginx
```

3) /etc/nginx/nginx.conf　の編集

```text:/etc/nginx/nginx.conf
（省略）
server {
       listen 80 default_server;
       root /var/www/localhost/htdocs;

（省略）
```

4) /var/www/localhost/htdocs/index.html を作成

```html:/var/www/localhost/htdocs/index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="CONTENT-TYPE" content="text/html; charset=utf-8" />
<head>
Test
</head>
<body>
Hello, world!<p />
Oct/13/2020<p />
</body>
</html>
```

5) Nginx の設定が正しいかを確認

```bash
sudo nginx -t
```

6) Nginx をスタート

```bash
sudo rc-service nginx start
```

7) 内部から curl でアクセス

```bash
curl http://localhost
```

8) ブラウザーでアクセス
>http://gentoo.local
量子コンピュータの量子ビット数（2020年10月時点）

# 量子コンピュータの量子ビット数

+ 現時点（2020年10月）における、量子コンピュータの量子ビット数を確認すため、情報を集めてみました。

## 量子アニーリング方式

### D-Wave Systems

+ 2020年9月29日発表。
+ 名称は「Advantage」（アドバンテージ）。
+ <b>5000量子ビット</b>。
+ トポロジ設計の名称は「Pegasus」（ペガサス）。
+ このマシンを「第五世代」としている。
+ [D-Wave TechRepublic: D-Wave announces 5,000-qubit fifth generation quantum annealer](https://www.dwavesys.com/media-coverage/techrepublic-d-wave-announces-5000-qubit-fifth-generation-quantum-annealer)
+ [https://jp.techcrunch.com/2020/10/01/2020-09-29-d-wave-launches-its-5000-qubit-advantage-system/]

## 量子ゲート方式

### IBM

+ 2020年9月、<b>65量子ビット</b>の「Quantum Hummingbird プロセッサ」をリリース。
+ 量子ボリュームが高いのは、<b>27量子ビット</b>の「Falcon プロセッサ」。
+ ロードマップとしては、2021年127量子ビット、2022年433量子ビット、2023年1121量子ビットとなっている。
+ [https://www.ibm.com/blogs/research/2020/09/ibm-quantum-roadmap/]
+ [https://www.itmedia.co.jp/news/articles/2008/21/news083.html]

### Google

+ 2019年10月、量子コンピュータによる量子超越を発表。
+ アーキテクチャ「Sycamore」の「rainbow」プロセッサ。
+ <b>54量子ビット</b>。（うちひとつが故障のため、53量子ビットで量子超越が検証されたとのこと）
+ [https://japan.googleblog.com/2019/10/quantum-supremacy-using-programmable.html]
+ [Youtube - Google's Quantum Computing Service (Quantum Summer Symposium 2020)](https://www.youtube.com/watch?v=crpQexwT2HU)

### IonQ

+ 2020年10月1日発表。
+ <b>32量子ビット</b>。（1世代前は11量子ビット）
+ 量子ボリューム（Quantum Volume）は400万の見込み。
+ 以前は<b>79量子ビット</b>での操作を確認されているが、性能が高いのは32量子ビットのマシン。
+ [https://ionq.com/news/october-01-2020-most-powerful-quantum-computer]
+ [https://ionq.com/news/december-11-2018]
Unity初心者が思ったアレコレ。

Uniyを勉強していて思ったこと一覧。
思っただけで、実用的かは不明。


**[Transform関係]**
・オブジェクトの回転角はtransform.eulerAngleで取得する。
・オブジェクトの回転はtransform.rotationで行う。(Quaternionを使うべし)
・transform.Rotateはなるべく使用しない。

**[Rigidbody関係]**
・オブジェクトへの力をかける方法はゲームによるがAddForce()よりvelocity。

**[Animation関係]**
・アニメーションの遷移はanimator.Play()を極力使わない。
・paramaterを設定して、animator.SetFloat()などを用いて遷移を行う。
・アニメーションの終了確認はanimator.GetCurrentAnimatorStateInfo().normalizedTimeで比較する。
・目的のアニメーション名のanimator.GetCurrentAnimatorStateInfo().IsName()で確認する。

**[EventTrigger関係]**
・ImageやUI以外のGameObjectのイベントを発生させるためにはCameraにPhysicsRaycasterを追加する。
・EventTriggerに自作関数を使いたい時は、Objectにスクリプトをアタッチした関数がEventTriggerの一覧に乗る。
・当然と言えば当然だが、判定にはcolliderが必要。
NTP(Chrony)インストール方法 (CentOS8)

###はじめに
ネットワークタイムプロトコル（NTP）はリモートインターネットタイムサーバーと時刻を同期するためのネットワークプロトコルです。

ChronyはNTPの実装であり、以前のバージョンのエンタープライズLinuxオペレーティングシステムで使用されていた古いNtpdの代わりになります。

CentOS 8のNTP(Chrony)インストールと下記の二つの設定方法解説します。

<a href="#section1">①、NTPサーバーとして構成</a>
　　　NTPサーバーとして構成するとクライアントPC又クライアントサーバーがNTPサーバーの時刻を同期可能になります。
<a href="#section2">②、NTPクライアントとして構成</a>
　　　NTPクライアントとして構成すると設定NTPサーバーの時刻を同期することができます。
　　　
<h2 id="section1">NTPサーバーとして構成<h2>
###　1.Chronyインストール
下記のコマンドを実行してインストールする。(既にインストールされていることもあります)　　

```
# yum install -y chrony
```


###　2.設定ファイルを変更-クライアントへアクセス許可

```
# vi /etc/chrony.conf
```
 
上記のコマンドを実行し、Confファイルの下記の箇所を追記します。
今回は**192.168.0.0**から**192.168.0.254**までのローカルネットワークのクライアントPCへアクセス時刻を同期にアクセス許可設定をします。

```
# Allow NTP client access from local netwok　 →　説明コメント
# allow 192.168.0.0/16　　　　　　　　　　　　  →　設定の例
allow 192.168.0.0/24    　　　　　　　　　　　  →　こちらは追加 

```
　　　
 注. [**/24**]はサブネットマスク**255.255.255.0**の**192.168.0.0**から**192.168.0.255**まで**256**個のIP数を表しています。

###　3.chrony再起動
```
# systemctl restart chronyd
```
　　　
###　4.OS再起動時にchronyを自動起動するように設定
```
# systemctl enable chronyd
```
　　　
###　5.ファイアウォール設定　　
クライアントPCからのNTP要求を許可するファイアウォールルールを追加します。

``` 
# firewall-cmd --permanent --add-service=ntp
　　　
# firewall-cmd --reload
```
　　　
###　6.クライアントPCの時刻を同期設定
　　　クライアントPCに上記設定したサーバーをNTPサーバーとして時刻を同期に追加します。
　　　
###　7.同期設定しているクライアントPC確認
下記のコマンドを実行する時刻を同期のためにアクセスしているクライアント一覧の確認できます。

```
# chronyc clients
```
　　　
<h2 id="section2">NTPクライアントとして構成</h2>

###　1.Chronyインストール
```
# yum install -y chrony
```
　　　
###　2.設定ファイルを変更-サーバーディレクティブを追加
      # vi /etc/chrony.conf
既存のサーバーディレクティブをコメントアウトし、NTPサーバーの新しいサーバーディレクティブを追加します。

```
# Use public servers from the pool.ntp.org project.                     →　説明コメントアウト
# Please consider joining the pool (http://www.pool.ntp.org/join.html). →　確認サイトについてコメントアウト
# pool 2.centos.pool.ntp.org iburst　　　　　　　　　　　　　　　　　   　  →　現在時刻を同期ですが、こちらは先頭に#を追記してコメントアウトする
server 192.168.0.21　　　　　　　　　　　　　　　　　　　　　　　　　　     　→　時刻を同期するNTPサーバーのIPアドレスを追記
```
###　3.chrony再起動

```
# systemctl restart chronyd
```
　　
###　4.NTPサーバーに到達確認　　
タイムソースをチェックして、クライアントが正しいNTPサーバーに到達していることを確認します。

```
# chronyc sources　
```  
```
Output:

210 Number of sources = 1
MS Name/IP address         Stratum Poll Reach LastRx Last sample
===============================================================================
^? 192.168.0.21                  3   6     1    25  +2525us[+2525us] +/-   87ms
```
　
###　5.手動時刻を同期　　　
デフォルトは64秒ごとにNTPサーバーにポーリングして同期していますが、同期タイミング待たないで下記のコマンドで同期できます。

```
# chronyc makestep
```

以上。
【python】import sys sys.argv　の使い方

#環境
linux
python
#pythonコード

コードは例として以下のようにする。

```python3:practice.py
import sys

a = sys.argv

print(a)
```

#コマンドプロンプト
以下のコマンドを実行

```
$ python3 practice_home.py linux windows abc
['practice_home.py', 'linux', 'windows', 'abc']

```

すると、以上のように__['practice_home.py', 'linux', 'windows', 'abc']__が出力される。

つまり、sys.argvは __<font color = 'red'>$ pyton3__の__<font color = 'red'>後の文字</font>__が入る。
WLS上のUbuntu 20.04.1 LTSにOpenCV

# 背景
DLの勉強の前準備です。丸2日かかった…。
下記は、少し冗長かもしれません。逆に試行錯誤中に消してしまった可能性も…
proxy突破に時間がかかり、しかもあちこちにパスワード書いてセキュリティ大丈夫か？と具申すると、
セキュリティ担当の管理職が「それはあなたの感想ですね」と軽く恫喝。
…大丈夫か、私の勤務先…

# ファイル編集。

認証付きProxyの環境で導入の為、~/.gitconfig

>[http]
>        proxy = http://id:pass@proxysrv:port/
>[https]
>        proxy = http://id:pass@proxysrv:port/
>[url "https://"]
>        insteadOf = git://


認証付きProxyの環境で導入の為、/etc/wgetrcを編集。

>use_proxy = on
>
>https_proxy = http://プロキシサーバのURL:ポート番号/
>http_proxy = http://プロキシサーバのURL:ポート番号/
>
>proxy_user = ユーザ名
>proxy_password = パスワード

やはり認証付きProxyの環境で導入の為、
管理者権限で、visudoを用いて/etc/sudoersに以下を追加する。

>Defaults env_keep+="http_proxy"
>Defaults env_keep+="https_proxy"

# 下記コマンド実行。

`sudo apt-get install git`
`sudo apt-get install python-pip-whl python-dev`
`git clone https://github.com/jayrambhia/Install-OpenCV.git`
`cd Install-OpenCV/Ubuntu/`

# コマンド実行

上記でProxy完璧のはずなのだが、なぜか消えてるので(空白に注意)、下記を入力する。
`export proxy_user ユーザID`
`export proxy_password パスワード`
`export http_proxy="http://プロキシサーバのURL:ポート番号/"`
`export https_proxy=$http_proxy`

下記を入れる。

`sudo apt-get install opencv-data`
`sudo apt-get install libopencv-dev`
`sudo apt-get install pylint`

# 仕方ない為、ブラウザからダウンロード。

このままだと、「libgstreamer0.10-dev」ありません他、足りないパッケージに悩まされる事になる。
ここの解決にほぼ1.5日使った…。最終的に、Googleに「Ubuntu パッケージ名」を入力してダウンロードする。
https://packages.ubuntu.com/
上記URLのサブディレクトリになる筈。
*くれぐれもバージョン番号には気を付ける事*。

Windowsのわかりやすい所、私はD:の直下に、ダウンロードディレクトリからコピーして/mnt/d/からコピーした。
その上で、コマンド実行。

`sudo dpkg -i libgstreamer0.10-0_0.10.36-1.5ubuntu1_amd64.deb`
`sudo dpkg -i gir1.2-gstreamer-0.10_0.10.36-1.5ubuntu1_amd64.deb`
`sudo dpkg -i libgstreamer0.10-dev_0.10.36-1.5ubuntu1_amd64.deb`
`sudo dpkg -i gir1.2-gst-plugins-base-0.10_0.10.36-2ubuntu0.2_amd64.deb`
`sudo dpkg -i libgstreamer-plugins-base0.10-0_0.10.36-2ubuntu0.2_amd64.deb`
`sudo dpkg -i libjasper1_1.900.1-debian1-2.4ubuntu1.2_amd64.deb`
`sudo dpkg -i libjasper-dev_1.900.1-debian1-2.4ubuntu1.2_amd64.deb`
`sudo dpkg -i libgstreamer-plugins-base0.10-dev_0.10.36-2ubuntu0.2_amd64.deb`


# ようやくOpenCVなのである。

`./opencv_latest.sh`
Windows 10にPython開発環境をインストールする

Macへのインストール方法は[こちら](https://qiita.com/suke_masa/items/3e593f7576e58a02a216)

# 最終更新日

2021年7月2日

検証を行ったWindows 10のバージョンは下記です。

- Windows 10 Home 20H2 19042.1081

インストールするもののバージョンは下記です。

- Python 3.9
- Visual Studio CodeのPython Extension（Visual Studio Code自体のインストールは別記事にて → [WindowsにVisual Studio Codeをインストールする](https://qiita.com/suke_masa/items/91fddf0728a290b72fc4)）

> この記事が古くなった場合、下記の手順は最新のインストール手順とは異なっている可能性があります。

# Python

## インストール
(1) https://www.python.org/downloads/release/python-395/ にアクセスしてください。

(2) [Files]の[Windows installer (64-bit)]をクリックしてください。
![スクリーンショット 2021-06-07 16.39.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/27355e1a-f728-c2a5-2f74-9c099c2d692c.png)

(3) ダウンロードしたEXEファイルをダブルクリックしてください。

(4) [Add Python 3.9 to PATH]にチェックを入れた後、[Install Now]をクリックしてください。
![スクリーンショット 2021-06-07 10.12.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/f81f31db-80b3-d761-9479-7cb3b6094f72.png)

(5) [はい]をクリックしてください。
![スクリーンショット 2021-06-07 10.12.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/03a604e1-e93d-5813-4cc5-af1a347a36ab.png)

(6) [Close]をクリックしてください。
![スクリーンショット 2021-06-07 10.14.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/b28e32fd-d41d-5d6d-fe0a-12f8e5374376.png)


## 確認
(1) コマンドプロンプトを起動してください。

(2) `python --version` を実行してください。下記のように表示されれば成功です。

```bash
C:\Users\tada>python --version
Python 3.9.5
```

# Visual Studio CodeのPython Extension

> Visual Studio Code自体のインストールは別記事にて → [WindowsにVisual Studio Codeをインストールする](https://qiita.com/suke_masa/items/91fddf0728a290b72fc4)

## インストール

(1) Visual Studio Codeを起動してください。

(2) Extensionの検索画面を開いて「python」で検索→MicrosoftのPythonエクステンションをInstallしてください。
![スクリーンショット 2021-07-02 13.31.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/b6f72eaa-2023-f644-c2a9-b62199993d0e.png)
MacでターミナルからコマンドでCPU温度などを確認する方法

:::note info

2024-11現在
現在は使用できるようです。
開発者の方より[コメント](https://qiita.com/watanu/items/5f2234245c2f62a3182a#comment-3a0efa015d74b157f444)いただきました。ありがとうございます。

```
こちら作成しましたので、コマンドで温度を確認されたい場合は是非お試しください。
https://github.com/narugit/smctemp
```


:::

:::note warn

2023-11現在
使用できなくなったようです。残念。
```
powermetrics: unrecognized sampler: smc
```

:::

##結論
```
sudo powermetrics --samplers smc |grep -i "CPU die temperature"
```

を実行

※iSta◯sなどのアプリをインストールしなくても見れます。


##オプションの解説

```
powermetrics
```

というコマンドが端末の情報をコンソールに表示してくれます。
windowsでいう「wmic」みたいな感じなんですね

--samplers
→グループを指定して表示します。見たい情報がわかっているなら指定しておかないと大量に出力されるので使用推奨。

smc
→このグループの情報にCPU温度が含まれています
“CPU die temperature" がCPU温度を指す項目です。

```
powermetrics　--help
```

から他にも色々と確認できるので、アクティビティモニタから見れない情報はこちらで調べてみると良さそうです。

grepは・・・割愛します。



##調べた感想
確認する方法を調べると、iSt○tsを使おうという記事ばかりです。
じゃあiSta◯sはどんな仕組みで温度を確認しているんだってなりますよね。

Satishさんありがとうございます。
https://apple.stackexchange.com/questions/54329/can-i-get-the-cpu-temperature-and-fan-speed-from-the-command-line-in-os-x


以上です。

追記
最近暑いですね。
2021/07/17現在もこのコマンドは使えるようです。
調べてみたところ、10年以上前の端末〜M1チップ搭載の最近のものまで大丈夫そうです。（持ってないので検証してませんがAppleサポートやら英語のページで有識者が書いてました。）
標準コマンド万歳。
AWS Glueで自作関数のインポート

## 自作関数インポートでつまづく
AWS Glueで共通処理や複雑な関数を別ファイルに記述する際は単純なインポートができません。
といってもジョブの作成時にファイルのパスを追加するだけなのですが、ドキュメントの該当部分がなかなか見つからず苦戦したのでメモしておきます

## インポート方法
基本的には
[AWS Glue での Python ライブラリの使用](https://docs.aws.amazon.com/ja_jp/glue/latest/dg/aws-glue-programming-python-libraries.html)
のドキュメントを参考にすれば対応可能です。

pythonファイルをzip化、S3にあげてスクリプトのパス設定が基本の流れとなっています。

今回は以下の簡単な2つの関数をインポートします。1関数1ファイルとなっています。

```py:hello_world.py
def hello_world(name):
    return 'Hello World, ' + str(name)
```

```py:calcu.py
def sum(x, y):
    return x + y
```

この２つのファイルをzipでまとめて今回は適当に`lib.zip`というzipファイルを作成しました。
このzipファイルをs3にあげます。
`s3://example_backet/lib.zip`というパスに配置したとします。
このパスをジョブの作成時または編集で`Python ライブラリパス`という選択肢に記載します。
仮に複数のzipファイルが存在する場合はカンマ区切りで記入します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/290902/21e80c9b-797a-25a4-13cf-7eb40baa085c.png)

これでジョブ作成後はいつものようにimportが可能となります。

```py:sample.py
from hello_world import hello_world
from calcu import sum

hoge = hello_world('hoge') 
sum = sum(1, 2)
```
PowerCMSXとnginx環境でflushエラーに対応

# はじめに
## 対象読者
* [PowerCMS X]() ユーザー
* 以下のエラーに困っている人

## 対応したいエラー
* pt-check.php 実行時に以下のエラーが発生する

> システム出力バッファをフラッシュ(flush())することができませんでした。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/37739/c63e0249-c3d8-188f-bbac-d4a433cadcf0.png)

* このエラーが起きていると、フロントに対していつまでも結果が返ってこないままで固まってしまうということが起きうる

## 動作確認環境
* Ubuntu 20.04
* PHP 7.4 + PHP-FPM 7.4
* nginx
* PowerCMS X 2.20


# やること
## nginx の設定書き換え
### 編集内容
* `location ~ \.php$` ディレクティブの中に `fastcgi_buffering off;` を追記
    * `fastcgi_buffers 8 128k;` `fastcgi_buffer_size 256k;` 等の記述があれば削除

### 記述サンプル
```nginx
# 前略

  location ~ \.php$ {
    fastcgi_buffering off;
    fastcgi_read_timeout 300;
    fastcgi_intercept_errors on;
    fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
    fastcgi_index index.php;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    include fastcgi_params;
  }

# 後略
```

### 参考
* [nginx - Module ngx_http_fastcgi_module](http://nginx.org/en/docs/http/ngx_http_fastcgi_module.html#fastcgi_buffering)



## 結果
* エラー文が表示されなくなればよし

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/37739/6857a9b9-d5f8-b484-84df-8e23eb52ad56.png)


## apache の場合……
* オマケです。apache の場合は公式ドキュメントに記載があります
    * [PowerCMS X - ドキュメント - インストール](https://powercmsx.jp/about/install.html)
* 以下のように記述してあげればよいようです
    * php-fpm の sock の path などは各自環境にて

```apache
<Proxy unix:/run/php-fpm/www.sock|fcgi://localhost>
    ProxySet flushpackets=on flushwait=20
</Proxy>
```


# おわりに
## 感想
* PowerCMS X 2.16 までは発生していなかったので 2.20 へ ver.up するにあたっての現象ですかね。ひとまずフロントに対しては処理した旨を返し、あとはバックエンド側で処理を続けておくというかたちになっているようです
* この場合、バックエンド側でエラーが発生したらログが出力されるはずですが、そのエラーログを検知するしくみを別途用意しておかないとならない……？🤔
cuDNNをダウンロードしようとしたらNVIDIA developerのアカウントが消えてた

cuDNNをダウンロードするためには、[NVIDIAのページ](https://developer.nvidia.com/cudnn-download-survey)からダウンロードしないといけません。

![スクリーンショット 2020-10-13 16.22.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/208566/8e288558-e5ac-1e54-96bf-7be92cb68f8b.png)

ダウンロードしようとしたら↑のようなページに飛ばされるはずです。ちなみに「Login」も「Join now」もリンク先は同じなのでどちらを押しても変わりません。

最近、久々にcuDNNを使って環境構築する機会があったので、ログインしようとしたのですが、ログインできなくなっていました。そもそもcuDNN自体、頻繁にダウンロードするものじゃないので、アカウントのメールアドレス・パスワードをド忘れしたのかと思ったのですが、どうやら違うようです。

以下に解決方法を書いていきます。

## 解決方法

公式は以下のような文章を出しています。

![cudnn.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/208566/9db347b1-8732-d412-e8a0-c632fdedabaa.png)

「**NVIDIA developer**」のアカウントが「**NVIDIA**」のアカウントに統合されたらしいです。
最初、何の違いがあるのかさっぱり分からず時間を溶かしてしまいました。

これからは、今までの「NVIDIA developer」のアカウントではcuDNNをダウンロードできないようで、「NVIDIA」のアカウントを作成し、「NVIDIA developer」のアカウントと紐付けする必要があります。

![スクリーンショット 2020-10-13 16.27.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/208566/927e1f16-af22-547f-05a8-f6b9cf01412a.png)

↑のログイン画面から、「Create account」を選択し、「NVIDIA」のアカウントを作りましょう。
「NVIDIA」のアカウントを作ったかどうか忘れてしまった場合、「Need help logging in?」から、「RESET PASSWORD」を選択し、パスワードをリセットしましょう。「NVIDIA」のアカウントが作成されていなければ、アカウントが存在しないというメールが届きます。
[Kotlin]IPアドレスとユーザーエージェントの取得方法

```kotlin
import javax.servlet.http.HttpServletRequest

fun function(request: HttpServletRequest) {
    val ipAddress: String = request.remoteAddr // "127.0.0.1"
    val userAgent: String = request.getHeader("user-agent") // "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.125 Safari/537.36"
}

```
【自分用】サーブレットクラスの処理の転送

【課題】乱数を発生させて、偶数が生成された場合はフォワードに、
奇数が生成された場合はリダイレクトに処理を転送する

<h3>【サーブレットクラス】</h3>

```java

package p185;

import java.io.IOException;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/P185")
public class P185 extends HttpServlet {
	private static final long serialVersionUID = 1L;
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		int Ran=(int)(Math.random()*10);
		if(Ran%2==1) {
			response.sendRedirect("/example/redirected62.jsp");
		}else{
			RequestDispatcher dispatcher =request.getRequestDispatcher("/forwarded62.jsp");
			dispatcher.forward(request,response);
		}
	}
}


```
a
<h3>【リダイレクト(jspファイル)】</h3>

```html

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>リダイレクトサンプル</title>
</head>
<body>
<h1>リダイレクトのサンプルを表示</h1>
</body>
</html>

```


<h3>【フォワード(jspファイル)】</h3>

```html

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>フォワードサンプル</title>
</head>
<body>
<h1>フォワードのサンプルを表示</h1>
</body>
</html>

```
デプロイ後に背景画像が適用されない場合の対処法

# この記事を書いた背景
デプロイしたら背景画像が表示されない！
調べたら結構そういう人いたため。

# 実施環境
macOS Catalina 10.15.7
VS Code 1.50.0
Ruby 2.6.5
Rails 6.0.0
サーバー：AWS EC2
WEBサーバー：Nginx
アプリケーションサーバー：unicorn 5.4.1

# 対処法
僕はこれでいけました。
デプロイ後、本番に上がったアプリ等で背景画像が表示されます。

### ①背景画像は『/app/assets/images』フォルダに格納する
### ②背景画像を指定するCSSの種類を『SCSS』にする
### ③背景画像を指定するCSSの記述『background-image: image-url("画像名");』


```css:scss
/*例*/
body { 
  background-image: image-url("wallpaper.jpg");
}
```

※この記述だと逆にローカル環境で背景画像が表示されない...笑
[超超初心者向け]オブジェクト指向とは

#オブジェクト指向とは

オブジェクト指向について復習する機会があったので、ここでアウトプットしておく。

今回は以下の書籍を参考に学習した。
[「スッキリわかるJava入門」 中山清喬・国本大悟 著](https://sukkiri.jp/books/sukkiri_java3)



##オブジェクト指向の定義
この書籍ではオブジェクト指向は

>ソフトウェアを開発するときに用いる**部品化の考え方**のこと

と定義されている。
ここで言う、部品というのはJavaにおけるクラスとも言いかえられる。
世の中にある部品（人物やもの）をクラスとして記述することで、それらの特徴や行動をプログラム化(
自動化）できる。



##オブジェクト指向の目的
**オブジェクト指向の目的**は、人間が把握しきれない複雑さを克服するため、つまり**「ラクして、楽しく、良いもの」を作ること**が目的である。
保守性がどうとか、再利用が上がるとかそんな難しい言葉で言われても、オブジェクト指向触れたて、プログラマー初心者にはいまいちピンと来ない。
ただ、この「ラクして、楽しく、良いもの」を作ることができれば、プログラマーにとっても良いこと尽くし。
残業は減るし、読みにくいコードを見てストレスを感じることも減る。

まあ、とりあえず今はこんな感じの簡単な理解でひとまず置いておくとする。

>批評の第一原則は、「まず、<この本がわかった>と、ある程度、確実に言えること。そのうえで、<賛成>、<反対>、<判断保留>の態度を明らかにすること」である
>-省略-
>判断を保留することもまた、一つの批評行為である。
[引用文献:「本を読む本」M.J.アドラー C.Vドーレン著](https://bookclub.kodansha.co.jp/product?item=0000150900)



##オブジェクト指向の本質
現実世界の人物の特徴や振る舞いを再現したもの（オブジェクト）を、クラスなどを使って生み出すことにある。

例えば**人物の特徴はクラス内のフィールド**に、**振る舞いはメソッド**に記述することでそれが実現されていく。

#まとめ
オブジェクト指向とは
**現実世界と仮想世界の架け橋**となり、今よりも便利でより良い世界を創るための考え方ともいえる。
【GCP】BeyondCorp Remote Access実装〜GCPを介して公開中サイトへ接続〜



構成図
 作成中

準備
テスト用のドメインを2つ用意（Azureのインスタンスにひもづけるもの、HTTPSロードバランサにひもづけるもの）お名前ドットコムなどで用意してください。



AzureにWebサーバを構築する
以下のドキュメントにもとづき、「WordPress の構成」の最後まで実施する。
https://docs.microsoft.com/ja-jp/azure/virtual-machines/linux/tutorial-lamp-stack
生成されたIPアドレスを、準備していた「Azureのインスタンスにひもづけるもの」のドメインのAレコードにひもづける
※取得したドメイン事業者の設定方法に準じてください。

IAP Connectorを設定する
【参考URL】
https://dev.classmethod.jp/articles/beyondcorp-remote-access-getting-started1/
https://cloud.google.com/iap/docs/enabling-on-prem-howto?authuser=2&hl=ja&_ga=2.167698558.-1346874108.1593496033&_gac=1.28074574.1601269179.CjwKCAjw8MD7BRArEiwAGZsrBeDInXWIg-vBSzJFQxJMuuCk9WonpM2wKFPtwbgVdBSEFGwEzxqKnhoCnPIQAvD_BwE

PJを作成する
以下のAPIを有効化する
Compute Engine API
Google Kubernetes Engine API
Cloud Deployment Manager API V2
IAMに移動し、「Google APIサービスエージェント」というアカウントにGKE管理者の権限を追加。
用意していたHTTPSロードバランサにひもづけるドメインに以下のCAAレコードを追加する。
CAA 0 issue "letsencrypt.org"
    0 issue "pki.goog"
Cloud Load Balnacingのページにて、「詳細設定メニュー」をクリック。
[証明書]タブをクリック。
[+ SSL証明書を作成]をクリック。
以下の項目を入力
名前：任意
作成モード：[Googleマネージドの証明書を作成する]にチェック
ドメイン：HTTPSロードバランサにひもづけるドメインを入力
cloud shellを起動
以下のコマンドを入力
git clone https://github.com/GoogleCloudPlatform/iap-connector
cd iap-connector/

vim iap-connector.yaml のコマンドを入力し、iap-connector.yamlを編集。
resources.properties.zone: GKEクラスタを展開するゾーンを入力します
resources.properties.serviceAccountName: 手順1で設定したGoogle APIサービスエージェントのアカウント名
resources.properties.routing.name: 任意の設定名。Deployment Managerのデプロイ名になります
resources.properties.routing.mapping.source: Cloud Load Balancingに割り当てるドメイン
resources.properties.routing.mapping.destination: 転送先（IPアドレスは不可。Azureのインスタンスにひもづけたドメインを記載）
resources.properties.tls: 手順1で作成したSSL証明書名
末尾3行はオプションのプロパティです。/iap-connector.py.schemaファイルに説明があります。今回は動作確認用途なので、GKEクラスタノードの利用料金をなるべく安くなるようにしてみました。

作成例
imports:
- path: iap-connector.py

resources:
- name: iap-connector
  type: iap-connector.py
  properties:
    zone: asia-northeast1-a
    serviceAccountName: XXXXXXXXX@cloudservices.gserviceaccount.com
    routing:
     - name: test-bcra-com
       mapping:
        - name: host
          source: test-bcra.com
          destination: test-azure-bcra.com
    tls:
     - test-bcra-com
    preemptible: true
    initialNodeCount: 1
    replicas: 1

以下のgcloud コマンドでCloud Deployment Managerのデプロイを実行します。
gcloud deployment-manager deployments create test-bcra-com --config=iap-connector.yaml
※test-bcra-comはresources.properties.routing.nameと合わせてください。
※作成まで5分ほどかかります。

作成が完了しましたら、HTTPSロードバランサに付与されているIPアドレスを用意していた「HTTPSロードバランサにひもづけるもの」のドメインに紐付けてください。
※しばらくするとHTTPSロードバランサの証明書で、provisioningが完了します。

ブラウザからHTTPSに紐付けたドメインにアクセスし、Azureインスタンスに接続できるか確認してください。
（GCPを介してAzure側に接続できているかの確認です。）

IAPの画面から、Resource列で「default/」となっている行のIAPのスイッチをONにしてください。
※ステータスが「エラー」とでますが、こちらはwarningなので、エラーが出ていても問題はありません。

上記と同じ行のチェックボックスにチェックをつけてください。
右側に情報パネルが表示されますので、メンバーを追加をクリックしてください。
許可したいGoogleアカウントを新しいメーンバーに入力し、ロールを選択から、[IAP-secured Web App User]を選択してください。

上記でアクセスしたURLに再度アクセスし、Googleにログインの画面が表示されれば成功です。
【Unity】Fungusのキャラクター表示をLuaで操作する方法

[前の記事](https://qiita.com/Humimaro/items/76e1730dde5c359f61ba)の続きになります。

前提条件としてHierarchyにFlowchart、LuaEnvironment、LuaScriptの３つの配置が必要です。


#ステップ１　HierarchyにCharacterを配置する

Tools　＞ Fungus　＞　Create　＞　Character
を選択し、HierarchyにCharacterを配置します。

![step1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/31c2c38c-565d-8c50-d53a-69674f3d44d8.png)

#ステップ２　CharacterのNameText、Portraitsの設定

配置したCharacterのNameTextで名前を変更し、Portraitsにキャラクターの画像を追加します。
Portraitsは複数配置でき、表情の差分を登録できます。

![step2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/5d80cdd5-33b5-ffcb-c1ed-a7312089bf6d.png)

![step3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/f4a75ba8-7246-cf3d-2621-3dbfffddeab2.png)


#ステップ３　HierarchyにLuaBindingsを配置する

Tools　＞ Fungus　＞　Create　＞　LuaBindings
を選択し、HierarchyにLuaBindingsを配置します。

![step4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/9396720c-9edb-7662-2414-8afdfe06c761.png)

#ステップ４　LuaBindingsにCharacterを登録する

ステップ３で追加したLuaBindingsのObjectBindingsにステップ２で配置したCharacterを登録します。
Key名を任意の名称に変更してください。この名前でLuaからキャラクターを表示します。

また、ObjectBindingsのComponentをFungus.Characterに変更してください。

![step5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/2a190554-d3cc-c615-070f-3da4fa9295f2.png)


#ステップ５　Luaからキャラクターを呼び出す方法

Luaからsetcharacter関数を呼び出します。

```lua
setcharacter(tesuko, "Actor4_0_0_L00")
```

第一引数はステップ４で登録したObjectBindingsのKey
第二引数はステップ２で登録したPortraitsのElementにあるSprite名を文字列
で指定してください。

第二引数を変更することで表情の差分を切り替えることができます。

うまくいけば下の画像のようにキャラクターが表示されます。

![step6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/76537/8a04e398-647f-f015-25a8-76965d95404a.png)
ReactでAPIを呼び出したところ、CORSエラーが発生。その対処方法

# ReactでpixabayのAPIを使って画像検索アプリケーションを作成した際にCORSエラーが発生

エラー内容

```
Access to XMLHttpRequest at 'https://pixabay.com/api/?q=animal' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
```

エラーの発生経緯

```React

const App =()=>{
  const [images, setImages]= useState([]);
  const ApiKey = process.env.REACT_APP_PIXABAY_APIKEY;
  const onSearchSubmit =async(term)=>{
    try{
      const params={
        key: ApiKey,
        q: term,
      };
      const response= await axios.get('https://pixabay.com/api/', { params });
      setImages(response.data.hits);
```

上記のようにAPIキーを環境変数に記述し、App.jsに引き渡す処理を実装した際に発生。
色々と検索してみた結果以下の記事を発見、参考にしてみました。

[なんとなく CORS がわかる...はもう終わりにする。
](https://qiita.com/att55/items/2154a8aad8bf1409db2b)

なるほど。セキュリティ上の問題か〜賢い！そしておもしろい！
参考にしていじってみよう。

そして10年後・・・・（冗談）

# サーバーを再起動したら解決

いろいろと試行錯誤した結果、「まさか！」と思い、
control+cして、yarn startしたところ、普通に解決しました。
なぜだ・・・。

一日中サーバー起動しっぱなしで作業してたからですかね？
詳しい方、教えていただけますと幸いです。。。

再起動したら改善されることは、よくあることなので覚えておこう。
CodeIgniter4は簡単にmime typeから拡張子を取得できる

画像をアップロードしてサムネイルを作成するようなjavascript系ライブラリを組み込んだ場合、最終的なデータがbase64エンコードされた文字列としてPOSTされることがあるが、PHPでここから拡張子を取得するのは地味に面倒くさい。
（大抵の場合はライブラリ側で拡張子を決め打ちしてしまうが）

拡張子を取得する例としては大まかに２通りで

### 例1. BASE64文字列から取得する  
```php
$data = 'data:image/jpeg;base64,/9j/hogefuga....';
$pos  = strpos($data, ';');
$type = explode(':', substr($data, 0, $pos))[1];
```

### 例2. mime typeと拡張子を対応付ける配列を用意する

こんな配列を作成して引っ張ってくる

- [PHPでMIMETYPEから拡張子を判定する用の配列](https://qiita.com/380miya/items/f36343296086aae8c34a)


一般に後者が使われることが多く見られるが、ぶっちゃけ面倒くさいというか、こんなの書きたくない。

### こんな面倒なことはしなくていい、そう、Codeigniter4ならね

Codeigniter4には`/app/Config/Mimes.php` というファイルにmime typeと拡張子を紐付ける配列が既に存在しており、かつ、このファイル内に **拡張子を予測するメソッドが存在する**。
なお、これは

- マニュアルには記載がない
- CodeiIgniter3には配列の拡張子 → mime type 用の配列しか存在しない。

それがこれ

```/app/Config/Mimes.php
/**
 * Attempts to determine the best file extension for a given mime type.
 *
 * @param string $type
 * @param string $proposed_extension - default extension (in case there is more than one with the same mime type)
 *
 * @return string|null The extension determined, or null if unable to match.
 */
public static function guessExtensionFromType(string $type, ?string $proposed_extension = null)
{
	$type = trim(strtolower($type), '. ');

	$proposed_extension = trim(strtolower($proposed_extension));

	if (! is_null($proposed_extension) && array_key_exists($proposed_extension, static::$mimes) && in_array($type, is_string(static::$mimes[$proposed_extension]) ? [static::$mimes[$proposed_extension]] : static::$mimes[$proposed_extension]))
	{
		return $proposed_extension;
	}

	foreach (static::$mimes as $ext => $types)
	{
		if ((is_string($types) && $types === $type) || (is_array($types) && in_array($type, $types)))
		{
			return $ext;
		}
	}

	return null;
}
```

素晴らしいことに **staticなメソッド** なのでどこからでも利用可能である。

```php
public function postbase64image() {
	$request = \Config\Services::request();
	$data = $request->getPost('imagedata');
	
	// 先頭部分を削除するのは自力で書く必要がある
	$data = str_replace(' ', '+', $data);
	$data = preg_replace('#^data:image/\w+;base64,#i', '', $data);
	$data = base64_decode($data);

	// mime typeを含む画像情報を取得
	$fileInfo = getimagesizefromstring($data);
	
	// 拡張子を取得
	// 第2引数で同じmimeタイプの拡張子が複数ある場合の優先する拡張子を設定可能
	// 指定しない場合（null）、はMimes.phpの配列の前にあるものが優先される。
	// 例えば、application/octet-stream は第2引数を指定しない場合 csv になる。
	echo \Config\Mimes::guessExtensionFromType($fileInfo['mime']); // jpg とか png とか。

	// あとは保存するだけ
}
```

Codeigniter4にはマニュアルにないこういったメソッドが沢山潜んでいるので、「これは・・」と思ったときは探してみると良い。


`data:image　～ ;base64` を削除するのも楽な方法ないかなぁ・・・
pyenvとvenvで仮想環境を構築する

Pythonの環境を構築することがあったので備忘録としてまとめておきます。
#使用環境
Mac Catalina 10.15.6

# 仮想環境の構築に使うもの
仮想環境を構築する上でよく使われるものは

- pyenv
- venv
- virtualenv
- pipenv
- Anaconda
- Docker 

など様々ありますが、今回は手軽にできる pyenv と venv で構築したいと思います。
ではそれぞれのインストール方法です。

## pyenv
pythonのバージョンを管理するツールです。
これひとつで Python 2系もPython 3系も同時に管理できる優れものです。

### pyenv のインストール方法
#### 1. Homebrew からインストール

```ターミナル.
brew install pyenv
```

Homebrewをインストールしていない場合は、

```ターミナル.
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)" 
```
で実行してHomebrewをインストールできます。

#### 2. pyenv 用の .profile を作成
pyenv 用に PATH を通します。
自分のホームディレクトリ直下に .zshrc を作成して以下のように記述します。
ちなみに

```ターミナル.
cd 
pwd
```
で自分のホームディレクトリがわかります。

```/Users/ユーザー名/.zshrc
export PYENV_ROOT="$HOME/.pyenv"
export PATH="$PYENV_ROOT/bin:$PATH"
if command -v pyenv 1>/dev/null 2>&1; then
  eval "$(pyenv init -)"
fi
```

ここまできたら一度ターミナルを閉じます。

もう一度立ち上げ、

```ターミナル.
pyenv -help
```

でエラーが起きなければ pyenv のインストールは完了です。

###python のインストール
####1.Python の確認
現在pyenvによってインストール可能なPythonのバージョンを確認してみます。

```ターミナル.
pyenv install --list
```
羅列したバージョンの中から自分に合うものを選びます。

####2. インストール

```ターミナル.
pyenv install [自分に合うバージョン]
例) pyenv install 3.8.5
```

####3. 選択したPythonのバージョンをデフォルトに設定

正しくインストールされているか確認します。

```ターミナル.
pyenv versions
  system
  3.8.5
```
このように先ほどインストールしたものが表示されていればOKです。
では、インストールしたバージョンをデフォルトに設定します。

```ターミナル.
pyenv global [自分に合うバージョン]
例) python global 3.8.5
```
では確認します。

```ターミナル.
pyenv versions
  system
* 3.8.5  (set by /Users/ユーザー名/.pyenv/version)
```

このようにセットされていればOKです。

一応Pythonのバージョンを確認しておきます。

```ターミナル.
python -V
3.8.5
```
このように変わっていれば完璧です。

また蛇足かもしれませんが、このままだと Jupyter などで使用できない場合があるので、pip をアップデートすることをお勧めします。

```ターミナル.
pip install --upgrade pip
```


##venv (virtualenv)
venv と virtualenv はどちらも、 Python のモジュール・ライブラリをプロジェクト毎に管理することができるツールです。
ただし、Python ３系には venv が元々搭載されているのに対し、Python 2系は virtualenv をインストールする必要があります。
基本的な部分は変わらないので、今回はPython 3系に準じていきます。

####1. virtualenv のインストール　（python 2系のみ）

```ターミナル.
pip install virtualenv
```
####2. プロジェクトに移動

```ターミナル.
cd path/to/プロジェクト
```
このように、仮想環境を適用したいプロジェクトの直下に作成するのが慣例のようです。

####3. 仮想環境作成

```ターミナル.
※ Python 2系
virtualenv [作成する仮想環境名]

※ Python 3系
python -m venv [作成する仮想環境名]
```

これで仮想環境が作成されました。
どうやら`.venv`で作成することが慣例のようです。

####4. 仮想環境をアクティベートする
仮想環境は持っているだけでは意味がありません。ドラクエの武器と同じです。
アクティベートはドラクエでいう装備です。
プロジェクト直下で以下のコマンドを行います。

```ターミナル.
source [仮想環境名]/bin/activate
もしくは
. [仮想環境名]/bin/activate

例) . .venv/bin/activate
```

もしWindowsで実施する場合

```
. .[仮想環境名]/Scripts/activate
```
でアクティベートしてください。
これでターミナルが

```
(仮想環境名): ~
例) (.venv): ~
```
ってなればアクティベートできています。

この状態で `pip install`すると全て venv に蓄積されるので、ローカル環境は汚染されずにすみます。

ちなみにディアクティベートは

```ターミナル.
deactivate
```
でOKです。
【AWS初学者用】AWS VPCとは?

# 本記事について
本記事はAWS初学者の私が学習していく中でわからない単語や概要をなるべくわかりやすい様にまとめたものです。
もし誤りなどありましたらコメントにてお知らせいただけるとありがたいです。

## AWS ネットワーク図
VPCとは何か？の前にAWSのネットワーク図を簡単ではありますが作成しました。（見辛くてすみません..)
![AWS ネットワーク図 (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/782134/f089176c-1931-bd42-815e-9dec050d4112.png)


VPCの中身はたくさんあってとても覚えづらいですね。理解するのに時間かかりそうですが、VPCはAWSサービスを利用する上でとても大切なのでしっかり学習します！

## VPC(Virtual Private Cloud)
VPCは名前の通り、AWS上にプライベートなネットワーク空間を作成できるサービスです。
通常、AWS上のハードウェアやインフラストラクチャは全ユーザーに共有された状態ですが、VPCを利用することでユーザーごとにプライベートネットワークを構築できます。

VPCを利用する上で欠かせない物がたくさんあるのでまとめていきます。

## サブネット
サブネットとはネットワークを分割した小さなネットワークで、VPCには1つ以上のサブネットは存在します。
サブネットはAZ(アベイラビリティゾーン)を指定する必要があります。(AZについては過去の記事で紹介してます。https://qiita.com/petite_amelie/items/ae20ae046bf9a198abde)
サブネットには2種類存在し、パブリックサブネットとプライベートサブネットが存在します。

### パブリックサブネット
パブリクサブネットは外のネットワークと**直接つながっているサブネット**です。

### プライベートサブネット
プライベートサブネットは外のネットワークと**直接つなげることができないサブネット**です

基本的にWEBサービスを開発する場合は外部からの攻撃を受ける可能性を考えて、プライベートサブネットにリソースを置くことが望ましいみたいです。

## インターネットゲートウェイ(IGW)
インターネットゲートウェイとはVPC内から外のネットワークへ繋ぐための通路の様な役割を持っています。
インターネットゲートウェイをVPCにアタッチすることで、VPCないのシステムはインターネットへアクセスできます。

## NATゲートウェイ
NATゲートウェイはプライベートサブネットから外のネットワークへ繋ぐための役割を持っています。
先ほど「インターネットゲートウェイは外のネットワークへ繋ぐ役割を持っている」と言いましたが、プライベートサブネットは直接IGWには繋げません。なのでNATゲートウェイを利用して、IGWに接続し外のネットワークにアクセスします。
この一連の流れは「ネットワーク図」の緑の矢印が表しています。

NATゲートウェイを利用せずにプライベートサブネットを外のネットワークへ繋ぐことも可能みたいです。その場合は**NATインスタンス**というEC2インスタンスを利用して接続するとのことです。

## バーチャルプライベートゲートウェイ(VPゲートウェイ)
バーチャルプライベートゲートウェイはオンプレミス環境に接続する際に利用されます。
IGWはインターネットへ、VPゲートウェイはオンプレミス環境へ繋ぐということですね。

## VPCエンドポイント
VPCエンドポイントはゲートウェイ型とインターフェイス型があり、どちらもAWSのサービスへインターネットを経由せずにプライベート接続を可能とするアクセスポイントみたいです。

## VPCピアリング接続
VPCピアリング接続は異なるVPC間を接続するサービスです。
通常、VPCはプライベートネットワークなので異なるVPC間の接続はできませんが、VPCピアリングを使えば可能になるとのことです。

## まとめ
AWS初学者の私からすると、とてもハードな内容でしたがAWSを利用する上では欠かせない内容とのことだったのでがんばりました...
もし理解が間違っているところあればご指摘頂けると幸いです！
爆速でZabbixサーバを構築する（CentOS 7）

# 今日の目標　

Zabbixサーバを構築する手順を整理する

#環境
CentOS7
Zabbix 4.0

## SElinux 無効化

```
vi /etc/selinux/config

SElinux=disabled
```
設定を反映させるため、再起動します。

```
# reboot
```

## Zabbixのインストール

```
# yum update
```
今回はZabbix4.0　のRPMリポジトリをインストールします。

```
# rpm -Uvh https://repo.zabbix.com/zabbix/4.0/rhel/7/x86_64/zabbix-release-4.0-2.el7.noarch.rpm
# yum clean all

```

こちらのツールも同時にインストール

```
# yum -y install yum-utils
# yum-config-manager --enable rhel-7-server-optional-rpms
# yum -y install zabbix-server-mysql zabbix-proxy-mysql zabbix-web-mysql zabbix-agent
```
## DBをインストール

```
# yum install mariadb mariadb-server 

```
Maria DB を自動起動設定にします。

```
# systemctl enable mariadb.service
# systemctl start mariadb.service
```
## DBの初期設定をします。

```
# mysql_secure_installation

Enter current password for root (enter for none):
Set root password? [Y/n] Y
New password:なんか適当に
Re-enter new password:なんか適当に
Remove anonymous users? [Y/n] Y
Disallow root login remotely? [Y/n] n
Remove test database and access to it? [Y/n] Y
Reload privilege tables now? [Y/n] Y
```

```
mysql -uroot -p
Enter password:

MariaDB [(none)]> create database zabbix character set utf8 collate utf8_bin;

Query OK, 1 row affected (0.01 sec)

grant all privileges on zabbix.* to zabbix@localhost identified by 'password'; --なんか適当にパスワード

MariaDB [(none)]> quit;
Bye

```

## 初期データとスキーマをインポート

```
zcat /usr/share/doc/zabbix-server-mysql*/create.sql.gz | mysql -uzabbix -p zabbix
Enter password: # 上記のパスワード
```
## Zabbixサーバのデータベース設定をする

```
vi /etc/zabbix/zabbix_server.conf
DBPassword= #上記のパスワードを入力
```
## Zabbixフロントエンドのタイムゾーンを設定


```
# vi /etc/httpd/conf.d/zabbix.conf
↓をよしなに変更
php_value date.timezone Asia/Tokyo

```
## Zabbixサーバ再起動

```
systemctl restart zabbix-server httpd zabbix-agent
systemctl enable zabbix-server httpd zabbix-agent
```
### Zabbixにアクセス
http://YOUR_IP/zabbix/
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/207ad840-1efb-d13c-abce-459ae9214a4c.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/91419849-a48b-356c-7e29-ac6ea2d263bc.png)

DBパスワードを入力（設定したパスワード）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/da493670-c1c9-0b66-bdec-732a8e2fb737.png)

デフォルトはホスト名 「localhost」だが「zabbix」に変更

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/7d94d173-e2e4-d2d8-76b7-25e14a45a09b.png)


設定内容を確認

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/06027bea-a59b-5fe3-d92f-4f85ca52e002.png)

無事インストールが出来たことを確認

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/ffac239c-1d1c-4b1f-f8e5-dc6e476ff20c.png)

デフォルトでUsername Admin  Password zabbix

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/e4a68e5f-3c8d-468d-afe4-29a44f7201ce.png)

やった！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/bb0a13bb-c8f0-7717-d2ae-32d4c707f1ac.png)

参考文献

[電算星組](https://densan-hoshigumi.com/server/zabbix-4-4-centos7-apache-mariadb-install)
ubuntuのjqコマンドで四捨五入する（round, ceil関数がない場合と、その対策）

# はじめに
`jq`コマンドで四捨五入するための四苦八苦を記載します。

# 環境
カテゴリ|バージョン
---|---
OS|Ubuntu 18.04(WSL 1)
jqコマンド|jq-1.5-1-a5b5cbe (aptからインストール)

aptでインストールできるjqコマンドは、普通に演算で使う、四捨五入の`round`関数、切り上げの`ceil`関数が使えません。

```shell
$ echo '{"a":100,"b":8}' |jq '.a / .b'
12.5

$ echo '{"a":100,"b":8}' |jq '(.a / .b)|floor' #切り捨て
12

$ echo '{"a":100,"b":8}' |jq '(.a / .b)|round' # 四捨五入したい -> 13
jq: error: round/0 is not defined at <top-level>, line 1:
(.a / .b)|round
jq: 1 compile error

$ echo '{"a":100,"b":8}' |jq '(.a / .b)|ceil' #切り上げたい -> 13
jq: error: ceil/0 is not defined at <top-level>, line 1:
(.a / .b)|ceil
```

[マニュアル](https://stedolan.github.io/jq/manual/v1.5/#Math
)によると「C言語ライブラリの関数は使える」という感じでしたが、使えない関数もあるようです。

```
Availability of standard math functions depends on the availability of the corresponding math functions in your operating system and C math library. Unavailable math functions will be defined but will raise an error.

```

というわけで、他の方法で回避します。

# 四捨五入する(round)

```shell

$ echo '{"a":100,"b":8}' |jq '(.a / .b) + 0.5 | floor' #100 / 8 = 12.5
13

```
# 切り上げる(ceil)
※JSONの演算結果が小数第一位までであることが前提のコードです

```shell
$ echo '{"a":100,"b":8}' |jq '(.a / .b) + 0.9 | floor' #100 / 8 = 12.5
13
```

# テスト

```shell
# 四捨五入
$ echo '{"a":100,"b":8}' |jq '(.a / .b) - 0.1 + 0.5 | floor' # 12.5 - 0.1 = 12.4
12
$ echo '{"a":100,"b":8}' |jq '(.a / .b) + 0.5 + 0.5 | floor' # 12.5 + 0.5 = 13
13

# 切り上げ
$ echo '{"a":100,"b":8}' |jq '(.a / .b) -0.1 + 0.9 | floor' # 12.5 - 0.1 = 12.4
13
$ echo '{"a":100,"b":8}' |jq '(.a / .b) + 0.5 + 0.9 | floor' # 12.5 + 0.5 = 13
13
```


# 余談
検索してみると、`jq` 1.6なら対応しているとか、ディストリビューションによって使える関数が異なるとか、このあたりの議論が錯綜しているようです。
https://stackoverflow.com/questions/59063536/how-to-round-floor-ceil-truncate

（´-`）.｡oO（素直に公式のjqを使った方がいいかもしれません）
Combineでkeyboard通知を受け取る

Appleが[Combine移行として用意した記事](https://developer.apple.com/documentation/combine/performing-key-value-observing-with-combine)は

- NotificationCenter
- 非同期処理
- KVO(Key-Value Observation)
- Timer処理

の4本です。

今回の記事では「Combineを利用してNotificationCenterでkeyboard関連通知を受け取る」という解説をします。

# 旧来の書き方
Combineを使わないものでは、ViewControllerなどで以下のような処理を記述していました。

`removeObserver`を実行している記事もありますが、[iOS9以降は不要になっています](https://developer.apple.com/documentation/foundation/notificationcenter/1415360-addobserver)。

```swift:old.swift

import UIKit

class ViewController : UIViewController {

    override func viewDidAppear() {
        NotificationCenter.default.addObserver(self,
                                               selector: #selector(keyboardWillShow(notification:)),
                                               name: NSNotification.Name.UIKeyboardWillShow,
                                               object: nil)

        NotificationCenter.default.addObserver(self,
                                               selector: #selector(keyboardWillHide(notification:)),
                                               name: NSNotification.Name.UIKeyboardWillHide,
                                               object: nil)
    }

    @objc func keyboardWillShow(notification: Notification) {
        ...
    }

    @objc func keyboardWillHide(notification: Notification) {
       ...
    }

}

```

# Combine利用
Combineでは`publisher`を利用して記述します。今回はオペレーターをいくつか繋げて、keyboardのフレームを取得するようなコードにしてみます。

`receive(on:)`は、downstreamの実行スレッドや同期・非同期などを指定できるオペレーターですが、UI周りで使うときはmainスレッドで動いてくれないと予期しない挙動を引き起こすので、必ず`RunLoop.main`もしくは`DispatchQueue.main`を渡すようにします。

```swift:combine.swift

import UIKit
import Combine

class ViewController : UIViewController {
    
    private var cancellables: Set<AnyCancellable> = .init()

    override func viewDidLoad() {
         NotificationCenter
            .default
            .publisher(for: UIResponder.keyboardDidShowNotification, object: nil)
            .compactMap({ $0.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect })
            .receive(on: RunLoop.main)
            .sink { (keyboardFrame) in
                 // 何らかの処理
            }
            .store(in: &cancellables)

        NotificationCenter
            .default
            .publisher(for: UIResponder.keyboardDidHideNotification, object: nil)
            .receive(on: RunLoop.main)
            .sink {
                // 何らかの処理
            }
            .store(in: &cancellables)
    }


}

```
ローカルブランチを新規ブランチとしてプッシュしたいとき

#### 環境
- SourceTree

#### やりたいこと
ローカルにあるブランチを、新規ブランチとしてリモートにプッシュしたい。
コマンドはできればギリギリまで触れたくない。


## 手順
大元にしたいブランチをチェックアウト
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/dbaffc25-6eab-1d03-31db-9f88d7334f69.png)

チェックアウトするときに名前を変えておく
（masterのままだと新規ブランチにできないので）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/0ac34f47-3abe-e425-a904-04c3789ecd15.png)

SourceTree上のUI操作では新規ブランチとしてプッシュできないので
ターミナルを起動
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/d37bb1ef-99eb-328b-1e37-5bb38d13279e.png)

コマンドでプッシュ
```$ git push origin master_test```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/7cfb485b-6029-8a3e-7f09-6019c355a47e.png)

<br/>


フェッチすると
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/8fa5d7bf-f4e9-b13f-72b1-286662840b22.png)
<br/>

新規ブランチとして作成されている
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/243523/2f8a9a4b-2979-9424-2cae-7e3ec61f2c43.png)


<br><br>
文字列の基本について（シングルクオート、ダブルクオート、ヒアドキュメント）

##文字列の扱い方
phpにおいて文字列を囲む「シングルクオート("")」「ダブルクオート(””)」「ヒアドキュメント(<<<EOF)」の使い分けを明確に理解できていますでしょうか。
それぞれを以下にまとめていきます。

##シングルクオート('')
シングルクオートは最も簡単な文字列の指定方法です。
特徴は**指定された範囲内でのエスケープ処理、変数の展開を行わない**という点です。

```
特殊文字等はそのまま表示されます。
echo 'これは \$1,000 です。\n'; 

これは \$1,000 です。\n

変数は展開されません
$sample = 'サンプル';
echo 'これは$sampleです。'; 

これは$sampleです。
```

##ダブルクオーテーション("")
ダブルクオーテーションはシングルクオーテーションとは異なり、
**指定された範囲内でのエスケープ処理、変数の展開を行う**という特徴を持ちます。

```
特殊文字等は変換されます。
echo "これは \$1,000 です。\n"; 

これは \$1,000 です。[改行]

変数は展開されます
$sample = 'サンプル';
echo "これは$sampleです。"; 

これはサンプルです。
```

##ヒアドキュメント(<<<EOF)
基本的にはダブルクオーテーションと同じで、**指定された範囲内でのエスケープ処理、変数の展開を行う**という特徴を持ちます。
さらに**スペースや改行などもそのまま出力される**という特徴を持ちます。

```
$result = <<<EOF
a
i
u
EOF;

echo $result;

a
i
u

```

##おわり
基本的な部分ではありますが意外ときっちり理解できていなかったので面白かったです。
vagrant環境でGitHubの草が生えない(Contributionできない）時の対処方法

せっかく日々のGitHubへのPushを頑張っているのに、草が生えないとがっかりします。
私もVagrant環境で何回か草が生えないが状況に陥ったので、参考になればと思います。

##草の生える条件

以下の3点が全て満たされていないと草が生えません。

①コミットに使用されるメールアドレスがGitHubアカウントと連携されていること
②フォークされたリポジトリではなく、独立したリポジトリでコミットされること
③デフォルトブランチもしくはProject Pages sitesでのコミットであること

私は初期の段階でメールアドレスの設定ができていなかったので、ターミナルで設定しました。
ローカルでのメールアドレスは以下で確認する事ができます。

```
$ git config user.email
```

GitHubに登録してあるメールアドレスは、Profileのsetting内のEmailsで確認する事ができます。

メールアドレスが合致していない場合は、ターミナルから以下の通りで設定を行います。

```
git config –global user.email “email@example.com“
```


##時刻を合わせる（vagrant環境）
上記のメールアドレスの未設定エラーは、よくある事なのですが
vagrantを使用している場合、時刻の不具合によって生えないケースがあります。
vagrantを実行した後に下記のコマンドで時刻を確認。

```
$ date
```
初期のUTCの設定だと生えません。
またvagrant側とホスト側の時刻が合致していない場合でもダメです。
下記のサイトがとても参考になりました。
https://polidog.jp/2014/01/08/vagrant/

##それでも生えない場合

上記を実行してもダメなケースもあります。

私は一度、vagrant実行時にエラーが起きてそれ以降、時刻がなぜかずっと止まったまま？になっていました。
その場合はこちらの記事を参考にすると良いです。
https://qiita.com/y0shihiro/items/13628b39e620354be6a3

記事内の注意点として通常のvagrant実行時にntpパッケージをアップロードしようとすると以下のエラーが出ます。

```
このコマンドを実行するには root である必要があります。
```
この場合、アップロードするには、管理者(root）の状態でないと実行できません。
ログイン後の最初の状態である[vagrant@localhost ~]の状態まで戻り
以下のコードを入力するとパスワードが求められます。

```
[vagrant@localhost ~]$ su –
```

```
パスワード:
```
パスワードの為、打ち込んでも表示はされませんが、中身はちゃんと打ちこまれています。
尚、パスワードとはvagrantのrootのパスワードの事で初期値は”vagrant”です。

```
[root@localhost vagrant]
```

この状態になったら、記事内の通りにアップロードを進めていく。

以上となります。
vagrantユーザーはGitHubの草はこまめにチェックしておいた方がいいかもしれません。
初投稿！！Mathオブジェクトまとめ

JavaScriptで数当てゲームを作る中で使用したMathオブジェクトについてまとめてみました。
(＊あくまでも使用したメソッドのみです。その他のMathオブジェクトについてはまた学習次第追記します。)

そもそもMathオブジェクトとは、、、？
計算に関する多くのメソッドと数学的定数（円周率など）があらかじめ代入されたプロパティが登録されている。

⭐︎主要なメソッド・プロパティの一覧
 ○プロパティ編
**Math.PI ---円周率を表す。約3.14159 ---**

```Math.js
//使い方//
console.log(Math.PI);  //予想されるリターン: 3.1415.....//

//円周を求めてみる//
function calculateCircumference(radius) {
  return Math.PI * (radius + radius);
}
calculateCircumference(1);  // 6.283185307179586
```

**Math.SQRT1_2 ---1/2の平方根。約0.707 ---**

```Math.js
//使い方//
console.log(Math.SQRT1_2);  //予想されるリターン: 0.707//

//1を2の平方根で割った数を返す//
function getRoot1_2() {
  return Math.SQRT1_2;
}
getRoot1_2(); // 0.7071067811865476
```

**Math.SQRT2 ---2の平方根。約1.414 ---**

```Math.js
//使い方//
console.log(Math.SQRT2);  //予想されるリターン: 1.414//

//2の平方根を返す//
function getRoot2() {
  return Math.SQRT2;
}

getRoot2(); // 1.4142135623730951
```