OmniAICreator/Qiita-1.07M huggingface dataset:
クラウド認定資格について整理する (AWS / Azure / GCP)

私の所属する会社の部門では、クラウド認定資格を取得しよう、というムードが高まっています。クラウド認定資格について調べる担当となったので、大手３クラウドについて認定資格を調べてみました。なお金額はざっくり円換算しています。2020年6月時点でのまとめとなります。

# AWS
まずは王道のAWS認定資格となります。 12個の資格があります。AWS Certifications というようです。

## まとめ
+ 入門編 (約1.1万円/90分)： 
 - Cloud Practitioner
+ 一般編 (約1.5万円/130分)： 
 - Solutions Architect Associate
 - Developer Associate
 - DevOps Administrator Associate
+ 応用編 (約3万円/180分)： 
 - Solutions Architect Professional
 - DevOps Engineer Professional
+ 専門編 (約3万円/180分)： 
 - Advanced Networking Specialty
 - Security Specialty
 - Machine Learning Specialty
 - Alexa Skill Builder Specialty
 - Data Analytics Specialty
 - Database Specialty

## 参考
AWS 認定
https://aws.amazon.com/jp/certification/

# Azure
次にAzure認定資格です。少しややこしいのですが試験に合格しないと認定資格を受験できないようです。MCP (Microsoft Certification Program) というようです。5つに整理されたようなのですが、ロールごとにもっと細かく試験は準備されているようです（[パブリッククラウド認定資格まとめ](https://qiita.com/nakazax/items/47a22b3ca3280a0f9891) に整理されています）。

## まとめ
+ 入門編 (約1.25万円/90分)： 
 - Azure Fundamentals (AZ-900)
+ 一般編 (約2.1万円/180分〜210分)： 
 - Azure Administrator Associate (AZ-104)
 - Azure Developer Associate (AZ-204）
+ 応用編 (約2.1万円/210分)： 
 - Azure DevOps Engineer Expert (AZ-400)
 - Azure Solutions Architect Expert (AZ-300, AZ-301)
+ 専門編 (約2.1万円/210分)： 
 - -

## 参考
【Azureの資格2019年版】Azureの認定資格とクラウド初心者におすすめの資格をご紹介
https://www.fenet.jp/infla/column/technology/66/
Azure関連のMCP試験と認定資格 ～2019年版～
https://blog.nextscape.net/archives/Date/2018/12/mcp2019
パブリッククラウド認定資格まとめ AWS / Microsoft Azure / Google Cloud
https://qiita.com/nakazax/items/47a22b3ca3280a0f9891

# GCP
最後に、GCPです。だいたいAWS、Azureと同じような認定があるようです。7つありました。言語ごとに個別の Google Cloud Webassessor アカウントが必要とのことです。Google Cloud Certified と言うのが共通の呼び名？のようです。

## まとめ
+ 入門編： 
 - -
+ 一般編 (約1.6万円/120分)： 
 - Associate Cloud Engineer (JPN)
+ 応用編 (約2.1万円/120分)： 
 - Professional Cloud Architect (JPN)
 - Professional Data Engineer (JPN)
 - Professional Cloud DevOps Engineer
 - Professional Cloud Network Engineer
 - Professional Cloud Security Engineer
 - Professional Collaboration Engineer (JPN)
+ 専門編： 
 - -

## 参考
認定資格取得のための登録
https://cloud.google.com/certification/register?hl=ja

それでは全員全冠目指してがんばるぞ。
関数の中で関数を出力

#関数の中で関数を出力

今回は勉強を進めているときに、疑問に思った
関数内での関数や変数の記述の仕方について発見があったので
書き留めておきます

まずびっくりしたのが関数内で別の関数は出力できる！ということ

```php
<?php

$n = 2;

function test($n) {
    return $n**2;
}

function hoge($n) {
    if(test($n) < 100) { //関数外定義
        echo "100以下" . PHP_EOL;
    }
    echo "OK!!" . PHP_EOL;
}

hoge($n);

//100以下
//OK!!
```

過去の学習から関数内で定義した変数は関数内でしか使えない
関数外で定義した変数を使いたければ引数で渡せ

これを学んだばかりの私は先入観から

「関数においても同じだろう」

このような安易な考えから

```php
<?php

$n = 2;

function test($n) {
    return $n**2;
}

$fuga = test($n);//わざわざ変数に直す

function hoge($fuga) {
    if(test($fuga) < 100) {
        echo "100以下" . PHP_EOL;
    }
    echo "OK!!" . PHP_EOL;
}

hoge($n);

//100以下
//OK!!
```

という風にかなり遠回りな記述をしていました。

そしてさらに驚いたのは、

```php
<?php

$n = 2;

function hoge($n) {
    function test($n) {//関数内で関数定義
        echo "2乗します" . PHP_EOL;
        return $n**2;
    }
    if(test($n) < 100) {
        echo "100以下" . PHP_EOL;
    }
    echo "OK!!" . PHP_EOL;
}

hoge($n);
test($n);//関数外で出力

// 2乗します
// 100以下
// OK!!
// 2乗します
```

関数の中で定義した別の関数が、関数の外で出力できることです。

もはや{}の囲いから外へ脱走しまくっていますw

用途は少なそうだが頭に入れておいて損はなさそうです。
Flutter duplicate symbols for architecture x86_64

## Flutter duplicate symbols for architecture x86_64の解決

### 34 duplicate symbols for architecture x86_64

```
    ld: 34 duplicate symbols for architecture x86_64
    clang: error: linker command failed with exit code 1 (use -v to see invocation)
    note: Using new build system
    note: Building targets in parallel
    note: Planning build
    note: Constructing build description
```

これが出たときの対処法。

### いつ起こったか
Flutterをiosで起動させようとした時に起こりました。


### 原因
FlutterのプロジェクトがiCloud内のディレクトリで作られている時に起こることがあるらしいです。
エラー通りいろんなファイルが二重で作成されてしまいエラーが起こるというのが原因。

### 解決方法。

#### 1. 二重で作成されたファイルを消去してあげる。

``` 
find . -name \*\ 2.\* //間違えたファイルを消さないように一度確認する。
find . -name \*\ 2.\* -delete
flutter clean
flutter run
```

とりあえず余分に作成されてしまったファイルを消去するという方法。
(たくさんファイルが出てくると思いますが間違えて必要なファイルを消してしまわないように気をつけてください。)
必要があれば上記の2->3でもやってみる。
自分はこれだけでで解決したのですが、解決しない人は以下を試してみるといいかも...


#### 2.podsを再インストールしてみる。

```
cd ios
pod deintegrate
cd ..
flutter clean
flutter run
```


### 最後に
Flutterやっていると自然と英語のドキュメントとか海外のサイト等見ることになる=> 癖がつくのでいい練習になるなって思います。(日本語充実してる言語だとどうしてもそっちに逃げちゃいますよね...)


### 参考
[Duplicate Symbols with IOS Build](https://stackoverflow.com/questions/58905933/duplicate-symbols-with-ios-build)
AWS CodeBuild において オンプレのJenkins では成功していたファイル権限系のテストをするとうまくいかない

# この記事を書くに至った経緯

私が開発しているチームでは、Jenkinsでビルド・テストを行っていました。
色々と環境をAWSに載せ替えていく中で、AWS CodeBuildを使用することになりました。
ところが、ReadOnlyに設定したファイルにWriteできないことをテストすると失敗しているではないか！
これはどうして、ということで調べた結果、わかったことがあります。

## 何が原因だった？どうやって解決した？

CodeBuild内ではデフォルトでroot権限で実行されます。公式のドキュメントにそう記載されています。
<https://docs.aws.amazon.com/ja_jp/codebuild/latest/userguide/troubleshooting.html#troubleshooting-root-build-commands>

今までビルド・テストを行っていたのはオンプレCIサーバ上のJenkinsです。
JenkinsではJenkinsユーザでビルドコマンド等が実行されていました。

じゃあnon-rootなユーザをadduserしてそのユーザで実行してあげればいいかな、とも思ったのですが、
CodeBuildのDockerFileを読むと`codebuild-user`なるユーザがいることに気がつきました。

<https://github.com/aws/aws-codebuild-docker-images/blob/master/al2/x86_64/standard/2.0/Dockerfile>
こちらの42行目に`RUN useradd codebuild-user`と書かれています。

じゃあ、それを利用してあげればいいんじゃない？ってことで、やってあげると無事に成功しました。

## 教訓

- ビルドやテストを行っているユーザがどういう権限を持っているのかを把握するのは大切
- 公式のDockerImage（というか公式の何かしら）に書かれていることを少しでも把握することは問題解決の一歩となる
    - 今回は答えだったけど
エクスプローラをきれいに並べる

#やりたいこと
エクスプローラを複数起動してきれいに並べたい
こんなかんじ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/282159/b3e3c7ec-d620-1959-ca9b-c38fe8e5b144.png)

#やってみた

## 基本的な構造
ウィンドウの幅と高さを定義する
「X軸、Y軸、パスの3つを引数にとって、エクスプローラを開く」関数を作る
あとはこんな感じでエクスプローラをずんずん起動できるようにする

```
execExplorer 0 0 "c:\"
execExplorer 1 0 "c:\program files"
execExplorer 2 0 "c:\program files (x86)"
```

## UWSC版
https://github.com/kumanobori/appProps/blob/master/uwsc/explorers.uws

## PowerShell版
https://github.com/kumanobori/appProps/blob/master/powershell/explorers.ps1

## 感想
どちらもいまいち安定しない(1回で成功しなくて何回かやり直したりする)
waitしたり、よくわからないままなんとか動かしてるところがあるので、もうちょっとマシにしたい
async/await がやっていること

かつてコールバック地獄とか呼ばれていたJSの非同期処理は `Promise` の登場で劇的に改善しました。
さらに `async/await` の構文の登場によってこれらの非同期処理はさらに簡潔に書けるようになりました。

## `async/await` は何をしているのか ?

内部的には `async/await` は `Promise` にある `then()` というメソッドを処理しています。
ここでTypeScriptの `Promise` で定義されている `then()` をみてみます。

```typescript
interface Promise<T> {
  then<TResult1 = T, TResult2 = never>(onfulfilled?: ((value: T) => TResult1 | PromiseLike<TResult1>) | undefined | null, onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | undefined | null): Promise<TResult1 | TResult2>;
}
```

`Promise` には `catch(), finally()` といった他のメソッドもあるのですが `async/await` がみているのは `then()` だけです。

## `async/await` に対応したクラスをつくりたい !!

`then()` を `Promise` と同じシグネチャで実装すれば `async/await` に対応させることができます。
またTypeScriptにはそのための限定的なインターフェイスとして `PromiseLike` があります、これを実装すればお手製の `async/await` に対応したクラスを作ることができます。

(TypeScriptの仕組みで、実際に `PromiseLike` を実装しなくても、同じメソッドシグネチャがあれば実は対応できます)

```typescript
interface PromiseLike<T> {
  then<TResult1 = T, TResult2 = never>(onfulfilled?: ((value: T) => TResult1 | PromiseLike<TResult1>) | undefined | null, onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | undefined | null): PromiseLike<TResult1 | TResult2>;
}
```

`Promise` を実装すると `catch(), finally()` など他のメソッドも実装する必要がありますが、これなら簡単です。

### 実食

```typescript
class Gotta implements PromiseLike<string> {
  public ingredients: Array<string>;

  public constructor(...ingredients: Array<string>) {
    this.ingredients = ingredients;
  }

  public get(): string {
    return this.ingredients.join(', ');
  }

  public then<TResult1 = string, TResult2 = never>(
    onfulfilled?: ((value: string) => TResult1 | PromiseLike<TResult1>) | undefined | null,
    onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | undefined | null
  ): PromiseLike<TResult1 | TResult2> {
    return new Promise<string>((resolve: (ret: string) => void) => {
      resolve('PANCAKE!!!');
    }).then(onfulfilled, onrejected);
  }
}
```

それっぽいクラスを作りました。これを以下のように呼び出します。

```typescript
const gotta: Gotta = new Gotta('flour', 'baking powder', 'egg', 'sugar', 'salt', 'milk', 'vegetable oil');

console.log(gotta.get());
// 'flour, baking powder, egg, sugar, salt, milk, vegetable oil'
console.log(await gotta);
// 'PANCAKE!!!'
```

やり方次第でもうなんでも `await` できるようになります。

### `then()` 実装のコツ

`then()` が要求する引数は `null, undefined` 可で非常に作りづらいので、一度 `Promise` のインスタンスを作成して、その `then()` に引数を任せるのが簡単です。


### 注意

`then()` を独自実装したクラスのインスタンスは `Promise` で包んでしまうと中身が飛び出ます。

```typescript
console.log(await Promise.resolve(gotta));
// 'PANCAKE!!!'
```

こんなことするわけないやろ。と思われるかもしれませんが `async` をつけた非同期の関数でこの問題が起こりえます。

```typescript
const cooking = async (): Promise<Gotta> => {
  return new Gotta('flour', 'baking powder', 'egg', 'sugar', 'salt', 'milk', 'vegetable oil');
}

console.log(await cooking());
// 'PANCAKE!!!'
```

`async` の関数内で使うときは独自色を出しすぎた `then()` を持つクラスのインスタンスの取り扱いに気をつけてください。
Jupyter Notebook on WSL がブラウザで自動起動しない場合の対応方法

諸事情で Mac から Windows に回帰し (2 回目)、WSL で Mac と同じように `jupyter notebook` を実行したところ、ブラウザで自動起動しない事象に遭遇したので、その対応方法を紹介します。
改めて紹介するほどのものでもないかもしれませんが、エラーメッセージでググっても日本語の情報が見つからなかったので、ここにさらしておきます。

## 動作確認した環境

- Windows 10 x64, Version 1909
- Ubuntu 18.04 LTS on WSL1
- Python 3.6.9
- Jupyter Notebook 6.0.3

## 事象

`pip install` で jupyter をインストール後、`jupyter notebook` を実行すると、以下のようなエラーが表示されブラウザで自動起動しません。

```
$ jupyter notebook
[I 01:39:20.094 NotebookApp] Serving notebooks from local directory: /mnt/c/workspace
[I 01:39:20.094 NotebookApp] The Jupyter Notebook is running at:
[I 01:39:20.094 NotebookApp] http://localhost:8888/?token=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
[I 01:39:20.095 NotebookApp]  or http://127.0.0.1:8888/?token=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
[I 01:39:20.095 NotebookApp] Use Control-C to stop this server and shut down all kernels (twice to skip confirmation).
[C 01:39:20.116 NotebookApp]

    To access the notebook, open this file in a browser:
        file:///home/wsluser/.local/share/jupyter/runtime/nbserver-xxxx-open.html
    Or copy and paste one of these URLs:
        http://localhost:8888/?token=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
     or http://127.0.0.1:8888/?token=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Start : This command cannot be run due to the error: The system cannot find the file specified.
At line:1 char:1
+ Start "file:///home/wsluser/.local/share/jupyter/runtime/nbserver-xx ...
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo          : InvalidOperation: (:) [Start-Process], InvalidOperationException
    + FullyQualifiedErrorId : InvalidOperationException,Microsoft.PowerShell.Commands.StartProcessCommand

```

ブラウザ (Windows) 側から WSL 上の nbserver-xxxx-open.html のパスを参照できないために発生するようですが、`http://localhost:8888/?token=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx` の URL に飛ぶと起動します。

## 対応方法 #1

`--NotebookApp.use_redirect_file=False` を指定して実行します。

```
$ jupyter notebook --NotebookApp.use_redirect_file=False
```

毎回オプションを指定するのは面倒なので、適当に alias を設定して実行します。

```
$ echo "alias jn='jupyter notebook --NotebookApp.use_redirect_file=False'" >> ~/.bashrc
$ source ~/.bashrc
$ jn
```

## 対応方法 #2

`--generate-config` を指定して実行し、生成された config ファイル内で `c.NotebookApp.use_redirect_file = False` を設定します。その後、オプションなしで実行します。

```
// config を生成
$ jupyter notebook --generate-config
Writing default config to: /home/wsluser/.jupyter/jupyter_notebook_config.py

// デフォルトの設定を確認
$ grep use_redirect_file ~/.jupyter/jupyter_notebook_config.py
#c.NotebookApp.use_redirect_file = True

// コメントアウトを外し、False に変更
$ sed -i -e 's/#c.NotebookApp.use_redirect_file = True/c.NotebookApp.use_redirect_file = False/g' ~/.jupyter/jupyter_notebook_config.py

// 変更後の設定を確認
$ grep use_redirect_file ~/.jupyter/jupyter_notebook_config.py
c.NotebookApp.use_redirect_file = False

// オプションなしで実行
$ jupyter notebook
```

## 参考

- [Launching notebook to browser on WSL · Issue #4594 · jupyter/notebook](https://github.com/jupyter/notebook/issues/4594)
ゼロから始めるLeetCode Day64「287. Find the Duplicate Number」

# 概要

海外ではエンジニアの面接においてコーディングテストというものが行われるらしく、多くの場合、特定の関数やクラスをお題に沿って実装するという物がメインである。

どうやら多くのエンジニアはその対策としてLeetCodeなるサイトで対策を行うようだ。

早い話が本場でも行われているようなコーディングテストに耐えうるようなアルゴリズム力を鍛えるサイトであり、海外のテックカンパニーでのキャリアを積みたい方にとっては避けては通れない道である。

と、仰々しく書いてみましたが、私は今のところそういった面接を受ける予定はありません。

ただ、ITエンジニアとして人並みのアルゴリズム力くらいは持っておいた方がいいだろうということで不定期に問題を解いてその時に考えたやり方をメモ的に書いていこうかと思います。

[Leetcode](https://leetcode.com/)

Python3で解いています。

[ゼロから始めるLeetCode 目次](https://qiita.com/KueharX/items/6ee2502c3b620c795b70)

前回
[ゼロから始めるLeetCode Day63 「195. Tenth Line」](https://qiita.com/KueharX/items/5c88d0a07201ff0fd16f)

今はTop 100 Liked QuestionsのMediumを優先的に解いています。
Easyは全て解いたので気になる方は目次の方へどうぞ。

[Twitter](https://twitter.com/kueharx)やってます。

**[技術ブログ](https://kueharx.blogspot.com/)始めました！！**
技術はLeetCode、Django、Nuxt、あたりについて書くと思います。**こちらの方が更新は早いので**、よければブクマよろしくお願いいたします！

# 問題

[287. Find the Duplicate Number](https://leetcode.com/problems/find-the-duplicate-number/)

難易度はMedium。
Top 100 Liked Questionsからの抜粋です。

問題としては、各整数が1からnまでの間にあるn + 1の整数を含む配列`nums`が与えられたとき，少なくとも1つの重複した数が存在しなければならないことを証明してください。
重複する数が1つしかないと仮定して，重複する数を求めるアルゴリズムを設計してください。

>Example 1:
>Input: [1,3,4,2,2]
Output: 2

>Example 2:
>Input: [3,1,3,4,2]
Output: 3

>Note:
配列を変更してはいけません（配列は読み取り専用と仮定してください）。
定数，O(1) の余分な空間のみを使用しなければなりません。
実行時の複雑さは，O(n2)以下でなければなりません。
配列の中に重複する数は1つだけですが，それが複数回繰り返される可能性があります。


# 解法
読み取り専用であり、ソートできないという制約があるのを見落とさずに確認しておきましょう。


```python
class Solution:
    def findDuplicate(self, nums: List[int]) -> int:
        low,high = nums[0],nums[nums[0]]
        while low != high:
            low,high = nums[low],nums[nums[high]]
        low = 0
        while low != high:
            low,high = nums[low],nums[high]
        return low
# Runtime: 64 ms, faster than 86.19% of Python3 online submissions for Find the Duplicate Number.
# Memory Usage: 16.4 MB, less than 35.59% of Python3 online submissions for Find the Duplicate Number.
```

`low`と`high`でそれぞれ要素をもち、numsの中の要素を代入し続けていくのをlowに0を代入して繰り返すことによってlowが答えになります。

少し解法としては物足りない部分があるかもしれませんが、今回はここまで。
お疲れ様でした。
2020年06月のCPU事情

# この文書は？

2020年6月現在のPC用/サーバー用のCPUについてのメモ書きです。

# 簡単なまとめ

- PC、サーバーのCPUはx64が主流。スマホ、組込み系ではARMが主流
- コア数は10を超える
- 5GHzを超えるクロックのCPUがある
- 単体CPUの性能ではAMDがIntelを圧勝中(後述)
- AWSのEC2はXeon、EPIC、さらにARM系のCPUがリリースされているので安価にためせる

# Intel 

## XeonとCoreシリーズの違い

サーバー用途用に、CPU数、IOまわりが大幅に強化されているのがXeon。価格も相当強化されている。
[インテル®製品の比較](https://ark.intel.com/content/www/jp/ja/ark/compare.html?productIds=199332,205684)

- 価格。Xeonプロセッサは100万円越え。Coreシリーズは数万円
- 対応ソケット数。Xeonは8ソケットまでいける。
- コア数。Xeonのほうが多い。8380HLだと28コア
- TDP。Xeon 250W って火がでそう。
- 内蔵GPUはCoreシリーズのみ。
- PCI Expressのレーン数。Xeonが3倍
- メモリはサイズも速度もXeonが上。XeonはRIMM。ECCメモリも対応

## [Core™ i9-10900K ](https://ark.intel.com/content/www/jp/ja/ark/products/199332/intel-core-i9-10900k-processor-20m-cache-up-to-5-30-ghz.html)

コア数10、最大周波数5.30GHz、TDW 125W。


##  [Xeon® Platinum 8380HL](https://ark.intel.com/content/www/jp/ja/ark/products/205684/intel-xeon-platinum-8380hl-processor-38-5m-cache-2-90-ghz.html)

コア数26、最大周波数4.30GHz、TDW 250W、最大メモリサイズ4.5TB

# AMD

## Intelより速い理由

AMDはCPU生産を[TSMC](https://www.tsmc.com/japanese/default.htm)に依託しており、TSMCのプロセスルール、世界でもっとも技術力の高い 7nmでCPUを生産できる。
対してIntelは自社工場で10nmのプロセスルールの構築に失敗して、現在作成しているCPUは 14nmとなっている。
プロセスルールが半分になると、同じ面積で作れる素子数が4倍になるし、また素子のサイズちいさければ、
高速になり、消費電力も下げられるので、この差はとても厳しい。
TSMCは世界一の半導体ファウンドリーで、AMD以外にもApple、Nvidiaなどの最新プロセッサを製造している。
この差はまだ2年ほど解消できないらしいのでIntelの苦境は続く。

## [Ryzen™ Threadripper™ 3990X ](https://www.amd.com/ja/products/cpu/amd-ryzen-threadripper-3990x)

コア数64、最大周波数4.30GHz、TDP 280W
(Xeonよりコア数がおおいw)

## [AMD EPYC™ 7H12](https://www.amd.com/ja/products/cpu/amd-epyc-7h12)

コア数64、最大周波数3.30GHz、TDP 280W、最大メモリサイズ (たぶん) 512GB。

# おまけ

## XeonとEPYCの比較
CPU単体の性能はEPYCのほうが優れているが、Xeonは 8CPU対応、最大メモリサイズ4.5TBという点で、(カタログ上の話では)エンタープライズ用途でXeonが選択される場合も十分ある。

## 実際にCPUをためしてみたい人は？

AWSでためせます(他のクラウドベンダーでもためせるかとおもいます)。

Xeonはここで例をあげた8380HL はまだリリースされていないようでその前の世代となりますが、c5インスタンスとなります。

EPYCサーバはAWSのEC2だとカスタムCPUですが、c5aインスタンスになります。ためした人もいるようです。
[Gen2 EPYC を搭載する「c5a」インスタンスの性能をOpenSSLで確認してみた](https://dev.classmethod.jp/articles/new-ec2-c5a-2nd-gen-epyc-openssl/)

# 書けなかったこと

ARM系のCPUについても書きたかったのですが、時間ぎれとなりました。また今度。
知らなかったでは済まされない!!よく見かけるexample.comのアドレスとは

ドキュメントやテストコードなどで `hoge.test.com` など適当なアドレスを例として使っていませんか？適当だからといっても誰かが使っているかもしれないので、それはダメです

「**それ、違法です。**」「**test.comの無断利用 つかまるよ、マジで。**」 という程ではありませんが、ITの常識として知っておくべきでしょう。

# なぜか？

`test.com` は実在する会社のドメインです。実際に使われているアドレスを他人が勝手に使うということは、自分の電話番号や住所などが勝手に便所の落書きに書かれているのと同じ状況なのです。

## 使われていないドメインであれば良いのか？

良くありません。現在使われていないとしても将来的に使われる可能性はあります。

# 使って良いアドレス

**example.com** を使いましょう。このアドレスはインターネットの聖書とも言える `RFC` でテスト用のアドレスとして使うように定められています

> **3. Reserved Example Second Level Domain Names**
> The Internet Assigned Numbers Authority (IANA) also currently has the
> following second level domain names reserved which can be used as
> examples.
>     example.com
>     example.net
>     example.org

https://tools.ietf.org/html/rfc2606#section-3

上記にある通り **example.net** と **example.org** も同様に使えます

## 他のアドレスも使いたい場合

上記の3つだけでは物足りない場合は、上の RFC2606 文書の中に以下のトップレベルのテスト用ドメインも用意されています。ただし、これらのドメインは使用方法がある程度決められているために、目的を意識して使いましょう

| アドレス | 目的 |
|:--------|:-----|
| .test | テスト用に使う |
| .example | ドキュメント等に例に出すアドレスとして使う |
| .invalid | 繋がらないアドレスとして使う |
| .localhost | 送信元と送信先が同じ(loopback)アドレスとして使う |

このルールに則って、 `aaa.test` や `bbb.example` 、 `xxx.invalid` 、 `itsme.localhost` などは気兼ねなく使えます

## 日本独自のテスト用アドレス

日本向けにも独自にテスト用のアドレスがいくつか用意されています

> 次の文字列のJPドメイン名は、例示としてご利用いただけます。
> 
> "EXAMPLE"を用いたもの
> 例： EXAMPLE.JP
> 　　 EXAMPLE.CO.JP
> 　　 EXAMPLE.NE.JP
> 
> "EXAMPLE"の後に1桁の数字（""0""から""9""）がつく文字列を用いたもの
> 例： EXAMPLE1.JP
> 　　 EXAMPLE2.CO.JP
> 　　 EXAMPLE3.NE.JP
> 
> 次の日本語ドメイン名
> 
> ドメイン名例.JP （日本語JPドメイン名）
> XN--ECKWD4C7CU47R2WF.JP （「ドメイン名例.JP」のpunycode表記）

https://jprs.jp/faq/use/

# 実際にアクセスするわけではなくても

テストコードのバグなど何らかの拍子で実際に繋がってしまうかもしれません。間違った時に、誰かに迷惑がかかる可能性はあります。

* テスト用サーバーに対して負荷をかけるつもりだったが、実際のサーバーに負荷をかけてしまった
* 配信テスト用のメールを大量に送り付けてしまった

そんなことにならないように、誰にも迷惑のかからないアドレスを使いましょう。

テスト用だからどんなアドレスでも構わないというような考えだと、いつの日か「セシウムさん騒動」のような事が自分の身にも起きてしまうかもしれません。意図しなくても他のサーバーに迷惑をかけてしまえば、損害賠償や刑事責任を負う可能性は出てきます
Excel VBA + SeleniumBasic でサイボウズ操作、在席ステータスを変更する

## 環境
windows10
Excel（Office365）
Google Chrome ver 83.0.4103.106
SeleniumBasic ver 2.0.9.0
chromedriver ver 83.0.4103.39
サイボウズ試用版

## サイボウズログイン、在席ステータスを取得
``` vb
Sub 席空きに変更する_Click()
    Dim Driver As New Selenium.WebDriver
    Dim seatStatus As String
    
    ' Chromeを開く
    Driver.Start "chrome"
    ' サイボウズを開く
    Driver.Get "https://xxx.xxx.xxx"
    ' ログイン名を入力
    Driver.FindElementByXPath("//*[@id='username-:0-text']").SendKeys "xxxxxxx@gmail.com"
    ' パスワードを入力
    Driver.FindElementByXPath("//*[@id='password-:1-text']").SendKeys "xxxxxxx"
    ' ログインボタンを押す
    Driver.FindElementByXPath("//*[@id='login-form-outer']/form/div[4]/div[2]/input").Click
    ' サイボウズofficeをクリック
    Driver.FindElementByXPath("/html/body/div[5]/div/div[1]/div/a[2]").Click
    ' 在席ステータスをクリック
    Driver.FindElementByXPath("//*[@id='cb7-portlet-body-110']/form/table/tbody/tr/td/table/tbody/tr/td[2]/a").Click
    ' セレクトボックスを選択
    Driver.FindElementByXPath("//*[@id='content-wrapper']/div[4]/div/form/table/tbody/tr/td/table/tbody/tr[2]/td/div/div[1]/table[2]/tbody/tr[1]/td/select").AsSelect.SelectByText "席空き"
    ' 変更ボタンをクリック
    Driver.FindElementByXPath("//*[@id='content-wrapper']/div[4]/div/form/table/tbody/tr/td/table/tbody/tr[2]/td/div/div[2]/p/input[1]").Click
    Driver.Wait 3000
    ' トップページに戻る
    Driver.FindElementByXPath("//*[@id='appIconMenuFrame']/div[2]/span[1]/a").Click
    ' セルに在席ステータスを書き込む
    seatStatus = Driver.FindElementByXPath("//*[@id='cb7-portlet-body-110']/form/table/tbody/tr/td/table/tbody/tr/td[2]/a").Text
    Range("B3").Value = seatStatus
End Sub
```
DNSの動きを確認する方法

- 勉強のメモがわりに記載をする

# DNSの動きを確認する方法 (正引き)
```shell
// 例
$ nslookup ec2-18-176-122-190.ap-northeast-1.compute.amazonaws.com (ホスト名)
```
紐づいている **IPアドレス** がわかる

# 逆引きする
```shell
// 例
$ nslookup 18.176.122.190 (IPアドレス名)
```
紐づいている **ホスト名** がわかる
Pix2PixをiOSモバイル用モデルに変換（CoreML)スマホで画像生成。

![pix2pix_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235259/c230ab22-83f4-d871-909a-a8a512423e7b.png)

*論文:[条件付き敵対的ネットワークによる画像から画像への変換](https://arxiv.org/abs/1611.07004)

CoreMLに変換することでpix2pix画像変換をiPhoneアプリで使用できます。

このストーリーでは、[TensorFlow CoreのPix2Pixチュートリアルモデル](https://colab.research.google.com/github/tensorflow/docs/blob/master/site/en/tutorials/generative/pix2pix.ipynb)を使用します。

最初に、Colaboratoryでチュートリアルモデルをトレーニングします。

colabの以下のセルまでの全てのセルを実行します。

```
fit（train_dataset、EPOCHS、test_dataset）
```

モデルのトレーニングが完了したら、新しいセルを挿入して以下の手順で変換を実行します。

1、TFCoreMLをインストールします。

```
！pip install --upgrade tfcoreml
```

2、チェックポイントを復元します。

```
checkpoint.restore（tf.train.latest_checkpoint（checkpoint_dir））
```

3、「saved_model」フォーマットでジェネレータを保存します。

```
generator.save（ './ savedmodel'）
```

4、変換を実行します。

```python
import tfcoreml
input_name = generator.inputs[0].name.split(':')[0]
print(input_name) #Check input_name.
keras_output_node_name = generator_g.outputs[0].name.split(':')[0]
graph_output_node_name = keras_output_node_name.split('/')[-1]
mlmodel = tfcoreml.convert('./savedmodel',
                       input_name_shape_dict={input_name: (1, 256, 256, 3)},
                       output_feature_names=[graph_output_node_name],
                       minimum_ios_deployment_target='13',
                       image_input_names=input_name,
                       image_scale=2/ 255.0,
                       red_bias=-1,
                       green_bias=-1,
                       blue_bias=-1,
                       )
mlmodel.save('./pix2pix.mlmodel')
```

これで、iOSプロジェクトでPix2Pixを使用できます。

```swift
import Vision
lazy var coreMLRequest:VNCoreMLRequest = {
   let model = try! VNCoreMLModel(for: pix2pix().model)
   let request = VNCoreMLRequest(model: mode, completionHandler: self.coreMLCompletionHandler0)   
   return request
   }()

let handler = VNImageRequestHandler(ciImage: ciimage,options: [:])   

DispatchQueue.global(qos: .userInitiated).async {   
  try? handler.perform([coreMLRequest])
}
```
multiArrayを画像として視覚化するには、Hollance氏の[CoreML Helpers](https://github.com/hollance/CoreMLHelpers)が非常に便利です。

[MultiArrayからImageへの変換　CoreMLHelper](https://qiita.com/john-rocky/items/bfa631aba3e7aabc2a66)

チャオ！

Twitterフォローしてくださいお願いします！
https://twitter.com/JackdeS11
QMK Firmwareビルド環境構築

この記事は[自作キーボード Helixを組み立ててみた](https://qiita.com/msrx9/items/1f328c1976fe2025491b)の補足用に書いた記事です。

## 環境

- MacOS Catalina 10.15.5

## TLDR

QMKのビルド環境を整えるのに必要だったコマンドは以下です。

```bash
# xcrunインストール
xcode-select --install

# QMKビルドツールのインストール
git clone --recrusive https://github.com/qmk/qmk_firmware.git
cd qmk_firmware/
util/qmk_install.sh

```

---

## led_testをビルドするまでに出たエラーと対処

qmk_firmwareをcloneして`led_test`をmakeしてみます。

```
git clone https://github.com/qmk/qmk_firmware.git
cd qmk_firmware/
make helix:led_test
```

makeしようとすると次のエラーがでました。

> xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun

xcrunをインストールするために次のコマンドを実行して、再度makeします。

```bash
xcode-select --install
```

今度は次のエラーが出ました。LUFAのmakefileがないそうです。


>tmk_core/protocol/lufa.mk:14: lib/lufa/LUFA/makefile: No such file or directory
/bin/sh: avr-gcc: command not found
make[1]: *** No rule to make target `lib/lufa/LUFA/makefile'.  Stop.
make: *** [helix:led_test] Error 1


調べてみると[【DZ60】ファームウェアをmakeできない](https://r7cancer.hatenablog.com/entry/2019/10/18/153458) にLUFAは別途Cloneしないといけないとありました。

```bash
cd qmk_firmware/lib
git/ clone https://github.com/qmk/lufa.git
cd ../
```

libf配下に移動してlufaをcloneして、またqmk_firmware配下に移動して再度makesします。

> mba:qmk_firmware msrx9$ make helix:led_test
QMK Firmware 0.9.19
WARNING:
 Can not run bin/qmk! This tool will be required when the develop branch is merged on 2020 Aug 29.
>
> Please run util/qmk_install.sh to install all the dependencies QMK requires.
>
>WARNING: Some git submodules are out of date or modified.
 Please consider running make git-submodule.
>
>Making helix/rev2 with keymap led_test
>
>/bin/sh: avr-gcc: command not found
sh: avr-gcc: command not found
sh: avr-gcc: command not found
make[1]: *** [.build/obj_helix_rev2_led_test/compiler.txt] Error 127
make: *** [helix:led_test] Error 1
Make finished with errors


次はavr-gccがないと怒られました。よく読むと `Please run util/qmk_install.sh to install all the dependencies QMK requires.` とありますね。QMK用のビルドツールをインストールしましょう。


```
util/qmk_install.sh
```

再度makeします。
無事makeが完了して、FWが生成されました。
自作キーボード Helixを組み立てる時に悩んだことや失敗したこと

![](https://i.imgur.com/RTZvM0K.jpg)

## 組み立てる前に読むべき資料

- [Helixベータ ビルドガイド](https://github.com/MakotoKurauchi/helix/blob/master/Doc/buildguide_jp.md)
  - マニュアルです。しっかり読み込みましょう。

- [ごみHelixキーボードの作り方](https://qiita.com/chesscommands/items/6bf774ee30d410995879)
  - ビルドガイドを何回か良んでわかった気になった後で読みましたが、え、こんなことビルドガイドに書いてあった？（書いてあるけど読み飛ばしていた）という点が出てきたので、初めて組み立てる方は是非読むべきです。この記事のおかげで失敗を未然に防げました。ありがとうございます。
 


## 組み立てたときのログ

組み立て方法は読むべき資料を読んでもらうとして、私が悩んだこと、失敗したことを書きます。

- 左手用PCB、右手用PCBの見分け方
  ![](https://i.imgur.com/00fM0zD.jpg)
  
  - 左手用はPCBにHelixの文字がシルク印刷されてる
  - 右手用はPCBに隕石？タコ？みたいなマークがシルク印刷されてる
  - １種類のPCBで左手用、右手用に対応しているリバーシブルPCBなので、**表面、裏面のどちらに実装するかは大事**
- `上面側`、`下面側`とは?
  - 表面側、裏面側のこと。上、下と書かれると同じ面の上下なのかと少し迷った

### 失敗したこと

- ProMicroの実装位置を間違えた
  ![](https://i.imgur.com/8Bbmuwr.jpg)

  > シルクにしたがって上面から実装してください。


  よくある（かはわからないけど）PCBは表面、裏面共にシルクを信用して実装してよいですが、Helixは１枚のPCBで左手用、右手用の配線がされたリバーシブルのPCBです。

  なので、ジャックやProMicroをPCBに挿入したとき、足の出た先のシルクで正しいかどうかを判断してしまうと失敗します。

  私はProMicroを **裏面のシルクに合わせて** 挿入して通電してしまいました。
  写真は正しい挿入位置ですが、失敗した時はProMicroの足がシルク印刷された白い枠内に出ていました。
  結果は、PC上で接続されたことは認識はできず、LEDも点灯せずのうんともすんとも言わない状態になりました。
  で、おかしいなーと思ってPCBを触ってたら**ProMicroが異常発熱していました。ヤバイです。**
  1分ぐらいは通電してたでしょうか。速攻USBケーブルを引き抜きました。とりあえず壊れはしなかったようで良かったです。

- LED実装失敗
  ![](https://i.imgur.com/EuFTRsO.jpg)
  左上のLEDがハンダ不良でした。
  この状態でLEDテストを行うと[この動画](https://youtu.be/ZH8R6sHSql8)みたいになります。
  ただしく実装できている時には[この動画](https://youtu.be/ZUN0Nlil1zM)のようになります。


## うーん？ってなったこと

### 1. LEDテストってどうやるの?

[ファームウェアガイド](https://github.com/MakotoKurauchi/helix/blob/master/Doc/firmware_jp.md) に載ってるかなと思いましたが載っていません。
ので、[LED test Keymap
](https://github.com/qmk/qmk_firmware/tree/master/keyboards/helix/rev2/keymaps/led_test) に記載されている手順でFWをビルドし、QMK ToolboxでProMicroに焼きます。

#### 1.1 FWをビルドできない

ビルド環境が整ってる人は問題ないでしょうが、私は初めてだったのでled_test用のFWをビルドしようとしたらいくつかエラーが出ました。内容が長いので[QMK Firmwareビルド環境構築](https://qiita.com/msrx9/items/60c41e7866182eec0768)の記事に分けました。


### 2. FWを焼いたあとのデフォルト配列はQWERTYじゃなくてDovorak

FWを焼いて入力を試していると、`asdfg`を押してるのに`aoeui`が入力されます。
なんか見たことある。あ、Dovorak配列だ。
QMKはショートカットキーでQWERTYやDovorak配列を選択できるので、`Raise + j` でQWERTYに変更しました。
初期設定がDovorak配列というのは嘘やん、と思いました。

- おかしいと思ってFWを焼き直してもDovorak配列だったからこう思ってますが、何か手順を間違っていたらごめんなさい



### 3. TRRSケーブルが20cmは短かった

Macbookの両脇にHelixを置きたかったけど、20cmだとこうなりました。
![](https://i.imgur.com/1PkSs4M.jpg)

50cmだとこんな感じ。ちょっと長いけどトラックパッドをうまく避けれてるから良しとしよう
![](https://i.imgur.com/EKkPnhs.jpg)

---

## HelixとQMKの使用感

１発目の感想は、**格子配列使いにくっ！！** でした。
でも我慢して使ってれば慣れるだろうと思い、この記事をHelixで書き始めてみました。
とりあえず触り始めた翌日、何十年も触ってるはずの普通のキーボードを触った瞬間、**普通配列使いにくっ！？** でした。
人間、すぐ慣れるものですね。翌日にはMTGの議事録もHelixで普通にとれました。

Helixというか、QMKのデフォルト配列を使って気に入ってる点はRaiseとLowerキーの存在のおかげで殆どのキーをホームポジションから動かなくて打てるという点です。
もし一般的な配列のキーボードに戻るとしてもQMKを使いたいので、次も自作しようという気になってるぐらい気に入りました。
Laradock使ったら表示できなくてNginxに怒られた

# エラー

なんかLaradock起動したのに localhost でつながらんな、と思って確認したら、
docker-compose で起動したときに `-d` しないでログ見てたらこんなのが出ていた。

```
nginx: [emerg] socket() [::]:80 failed (97: Address family not supported by protocol)
```

# 環境

- Arch Linux (もうこれが原因のような気しかしない)

# 原因

IPv6 がないよって nginx がキレている。
私のArchではIPv6を中途半端にdisableしていた。そりゃ使えないって言われるか。

# 対処

`Laradock/nginx/sites/default.conf` 内の設定をいじる

```conf:default.conf
server {

    listen 80 default_server;
    # listen [::]:80 default_server ipv6only=on;
    # ↑これをコメントアウトしておく
```

で docker-compose 上げ直し。

# やったぜ

Archくん、LinuxネイティブだからDocker早いんだが、小生のスキル不足で躓くこともそこそこ。
勉強せねば
【自己学習】Railsチュートリアル第一章

##[Rails]Railsチュートリアル第一章からでてきそうな試験問題（予想）

Rails 5 技術者認定ベーシック試験を受けたいが,
過去問や参考になるものがなかったので、Railsチュートリアルを見ながら自作で出てきそうな問題を作成する。
※予想で作成しているため過度な期待は注意

問題1:Railsサーバーを立ち上げるコマンドを以下から正しいものを2つ選べ

```
1. rails g
2. rails s
3. rails server
4. rails c
5. rails console
```

**正解:2,3**

問題2:新規Railsプロジェクトを作成するコマンドを以下から正しいものを選べ

```
1. rails g
2. rails s
3. rails server
4. rails c
5. rails new
```

**正解:5**

問題3:Rubyのバージョンを確認するコマンドを以下から正しいものを2つ選べ

```
1. ruby --version
2. ruby --versions
3. ruby -v
4. ruby --v
5. ruby version
```

**正解:1,3**

問題4:Railsのバージョンを確認するコマンドを以下から正しいものを2つ選べ

```
1. rails -v
2. rails -versions
3. rails --version
4. rails --v
5. rails --versions
```

**正解:1,3**


問題5:ルーティングを記述するファイルを以下から正しいものを選べ

```
1. route.rb
2. routing.rb
3. routed.rb
4. root.rb
5. routes.rb
```

**正解:5**


### 参考
Ruby on Rails チュートリアル
https://railstutorial.jp/chapters/beginning?version=5.1#code-rails_command
MultiArrayからImageへの変換　CoreMLHelper

![pix.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235259/a1cfa6ab-8fb3-5b09-70cf-825fe65c45fc.png)
CoreMLモデルの出力をMultiArrayからImageに変換するには、[CoreMLHelper](https://github.com/hollance/CoreMLHelpers)が便利です。

1、上のCoreMLHelper GitHubページリンクからCoreMLHelpersのファイルをダウンロードします。

2、XcodeプロジェクトにCoreMLHelpersファイルをコピーします。
<img width="538" alt="スクリーンショット 2020-06-22 4.56.58.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235259/f0135c93-b401-000e-4a01-7e7ede9a06cd.png">
必要なファイルのみで問題ありません。

3、MultiArray値からCGImageを作成します。

```swift
let cgimage = multiArray？.cgImage（min：-1、max：1、channel：nil、axes：（3,1,2））
```

MultiArray値が-1…1の場合、（最小：-1、最大1）を指定します。それ以外の場合、それらが0…255の場合、（最小：0、最大255）を指定します。

Hollance氏に感謝します。


Twitterフォローしてくださいお願いします！
https://twitter.com/JackdeS11
【初学者手順書１】Ruby on Rails ：開発環境の構築

5月中旬からRuby on Rails(以下、rails)の学習を始めて、超標準的なチャットアプリ制作~デプロイまでを一通り経験したので、自身の備忘録として手順を整理していきたいと思います。

私が行ったRailsでのチャットアプリ制作は以下のような流れです。
7回に分けてチュートリアル作成します。

1　Macでの開発環境構築(MacOS Catalina)
2　Railsでアプリの雛形作成
3　フロント画面の実装（hamlとsass）
4　ログイン機能実装
5　グループ機能実装
6　メッセージ機能実装
7　Ajax非同期通信の実装

# Ruby on Rails 開発環境の構築
初めにMac(MacOS Catalina)での環境構築手順を整理します。

## ◉Command Line Toolsの導入
Command Line Tools = ソフトウェアをコマンドライン(ターミナル)で動かすためのツールです。
ログインシェルをzshにするため、ターナルで下記のようにコマンドを実行します。

```ターミナル
# zshをデフォルトに設定
% chsh -s /bin/zsh
# ログインシェルを表示
% echo $SHELL
# 以下のように表示されれば成功です。
/bin/zsh
```
Command Line Toolsをインストールします。

```
% xcode-select --install
```

## ◉Homebrewの導入
Homebrew = ソフトウェアの管理ツールです。
Homebrewインストール手順です。

```
# ホームディレクトリに移動
% cd
# ホームディレクトリにいるかどうか確認
% pwd
# Homebrewの導入(処理に時間がかかる)
% ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
# バージョン確認
% brew -v
Homebrew "バージョン"
# 最新の状態にする
% brew update
# 権限の変更
% sudo chown -R `whoami`:admin /usr/local/bin
```

## ◉最新のRubyを導入

```
# rbenv と ruby-buildをインストール
% brew install rbenv ruby-build
# どこからでも使えるようにする
% echo 'eval "$(rbenv init -)"' >> ~/.zshrc
# 設定ファイルの修正を反映
% source ~/.zshrc
# readlineの導入(日本語入力のため)
% brew install readline
# どこからでも使えるようにする
% brew link readline --force
```
Rubyのインストールします。(時間がかかります)

```
% RUBY_CONFIGURE_OPTS="--with-readline-dir=$(brew --prefix readline)"
% rbenv install "バージョン"
```
インストール後の手順です。

```
# バージョンを指定してデフォルトのrubyから変更
% rbenv global 2.6.5
# 設定の変更を反映
% rbenv rehash
# バージョンの確認
% ruby -v
```


## ◉MySQLの導入
MySQL = データベース管理ツール

```
# MySQLのインストール
% brew install mysql@5.6
# 自動起動設定
% mkdir ~/Library/LaunchAgents 
% ln -sfv /usr/local/opt/mysql\@5.6/*.plist ~/Library/LaunchAgents
% launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mysql\@5.6.plist 
# MySQLコマンド導入
% echo 'export PATH="/usr/local/opt/mysql@5.6/bin:$PATH"' >> ~/.zshrc
% source ~/.zshrc
# MySQLコマンドを試す
% which mysql
# 以下のように表示されれば成功
/usr/local/opt/mysql@5.6/bin/mysql
```
MySQLの起動確認です。

```
# MySQLの状態を確認
% mysql.server status
# 以下のように表示されれば成功
 SUCCESS! MySQL running
```

## ◉Railsを導入
Rails(アプリケーションフレームワーク)はRubyのGemなのでbundlerでインストールします。

```
# bundlerのインストール
% gem install bundler
# railsのインストール(時間がかかる)
% gem install rails --version='6.0.0'
# rbenvの再読み込み
% rbenv rehash
# railsのバージョン確認
% rails -v
Rails "バージョン" 
(後にrails newコマンドで指定します)
```

## ◉Node.jsの導入
JavaScriptでサーバーサイドの処理を可能にさせるプログラムです。
Railsで非同期通信を行う際、JavaScriptを使用します。
Homebrewでインストールします。
(already installedのエラーは無視でOK)

```
# node.jsをインストール
% brew install nodejs
# バージョン確認
% node -v
```

## ◉yarnの導入
JavaScriptのパッケージマネージャです。
Node.js上で動作してJavaScriptのライブラリを管理します。

同じJavaScriptのパッケージマネージャでnpmがありますが、
yarnはnpmを改良したものという位置付けのようです。

```
# yarnをインストール
% brew install yarn
# yarnのバージョン確認
% yarn -v
```

以上、Ruby on Railsにおける開発環境構築は完了です。
Elastic Cloud Controller (ecctl)をセットアップするGitHub Action

> UPDATE: 最新action-setup-ecctl-0.2.0をお使いください。理由: [GitHub Actionsのset-envとadd-pathの廃止](https://github.blog/changelog/2020-10-01-github-actions-deprecating-set-env-and-add-path-commands/)に伴い@actions/coreを1.2.6にアップグレードしてます。

Elastic CloudのデプロイメントのNode数を変更するという作業をCI/CD化したい。CI/CDはGitHub Actionsで構築し、そのパイプラインではElastic Cloud Controller ([ecctl](https://github.com/elastic/ecctl))を使ってNode数を変更したい。ecctlをセットアップするActionがないか[GitHub Actions Marketplace](https://github.com/marketplace?type=actions)を探してみたところなかった。そういうわけで、作ってみた。

- https://github.com/yokawasa/action-setup-ecctl
- https://github.com/marketplace/actions/elastic-cloud-control-ecctl-tool-installer

詳しくは上記GitHubレポジトリを参照いただくとして、ここでは簡単にポイントだけを書いておくとする。

## どんなAction?
- 指定versionのecctlパッケージをダウンロードして展開して、ecctlコマンドのパスを`ecctl-path`という名前でoutput出力に設定する
- ダウンロードしたらそいつをcacheディレクトリに配置するので同じバージョンであれば２回目以降はキャッシュから実行
- サポートOSはLinuxとmacOS

## どうやって使う？

特定のecctlのバージョンを利用したい場合は次のように、セットアップ用actioninputにてversionを指定することで、後続のstepでそのバージョンのコマンドの実行が可能。

```yaml
- uses: yokawasa/action-setup-ecctl@v0.2.0
  with:
    version: 'v1.0.0-beta3'   # default is 'latest'
  id: setup
- run: |
  ecctl version
```
ecctlのバージョン指定は必須ではなく、指定しない場合はデフォルト`latest`、つまり最新のバージョンがダウンロードされる。

```yaml

- uses: yokawasa/action-setup-ecctl@v0.2.0
  id: setup
- run: |
  ecctl version
```

以上、簡単でしたがaction-setup-ecctlの紹介でした。何か問題を見つけたとか、フィードバックなどあれば、上記GitHubレポジトリにissue登録いただけると嬉しいです。
マッスルJavaオブジェクト指向 1日目

#インスタンス
> クラスとは?(復習)
設計書のようなもの
・定義するもの
　・状態(状況)：変数(フィールド)
　・振る舞い(動作)：メソッド

- 設計書(クラス)から作成された実体(インスタンス)
- 複数の生成も可能 
   
<img width="400" alt="インスタンス" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/644035/a4848d30-8e06-d055-0c03-00edcad090e2.png">


##インスタンス(コード生成)
```
クラス名　インスタンス変数名(自由) = new クラス名(引数)[コンストラクタ指定]；
```
生成したインスタンスを変数に格納
ここで注目すべきは！！
__クラス型(参照型)のインスタンス変数__

> Javaの全変数は静的型付けにより、クラス型の宣言を行った

##コンストラクタ
- インスタンスを生成するときに行う初期化処理をする特別なメソッド
- コンストラクタの特徴
 - メソッド名はクラス名と同じ
 - 戻り値なし
 - 引数の異なるコンストラクタは複数あっても良い
 - コンストラクタは省略可能 

```
// Personクラス

public class Person {
  public Person(){
   age = 1;
  }
  public Person(int a){
   age = a;
  }
  public Person(String a){
   age = a;
  }
  public void printAge(){
   System.out.println("私は"+age+"歳です");
  }
 }
}
```
```
// mainクラス

public static void main(String args[]){
  Person p1 = new Person();
  p1.printAge();
  
  int num1 = 29;
  Person p2 = new Person(num1){
  p2.printAge();
  }

  String num2 = "29";
  Person p3 = new Person(num2){
  p3.printAge();
  }
}
```

##static定義
staticフィールド、staticメソッドへのアクセス
- staticキーワードがついたフィールドやメソッドにはインスタンス生成しなくて、使える

| 内容| 使い方| 
|----|-------|
|staticメソッド使う|クラス名.メソッド名(引数)|
|staticフィールドを使う|クラス名.フィールド名|

###static定義の制限
- staticフィールド
 - 変数の値を１つしか保持できない　→　格納するたびに上書きされる
- staticメソッド
 - staticメソッド内からは、同一クラス内のstaticが無いメソッドや、staticが無いフィールドを使えない
   - staticメソッド内でインスタンスを作れば、アクセス可能    


##クラス連携
- 他のパッケージのクラスを使う場合
 - コードに直接「パッケージ名.クラス名」で指定  
 - import宣言で使う
     - import 他のパッケージ名.クラス名;
     - import パッケージ名.*(全てのクラス);
async/awaitを使った非同期処理

##async/awaitとは
Promiseをベースにした非同期のコードを簡単に処理するメソッド

##asyncを使った時、使わない時
asyncを使うと、返り値をPromiseを使って表示させることになる。

・asyncを使わない時

```javascript
const doWork = () => { }
console.log(doWork())
```
↓
「undefined」が返ってくる
（まだdoWork関数は何も定義されていないため）

・asyncを使った時

```javascript
//asyncを用いて実装
const doWork = async() => {}
console.log(doWork())
```
↓
「Promise{undefined}」が返ってくる

<h6>★asyncは常にPromiseを返す！！！</h6>

<h6>asyncを使うメリット</h6>
→「.then()」「.catch()」を用いて、成功時、失敗時の次の処理を記述することができる。

```javascript
const doWork = async() => {

//エラーの時のパターンを見たい場合
//throw new Error('something wrong') をここに記入
return "Hello World"
}

doWork().then((result) => {
console.log('result', result)

}).catch((e) => {
console.log('e', e)
})
```
↓
・処理成功した時
「result Hello World」と表示される
・エラー時
「e Error:something wrong」と表示される

##awaitを用いた実装
awaitを用いると、複数の非同期処理を簡単に扱える

<h6>★awaitは常に、asyncファンクションの中でしか使えない</h6>

```javascript
//非同期処理、add関数の定義
const add = (a, b) => {
//返り値をPromiseで実装
  return new Promise ((resolve, reject) => {
    setTimeout(() => {
        if(a < 0 || b < 0){
          return reject('Number must be non-negative')
        }
      resolve(a + b)
    }, 2000)
  })
}

const doWork = async() => {
  const sum = await add(1, 99)//もしも「await add(1, -99)」ならば、次の処理に行く前にエラーを返す
  const sum2 = await add(sum, 50)
  const sum3 = await add(sum2, 3)
  return sum3  //sumからsum3まで順番に実行される。ネストされず非同期処理を連続させられる
}

doWork().then((result) => {
  console.log('result', result)
}).catch((e) => {
  console.log('e', e)
})

```

<h6>awaitを使うメリット</h6>
①ネストさせずに非同期処理を連続で記述することができる

②非同期処理の連続の中で、エラーになったものが一つでもでたら、次の非同期処理に移らずに処理を終了してくれる

##参考文献
「The complete Node.js Developer Course」
https://www.udemy.com/share/101WGiAEIedVpTTX4D/
【pug】pugで詰まったところまとめ

## 初めに
pugの記法で自分が詰まった箇所をアウトプットを兼ねてまとめました。他の記事にて既出のものばかりなので目新しいものはありません。pugの書き方で抑えておきたいことに出会う度に追記していこうと思います。

## pug記法まとめ
### 1. デザインの場合分け

あるパラメータを参照してデザインの場合分けを行いたい時に、以前まで1つのclass名をつけるのに下記のようにif文で大きく括っていました。

```pug:失敗例
if hoge
  .content.hoge-class
    .content-body
else
  .content
    .content-body
```
if文の条件式がtrueだった場合にはcontentクラスにhoge-classを付与してあげることでデザインを変えていました。上記の例だとまだ内容が短いので許容範囲内ですが、それ以降の行が長くなるにつれかなり可読性を悪くしていて何か対応策はないか探していました。
そこで下記のようにdivのパレンティス内でclassを指定し、なおかつ三項演算子を使ってclassの出し分けを行いました。

```pug:成功例
div(class = hoge ? 'content　hoge-class' : 'content')
  .content-body
```
以降のコードを丸々記述せずにすみ、スッキリ書くことができました。class名の書き方が普段のドット始まりではないことに注意します。これでhoge-classにcssを当ててあげることでデザインの場合分けをすることができます。

### 2. requiredやcheckedなどの場合分け
次はrequiredやcheckedなどの属性の場合分けです。初めは条件によってrequiredという文字列か空文字を渡そうとしていたのですが、全てtrue判定となってしまいました。

```pug:失敗例
- const isRequired hoge ? 'required' : ''
input(type='text', name='example', isRequired)
```
下記のように変数にtrue、falseを格納し、requiredに対して渡してあげることで出し分けができるみたいです。

```pug:成功例
- const isRequired hoge ? true : false
input(type='text', name='example', required=isRequired)
```
先程の1のclass名の時もそうでしたが、パレンティス内ではJavaScriptの記法を普通に使うことができるみたいですね。全てが使用できるかどうかはわかりませんが。。。

## まとめ
自分の暗記用、アウトプット用にまとめたので拙い説明になっているかもしれませんが、同じ内容で困っている方の助けになれば幸いです。今後も便利そうなものを発見しましたら都度更新していこうと思いますのでよろしくお願いします。
競技プログラミングにおける標準入力の受け取り方

競技プログラミングでは、標準入力を受け取る機会が多いが、それの受け取り方を備忘録として残しておく。

```input.txt
Hoge
```

```sample.py
from sys import stdin

a = stdin.readline().rstrip()
print(a.upper())    # 読み込んだ文字を大文字に変換
```

の2つのファイルを作成し、ターミナルで以下を実行する。

`python sample.py < input.txt`

すると、

`HOGE`

が返ってくる。
Dockerがない世界線を想像してみた。

## Dockerって結局なんなん？
なんか今当たり前の技術だと聞いて、ひととおり勉強して開発環境に取り入れてみたけどイマイチありがたみを感じなかったので、今回は

　**・dockerを使う利点**
　**・dockerがないとどう不便なのか？**

という軸で素人なりに考えてみました。

dockerの使い方とか詳しい説明とかは他に優秀な記事がゴロゴロ転がってるので割愛します。



## メリット
dockerを使う主なメリットとして
**・起動が早い**
**・環境構築をファイル化できる**
**・環境差分が生まれない**

あたりがあげられる。

### ○起動が早い

よくこう言う図で説明される。
コンテナ型技術というもので
従来のホスト型のサーバーよりも軽量で動作が早いそうだ。
[![Image from Gyazo](https://i.gyazo.com/1ea44884b562ee7effea94b24934b7ec.png)](https://gyazo.com/1ea44884b562ee7effea94b24934b7ec)

ただ自分はあまりその利点を感じなかった。
おそらく個人での開発は規模が小さすぎて変化がわかりづらいのだろう。(Vagrantも使用したことあるがそんな変わらない気が、、、)

複数チームで規模の大きな開発を行う時に効率が上がるのだろう。

ちなみにコンテナ技術はDocker以前にもあったらしい。



### ○環境をファイル化できる

通常開発を行う時には使用言語のインストールやデータベースサーバの立ち上げなど、毎回CLIでぽちぽちコマンドを打って環境を整える必要がある。

Dockerを使う場合DockerFileに必要なツールとコマンドを書いてしまえば、コマンド一発で一気に環境が出来上がる。

イメージはこんな感じ
[![Image from Gyazo](https://i.gyazo.com/68699edad9b2d6e4b5b555b7f4a66c53.png)](https://gyazo.com/68699edad9b2d6e4b5b555b7f4a66c53)

上の図だと10回くらいコマンド打ってようやく出来上がる環境が
一発で出来る。効率がいい。

### ○環境差分が生まれない

個人的にこれが一番の利点かと思うが、チームで開発を行う時に片方がMacを使っていて、もう片方がwindowsを使っていたりすると、環境の差分がでてしまい、どちらかのPCがエラーなどで遅れて開発進まなくなってしまって、大幅に作業ロスが出てしまうことが昔はよくあり、その問題を解決できることが最大の利点ではないかと、、


ここでもう一つの考察に映る

## Dockerがないとどういう問題が起きるのか？

dockerがない時代のシステム開発を想像してみる。

〜続く〜
バイオインフォ備忘録 | 配列データの取得から相同性検索まで


遺伝子情報の取得から相同性検索までの流れを紹介する

## Outline
>
1.遺伝子情報の取得
2.相同性検索


<br>
### 1.遺伝子情報の取得
遺伝子情報が蓄積された公共データベース
>
<b>NCBI</b>
<b>UCSC</b>
<b>Ensembl</b>


#### Ensembl | https://asia.ensembl.org/index.html
ゲノム配列が解読済みの生物のゲノムを閲覧できる。一つの遺伝子から得られる情報は思ってるより多く、生物の前提知識があってもどこを見ればいいか分からず戸惑うことがあると思う。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/380579/bd897d8f-aae0-88fd-1ee7-c9755683763a.png)



検索結果から見たいものを選んでクリックすると以下のページに飛ぶ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/380579/54affd55-76c8-55cf-d817-9a1ba69f9aa7.png)

<ul>
<li>Description: 遺伝子の機能についての説明  </li>
<li>Location: 染色体上の位置</li>
<li>About this gene: 遺伝子の特徴 
(transcript vatiants、オーソログ、関連づけられる形質　etc...)</li>
<li>Transcripts: 転写産物。選択的スプライシングにより一つの遺伝子に複数の転写産物が対応していることが多い。</li>
</ul>
<ul>

 左側のパネルから、GOを見たりアライメントしたり系統樹見たり多くの情報をえることができる。全部理解しようとすると疲れる。


左側のExport data > next > txt でfast形式のファイルをダウンロードできる。


```
FASTA format
>YBR024W cds chromosome:R64-1-1:II:289445:290350:1 gene:YBR024W gene_biotype:protein_coding transcript_biotype:protein_coding gene_symbol:SCO2 description:Protein anchored to mitochondrial inner membrane; may have a redundant function with Sco1p in delivery of copper to cytochrome c oxidase; interacts with Cox2p; SCO2 has a paralog, SCO1, that arose from the whole genome duplication [Source:SGD;Acc:S000000228]
ATGTTGAATAGTTCAAGAAAATATGCTTGTCGTTCCCTATTCAGACAAGCGAACGTCTCA
ATAAAAGGACTCTTTTATAA...
```


## 2.相同性解析
今、手元に酵母の全ゲノム`yeast_genes.nuc`とヒートショックプロテインの遺伝子`HSP.nuc`があるとする。
酵母の全ゲノムからHSPに相同な配列をblastで探す。

```shell
$ makeblastdb -in yeast_genes.nuc -dbtype nucl -hash_index
$ blastn -outfmt 6 -evalue 1e-25 -db yeast_genes.nuc -query HSP.nuc -out HSP.blastn
```

ここらへんの意味やパラメータについてはhttps://bi.biopapyrus.jp/seq/blast/blastn.html
が詳しく説明しているので参照されたい。
出力ファイルに指定したHSP.blastnに相同性検索の結果ヒットした参照の遺伝子名が記載されている。
YAL005Cが検索クエリに使った配列で、それに対して酵母の配列が取れてきているのがわかる。

```shell

YAL005C YAL005C 100.000 1929    0       0       1       1929    1       1929    0.0     3563
YAL005C YLL024C 96.427  1931    56      6       1       1929    1       1920    0.0     3171
YAL005C YNL209W 77.057  1203    238     33      10      1190    25      1211    0.0     658
YAL005C YDL229W 74.607  1591    350     48      10      1570    25      1591    0.0     651
```
ポートフォリオの開発日記3

今回はメンバーの担当部分がReactでは達成が難しいため、実装内容を妥協して簡単な物にした。
変更点としては、音声が鳴っている間、画像をひたすら口パクさせる物であったが、口を開けた画像に切り替えるだけにした。
クオリティが下がったかもしれないが、今週末の逆求人のイベントまでに披露できるところまで完成できるかもしれない
gradle Could not find tools.jar. エラー対策


## 環境

-   windows10
-   gradle-6.3
-   jre1.8.0_251

## 現状

    gradle build

を実行すると

    Could not find tools.jar.

として, Build が落ちた.

## 対策

tool.jar を探して手に入れる.

### JDKのダウンロード

JDKの中にtools.jar があるらしいので落とす.

>「Windows 10 i586 Java Development Kit」から

<http://jdk.java.net/java-se-ri/8-MR3>

※ 注意
JDK9からはtools.jar は入っていないらしい
<https://jpn.nec.com/webotx/download/info/from_JDK8_to_JDK11.pdf>

### 格納する

    C:\Program Files (x86)\Java\jre1.8.0_251\lib

のなかに, tools.jar を移動させる.

tools.jar は

    java-se-8u41-ri\lib

の中にある.
kubernetes 勉強の記録 (minikube)

# 主題
- AWS上でkubernetesを試す勉強の記録。
- 途中に考えた考え事、彷徨った結果も記録していきます。
- ゴールは、現段階では特に設けません(EKSとかFargateとかECRとかわかった感じで話したい)。

# 環境 / 前提
- 当方知識レベル :
 - AWSについては、EC2, S3ぐらいならわかります。
 - LinuxやNWの基礎はわかります。
 - VMの基礎はわかります。
 - コンテナは雰囲気はわかります。
- AWS EC2 (t2.medium (今後足りるかは知らない))
 - AWSである理由: 自前PCがちょっと古く、実験・勉強はAWSを使うほうがいろいろと楽
 - EC2である理由: EKSにしようと最初は思ったが、なんか高かった(常時$72/月で、止めたり作ったりするのめんどくさそうだった)
- kubernetes SW(表現あってなさそう) : minikube
 - 理由: 使っている人を見た事がある。microk8sみたいな名前のやつもどこかで見た。

僕のAWS EC2の運用方法としては、使うときだけインスタンスを「開始」して、寝るときは「停止」している。そうすれば金が全然かからない(１時間やって寝るとかならほんとに数円か数十円)

# やったこと1 : EC2にminikubeの構築。
## 環境の準備
最初は、EKSを使いたかったです。ただ、ざっと見た所、僕のレベルでは面倒そうだったのでまずはEC2で感触を掴もうと思いました。小さめの構成で試したいと考えています。
AWSのセキュリティグループとか鍵とかは、EC2はたまに使っていたのですでにある前提で進めます。

いろいろ調べていたところ、minikubeであれば1台でマスターもワーカーも行けるような感じでした。
なのでやることにしました。
AWS EC2に入り、それなりにスペック足りてそうなt2.mediumで作成(Amazon Linux 2)。
完了後sshでログイン。

## ログイン後作業(minikube導入まで)
ここ見てminikube動くところまでやりました。
https://level69.net/archives/27284

```
sudo yum update -y
amazon-linux-extras install -y docker
     (man amazon-linux-extrasとかやりつつ)
systemctl enable docker
systemctl start docker
yum install -y conntrack
minikube start --vm-driver=none
ln -s `find /var/lib/minikube/binaries/ -name kubeadm` /usr/sbin/
ln -s `find /var/lib/minikube/binaries/ -name kubectl` /usr/sbin/
ln -s `find /var/lib/minikube/binaries/ -name kubelet` /usr/sbin/
minikube stop
minikube start --vm-driver=none
```

ここまで来ると、udemyとか本に載っているような、以下のようなコマンドが使えるようになります。
余談ですが、udemyでは、「Certified Kubernetes Administrator(CKA) with Practice Tests」を毎日見ています。

```
kubectl apply -f sample-pod.yaml
kubectl get pods
```

## 振り返り

minikubeの構築自体は簡単です。1台の構成でいけるのは楽で良いです。マシンスペックも充分足りているようです。
ということは、CKAとかの試験勉強的にはEKSでなくてもminikubeで行けるなと思いました。
完全に人のコピペで済ませたのでまだまだ味わいは少ないです。

## 次のステップ

Webアプリのpodを作って我が家からAWS上にアクセスできるところまで行きたい(なんならnginxで充分なのでまずそれをhello worldします)。

その後に、そのソフトウェアがアップデートされたらどう運用するのか見たいなところを考えるか、なんせ次のステップを探ります。

# やったこと2 : nginxコンテナをマイPCからアクセスする。

## 予備調査 & 実験

いくつかグーグルを散歩していたところ、以下をやって、セキュリティグループの設定を変えて、パブリックのIPでアクセスしている例がありました。

```
kubectl expose 〜〜　--port=80 〜〜
``` 

kubectl exposeについて考えます。とりあえず　-h　にて。

```
[root@*** pods]# kubectl expose -h
Expose a resource as a new Kubernetes service.
(以下略)
```
このコマンドは、新しいkubernetesのserviceとしてresourceをexposeしてくれるようです。
オプションは2,30個ありました(--portとか--typeとか使えそうです)。

あと、参考にしたサイトは、podじゃなくてdeploymentを作ってそれをexposeしてました。
そこで、「kubernetes完全ガイド」の第五章[Workloadsリソースの概要]を読むと、
以下のような管理構造になっているようです。

```
「Tier1:Pod」 ← 「Tier2:ReplicaSet」 ← 「Tier3:Deployment」
```

Podをexposeする例があまり見つかってませんが、ヘルプを読む限り、podも行けるように見えます。
ただ、まずは動かしたいので、deploymentでまずはいきます。

[参考]
https://qiita.com/leomaro7/items/4433f408a276dfa385fc
とかいろいろ

ということで、deploymentを作ってserviceを作ってアクセスすれば良い模様なので、まずはそうします。
それぞれがどういう概念でどういう動きをするかは一旦気にしないでおきます。

## 本番進行

随時更新中
Blender/Cycles Principled Hair BSDF にはバグがある

Blender/Cycles の Principled Hair BSDF は, pbrt-v3 のコードを参考に 2018 年ごろに GSoC で実装(移植)されました

https://github.com/blender/blender/blob/master/intern/cycles/kernel/closure/bsdf_hair_principled.h

しかし, 元の pbrt-v3 実装にはバグがありました. 実に三年(!)近い年月を経て, pbrt-v3 では治っています.

https://github.com/mmp/pbrt-v3/commit/c65c588eff6a285f5df4553faf2e95e43aa3ac1c

https://github.com/mmp/pbrt-v3/pull/256

この反映はまだ Blender/Cycles には取り込まれていません.

具体的には, いくらかシェーディングがおかしくなります.
Blender/Cycles で Hair のシェーディングがなんとなくうまくいかないな〜と思ったら, このバグが原因かもしれません.

## TODO

* [ ] Blener/Cycles にバグレポする
  * どう治るのか説明するために, Blender/Cycles を OSL 有効にしてビルドしないといけないんでめんどい.
    * https://qiita.com/syoyo/items/37dd45f352b8a6cdb0fc
    * https://qiita.com/syoyo/items/2cec96444d5d1df46e67 
  * Cycles だけで Standalone 実行する仕組みを作ったほうがいいかもだが https://qiita.com/syoyo/items/672ea616b829f63f19e7 これもまた再現環境設定するのがめんどい.
  * レンダラのバグレポ(特に Blender/Cycles みたいな規模が大きいやつ), 時間が莫大に溶けてつらいんで, 優秀な Blender/Cycles 若人さまを探し出し, 札束積むので代わりに対応してもらいたい(time is money)
Raspberry Pi 4をnas化してみる

Raspberry Pi 4をファイルサーバとして使用したいと思い、nas化してみた。

<h2>■準備</h2>
●OSインストール、アップデート
Raspberry Pi 4にRaspbianをインストール、アップデートもしておく。
ネットワーク設定など初期設定はしておく。

●ファイルシステム追加
extfat,ntfsを追加する
apt-get install exfat-fuse exfat-utils
apt-get install ntfs-3g

<h2>■NASミドルウェア</h2>
NAS化に何を使うか調べた結果、openmediavaultがよさそうだったので、
それを導入。

●openmediavaultインストール ※15分くらいかかる
cd /opt
wget -O - https://github.com/OpenMediaVault-Plugin-Developers/installScript/raw/master/install | bash

shutdown -h now
ここでnasとして使うusbのストレージを接続する。
電源ON

<h2>■openmediavault設定</h2>
openmediavaultはwebの画面から設定を行う

http://Raspberry Piのipアドレス/
でopenmediavaultのweb画面を表示
ログイン画面が出るので、
言語に「日本語」を選択し
admin/openmediavault
でログイン

メニューの「ストレージ」－「ファイルシステム」を選択し、
USBストレージの確認、ext4等でフォーマットを行う。
フォーマットが終わったらマウントする。

メニューの「アクセス権の管理」-「共有フォルダ」を選択し、
「＋追加」をクリック。
名前は適当に
デバイスに外付けしたドライブを選択
ここで、USBストレージを選択できるはずだが、表示されず、選択できない。
理由がわからない。

<h2>■もう一回アップデート</h2>
原因がわからず、OSのインストールからやり直してみるがやはりだめ。
ダメもとでもう一度アップデート

rpi-update
reboot
apt dist-upgrade -y
apt-get autoremove -y
apt-get autoclean
reboot

<h2>■openmediavault設定　2回目</h2>
webの設定画面を表示してログイン。

メニューの「アクセス権の管理」-「共有フォルダ」を選択し、
「＋追加」をクリック。
名前は適当に
デバイスに外付けしたドライブを選択
今度はすんなり選択できた。
なぜだろう？

メニューの「サービス」-「SMB/CIFS」を選択し、「設定」タブにある「一般設定」の
「有効」をクリックしてファイル共有を有効化。
「保存」をクリックして設定を保存。
「共有」タブで「＋追加」をクリックし、作成した共有フォルダを設定。

ネットワークにRaspberryPiが見えてくるので、アクセスして
ユーザー/パスワードを入力すると共有フォルダが表示される。

NAS化成功！
Bootstrapの有料テーマを編集

こんばんは、初めまして。
数ヶ月前に某スクールを卒業しました。そこでフロントエンドコースを一通り学び、卒業制作で飲食店のホームページを制作しました。その時は
https://wrapbootstrap.com/theme/tavern-bootstrap-4-restaurant-theme-WB0J449R0
このテンプレートを使いました。

今回、縁があり会社のホームページを制作することになり、またテンプレートを使おうと思っています。
https://themes.getbootstrap.com/product/sparrow-simple-seamless-alive/
このテンプレートなのですが、HTMLとCSSで編集できるのか疑問に思い、この掲示板で質問しました。
https://prium.github.io/twbs-sparrow/v1.6.1/documentation/getting-started.html
見てみるとSCSSやNodeやGitという学んだことのない単語があり、編集できなかっらどうしようと思っています。
購入する前にこの不安を解決したいです。

HTMLとCSSを中心に編集できるか知りたいです。
会社の人には自分で作るといい、このテンプレートを見せていいねと言ってもらえたので、できるだけこのテンプレートを使いたいです。。
よろしくお願いいたいします。