OmniAICreator/Qiita-1.07M huggingface dataset:
composer installで発生したエラーの解決法

AWSを学習中の者です。
以下の記事を参考にAWSを触ってみたところエラーが発生しましたので自分用メモとして残します。
[AWSでウェブアプリケーション環境構築：②RDSでDBを作成し、Laravelサンプルアプリを動かす最小構成を構築
](https://qiita.com/minato-naka/items/03f9dbd09eb3919a501f)


###【エラー発生箇所1】
PHP拡張モジュールインストール時にトランザクションエラーが発生
###【エラー文】
Transaction check error:
  file /usr/lib64/php-zts/modules/zip.so from install of php-pecl-zip-1.15.2-3.amzn2.0.1.x86_64 conflicts with file from package php-common-7.2.29-1.amzn2.x86_64

  file /usr/lib64/php/modules/zip.so from install of php-pecl-zip-1.15.2-3.amzn2.0.1.x86_64 conflicts with file from package php-common-7.2.29-1.amzn2.x86_64

———————————————
競合が発生しインストールが失敗したようです。
このままでも進められないかと試みたのですが、以下のところでエラーが発生してしまいました。

###【エラー発生箇所2】
php7.2をインストール後、composer installしたところでエラーが発生

###【エラー文】
 Problem 1
    - Installation request for laravel/framework v5.2.19 -> satisfiable by laravel/framework[v5.2.19].
    - laravel/framework v5.2.19 requires ext-mbstring * -> the requested PHP extension mbstring is missing from your system.
  Problem 2
    - Installation request for phpunit/phpunit 4.8.23 -> satisfiable by phpunit/phpunit[4.8.23].
    - phpunit/phpunit 4.8.23 requires ext-dom * -> the requested PHP extension dom is missing from your system.

  To enable extensions, verify that they are enabled in your .ini files:

—————————————
エラー発生箇所１が原因でext-mbstringとext-domがインストールされなかった為インストール失敗したようです。
##【試したこと】
ext-mbstringとext-domを別途インストールしました。
具体的な手順を以下に示します。

###ext-mbstringのインストール手順
webサーバにSSHログイン後、ターミナル上で以下のように入力します。

```
cd /var/www/html/laravel-sample
php -v 
yum list | grep "\-mbstring"
```
実行結果
![実行結果.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355738/feba1e15-d923-167e-a23f-438d8c8bc903.png)

php-mbstring.x86_64がインストール可能のようなのでインストールします。

```
sudo  yum install php-mbstring.x86_64
```
![インストール完了.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355738/a9d93443-6957-aa32-edd5-fef8fbb824af.png)

ext-mbstringがインストールできました。

###ext-domのインストール手順
ext-domはphp-xmlをインストールすることでext-domを導入できるそうです。
以下のコマンドでphp7.2(自分の環境)でインストール可能なphp-xmlを探します。

```
 yum list php* | grep amzn2extra-php7.2
```
実行結果（一部）
![一覧一部.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355738/d8ea2f9d-f3de-bbc3-319d-f8fcbbeb7219.png)

php-xml.x86_64がインストール可能のようなのでインストールします。

```
 sudo yum install php-xml.x86_64
```

実行結果
![インストール完了2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355738/ca4b8de3-88e8-2ac8-042e-22ee2b783ba3.png)

php-xmlがインストールできました。

###もう一度composer installを実行
composer installが失敗した原因となるエラーを解決できたのでもう一度composer installを実行します。

```
cd /var/www/html/laravel-sample
composer install
```
実行結果
![インストール完了3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/355738/b647cd8b-3458-26f8-66f4-f68f36ea99de.png)

composer installが実行できました。
 
###参考にしたサイト一覧
[Amazon Linuxでphpでmbstringを使う
](https://qiita.com/osada/items/885510dae4e8ec4c88f4)
[composerでlaravelを導入しようとして発生したエラー「ext-mbstring」「ext-dom」
](https://qiita.com/yamauchi_kkk/items/63e38ded0eb8571fabfd)
ロジックアナライザを試すその１

# 安価なUSBロジックアナライザを試す

## 使ったUSBロジックアナライザ
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/6fae2ffd-4aa3-dfa9-d3d5-1ed7b7225e3e.png" width=30%>
購入先はいつもお世話になっているスイッチサイエンスさん。
[USBロジックアナライザ - 24 MHz/8チャンネル](https://www.switch-science.com/catalog/5194/)
2020年5月16日現在の価格は2641円。

## インストール
[Sparkfunの記事](https://learn.sparkfun.com/tutorials/using-the-usb-logic-analyzer-with-sigrok-pulseview?_ga=2.117891273.1124113922.1543462908-1937571979.1501724101)から必要なものをDownload&Install。今回はPulseview。

## ターゲットはシリアル通信
Arduinoのシリアル通信ループバックのサンプルを使う。
![SerialEvent.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/3d71b86d-4293-68d3-c781-5da1448a56dd.png)
次のようにArduinoとロジックアナライザを接続。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/f03ff6d9-dd49-72f0-6bae-9dcdeeccb364.jpeg" width=70%>
ArduinoのPin1(TX)はUSBと接続されていることを利用。ロジックアナライザ側のチャネルは0に接続。

## PulseViewの基本設定
ロジックアナライザ自体を指定。
![Begin.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/40a42c67-38a3-201f-e5f2-3d87bf8955bd.png)
「No Device」をクリックし、ドライバにfx2lafw、USBを選択。Scanするとデバイスが見つかるのでそれを選択してOK。
![Select.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/261bcc7e-467b-b758-169f-33d5196aa965.png)
次のようにDeviceが見える。
![After select.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/9f99b2b5-7dc6-f987-70cc-70f2185b1a34.png)
今回はチャネル0のみ使用するので、1-7は削除。
![Delete.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/4afcbb71-3251-4d56-b508-09cfc4ba0632.png)

## UARTの設定
プロトコルを選択。
![Select Protocol.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/33fc1b03-0354-385d-8e87-421097f4d3c1.png)
”Add protocol decoder”を選択して、UARTで検索して選択。
![UART.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/003fc42d-7dc8-d775-5ae7-8c868b479be4.png)
次のようになる。
![Before Link.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/fd91f037-af47-860d-f6c6-cdc760d52635.png)
UARTを選んで必要な設定を行う。RXをチャネル0(D0)に、ボーレートは9600bpsに設定。
![After Link.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/7542a392-c23a-6366-31ca-fdee6d4ca20e.png)

## PC側のTeratermの設定
タイプした文字が見えるようにローカルエコーにチェック、送信改行コードはCR+LFとします。ボーレートは9600bps（画面ないですが）。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/9632109c-b882-c71c-fc78-ec4b2e72ec3a.png" width=60%>

## テスト
Teratermで「9087」と入力しループバックした「9087」をキャプチャ。HEXデータで「39 30 38 37」と見える。
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">UART at Logic Analyzer <a href="https://t.co/GY34KV8n78">pic.twitter.com/GY34KV8n78</a></p>&mdash; HT (@infinite1oop) <a href="https://twitter.com/infinite1oop/status/1261464056013000704?ref_src=twsrc%5Etfw">May 16, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
PowerShellでPDFを右綴じに変換 (PDFSharp版)

PowerShellからiTextSharpを呼び出してPDFを右綴じに変換します。

オリジナル（拙作）は
https://qiita.com/acknpop/items/e85c91947a407bc5a91a
ですが、iTextSharpの利用が信条的に受け入れがたい人のために。

# 下準備

まず始めに pdfsharp.dll を入手してください。

https://www.nuget.org/packages/PDFSharp/

nugetするのが本筋ですが、下記はスクリプトを置くフォルダにlibというサブフォルダを作って、その下に pdfsharp.dll を入れる方式です。

# スクリプト

以下を ConvertTo-RightBinding.ps1 として保存。

```powershell:ConvertTo-RightBinding.ps1
# Convert PDF To Right-bindings
param(
    [parameter(mandatory=$true)][string]$sourceDataPath,
    [parameter(mandatory=$true)][string]$destinationPath
)

function ConvertTo-RightBinding($sourceDataPath, $destinationPath)
{
    # path of pdfsharp.dll
    [System.Reflection.Assembly]::LoadFrom((Join-Path (Split-Path $script:MyInvocation.MyCommand.Path) "\lib\PdfSharp.dll")) | Out-Null

    $pr = [PdfSharp.Pdf.IO.PdfReader]
    $mode = [PdfSharp.Pdf.IO.PdfDocumentOpenMode]
    $input = $pr::Open([string]$sourceDataPath, $mode::Import)

    try {

        $doc = New-Object PdfSharp.Pdf.PdfDocument
        #$input.Pages |  %{$doc.AddPage($_)}
        for($i = 0; $i -lt $input.PageCount; $i++){
            $doc.AddPage($input.Pages[$i]) | Out-Null
        }

        $doc.ViewerPreferences.Direction = [PdfSharp.Pdf.PdfReadingDirection]::RightToLeft

        $doc.Save([string]$destinationPath)

        $input.Close()
    }
    catch {
        Write-Error("Error: " + $_.Exception)
    }
}

ConvertTo-RightBinding (Convert-Path $sourceDataPath) $destinationPath
```

# 使用例

PowerShellを立ち上げて、

```powershell
PS> ConvertTo-RightBinding.ps1 元PDFファイル (Join-Path $PWD 出力先PDFファイル)
```

みたいに使います。

# あとがき

なぜか、
https://stackoverflow.com/questions/27307124/returning-net-objects-in-powershell-functions?rq=1
みたいにパイプで繋ぐとうまく動かないので、forで回してます。
PowerShellでPDFをページごとに分割 (PDFSharp版)

PowerShellからPDFSharpを呼び出してPDFをページごとに分割します。

オリジナル（拙作）は
https://qiita.com/acknpop/items/de56f3f83403cc0e1985
ですが、iTextSharpの利用が信条的に受け入れがたい人のために。


# 下準備

まず始めに pdfsharp.dll を入手してください。

https://www.nuget.org/packages/PDFsharp/

nugetするのが本筋ですが、下記はスクリプトを置くフォルダにlibというサブフォルダを作って、その下に pdfsharp.dll を入れる方式です。

nupkgは単にzip圧縮しているだけなので、拡張子をzipに書き換えてやれば展開して中身を取り出せます。

# スクリプト

以下を Split-Pages.ps1 として保存。

```powershell:Split-Pages.ps1
# Split PDF pages
param(
    [parameter(mandatory=$true)][string]$sourceDataPath,
    [string]$destinationPath
)

function Split-Pages($sourceDataPath, $destinationPath)
{
    # path of pdfsharp.dll
    [System.Reflection.Assembly]::LoadFrom((Join-Path (Split-Path $script:MyInvocation.MyCommand.Path) "\lib\PdfSharp.dll")) | Out-Null

    $pr = [PdfSharp.Pdf.IO.PdfReader]
    $mode = [PdfSharp.Pdf.IO.PdfDocumentOpenMode]
    $input = $pr::Open([string]$sourceDataPath, $mode::Import)

    if([bool]$destinationPath){
        $path = Convert-Path $destinationPath
    }
    else{
        $path = Split-Path -Parent $sourceDataPath
    }

    $fname = [System.IO.Path]::GetFileNameWithoutExtension($sourceDataPath)
    $ext = [System.IO.Path]::GetExtension($sourceDataPath)

    try {
        $pagecount = $input.PageCount
        $padding = [string]$pagecount

        for($i = 0; $i -lt $pagecount; $i++) {

            $pn = [string]($i + 1)
            $destinationPath = Join-Path $path ($fname + "_p" + $pn.PadLeft($padding.Length, "0") + $ext)

            $doc = New-Object PdfSharp.Pdf.PdfDocument
            $doc.AddPage($input.Pages[$i]) | Out-Null

            $doc.Save([string]$destinationPath)

        }

        $input.Close()
    }
    catch {
        Write-Error("Error: " + $_.Exception)
    }
}

Split-Pages (Convert-Path $sourceDataPath) $destinationPath
```

# 使用例

PowerShellを立ち上げて、

```powershell
PS> Split-Pages.ps1 元PDFファイル 出力先フォルダ
```

みたいに使います。
出力先フォルダを指定しない場合は元PDFファイルと同じフォルダに分割したPDFを保存します。

# あとがき

PDFの読み込みは、上記の方法でなくFromFile()を使う方が簡単かも。
firebaseデプロイで変更が反映されない時

##問題
Reactでアプリをfirebaseにデプロイしようとしたところ
デプロイは成功しているのにURLを開くと何も変更が反映されておらず....

![スクリーンショット 2020-05-16 10.46.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/333231/4c3d1ddc-8fa1-ae61-6b9b-dded4f099295.png)


##状況
・`firebase init`時にはpublicではなく、buildを指定
・しっかりbuildフォルダは作成されている
・publicが反映されているのかと考えたがfirebase.jsonでhostingはbuildになっている
・`npm start`でサーバーを立てると変更は反映されている
・デプロイは成功している


##解決
ググってもキャッシュを削除としか書かれていない記事ばかりで時間を使ってしまったが
下記のコマンドで解決した！！

`npm run build`
こうすると

***The build folder is ready to be deployed.***

と表示されるのでこの後に

`firebase deploy`
で完了！


##結果
ちゃんとデプロイ前にbuildしないといけないだけでした。

今日も見てくれてホンマありがとな!!
記事がええなと思ったらフォローといいねホンマよろしくな!!
(ジョーブログ風に)
laravel apache サブディレクトリで動かす場合

サブディレクトリでlaravelプロジェクトを運用する場合、
以下のようなエラー

```
Internal Server Error
The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator at devel@vue.jp to inform them of the time this error occurred, and the actions you performed just before this error.

More information about this error may be available in the server error log.
```

### 対応方法

以下追加

prj_dir/public/.htaccess

```
RewriteBase /ｐｒｊ_dir
```
Apacheのconfファイルを使って、特定ドメインで来たアクセスを他URLにリダイレクト

前回
[Apache2.4でバーチャルホストの設定（超初級）](https://qiita.com/torshim/items/f4fa3aa62174bca47709)
という記事を書いたがこれは、実案件で、「特定ドメインで来たアクセスを他URLにリダイレクトさせて欲しい」という要件があり、その下準備だった。
なので今回はそのリダイレクト処理のさせ方をまとめておく。Apacheのconfを使う。
#前提条件
前回の記事のようにconfでバーチャルホストの設定がされていること

#実現したいこと
a.test でアクセスして来たら b.test にリダイレクトさせる。
##confの変更

```
/etc/httpd/conf.d/vhost.conf
```

を以下のように変更。

```
<VirtualHost *:80>
  ServerName any
  DocumentRoot /var/www/html
</VirtualHost>
<VirtualHost *:80>
  ServerName a.test
  Redirect / http://b.test/
</VirtualHost>
<VirtualHost *:80>
  ServerName b.test
  DocumentRoot /var/www/html/site_b
</VirtualHost>
```

##文法チェック

```
sudo apachectl configtest
```

##httpd の再起動

```
sudo systemctl restart httpd
```

ローカルのブラウザで
http://a.test
を見てみる。

```
This is SITE B!
```
↑ちなみにこのとき、ブラウザのアドレスバーには
http://b.test
となっていなければならない。もし
http://a.test
でいいなら、それはDocumentRootの先を変えればよい。

http://b.test
を見てみる。

```
This is SITE B!
```

http://hoge.test
を見てみる。

```
This is other SITE!
```

要件通り。成功！
numpyのaxis(軸)を理解する

## axisとは
多次元の配列を扱うnumpyではaxis(軸)をきちんと理解しておくことが大切です。

例えば、配列の合計値を求める`numpy.sum()`を考えてみましょう。

単純なスカラーや1次元の配列ならば、軸を考えるまでもなく、全ての値を合計すればよいのですが、多次元配列の場合、どの軸に沿って合計すればいいかを意識する必要があります。

`numpy.sum(a, axis)`
numpyのsum()は第1引数aに配列を指定し、第2引数にはaxis(軸)を指定します。
このaxisに沿って、要素を足し合わせていくわけですね。

## 2次元配列のaxis
まずはわかりやすい2次元の配列を例にします。
2次元配列において、**行方向はaxis=0、列方向はaxis=1**となります。

![numpy_axis_2d.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634673/0b19b816-1970-d322-eea3-28b83654204d.png)


```python
Z = np.array([[0,1],
              [2,3]])
print("axis=0    ->", sum(Z,0))
print("axis=1    ->", sum(Z,1))
```

実行結果

```
axis=0    -> [2 4]
axis=1    -> [1 5]
```

なお、axisに何も指定しないと、すべての要素の合計値(スカラー)になります。

```python
Z = np.array([[0,1],
              [2,3]])
print(sum(Z))
```

実行結果

```
6
```

## 3次元配列のaxis
次に3次元配列を考えてみましょう。
3次元配列では、**axis=0が奥行き方向、axis=1が行方向、axis=2が列方向**になります。

![numpy_axis_3d.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634673/1ebefa73-1107-927d-0315-6c08c27eebe0.png)


```python
Z = np.array([[[0,1],
               [2,3]],
              [[4,5],
               [6,7]]])
print("axis=0")
print(sum(Z,0))
print("----")
print("axis=1")
print(sum(Z,1))
print("----")
print("axis=2")
print(sum(Z,2))
```

実行結果

```
axis=0
[[ 4  6]
 [ 8 10]]
----
axis=1
[[ 2  4]
 [10 12]]
----
axis=2
[[ 1  5]
 [ 9 13]]
```

### axis=-1は何を表すか

axis=-1とすると**最後の軸方向**を表します。つまり、3次元配列ならaxis=2、2次元配列ならaxis=1と同じです。

```python
Z = np.array([[[0,1],
               [2,3]],
              [[4,5],
               [6,7]]])
print("axis=2")
print(sum(Z,2))
print("----")
print("axis=-1")
print(sum(Z,-1))
```

実行結果

```
axis=2
[[ 1  5]
 [ 9 13]]
----
axis=-1
[[ 1  5]
 [ 9 13]]
```

同じ結果になりましたね。
[Angular]Interceptor(インターセプター)の介入をする

Angularにおいて、HTTP通信周りの共通処理を仕込みたいときにInterceptor(インターセプター)という仕組みを使います。

例えば

- HTTP通信のすべてのヘッダーに認証トークンを付与したいとき
- 通信エラー時の処理を共通で設定したい
- 通信ログを残したい

といった使い方ができます。

複数のinterceptorが使えるようですが、それは[こちら](https://gitbook.lacolaco.net/angular-after-tutorial/season-3-httpclient-in-action/interceptors)に例がありますので、今回は単一のinterceptorで実装していきます。

Angular 9.1.4で実証しました。

# Interceptorを定義する
まず、適当なディレクトリに共通処理の実装を含む`http-interceptors.ts`というファイルを作ります。
リクエスト、レスポンスに介入するコードはそれぞれ以下の通りです。

## リクエストに介入する
共通のヘッダーを付与したい場合はこちら

```http-interceptors.ts
@Injectable()
export class NoopInterceptor implements HttpInterceptor {
    constructor(private authService: AuthService) {}
    intercept(
        req: HttpRequest<any>,
        next: HttpHandler
    ): Observable<HttpEvent<any>> {
        const newReq = req.clone(
            {headers: req.headers.set('Authorization', this.authService.authToken)}
        );
        // cloneされてヘッダーを付与したリクエストを次の処理に引き渡す
        return next.handle(newReq);
    }
}

```

## レスポンスに介入する
リクエストに介入するのと同じく`http-interceptors.ts`に記述できます。
ファイルは分けてもいいですし、リクエストの介入と一緒に書いてもいいです。
返り値にpipeすることで介入します。

```http-interceptors.ts
import { tap } from 'rxjs/operator';

@Injectable()
export class LoggingInterceptor implements HttpInterceptor {

  constructor(private logger: Logger) {}

  intercept(
    req: HttpRequest<any>, 
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
            // tapオペレータでレスポンスの流れを傍受する
            tap(resp => {
                // リクエスト成功時のログ出力
                console.log(resp);
            },
            error => {
                // エラー時の共通処理やログ出力
                console.error(error);
            }),
        );
  }
}

```

# 定義したinterceptorをproviderに登録する
定義しただけでは呼び出されないので、`app.module.ts`のproviderに定義します。

```app.module.ts

@NgModule({
  declarations: [
    AppComponent,
    // AnyComponent
  ],
  imports: [
    HttpClientModule,
    FormsModule,
    AppRoutingModule
  ],
  providers: [
    { provide: HTTP_INTERCEPTORS, useClass: Interceptor, multi: true }
  ],
  bootstrap: [AppComponent],
  entryComponents: []
})
export class AppModule { }

```

これで、同じエラー処理を書かずに済みます。

# 参考リンク
> - [インターセプターによる介入 - Angular After Tutorial](https://gitbook.lacolaco.net/angular-after-tutorial/season-3-httpclient-in-action/interceptors)
> - [HttpInterceptorの使用例メモ - Qiita](https://qiita.com/puku0x/items/68c16c34975ee4e41211)
Apache2.4でバーチャルホストの設定（超初級）

#前提条件
- OS：CentOS7系
- Apache：2.4系

#コンテンツの準備
サーバー側でコンテンツの準備をする。
##サイト構成
```
var/www/html
         ├ index.html
         ├ site_a
         │  └ index.html
         └ site_b
            └ index.html
```
↑このようにする。以下具体的な手順。

```
/var/www/html
```

内に「index.html」を作成。

```
<meta charset="UTF-8">
<title>テスト</title>
<body>
<h1>This is other SITE!</h1>
</body>
```

と書く。これは例外のドメインで来たときに表示されるページ。

次に

```
/var/www/html
```

内に

- site_a
- site_b

を作り、その中にそれぞれ「index.html」を作成。

site_aのindex.htmlに

```
<meta charset="UTF-8">
<title>テスト</title>
<body>
<h1>This is SITE A!</h1>
</body>
```

site_bのindex.htmlに

```
<meta charset="UTF-8">
<title>テスト</title>
<body>
<h1>This is SITE B!</h1>
</body>
```

と記述。


# テスト用のローカル設定
##hostsの設定
サーバーのIPが、192.168.33.1だとする。(もちろんグローバルIPでも可)
ローカルのhostsに

```
      192.168.33.1     a.test
      192.168.33.1     b.test
      192.168.33.1     hoge.test
```

と記述。

ローカルのブラウザで
http://a.test
を見てみる。

```
This is other SITE!
```

になっている。まだバーチャルホストの設定をしていないので当然。
サーバー側の操作に戻る。

```
/etc/httpd/conf.d/
```

に「vhost.conf」などという名前のファイル(拡張子だけconfになっていればファイル名は何でもよい)を作成して、以下のように記述。

```
<VirtualHost *:80>
  ServerName any
  DocumentRoot /var/www/html
</VirtualHost>
<VirtualHost *:80>
  ServerName a.test
  DocumentRoot /var/www/html/site_a
</VirtualHost>
<VirtualHost *:80>
  ServerName b.test
  DocumentRoot /var/www/html/site_b
</VirtualHost>
```

##文法チェック
```
apachectl configtest
```

##httpd の再起動
```
sudo systemctl restart httpd
```

ローカルのブラウザで
http://a.test
を見てみる。

```
This is SITE A!
```

http://b.test
を見てみる。

```
This is SITE B!
```

http://hoge.test
を見てみる。

```
This is other SITE!
```

成功！
Mapの使い方

#Mapとは

2つの情報をkey(キー)とvalue(値)で格納するデータ構造


###HashMapのインスタンス化

```Java
Map <key, value> マップの変数 = new HashMap<key, value>();
```

※Mapでvalueの重複することは可能ですが、keyが重複することは不可です。

要素を格納する場合はputメソッド
要素を取り出す場合はgetメソッド
要素をすべて削除する場合はclearメソッド
指定した要素を削除する場合はremoveメソッド
SRResNetによる超解像に挑戦した

##データセット
safebooruのサイトから1500枚ほどの画像をダウンロードしてきた。
さらにデータの数を増やすために、一枚の画像を四分割＋元の画像でデータ量を５倍に増やした。これらの画像すべてを、32x32px, 64x64px, 128x128px,にリサイズしてデータセットの準備は完了した。
##ニューラルネットワーク
今回、ネットワークには　https://arxiv.org/abs/1609.04802 こちらを参考にしResNet+pixel shufllerを取り入れた。全体の構造は以下の画像とほぼ同じである。
![srresnet.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558031/536d66f9-dbe1-bf04-bb0d-b72379677fcf.png)
kerasでの実装のためpytorchのようにpixel_shufller層が用意されていなかったので、ReshapeとPermuteで作成した。

```python
        x = Reshape((self.imageSize, self.imageSize, r, r, self.generatorFilters))(x)
        x = Permute((1, 3, 2, 4, 5))(x)
        x = Reshape((self.imageSize2x, self.imageSize2x, self.generatorFilters))(x)
```

##学習結果
学習はパラメータは
loss='mean_squared_error', 
optimizer=Adam(lr=8e-4, beta_1=0.5)
64バッチで30epoch学習した。

入力サイズ64x64 出力サイズ128x128
![SRNet_64To128.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558031/a8607036-a6a5-8cc6-dcae-b1c3647b409c.png)
入力サイズ32x32 出力サイズ128x128
![SRNet_32To128.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558031/a593d3a8-6a1f-9807-e9ca-e89476e4480b.png)
32x32では細かい部分の造形が再現できておらず、50epochまで学習したが全く変わらかったので、おそらく入力画像の情報量が少なすぎるためだと思われる。一方64x64では背景などの細かい部分はぼやけてはいるもののかなり高い精度で再現できている。
SRResNetはSRGANと違いパラメーターの調整が難しくないので、手軽に超解像に挑戦できたと思う。
リポジトリ　https://github.com/AokiMasataka/-Super-resolution
googleスライドの共有の仕方

# この記事では、googleスライドを、特定の相手に共有する方法を記載しています。

googleスライドの画面右上にある、「共有」ボタンを押します。
![a13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/4b100152-822d-fb27-6e91-b1a901a9a06b.png)
---

自分にとってわかりやすいスライド名をつけます。
![a14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/6bae28a6-6fab-70d5-5f04-85598dc33140.png)
---

名前をつけたあとの図です。「保存」を押します。
![a15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/4982941f-0016-5a43-f1d7-6c7da6c523d2.png)
---

下図の画面で、「ユーザー」に、共有したい相手のメールアドレスを記載します。
![a16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/254e60d9-9d38-de67-8681-9d932d8db07d.png)
---

記載したら、下図のようになります。「送信」を押します。
![a17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/177d8429-37cb-c793-81aa-0c093d27c17b.png)
---
【Swift】カメラ起動

※余計なコードが入っている場合があります。


###①photosをインポートする


###② UIImagePickerControllerDelegate,UINavigationControllerDelegate　を継承する。
```
UIImagePickerControllerDelegate,UINavigationControllerDelegate
```

###③カメラ起動させる。以下のコードをメソッドとして記述する。
```
//カメラを起動
func doCamera(){
    let sourceType:UIImagePickerController.SourceType = .camera
    //カメラが利用可能かチェックする
    if UIImagePickerController.isSourceTypeAvailable(.camera){
            let cameraPicker = UIImagePickerController()
            cameraPicker.sourceType = sourceType
            cameraPicker.delegate = self
            cameraPicker.allowsEditing = true
            present(cameraPicker, animated: true, completion: nil)
        }
    }
```

###④カメラ撮影した時に呼ばれる箇所。以下のコードを記述する

    //カメラ撮影orアルバムから画像選択された時に呼ばれる
    func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
        
        if info[.originalImage] as? UIImage != nil{
            let selectedImage = info[.originalImage] as! UIImage
            UserDefaults.standard.set(selectedImage.jpegData(compressionQuality: 0.1), forKey: "userImage")
            logoImageView.image = selectedImage
            picker.dismiss(animated: true, completion: nil)
            
        }
    }
DjangoでJavaScriptに深い構造のデータを簡単に渡す

DjangoからデータをウェブページのJavaScriptに渡し、JSを使用して処理したい場合があります。
たとえば、Vue.jsを使用してデータをwebページに表示させます。

```python:views.py
import json
from django.shortcuts import render


def home(request):
    books_py = [
        {
            'code': '00009',
            'name': 'はじめてのC',
            'publisher': '技術評論社',
            'price': 2178,
            'count': 1
        },
        {
            'code': '01002',
            'name': 'やさしいC＋＋',
            'publisher': 'SOFTBANK',
            'price': 2500,
            'count': 1
        },
        {
            'code': '20006',
            'name': '実践SQL',
            'publisher': 'SOFTBANK',
            'price': 2800,
            'count': 1
        }
    ]

    return render(request, 'home.html', {'books': json.dumps(books_py)})

```
```html:home.html
......

<script>

    var books = {{ books|safe }};
    console.log(books);

</script>

......
```
実行結果：
![django02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/313622/b8034002-d333-5f53-5444-2f3af5eb6b79.png)
windowsで、googleスライドにスクショを貼り付ける方法


# この記事では、windowsで、googleスライドに、スクショした画像を貼り付ける方法を記載しています。


google chromeを起動して、サインインします

googleスライドを選択します。
(もしgoogleスライドのアイコンがない場合、右側のスライダーを下へ移動して確認してみてください)
![a02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/21223045-26b0-0842-e92c-cff5171eb39f.png)

googleスライド起動画面です。
![a01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/2b1f2e7c-bea5-8a46-1a0c-108ae3926758.png)

---

スクショを撮ります。
スクショがとれたかどうかの確認の仕方は、次の項で説明します。
※windowsによってスクショの撮り方が変わります。
※「PRTSC」というキーが、キーボードの右上によくあります。
　もし白い色の文字であれば、そのキーを押すだけでスクショがとれると思います。
※もし灰色の文字であれば、「FN」キーとか「FUN」キーとかが、よくキーボードの左下にあります。
　この場合、「FN」キーとかを押しながら、「PRTSC」キーとかを押せば、スクショをとることができます。
![a04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/de2e0117-dfa7-b0ac-9fd6-808ba516519c.png)

スクショの確認の仕方
windowsのデスクトップ画面の左下のwindowsアイコン、もしくはスタートボタンなどを押してメニューを出します。
キーボードの場合は、windowsのアイコンのキーがあると思います。
![a05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/744684de-f5aa-aeeb-1e8c-ea723699a6e0.png)

メニューの中から、
「windowsアクセサリ」を探し、その中に「ペイント」があることを確認してください。
「ペイント」をクリックします。
![a06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/7f7289a6-0703-0993-c022-3752688d34b8.png)

ペイントの起動画面です。
![a07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/0a7f079e-62f8-824e-ad6c-2e96133386bc.png)

ペイントに、スクショを貼り付ける(ctrlキーを押しながらVキーを押す)と、
デスクトップをスクショとった場合は、このようになります。
![a08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/cda68955-3ae3-7487-921d-ee9d46d86c55.png)

保存するために、「ファイル」を選択して、「名前を付けて保存」を選択します。
適切な名前をつけて保存しましょう。
![a09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/876c5445-28a4-0708-13f5-2f9525a2d98b.png)

---

googleスライドと、画像を保存したフォルダを開いておきましょう。
![a10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/55fe0b80-eb38-c409-0bf1-95f4a6da9160.png)

googleスライドに表示させたい画像を、下図のようにドラッグアンドドロップします。
![a11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/b7cc1ac3-f482-af88-052c-8e782806d670.png)

ドラッグアンドドロップがうまくいけば、下図のようになります。
![a12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191635/dff2b862-ee84-9b2c-5f4e-14c8483e1320.png)
【Rails】gem ' active_hash' プルダウンメニュー作成


#手順
1:gem導入
2:手動でモデルを作成
3:データを引っ張る
4:アソシエーションを定義
5:実装中のエラー
##１：gem 導入
```Gemfail.
gem 'active_hash'
```
`bundle install`する。

##２：モデル作成
`※モデルは手動で作成`

```model/shipping_fee.rb
class ShippingFee < ActiveHash::Base
  self.data = [
      {id: 1, name: '送料込み（出品者負担）'}, {id: 2, name: '着払い（購入者負担）'}
  ]
end
```
**ターミナルで確認：**

```
[2] pry(main)> ShippingFee.find(1)
=> #<ShippingFee:0x00007fa012181140 @attributes={:id=>1, :name=>"送料込み（出品者負担）"}>
```
##３：プルダウンメニューにデーターを引っ張る
```new.html.haml
.new-contents__box__title
  発送量の負担
  %supan{class: "required"} 必須
= f.collection_select :shipping_fee_id, ShippingFee.all, :id, :name, {prompt: "選択してください"}, {class: ""}
```
`ShippingFee.all`でモデルからデータを取得。
保存されるテーブルのカラムには、idが保存される。

| sihpping_fee_id  |
|:----------------:|
|1                 |
|15                |
|4                 |
|24                |


##４：アソシエーションを定義
```item.rb
extend ActiveHash::Associations::ActiveRecordExtensions
belongs_to_active_hash :shipping_fee
  
```
active_hashにはbelongs_to_active_hashメソッドが用意されているため、
`親になるモデルのみ`にアソシエーションを定義する。

**アソシエーションの確認：**

```
[5] pry(main)> item = Item.find(1)
[6] pry(main)> item.shipping_fee
=> #<ShippingFee:0x00007fa012181140 @attributes={:id=>1, :name=>"送料込み（出品者負担）"}>
```

##５：実装中のエラー
**LoadError Unable to autoload constant ShippingFee**
原因：作成したモデルのクラス名

```model/shipping_fee.rb
#修正前
class Shipping_fee < ActiveHash::Base

#修正後
class ShippingFee < ActiveHash::Base
```
【Golang】可変長引数

#【Golang】可変長引数
Golangの基礎学習〜Webアプリケーション作成までの学習を終えたので、復習を兼ねてまとめていく。 基礎〜応用まで。

```
package main
//可変長引数
//複数の引数を渡す際、決まった個数でない場合。

import "fmt"

//可変長引数   ...int
func foo(params ...int) {
	//引数の長さ表示
	fmt.Println(len(params), params)
	//引数の長さ分繰り返す　
	//_にはインデックスが入る。
	for _, param := range params {
		fmt.Println(param)
	}
}

func main() {
	foo()
	//>>0 []
	foo(10, 20)
	//>>2 [10 20]
    //>>10
    //>>20
	foo(10, 20, 30)
	//>>3 [10 20 30]
    //>>10
    //>>20
    //>>30
	
	//スライス作成
	s := []int{1, 2, 3}

	//表示
	fmt.Println(s)
	//>>[1 2 3]

	//スライスを引数に展開して渡す
	//foo(s)ではエラーになる
	foo(s...)
	//>>3 [1 2 3]
    //1
    //2
    //3
}
```
JavaScript 学習記録　＃1　Dateオブジェクト

わかりやすく日時を表示する方法:point_up:コードの書き方

①プログラムを書く準備

```javascript:date.js
<section>
    <p>最終アクセス日時：<span id="time"></span></p>
</section>
```
最終アクセス日時：


②「年/月/日　時：分」のかたちで表示
　そのためには「年、月、日、時、日、分」を個別に取得する必要がある。

```javascript:date.js
<script>
'use strict';

const now = new Date();
const year = now.getFullYear();
const month = now.getMonth();
const date = now.getDate();
const hour = now.getHours();
const min = now.getMinutes();

const output = `${year}/${month + 1}/${date} ${hour}:${min}`;
document.getElementById('time').textContent = output;
</script>
```

③Dateオブジェクト
　日時を扱うためのオブジェクトであり、次のようなことができる
　　1.現在日時を取得する
　　2.過去や未来の日時を設定する
　　3.日時の計算をする

　:point_right:Dateオブジェクトは初期化（インスタンス化）する必要がある
　　　new Date();
　　※いくつかのオブジェクトは、newを使って初期化してから使う
　:point_right:月を取得するgetMonthメソッドは「実際の月-1」の数字が取得されるため、+1を忘れずに
　　![20200516_200516_0002.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/575721/842f8884-ec62-6de0-f786-e5f78f025074.jpeg)
Teams修業日記：Teamsのメンバータグ機能を活用しよう！

# 困った事
Microsoft365管理センターから見てみるとメンバーの名前がバラバラｗ
メンション”＠hogesan”てしようとしても賢くヒットしてくれない・・・。

# 根本解決
Microsoft365管理センターのメンバー若しくはゲストの一覧から、連絡先情報を編集しましょう。
そうするとメンバーの表示名そのものを変えることができます。

# そうじゃない解決と応用
だからってイチイチ面倒くさいし、チーム内でも役割毎にまとめたいとか？
ニックネームでメンションしたいって時もあります！
そんなときに役立つのが`メンバータグ`機能です。

## メンバータグのつけ方
チーム管理からメンバー一覧を出すと`タグ`ってあります。
ココからいわゆる`タグ`を作ってドンドン属性付与ができちゃいます。
例えば`UI担当`とかしてもいいでしょうし、漢字で名前を付与してもいいでしょう。

## 便利なメンバータグ
この漢字で名前を付けてあげるのは結構便利です。`○○さん`とか付けとくと賢いかな漢字変換システムならメンションと漢字で入力でいちゃいますよ。
Raspberry Pi 3B をWQHD解像度で使う

## 序
　WQHDモニターを購入したのを機に、Raspberry Pi 3 ／Arch Linux環境でもその解像度で表示できないかと思い検索するとRaspberry Pi の公式サイトの[フォーラムでのトピックス](https://www.raspberrypi.org/forums/viewtopic.php?t=216754)が見つかりました。出来る様なのですが、具体的な設定が示されてませんでしたので、いろいろ試してみました。

## 結果
　・WQHD(2560x1440)で表示可能。
　・32bit環境,64bit環境の両方ともできる。
　・但し一部制限あり。

## 実施環境
　・Raspberry Pi 3B (初期の+のつかない方）
　・Arch Linux ARM 32bit版(armv7),64bit版(aarch64)
　・2.5inch sata HDD のみで起動(microSDカードレス)
　・USB 日本語キーボード
　・WQHDモニター／Dell UP2516D HDMI接続
　・電源 5V 2.5A、USB-MicroB端子より給電

## 手順
　Raspberry Pi 公式サイトの[Video Option(英文)][link-1]と参考サイトを確認して、`/boot/config.txt`に以下を追加しました。32bit環境,64bit環境ともWQHD(2560x1440)で表示となりました。

```/boot/config.txt
hdmi_group=2
hdmi_mode=87
hdmi_cvt=2560 1440 30 3 0 0 1
max_framebuffer_width=2560
max_framebuffer_height=1440
hdmi_pixel_freq_limit=125000000
```

###各行の意味
　内容を忘れると応用が効かないので、Raspberry Pi 公式サイトの[Video Option(英文)][link-1]等からまとめてみました。

####hdmi_group
　`0/1/2` のどれかの値を設定できます。`0:自動`、`1:CEA機器(家庭用TVなど)`、`2:DMT機器(コンピュータ用のモニターなど)`。使っているのはコンピュータのモニターなので値は`2`。

####hdmi_mode
　解像度を設定する項目で、`hdmi_group`で設定した値とこの値のセットで解像度とフレームレート等の組み合わせが固定されます。`hdmi_group=2`では`1`から`86`の値が予約されていますが(例:FHD1920*1080*60Hzなら値`82`)、WQHDの解像度では予約値が無いため、カスタムモードとなる値`87`を設定します。

####hdmi_cvt
　カスタムモードの場合、ここでモニター解像度、フレームレート等の値を設定します。値は半角スペース区切りで以下のようになります。
`<横解像度> <縦解像度> <フレームレート> <アスペクト比> <マージン> <インターレス> <チラつき対応>`
　このため、上記`config.txt`の設定値は、横2560,縦1440,フレームレート30Hz,アスペクト比16:9,マージン0,プログレッシブモード,チラつき軽減、という内容の設定値になります。各項目の細かい設定値は、[公式サイト][link-1]で確認ください。
　※1：当初Arch Linux 32bit版ではフレームレート値`60`に設定しても表示できてましたが、いつだかのカーネルアップデートで表示できなくなりました。値`30`にしたら又表示できるようになりました。
　※2：チラつき対応（訳は適当：英原文ではreduced blanking）部分は値`0`:ノーマルと値`1`:チラつき軽減と変えてみましたが、私のモニターでは具体的な効果は分かりませんでした。気休めに値`1`にしています。

####max_framebuffer_width,max_framebuffer_height
　framebufferの解像度の設定。モニターの解像度と合わせないと、モニターの最大解像度表示とならない。このため、WQHDの解像度の値を入れます。

####hdmi_pixel_freq_limit
　`vhdmi_group=2` で `hdmi_mode=87` のカスタムモードの場合は、HDMIのタイミングを設定します。周波数で設定する場合はこの値を最低 `モニターの横解像度×縦解像度×フレームレート` 以上に設定する必要があります。ただ、2560*1440*30=`110592000` と計算上ピッタリの値を入れると、WQHDでの表示ができませんでした。このためかなり余裕を加えたこの値を入れてます。

## 制限事項
　32bit環境で、VideoCore GPU のハードウェアアクセラレーション(X,Wayland, openglでの)を使いたい場合、`/boot/config.txt`内に`dtoverlay=vc4-kms-v3d,cma-256`を記述を追加する必要がありますが、これを入れると、私の環境では画面が全く表示されなくなりました。

##補足
　・モニター表示まわりの設定を変えると、表示出来なくなる場合があります。リモートからログイン出来るようにしてから調整した方がいいでしょう。

　・64bit環境で、コールドスタートすると起動途中まではWQHDの状態なのですが、ログイン表示画面の直前でこけて、FHDの表示になることがたまにありました。再起動するとWQHDで問題なく表示されるので、何かのタイミングで変わるのか、設定が詰めきれてないかまだ不明です。

　・海外サイトのフォーラムでは、Raspberry Pi 3で4kでも表示できたとの報告をどこかで見ました。フレームレートは15Hzでしたが私は4kモニターを持ってないので確認してません。


## 参考サイト
Corgi Lab. ～備忘録のための技術ブログ～：https://corgi-lab.com/raspberrypi/raspberrypi3-hdmi/
nWorld:https://firtel.blogspot.com/2019/08/raspberry-pi-retina-lcd.html
## 公式サイト（関連部分）
Raspberry Pi (英文)：https://www.raspberrypi.org/documentation/configuration/config-txt/video.md

[link-1]:https://www.raspberrypi.org/documentation/configuration/config-txt/video.md
"ejs"コンパイル時のエラー：npm run dev

#要点まとめます

```webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  plugins: [
    new HtmlWebpackPlugin({
      filename: './index.html',
      template: './src/index.ejs',
    }),
  ],
  module: {
    rules: [
      {
        test: /\.ejs$/,
        use: 'ejs-compiled-loader'
      },
    ],
  },
  devServer: {
    compress: true,
    port: 9000,
  },
}
```

#package.jsonの要点
```package.json
{
  "name": "01_kadai",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --mode development --watch",
    "dev": "webpack --mode development"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "clean-webpack-plugin": "^3.0.0",
    "copy-webpack-plugin": "^5.1.1",
    "ejs-compiled-loader": "^1.1.0",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.41.5",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.10.1"
  }
}
```
##①"webpack"や"ejs-compiled-loader"のバージョン

```package.json
{
"ejs-compiled-loader": "^1.1.0",

"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.1"
}
```
・最新バージョンとかだとエラーが出たりします。

適宜ググってバージョンの確認が必要ですね。

https://qiita.com/baby-0105/items/e094b2fca415fc407706

##②npm run devエラー

```
$ npm run dev
npm ERR! missing script: dev

npm ERR! A complete log of this run can be found in:
```

これは、```"scripts"```の中に```"dev"```の記載がなかった時に起きたエラーです。

```
"scripts": {
  "dev": "webpack --mode development"
}
```

記載してあげればオッケー。

#モジュールのパスの読み込みに注意！

```
ERROR in   Error: Child compilation failed:
  Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
  Error: ENOENT: no such file or directory, open 'templates/_head.ejs'
```

このエラーを見た時は、```ejs-compiled-loader```のバージョンの問題かと思いましたが違いました。

```Error: ENOENT: no such file or directory, open 'templates/_head.ejs'```
とある様にモジュールが読み込めてません。

そういう時は、大概相対パスの間違いです。

```
├── src
│   ├── sample.ejs
│   ├── index.js
│   └── templates
│       ├── _footer.ejs
│       ├── _head.ejs
│       └── _header.ejs
└── webpack.config.js
```

```sample.ejs（修正前）
<!DOCTYPE html>
<html lang="ja">
<% include templates/_head %>
<% include templates/_header %>
<body></body>
</html>
```

普通に相対パスを設定していれば、上記の様で間違い無いかと思います。

しかし、正解は**webpack.config.jsからの相対パスの設定**をしなければいけません。

なので修正すると、

```sample.ejs（修正後）
<!DOCTYPE html>
<html lang="ja">
<% include src/templates/_head %>
<% include src/templates/_header %>
<body></body>
</html>
```

相対パスに```src/```を加えました。

これで、```npm run dev```すると問題なくコンパイルもできてdistファイルに```main.js```と```index.html```が作成されました。
連想配列を説明する

#じゃあまずC#で書く。

```ex.cs
using System;
using System.Collections.Generic;
public class Ex{
    public static void Main(){
        var jcpmusicdotcom = new Dictionary<string,string>();
        jcpmusicdotcom["東方ロストワード"] = "ロストワードクロニカル";
        jcpmusicdotcom["俺はボーマンダ"] = "レプリカの恋";
        jcpmusicdotcom["ほのぼの神社"] = "SHAMAN QUEEN";
        foreach(var music in jcpmusicdotcom){
            Console.WriteLine($"{music.Value}は、{music.Key}を連想する音楽です。");
        }
    }
}
```

#次にPythonで書いてみる。

```ex.py
class Ex:
    def main():
        jcpmusicdotcom = {}
        jcpmusicdotcom["東方ロストワード"] = "ロストワードクロニカル"
        jcpmusicdotcom["俺はボーマンダ"] = "レプリカの恋"
        jcpmusicdotcom["ほのぼの神社"] = "SHAMAN QUEEN"
        for musickey in jcpmusicdotcom:
            print(f"{jcpmusicdotcom[musickey]}は、{musickey}を連想する音楽です。")

if __name__ == "__main__":
    Ex.main()
```

やはりどちらもC言語の影響があるので大して書き方が変わらないですね。私は、結構C#とかPythonとかの「汚い書き方ができないスタイル」が好きなのですが、皆さんはどうですか？コメントよろしくお願いします。
Best Motherboard For i9 9900k 2020

<a href="https://dariusreviews.com/best-motherboard-for-i9-9900k/">Best Motherboard For i9 9900k</a>
![Best Motherboard For i9 9900k.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/638498/be91a53e-3fb0-1b29-9006-d895138f1a1b.jpeg)
plunkerでmandara

#概要

plunkerでmandaraやってみた。

#参考にしたページ。

https://qiita.com/KOJI-YAMAMOTO/items/7fb12d8a505e420dfe71

#写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/c4bdeaba-11f0-42ab-1e18-07467d3b18c0.png)


#成果物

https://embed.plnkr.co/plunk/ebSJqLX2PKyzpbcM


以上。
QRコードでURLを送る (qrcp)

* [qrcp - QRコードを使ってファイル送信 MOONGIFT](https://www.moongift.jp/2020/05/qrcp-qr%e3%82%b3%e3%83%bc%e3%83%89%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%83%95%e3%82%a1%e3%82%a4%e3%83%ab%e9%80%81%e4%bf%a1/)

* https://github.com/claudiodangelis/qrcp/releases

から `qrcp_0.6.2_linux_x86_64.deb`をダウンロード

```sh:インストール
dpkg -i qrcp_0.6.2_linux_x86_64.deb
```

```sh:QRコード表示
qrcp ファイル名
```
golangのrestのググりまとめ

## golangでrestを試してみたくて、まずは記事を調べてみた。

[golangでシンプルなRESTful APIを作ってみよう！](https://qiita.com/sbenemerito/items/d94b811f14ce0a546a3f)
mux packageを使って、Readを試してみている。

[RESTAPI WITH Go言語!](https://qiita.com/__init__/items/145462cdbb0f569a29cf)
mux packageを使って、CRUDを作り、ElephantSQL(postgresのPaaS)でdb接続もやっている。


[【Go×WAF】うほうほ！！gorillaを分かりやすくまとめてみた【mux/context/schema】](https://qiita.com/gold-kou/items/99507d33b8f8ddd96e3a)
mux packageのrouterを丁寧に網羅してかいて、testも書き、gorilla packageでのformへのDecode&Encodeを解説してくれている。

[【第4回】Go言語（Golang）入門～REST API環境構築編～](https://rightcode.co.jp/blog/information-technology/golang-introduction-rest-api)
right code様のgolangの記事。echo frameworkを使って、
簡単なPOST、JSONでの受け渡しなどをやっている。
続きの第５回実装編にて、firebaseを使って試している

[golangでREST APIをやってみた①](https://qiita.com/katekichi/items/d94e078b376151858ca4)
go-json-restやgormを使って、実装している。
円の方程式

## 円の方程式の標準形
円とは、中心点 $C$ と円周上の任意の点 $P$ と半径 $r$ との関係が、
（点$C$と点$P$を結んだ線分の長さと半径$r$が同じ長さ、すなわち、）
$$CP=r$$
となるような点$P$全体の集合のことである。
$C$の座標を$(a,b)$、点$P$の座標を$(x,y)$としたとき、$CP$の長さは、
$$ CP = \sqrt{(x - a)^2 + (y - b)^2}$$
となり、$CP=r$ という条件は、
$$ \sqrt{(x - a)^2 + (y - b)^2}=r$$
と表される。
この式の両辺を二乗すると、
$$ (x - a)^2 + (y - b)^2=r^2$$
これが円の方程式です。
![円の内部の点か調べる_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/384860/add4b180-7190-e34d-19ad-05fd6e6c7670.png)
#### 【例】　中心(3,2) 半径 5 の円の方程式は
$$ (x - 3)^2 + (y - 2)^2=25$$
<img width="400"  src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/384860/9fd34e3e-127c-2037-417e-5c440018ee66.png">

## 円の方程式の一般形
円の方程式の標準形、$(x - a)^2 + (y - b)^2=r^2$ の左辺を展開すると、
$$x^2-2ax+a^2+y^2-2by+b^2=r^2$$
整理して、
$$x^2+y^2-2ax-2by+a^2+b^2-r^2=0$$
$-2a=l,-2b=m,a^2+b^2-r^2=n$とおいて、
$$x^2+y^2+lx+my+n=0\ \cdots \ ①$$
となり、この式は$x^2$と$y^2$の係数が等しく、$xy$の項がない $x,y$ についての2次方程式となっており、円を表すことができる。
しかし、①の式が表す図形が必ずしも円とは限らない。
①の式を平方完成して変形すると、
$$\left(x+\frac{l}{2}\right)^2+\left(y+\frac{m}{2}\right)^2=\frac{l^2+m^2-4n}{4}$$
となり、

 - $l^2+m^2-4n > 0 $ のとき、この式は中心$\left(-\dfrac{l}{2},-\dfrac{m}{2}\right)$、半径$\dfrac{\sqrt{l^2+m^2-4n}}{2}$の円を表す
 - $l^2+m^2-4n = 0 $ のとき、この式は1点$\left(-\dfrac{l}{2},-\dfrac{m}{2}\right)$を表す
 - $l^2+m^2-4n < 0 $ のとき、この式が表す図形は存在しない（虚円）

となる。よって円の方程式の一般形は、
$$x^2+y^2+lx+my+n=0$$
$$ただし、l^2+m^2-4n > 0$$
となる。

#### 【例】
方程式 $x^2+y^2-4x+2y+4=0$ はどのような図形を表すか。
並べ替えて
$$x^2-4x+y^2+2y+4=0$$
変形して、（両辺に$4$と$1$を加えて、左辺の $4$ を右辺に移行）
$$(x^2-4x+4)+(y^2+2y+1)=4+1-4$$
因数分解して、
$$(x-2)^2+(y+1)^2=1$$
よって、この方程式は中心 $(2,-1)$、半径 $1$ の円を表す。
Rails6使用時のyarn,webpacker,SQlite古い問題

#背景
プログラミングスクールのカリキュラムで構築した環境(Vagrant, CentOS7, Ruby2.5.7, Rails5.2.4)で開発してきたがRails6を使いたくなった。そこでの環境構築中に発生したエラーと解決策を自分用に残す。とりあえずvagrantファイルを編集してRails6.0.2の仮想環境を用意した(ファイル内のGUEST_RUBY_VERSION = '2.5.7'のところの数字を変えるだけ)
#改めて環境
Vagrant
CentOS7
Ruby2.5.7
Rails6.0.2
#発生する問題
webpackerない問題
yarnない問題
SQLite古い問題

#解決手順

```
$rails new test-app
$cd test-app
$rails s -b 0.0.0.0
```

で新規で作ったアプリを立ち上げると
`Please run rails webpacker:install`
とか言われる
###webpackerない問題
以下でインストール[参考](https://qiita.com/NaokiIshimura/items/8203f74f8dfd5f6b87a0)

```
$rails webpacker:install
```

すると以下のように言われる

`Yarn not installed. Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/`
###yarnない問題
以下を実行
`sudo wget https://dl.yarnpkg.com/rpm/yarn.repo -O /etc/yum.repos.d/yarn.repo`
sudo: wget: command not foundとか言われたので[公式？](https://linuxize.com/post/how-to-install-yarn-on-centos-7/)を参考にした

```
$curl --silent --location https://rpm.nodesource.com/setup_10.x | sudo bash -
$sudo yum install nodejs
$curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | sudo tee /etc/yum.repos.d/yarn.repo
$sudo rpm --import https://dl.yarnpkg.com/rpm/pubkey.gpg
$sudo yum install yarn
```


Installed:
  yarn.noarch 0:1.22.4-1
Complete!と出ればOK
yarnがインストールできたので改めてwebpackerをインストール

```
$rails webpacker:install
```

Webpacker successfully installed 🎉 🍰と出ればOK

サーバーを再起動すると今度は
`RuntimeError (Your version of SQLite (3.7.17) is too old. Active Record supports SQLite >= 3.8.):`
と言われる
###SQLite古い問題
[神記事](https://qiita.com/libertyu/items/1eb74adc817ab8971100)があってので書いてある通りにやってSQliteを更新
（Centos7ではSQliteのサポートが3.7が最新らしいがどうやらRails6には3.8が必要みたい）
途中wgetがないとか言われたのでググって入れた↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421795/7134aa5d-14d5-4ba1-050f-ae30c34b6f3a.png)
これで無事に起動するようになった


#その他の参考
https://qiita.com/libertyu/items/1eb74adc817ab8971100
https://classic.yarnpkg.com/ja/docs/install#alternatives-stable
ほぼYoutubeだけで合格する、統計検定２級

統計検定２級受験に向けていろいろ勉強しましたが、これでいいんじゃないかって勉強方法をお伝えします。

必要なものはPCと本１冊です。

## 学習方法
1. まず、公式問題集を買いましょう。
2. 公式問題集で出題範囲を確認し、出題される分野を確認しましょう。
3. 該当の分野について、[統計WEB](https://bellcurve.jp/statistics/course/#step1)でざっくりと理解しましょう。
4. 統計WEBで理解が浅い、もしくは理解できない分野については[こちら](https://www.youtube.com/playlist?list=PLDJfzGjtVLHmx7qMP410-9gx0weC9d90X)のチャンネルがおすすめです。イケメン講師がわかりやすく教えてくれます！　※7でYoutubeチャンネルもこのタイミングで見てもOKです。
5. それでは公式問題集を解きましょう。
6. 公式問題集の解説だけでは理解できない場合、上記の統計WEBに解説がありますので、併せて確認しましょう（ただし、誤植が多いのであまりにおかしい箇所は気にしないように）。
7. 6でも理解できない、もしくはより理解したい場合、[こちら](https://www.youtube.com/channel/UCMQAtnp07Genb7egZNrmrLg)のYoutubeチャンネルがおすすめです。（というか一度、全て見たほうがいいです。非常にわかりやすいです。）
8. 公式問題集を2周くらいはこなしましょう。
9. 受験しましょう。
10. たぶん合格できます。

## おまけ
Youtube見るときは、以下のExtensionを入れることをおすすめします。

Video Speed Controller - Chrome ウェブストア https://chrome.google.com/webstore/detail/video-speed-controller/nffaoalbilbmmfgbnbgppjihopabppdk?hl=ja

ショートカットもしくは左上のボタンで再生速度をX2、X3に変えられます。
（あまり大声で言えないけど、CMも光速で飛ばせます…）
sudo apt-get update のエラーと警告を虱潰しに直していくだけ



linux を使ってるとしばしばsudo apt-get update をするのですが、よく警告が出てきます。今回はそのお掃除


また増えたらかきたすかも（2020/05/16）

今回は２つ

```
E: The repository 'http://ppa.launchpad.net/kazam-team/unstable-series/ubuntu bionic Release' does not have a Release file.

W: An error occurred during the signature verification. The repository is not updated and the previous index files will be used. GPG error: https://nvidia.github.io/nvidia-docker/ubuntu18.04/amd64  InRelease: The following signatures couldn't be verified because the public key is not available: NO_PUBKEY 6ED91CA3AC1160CD
```
上が見にくいために平文も貼っておきます↓

**E: The repository 'http://ppa.launchpad.net/kazam-team/unstable-series/ubuntu bionic Release' does not have a Release file.**

**W: An error occurred during the signature verification. The repository is not updated and the previous index files will be used. GPG error: https://nvidia.github.io/nvidia-docker/ubuntu18.04/amd64  InRelease: The following signatures couldn't be verified because the public key is not available: NO_PUBKEY 6ED91CA3AC1160CD**

## 解決策 1 

公開鍵の期限が切れているので更新してあげる。

参照：https://linuxconfig.org/how-to-list-and-remove-ppa-repository-on-ubuntu-18-04-bionic-beaver-linux




## 解決策 2
ppaファイルのrepository を消してあげる。

```
 sudo apt-add-repository -r ppa:kazam-team/unstable-series
```

参照：https://linuxconfig.org/how-to-list-and-remove-ppa-repository-on-ubuntu-18-04-bionic-beaver-linux
【最新】Android Studioのダウンロード・インストール方法

#【最新】Android Studioの開発環境構築

最近アプリを作る機会が増えてきたので、備忘録として残しておこうかなと思っています。

Androidアプリを開発し始めてから3年程度ですが、それなりに勉強してきたのと、信憑性を十分に確認したうえで発信しています。

##Android Studioのダウンロード

まず、公式サイトからAndroid Studioをダウンロードし、起動します。
https://developer.android.com/studio?hl=ja

##Android Studioのインストール

基本、設定は変えずに「Finish」まで、「Next」をクリックしていきます。

あっという間に、インストールまで完了です。

##AVD（AndroidVirtualDevice）のインストール

###AVDってなに？
AVDとは、仮想Androidです。

アプリを作る際に、実機を用いて行う場合は必要ありませんが、実際、実機だけでテストをする！という訳にはいかないのです。

例えば、Xperiaは大丈夫だけど、Galaxyだとバグが出る・・・等の問題もツキモノだからです。

###本題のインストール方法

AndroidStudioを起動し、AVDマネージャーを開く
![1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/627431/f8dec8f2-e3bc-e883-3c55-f7ed2ea8f3e9.jpeg)

CreateVirtualDeviceをクリック
![2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/627431/21a7e56a-6ece-516e-08e6-15135d2ffef2.jpeg)

Pixel2を選択、Next
![3.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/627431/8edf15ed-3d7b-f06b-46fd-86407deab80a.jpeg)

写真4
Pieを選択、Next
![4.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/627431/16db4c2e-e230-85a8-0e25-19a736c096dd.jpeg)

写真5
Finish
![5.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/627431/ff7ce1c1-6ae6-9458-eed3-9f606952d27a.jpeg)

右下に、ダウンロードの表示が出ていると思うので、終わるまで待っていれば、完了です。
【Excel】”全シートA1セルに合わせ、倍率100％に戻す”マクロショートカットボタンの作成


#概要
Excelファイルをやり取りする際は「カーソルをA1セルに合わせる」というお作法があるそうです。

たくさんシートがあるときにいちいち確認するのが面倒なので、自動でできるようにマクロをクイックアクセスツールバーに登録しています。
同じような内容の記事は多くあると思いますが、次の現場に移動した際自分ですぐ使えるようにメモしておきたいと思います。

####マクロの内容
・カーソルと表示位置をA1に合わせる
・表示の倍率を100％に合わせる（目が悪くてよく拡大するので）
・マクロが実行し終わったら１枚目のシートに移動してメッセージを出す

####参考URL
[Excelで「全シートでA1セルに移動して元のシートに戻る」ショートカットを作る](https://qiita.com/FireFoxCorp/items/0b6f7cc79b57389ac94a)
ほとんどこちらを参考にさせていただいています・・・

#手順
１. 開発者タブを表示させる
２. 個人用マクロブックにマクロを保存
３. クイックアクセスツールバーに登録

#１.開発者タブを表示させる（表示されていない場合）
[Windows](https://support.office.com/ja-jp/article/-%E9%96%8B%E7%99%BA-%E3%82%BF%E3%83%96%E3%82%92%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B-e1192344-5e56-4d45-931b-e5fd9bea2d45)
[Mac](https://support.microsoft.com/ja-jp/office/excel-for-mac-%E3%81%A7-%E9%96%8B%E7%99%BA-%E3%82%BF%E3%83%96%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%97%E3%81%A6%E3%83%9E%E3%82%AF%E3%83%AD%E3%82%92%E4%BD%9C%E6%88%90%E3%81%BE%E3%81%9F%E3%81%AF%E5%89%8A%E9%99%A4%E3%81%99%E3%82%8B-5bd3dfb9-39d7-496a-a812-1b5e8e81d96a) 

#２.個人用マクロブックにマクロを保存する
個人用マクロブックにマクロを保存するとどのExcelファイルでも使用できます。

####(1)個人用マクロブックを表示させる
開発者タブ->マクロの記録
マクロの保存先を個人用マクロブックに指定し、何もせずにOKボタンを押す

####(2)開発者タブ->VisualBasic
先ほど作成した個人用マクロブックのモジュールに以下を貼り付けて保存する

```vb

Sub Cursor_A1()

' 画面更新をさせない（チカチカするため）
Application.ScreenUpdating = False

Dim ws As Worksheet
' 各シートを順番に見ていく
For Each ws In Worksheets
' カーソルをA1に移動
ws.Select
Range("A1").Select
' 表示位置を左上端に移動
ActiveWindow.ScrollColumn = 1
ActiveWindow.ScrollRow = 1
' 表示倍率を１００％に戻す
ActiveWindow.Zoom = 100
Next ws

' １枚目のシートに移動
Sheets(1).Select
'画面更新を再開させておく
Application.ScreenUpdating = True
' メッセージを表示
MsgBox "処理が完了しました"

End Sub
```

#３.クイックアクセスツールバーに登録
Excel -> 環境設定 -> リボンとツールバー -> クイックアクセスツールバー
コマンドの選択で[マクロ]を選択
先ほど作成したマクロを登録

#おわりに
1日1回以上は使っているショートカットボタンですが、１年程前に作成して以来今回記事を書くまでマクロについて調べることがなかったので、もっと勉強した方がいいなと思いました。
付け足すのにおすすめな処理などあれば、ぜひコメントの方で教えてください。
#3_Raspberry Pi 3b+でプログラムを決まった時間に実行したい

#Raspberry Pi 3b+でプログラムを決まった時間に実行したい

##はじめに
前回の記事( #2_Raspberry Pi 3B+からLINEに天気予報を通知 )でラズベリーパイからLINEに天気予報を通知するプログラムを作ってみました。
ターミナルからプログラムを叩いてLINEに通知が送られるところまで実行して「やったー！」と思っていたんですが...。

そもそも天気予報を受け取るのにいちいちターミナルを開いてプログラムを叩くの？

毎朝天気予報を受け取る機能は『自動化』したい。
『自動化』っていうとなんかかっこいいですよね。

ということで今回はラズベリーパイ(Linux)の『cron』を使って毎日決まった時間にプログラムを実行してみます。

前回の記事で作成したプログラム以外のpython,shellscriptなどでも使えちゃうので、
『このプログラムを決まった時間に動かしたい！』という希望があればご覧ください。

####1.ターミナルを開いて「crontab -e」と入力し実行
![image7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/b2cff3c9-2de3-25d8-964e-ebf8e64a4820.png)

####2.エディタが開きます
ここに追記していきます。
![image8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/9f34cd8d-73c5-6a33-b6da-71e4cc25fc1c.png)


実行したい時間、プログラムを以下のように記述します。
分~曜日という並び順になっているのに違和感を覚えるかもしれませんがこういうものと思ってください。

```cron
分 時 日 月 曜日 実行したいプログラム
*  *  *  *  *  program
```

もし毎日7:30にプログラムを![image10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/d74b9df5-7e6f-1d28-070a-4efd3f504c97.png)
実行したいという場合は以下のように記述します。
「ж」を実行したい時間に書き換えてください。月、日、曜日を「ж」にして時分だけ指定することで毎日実行することができます。

```cron
30  7  *  *  *  program
```


今回は、毎朝6時に天気予報を取得するプログラムを実行したいので以下のように記述しました。
実行するweather.pyは/home/pi/projectというディレクトリに配置されているのでパスをしていします。
![image12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/f1df2464-446c-2cc4-f9ea-e2e6756dbf1c.png)


###3.アクセス権限(パーミッション)の確認
せっかくcronに登録してもプログラム自体に実行権限がついていなければ意味がありません。
現在のユーザにプログラムの実行権限が付いているかどうか確認しましょう。
ターミナルで以下のコマンドを実行します。

```
ls -l [プログラムのパス]
```

![image10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/d36dc49f-0f97-e87d-0fa5-84b66b61f483.png)

『-rw-r--r--』というのが頭についているのがわかります。
2~4文字目の『rw-』に注目してください。

| 記号(r w x -) | 権限         |
|:--------------|-------------:|
| r             | 読み込み可能 |
| w             | 書き込み可能 |
| x             |   実行可能   |
| -             |     権限なし |
『rw』がついているので読み書きはできますが『x』がないためプログラムを実行することができません

####4.実行権限の付与

以下のコマンドを実行しパーミッションを変更します。

```
chmod 755 [プログラムのパス]
```

以下のコマンドを実行して再度パーミッションを確認しましょう。

```
ls -l [プログラムのパス]
```

![image11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/baeb17c0-77ec-4011-fefb-e6c3e3cd9209.png)

『rw-』→『rwx』に変更されたのがわかりますね。
これでcronから実行されるはずです。

####☆成功
無事にプログラムが実行されLINEに天気予報が通知されました。
![Screenshot_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/308518/79d5d2a7-4bfa-b552-db08-1e783f011698.png)