OmniAICreator/Qiita-1.07M huggingface dataset:
客先常駐エンジニアからWebエンジニアに。

#【客先常駐エンジニアからWebエンジニアに。】
前職を1年5ヶ月で退職し、転職しました。
9月からWebエンジニアになって、10日ほど経ちました。
実務を経験して感じた事などを今後転職される方の参考になればと思っています。

※ まとまりに欠けますがお許しくださいm(_ _)m

##Google Workspaceをフル活用、Slackコミュニケーション
- Google Workspaceをフル活用します。
  - GmailやDriveはもちろんのこと、meetでのWeb会議が盛ん
  - Googleカレンダーでの共有が効率的におこなわれている
  - 社内メンバーのスケジュールの共有が最適化されている

- Slackコミュニケーション
  - Slackで業務の進捗や質問などのコミュニケーションをおこなう
  - 文章で正確に要件を伝えることはやはり難しい
  - 普段のLINEなどのコミュニケーションから文章に気をかけておく

##Linux、AWSの知識がかなり必要（簿記の知識もあれば可）

- **簿記（日照簿記３級レベル）**
 - スタートアップなので簿記の理解があると◎
 - 原価率など用語の理解ができる
 - 全社会議などで会社の業績の理解にも役立っている

- **Linux**
 - LPIC-1レベルが全部頭に入ってて、開発できると一目を置かれそう
 - 自分はLPIC-1の資格は持っているけど、実際の開発には不十分だったと痛感
 - 資格勉強で得たものと実務で必要とされるものは全然レベルが違う
 - Linux環境、SQLをコマンドラインベースで操作の抵抗を無くしておくと◎
 - Amzon Linux2で実際にコマンドを打って、勉強するのがおすすめ

- **AWS**
 - AWS認定資格（CLF,SSA,DVA,SAO）の資格を取ってて良かった。
 - 実務の中でAWSの用語を聞かない日はない（IAM、S3、ClouldFront など）
 - AWSのインスタンスへの接続はMacのターミナルから接続するのが基本
 - SSH接続、SSMを当然のように使用する
 - 自分はこの辺りの実装をしていなかったので気を入れて勉強する必要がある
 - 1からAWS環境を構築・運用していくために引き続き、先輩方から学ぶ

- **Docker**
 - コンテナでDBも動かし、開発するので基本的なところは抑えておきたい
 - Udemy かめさんの講座を一通りやっておくと良いと思います（とりあえずは）

##今後

Qiitaのアカウントを作成して、1年
継続的に学習してきたので知識の幅は広がっていると思います。
今日以降もっと成長スピードがあげていきたい

採用してくれた企業で絶対に貢献して、採用して良かったと思ってもらえるように頑張る。
【Javascript】 (小技) CSS Selectorで最初に見つけた1件以下を処理するワンライナー。

# 「先っぽだけだから！」
一番信用のないセリフNo.1

# 思い立ち
あるサイト用に、最初に見つけた画像を開く ``bookmerklet`` を作成しようと考えていた。
基本 ``ワンライナー`` は嫌いだが、``bookmerklet`` となると少々事情が異なる。

今回は ``新しく開く`` 動作を行うため、何度も実行されてしまうと、よもやセルフな ``ブラクラ`` になるのでなんとか避けたい。

そんな訳で ~~butter~~ **better** ~~の~~ **な** ~~犬~~ **解** を模索してみた。

# 思案
## ① querySelectorAll + forEach
```javascript:
document.querySelectorAll('img[src]').forEach((img) => window.open(img.src));
```
('A｀).｡oO (1回ででええねんで...)

## ② Optional Chaining
```javascript:
window.open(document.querySelector('img[src]')?.src);
```
('A｀).｡oO (必ずopnenが処理されちゃって、無い時にエラーになっちゃって意味ないなぁ...)

## ③ if文
```javascript:
let img = document.querySelector('img[src]');
if(img) {
    window.open(img.src);
}
```
('A｀).｡oO (if文書きたくないなぁ...変数もわざわざ作りたくないでござる...)

## ④ querySelector + スプレッド構文
```javascript:
[...document.querySelector('img[src]')].forEach((img) => window.open(img.src));
```
('A｀).｡oO (ぬるぅ....)

## ⑤ スプレッド構文 + Optional Chaining
```javascript:
[...document.querySelector('img[src]')?].(略);
```
('A｀).｡oO (そんな構文はねぇ...)

## ⑥ 関数
```javascript:
let f = function(val, callback) {
    if(val) {
        callback.call(val);
    }
};
f(document.querySelector('img[src]'), (img) => window.open(img.src));
```
('A｀).｡oO (これならif文のほうがマシ...)


# 解
## querySelectorAll  + スプレッド構文 + slice + forEach
```javascript:
[...document.querySelectorAll('img[src]')].slice(0, 1).forEach((img) => window.open(img.src));
```
('A｀).｡oO (要素数が ``0`` or ``1`` で ``querySelectorAll`` の ``forEach`` がイキるぜ！)

## おまけ( ``bookmarklet``)
```javascript:
javascript:(function() {[...document.querySelectorAll('img[src]')].slice(0, 1).forEach((img) => window.open(img.src));})();
```
('A｀).｡oO (やっぱ ``bookmarklet`` には ``ワンライーナー`` の方が良い...)


# 余談
``Selector`` とか ``Spread`` とか、なんか ``WIXOSS`` みたいだなと思った。
(iTMSでサントラ売ってるからみんな買うべし。井内舞子さん最高。)
JESTでよく使うVueのMockの方法まとめ[Nuxt]

# 概要

テストを楽に行うためにMockの仕方を調べることが多かった
以下は個人的によく利用したMockの方法をまとめたものとなる

# 目次

1. methodsはWrapperの上書きをする
1. $routerはconfig.mock
1. VuexのSotreはshallowMountに設定
1. 外部ツールはjest.spyOn

# 環境

```
"nuxt": "^2.0.0",
"vue": "^2.6.11",
"vuetify": "^2.2.27",
"jest": "^26.6.3",
"playwright": "^1.10.0",
```

# Mock方法

## methodsはWrapperの上書きをする

- mountまたはshallowMountでWrapperを生成し、Wrapperのmethodを上書きする
- 全てのテストでmock状態にしたい場合はbeforeEachを使う
- mock関数色々 https://jestjs.io/ja/docs/mock-function-api

**テストしたいページ： ~/pages/index.vue**

```javascript
<script>
export default {
  methods: {
    getString() {
        return 'test1';
    },
  },
};
</script>
```

**テストコード**

```javascript
import page from '~/pages/index.vue';
beforeEach(() => {
  const store = new Vuex.Store({getters});
  wrapper = shallowMount(page, {store});
  // Methodの上書き
  wrapper.vm.getString = jest.fn().mockReturnValue('test2');
});
afterEach(() => {
  wrapper = null; // test毎リセットしておくと安全
});
describe('Methods', () => {
  test('login： validationエラーの場合', async () => {
    const result = wrapper.vm.getString();
    await flushPromises();
    expect(result).toBe('test2');
  });
});
```


## $routerはconfig.mock

- `this.$router` などthis.$で取得できる情報はconfig.mocksで定義できる
- 参考：[Vue Test Utils Config について](https://vue-test-utils.vuejs.org/ja/api/config.html)

```javascript
import {config} from '@vue/test-utils';
beforeEach(() => {
  config.mocks['$router'] = {
    push: jest.fn(),
    go: jest.fn(),
    currentRoute: {
      path: 'dummy_path',
    },
  };
});
```

## VuexのStoreはshallowMountに設定

- 参考：[VueTestUtils Vuex と一緒に使用する](https://vue-test-utils.vuejs.org/ja/guides/using-with-vuex.html)
- より効率的にMockする方法
  - mock用のファイルを用意して各testファイルでまとめて実装

**getters.js (とか actions.js)**

```javascript
const getters = {
  'test/getter': jest.fn().mockReturnValue(''),
};
export default getters;
```

**store.test.js**

```javascript
import Vuex from 'vuex';
import getters from 'getters.js';
import actions from 'actions.js';
let wrapper;

beforeEach(() => {
  const store = new Vuex.Store({getters, actions});
  wrapper = shallowMount(page, {store});
});
```

## 外部ツールはjest.spyOnを使う

- 例：Auth
- 参考：[jest.spyOn(object, methodName)](https://jestjs.io/ja/docs/jest-object#jestspyonobject-methodname)

```javascript
import Auth from '@aws-amplify/auth';
beforeEach(() => {
  // currentAuthenticatedUser はMockしたい関数名
  jest.spyOn(Auth, 'currentAuthenticatedUser').mockResolvedValue({data: ''});
});
```
AtCoderログ：0112 - ABC 218 B

# 問題

https://atcoder.jp/contests/abc218/tasks/abc218_b

## 問題文
> $1$ 以上 $26$ 以下の整数からなる長さ $26$ の数列 $P=(P_1,P_2, \ldots,P_{26})$ が与えられます。ここで、$P$ の要素は相異なることが保証されます。
> 以下の条件を満たす長さ $26$ の文字列 $S$ を出力してください。
> ・任意の $i~(1 \le i \le 26)$ について、$S$ の $i$ 文字目は辞書順で小さい方から $P_i$ 番目の英小文字である。

## 制約
> ・$1 \le P_i \le 26$
> ・$P_i \ne P_j~(i \ne j)$
> ・入力は全て整数である。

# 回答
## 回答1 (AC)
各 $i$ に対し、アルファベットの a から数えて $P_i$ 番目のアルファベットを表示することが求められています。アルファベット a を表す文字番号(ASCIIコード)に $P_i-1$ を足したものが、表示するアルファベットの文字番号となります。コードは以下のようになりました。cout で文字コードを変換する方法がわからなかったので、printf 文を使用しました。

```C++:abc218b-1.cpp
#include <bits/stdc++.h>
using namespace std;
 
int main() {
  int t;
  for ( int i=0; i<26; i++ ) {
    cin >> t;
    printf("%c",'a'+t-1);
  }
}
```

# 調べたこと
## [AtCoder の解説](https://atcoder.jp/contests/abc218/tasks/abc218_b/editorial) → [公式解説](https://atcoder.jp/contests/abc218/editorial/2604)
回答1と同じ方針でしたが、cout を使っていました。勉強になります。

# リンク
## 前後の記事
- 前の記事 → [AtCoderログ：0111 - ABC 218 A](https://qiita.com/RoadLynton/items/7bc5783fb3c5f160e55a)
- 次の記事 → [AtCoderログ：0113 - ABC 122 B](https://qiita.com/RoadLynton/items/69927096e90994c23dc9)
【Android】Looper を持つスレッドの CoroutineDispatcher を作る

関連記事：[【Kotlin/JVM】CoroutineDispatcher を作る](https://qiita.com/sdkei/items/a056a1275b05b11ddcd4)

次のようにすることで `Looper` を持つスレッドの `CoroutineDispatcher` を作ることができる。

```Kotlin
import android.os.Handler
import android.os.HandlerThread
import kotlinx.coroutines.*
import kotlinx.coroutines.android.HandlerDispatcher
import kotlinx.coroutines.android.asCoroutineDispatcher

val handlerDispatcher: HandlerDispatcher =
    HandlerThread("HandlerThreadDispatcher")
        .apply { start() }
        .looper
        .let { Handler(it) }
        .asCoroutineDispatcher()
```

[`HandlerDispatcher`](https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-android/kotlinx.coroutines.android/-handler-dispatcher/index.html) クラスは `Dispatchers.Main` の型である `MainCoroutineDispatcher` を継承しており[^継承しており]、`Dispatchers.Main` と同じく `immediate` プロパティを持つ。

[^継承しており]: 型名からは継承関係が逆のように感じるが…。

Realm では、メインスレッドではない、Looper を持つスレッドが必要になることがある。
そのときにはこの方法を使うとコルーチンで扱うことができて便利だ。

／以上
[Coil]キャッシュサイズを変更する方法

Androidの画像ローディングライブラリ[Coil](https://coil-kt.github.io/coil/)でディスクキャッシュのサイズを変更する方法を調べたのでメモがてら記事にします。  

###方法
Coilは[OkHttp](https://square.github.io/okhttp/)のディスクキャッシュ機構を利用しています。
したがって、キャッシュのサイズを変更するにはOkHttpClientを置き換えます。

``` Coil.kt
val cache = Cache(
    directory = File(context.cacheDir, "image_cache"),
    maxSize = 500L * 1024L * 1024L // 500 MB
)
val imageLoader = ImageLoader.Builder(context)
    .okHttpClient {
        OkHttpClient.Builder()
            .cache(cache)
            .build()
    }
    .build()
```

アプリ内で共通のキャッシュ(ImageLoader)を利用したい場合は、Applicationクラスで`Coil.setImageLoader()`メソッドを利用してImageLoaderをセットします。

``` MyApp.kt
class MyApp : Application() {
    override fun onCreate() {
        val cache = Cache(
            directory = File(cacheDir, "image_cache"),
            maxSize = 500L * 1024L * 1024L
        )
        val imageLoader = ImageLoader.Builder(applicationContext)
            .okHttpClient {
                OkHttpClient.Builder()
                    .cache(cache)
                    .build()
            }
            .build()
        Coil.setImageLoader(imageLoader)
    }
}
```

キャッシュを削除する場合は、`Cache.delete()`や`Cache.evictAll()`メソッドを利用します。
CacheインスタンスはDIなどを用いてシングルトンとして扱うのが良いと思います。

``` MyRepository.kt

class MyRepository @Inject constructor(
    private val cache: Cache,
) {
    fun deleteCache() {
        cache.evictAll()
    }
}
```
備忘録【現場で役立つシステム設計の原則】②

第２章　場合分けのロジックを整理する
・区分や種別はコードを複雑にする
・早期リターンやガード節を使うと区分ごとのロジックをわかりやすく整理できる
・区分ごとに別のクラスに分けると独立性を高めることができる
・多態を使うと区分ごとのロジックをif文/switch文を使わずに記述できる
・状態の遷移ルールを記述する（状態遷移図）
ABC196 C - Doubled を解いた

https://atcoder.jp/contests/abc196/tasks/abc196_c

![Abc196_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737344/b7a78ab6-3fed-08c4-6abd-71d006c728bb.png)

文書のまま入力してみようと思った。
念のためサンプルを確認

![Abc196_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737344/3b112d5f-b3a8-d556-6f0e-18b54ebab906.png)

ふむふむ。とりあえず書いてみよう。

```Doubled.py
N = int(input())       #N は偶数桁。
a,b = 1,1              # a と b を用意。
X = int(str(a)+str(b)) # a b を合体して X
lis = []               # 条件に合うものをを append
while X <= N:          
    lis.append(X)
    a += 1
    b += 1
    X = int(str(a)+str(b))
#print(lis)
print(len(lis))        #append した個数が答え
```

N は条件から 10^12 だが、a , b と分割して考える事で
a, b のそれぞれの最大値は 10**6 となるので間に合う算段だ。
Windowsのシステム情報をテキストに吐き出す

#Windowsのシステム情報をテキストに吐き出す方法(コマンド)

###システム情報とは
Windowsの色んな情報が確認できる画面です
###よく使う用途は
・パラメータシートに書き出す情報を"とりあえず全部取得して持ち帰ろう！"と言った時によく使います
・サポートがトラブルシュートの際に"システム情報を知りたいから送ってください"というのもあるかもです

---
この画面の以下の情報を全てテキストで吐き出します

>・システムの要約
・ハードウエアリソース
・コンポーネント
・ソフトウェア環境
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/197418/7d7db9fc-fe49-c183-8637-a79a2365ad81.png)

##コマンド

###`msinfo32/report c:\temp\msinfo.txt`

※出力先は任意のディレクトリとファイル名を指定

###出力結果はこんな感じでサイズは2MBくらいありました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/197418/3a61bb13-79c6-746b-1424-527554ec1c98.png)
AZ-900合格体験記

先日MicrosoftAzureFundamentals(以下AZ-900)を受験し、無事合格しましたので、
試験の概要と実際の私の勉強方法について記録を兼ねて共有できればと思います。

# 【簡単に自己紹介】
　□文系出身、未経験で入社した社会人2年目。
　□Azureは業務で使用していたものの、ほぼ知識ゼロ。
　□クラウドについてもほぼ初心者。(知識はITパスポートレベル)

#【試験の概要】
　□Azureの基礎的な部分が問われる入門のような試験。
　□問題数は40問程度で、試験時間は60分。
　□700/1000点が合格ライン。

#【勉強方法】
　①テキストを熟読(約2か月)
　　…“徹底攻略 Microsoft Azure Fundamentals教科書[AZ-900]対応 ”というテキストを購入し、
　　 太字の単語を中心に精読しました。
　　 知らない単語も多く、一周読み切るのにかなり時間がかかりましたが、腹をくくって、
　　 自分の納得がいくまで調べながら学習しました。
　②Microsoftが主催しているセミナーに参加(2日間)
　　…Microsoftが主催している無料のオンラインセミナー(3.5時間×2日間)に参加しました。
　　 事前に録画されている映像を視聴し、わからない点はその場でチャットで講師の方に質問
　　 することができました。またこちらのセミナーを受講すると、無料でAZ-900の試験を受けられる
　　 特典コードをゲットできるので、参加しない手はないと思います！
　③テキストの章末問題や付属の模擬問題で演習(1週間)
　　…内容がある程度理解できてきたと感じたため、演習形式で知識をさらに確実に
　　 定着させていきました。
　　 昨年2020年11月に試験範囲が変更になったこともあり、過去問が少なかったのが個人的には
　　 かなり厳しかったです…
　　 章末問題や模擬問題は全問正解できるようになるまで繰り返し解きなおしました。　　 

#【試験本番】
　□自宅で受験or会場(テストセンター)で受験するかを選択でき、私は会場で受験。
　□難易度が章末問題や模擬問題よりもはるかに難しく、サービスや概念の細かい部分が多く
　  問われていたように思います。

#【今後にむけて】
　□ギリギリの点数でなんとか合格。(試験中は絶対にダメだと思いました)
　□あくまで基礎的な知識を学習しただけなので、実際の業務で活かしていくためにも、
　  継続的に学習し続ける必要があると感じました。
Azure、デバイスのＯＳでアクセス制限


Azureサインインで、デバイスのOSを元にアクセス制限かけられるのかなと思い、やってみた。「Azure AD 条件付きアクセス」を使うと簡単にできました！

## 手順
「Azure AD 条件付きアクセス」を検索。「＋ 新しいポリシー」をクリック。以下の通りポリシーを設定して「保存」をクリック。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/619163/79069621-1b2f-589c-f724-6225d79a2d5b.png)

#### ポリシー設定

**ユーザーとグループ**：対象 → ユーザーとグループの選択 → 「ユーザーとグループ」にチェックを入れて対象のユーザーを選択

**クラウド アプリまたは操作**：対象 → アプリを選択 → 「Microsoft Azure Management」を選択

**条件**：デバイスプラットフォーム → 対象 → デバイス プラットフォームの選択 → 今回はWindowsとMac以外からアクセスできないようにしたいので、「Android, iOS, Windows Phone」にチェック

**許可**：「アクセスのブロック」を選択

**ポリシーの有効化**：「オン」を選択

## 試してみる
iPhoneからサインインを試みる。ちゃんと断られましたー。
<img width="300" alt="unnamed.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/619163/c0354033-3fd2-c7d9-d270-42168415efef.jpeg">
【Kotlin/JVM】CoroutineDispatcher を作る

関連記事：[【Android】Looper を持つスレッドの CoroutineDispatcher を作る](https://qiita.com/sdkei/items/b066817fb7f7c34d5760)

`CoroutineDispatcher` として、kotlinx-coroutines-core には `Dispatchers.Default` と `Dispatchers.IO` が用意されている。
ほとんどの場合はこれらで事足りる。

しかしスレッドセーフでないオブジェクトを排他制御することなく安全に扱うためにシングルスレッドの `CoroutineDispatcher` が欲しい場合など、
独自のスレッドやスレッドプールからなる `CoroutineDispatcher` が欲しいことがある。

Kotlin/JVM であれば [`ExecutorService`](https://docs.oracle.com/javase/jp/8/docs/api/java/util/concurrent/ExecutorService.html) オブジェクトに対して拡張関数 [`asCoroutineDispatcher`](https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines/as-coroutine-dispatcher.html) を呼ぶことで簡単に作ることができる。
また、[`Executors`](https://docs.oracle.com/javase/jp/8/docs/api/java/util/concurrent/Executors.html) クラスを使うことでさまざまな `ExecutorService` オブジェクトを簡単に作ることができる。

## シングルスレッドの `CoroutineDispatcher` を作る

```Kotlin
import kotlinx.coroutines.*
import java.util.concurrent.Executors

val singleThreadDispatcher: CoroutineDispatcher =
    Executors.newSingleThreadExecutor()
        .asCoroutineDispatcher()
```

動作確認

```Kotlin
var i = 0
runBlocking {
    repeat(1000) {
        launch(singleThreadDispatcher) {
            ++i
        }
    }
}
println(i) // > 1000
```

## スレッドプールの `CoroutineDispatcher` を作る

```Kotlin
import kotlinx.coroutines.*
import java.util.concurrent.Executors

val threadPoolDispatcher: CoroutineDispatcher =
    Executors.newCachedThreadPool()
        .asCoroutineDispatcher()
```

動作確認

```Kotlin
var i = 0
runBlocking {
    repeat(1000) {
        launch(threadPoolDispatcher) {
            ++i
        }
    }
}
println(i) // > 993
```

なお、並列数を固定にしたスレッドプールを作りたければ
`Executors.newCachedThreadPool` 関数に代えて `Executors.newFixedThreadPool` 関数を使うと良い。

／以上
【5枚目】おっさんが入門CakePHP　(動画第6回：新規登録の解説)

ケーキも5枚目に成ってかなり胃もたれしてきてます。。。
動画再生（2倍で）娘に又それかよって言われながら進めてます。
https://www.youtube.com/watch?v=ieFp-Y9sZIg&t=414s

今回の動画でやること
・新規登録の動きを確認
・Code解説　新規登録画面を開く
・Code解説　ユーザ登録をする

前回配置したソース類を使用してお勉強するので今回はほ見るだけ。（ソースは追いかける）

いつも通りXAMPPからApacheとMySQLを開始して
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/490a1040-332e-f875-ba86-70471027628f.png)

WEBブラウザで画面動作確認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/d8eb87dc-513c-2bc3-c467-c68b5a95deb9.png)

上記画面のように「New User」にカーソルを当てると
押下時に遷移するURLが画面左下に表示される。
押下したら新規登録画面を表示するために
UsersControllerのaddメソッドが呼ばれる。

前回のソースの動きを説明
新規登録のためのメソッドを説明
POSTとGESTの説明
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/435f8470-71f0-bdf3-2692-7c23d57996c3.png)

setメソッドの説明でcompact関数を使うと説明があるのだが
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/d5af8515-fa2d-9861-c497-6dc343936dce.png)
メソッドと関数は何が違うのん？
set・・・・・CakePHPが用意しているメソッド
compact・・・PHPの関数
この辺の説明が無いのでサラッと分かった気になるんだけど実は良く解って無いってことに成りそうなので気になるポイントがあったらググるの必要だね。

ブラウザを使用したデバッグツールを使用して動作確認するのだけど
こういう操作教えてくれるの親切で良いよね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/859a83bd-4193-5915-6f71-8d921e7bb970.png)

UserController.phpのaddメソッドを確認
ソースの内容はpostからの動きの確認程度。
patchentityを使用することによってCakePHPの便利機能を使うことができる。
バリデーションを自動でやってくれるが説明は後日らしい。いつだろうか？？
saveメソッドで登録するっと。これもCakePHPのメソッドらしい。
cakephp固有メソッドの説明が無いの微妙だな・・・
WEBで調べても日本語のリファレンス的なのは意外と出てこなくて
ググっても結局公式のサイトぐらいしか見つけられなかったのだけど
現在勉強中の画面から遷移できることに気づいた・・・
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102625/68c788b2-668e-f795-992b-1a97c84d7a53.png)
動画ではv3.8を使用しているので3.8を選択してリファレンスを利用

動画のまとめ
・GETとPOSTは用途で使い分ける
　　GET→取得
　　POST→データ送信

・Formの<B>name</B>とDBのカラム名は同じにすることによりCakePhpの便利機能が使える。

・setメソッドはcompactメソッドを使うことにより引数と同じ名前の変数をセットできるのでコードが短くできる。


所感：
正直、ソースの内容は簡単なので誰でもわかると思う。
テンポよくてザックリわかるのは良いところだが
複雑な説明などを後回しにしているので自学が必要。
思い出：
WEBシステム初期のころはオレオレフレームワークを作ってチームメンバーに文句言われてたなあ...(　= =) ﾄｵｲﾒ
はじめてのMarkdown

##初めての記事投稿
自分もエンジニアとして何か技術発信をしてみたい…と思いQiitaに参加させていただきました。
よし、早速記事を書くぞ！！と息巻いたのはいいのですが...

**『エンジニアにかかわる知識をMarkdown記法で書いて共有しよう』**

Markdown記法ってなんだっけ…HTMLっぽい書き方？
よくわからない…書き方に慣れない…ということで記事投稿に慣れる目的も含めてMarkdownについて学んだことを記録に残そうと思います。
情報の正確性について気を付けてはおりますが、何かありましたらコメントください。

##Markdown記法とは？
* HTMLなどのMarkUp記法を使った記法（文章の一部または全部に書式の注釈を加える記法）より
シンプルな書き方のこと

* 変換してHTMLにすることを想定した書き方

##Markdown記法のメリット**（個人の感想）**
* 見やすい文章が手軽に書ける  
    * 「ここは見出しだから大きさはh2にしてそれからここは改行入れたいからbr入れて...」  
    のようなめんどくさいタグの設定や閉じ忘れが少ない
    * 書き方に慣れれば（知っている人になら）誰にでも通じるので、備忘録にメモレベルの説明資料など用途が幅広い

    
* メモ帳だけでもMarkdown記法は始められる
    * HTMLも確かにメモ帳だけで始めることはできるが、  
    Markdown記法の方がタグなどがシンプルである分、読みやすい文章を書くことが可能

##次回予告
今回はMarkdown記法について簡単に紹介しつつ、
実際に使用して記事を作成しました。
次回は今回使用した見出しや箇条書きなどの解説を行います。
どうぞよろしくお願いいたします！

##参考文献
社内メンバーの方が「チートシートあるよ～」と教えてくれました。
これをきっかけに「もっとモリモリ学びたい！」という欲が出たので、以下の書籍も並行して読んでいます。

https://qiita.com/Qiita/items/c686397e4a0f4f11683d

清水　美樹　「はじめてのMarkdown」…自分の備忘録を残すのにも使えそうだなと思ったので、現在チートシートと合わせて勉強中です。

https://www.kohgakusha.co.jp/books/detail/978-4-7775-1832-6
ドメインとネームサーバ（Route53/お名前.com比較）

### はじめに
個人開発で独自ドメインを作りたいなと思い、先日↓の記事を参考にさせていただいた。

https://qiita.com/nakanishi03/items/25278fb4dfad60ebfac4

上記の記事では
・ドメイン作成　　　→ お名前.com
・ネームサーバ作成　 → AWS Route53
の方法で作成していたが、

先日業務でAWS Route53でドメイン作成できるということも知り、
・ドメイン作成　　　→ AWS Route53
・ネームサーバ作成　 → AWS Route53
でドメイン作成する機会があった。

この時点で「あれ、ドメインってそもそもなんだっけ？ネームサーバとドメインの関係性って？」と混乱してしまったので改めて整理。

---
### ドメインとネームサーバ

ドメイン：IPアドレスの別名
ネームサーバ：ドメイン情報(ドメイン --- IPアドレス)のマッピング情報を保持するサーバ

①ぐぐる時にURLに「https://qiita.com/ 」と打ち込む
②ドメイン「qlita.com」のIPアドレスを知っているネームサーバに問い合わせる。
③返ってきたIPアドレスでQlitaのサイトに辿り着く。

「ドメイン⇄IPアドレス」の変換のことを**名前解決**という。

---
### 名前解決の仕組み
2023/05/04 追加↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/cd307bfc-ff4c-40cc-1da6-ed1b8abddc8a.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/ba1610bf-4d8c-b22e-6bbc-0e42cf3d1813.png)

> Amazon Route 53 は、権威 DNS システムです。
> https://aws.amazon.com/jp/route53/what-is-dns/

---
### ドメインとネームサーバの関係性

ネームサーバは「ドメイン情報を皆に教える場所」なんだから、大前提としてドメインがないと何も始まらない。サッカーボールがないサッカー場みたいな？（表現下手か( ´_ゝ`)

逆に、ドメインを作ってもネームサーバを作らなければそのドメインのIPアドレスを誰も知ることができない。サッカー場がないサッカーボールみたいな？（表現下手か2回目( ´_ゝ`)

言いたいことは「**ドメインとネームサーバはお互いに欠かせない存在**」ってこと。

---
### お互いに欠かせないのなら、どっちから作るのよ？同時に作らんの？

A. お名前.comは別のタイミング。Route53は同時に作る。

##### お名前.comでドメイン作成する場合
①ドメイン作成
②ドメインの設定＞ネームサーバの変更 にてネームサーバ作成/設定する
※ここでRoute53のホストゾーンで作成したネームサーバを設定することが可能

##### Route53でドメイン作成する場合
①ドメイン作成と同時にネームサーバが作成される

aws公式ドキュメントにはこう書いてある
> ドメインを Route 53 に登録する際に、そのドメインのホストゾーンが自動的に作成されます。
> https://docs.aws.amazon.com/ja_jp/Route53/latest/DeveloperGuide/domain-register.html
> ホストゾーンを作成すると、Route 53 は自動的に 4 つのネームサーバーをゾーンに割り当てます。
> https://aws.amazon.com/jp/premiumsupport/knowledge-center/create-subdomain-route-53/

ドメイン作る
＝そのドメインのホストゾーンが自動的に作成される
＝自動的に４つのネームサーバがそのドメインに割り当てられる
ってことだ

---
### まとめ
✔︎ ドメインとネームサーバは運命共同体（外部に共有すべき「もの」とそれを共有するための「場所」）
✔︎ お名前.com・Route53のどちらでもドメイン作成できる
✔︎ Route53の方はドメイン作成＆ネームサーバの作成が同時に行われる
文字列と数値はそのままでは連結できない！？

◼️ タイトルにもある通り、文字列と数値は連結できない。もし、文字列と数値を連結したいなら下記の書き方を覚える必要がある。

書き方：　　puts "１日は" + (24 * 60 ).to_s + "分です。"

上記のように数字の値の辺りに(  ).to_s という記号を加えるだけでOK！！:point_up:



今日の投稿は以上です。

wagaでした！
Zybo Z7用のACアダプタについて

## Zybo Z7用のACアダプタについて


### Zybo Z7で要求されるACアダプタの規格

[Zybo Z7 Reference Manual](https://digilent.com/reference/programmable-logic/zybo-z7/reference-manual?redirect=1)には下記のように書いてあります。

> The recommended power source is an external power supply (such as a wall-wart) with a barrel jack connector (also known as a coaxial power connector). The supply must use a center-positive 2.1mm internal-diameter plug and deliver between 4.5V to 5.5V DC. It should also be able to output at least 2.5 A (12.5 Watts) in order to support power hungry Zynq projects and external peripherals. 

google翻訳

> 推奨される電源は、バレルジャックコネクタ（同軸電源コネクタとも呼ばれます）を備えた外部電源（ACアダプタなど）です。 電源は、センターポジティブ2.1mm内径プラグを使用し、4.5V〜5.5VDCを供給する必要があります。 また、電力を大量に消費するZynqプロジェクトや外部周辺機器をサポートするために、少なくとも2.5 A（12.5ワット）を出力できる必要があります。

要約すると下記のようなACアダプタを使用すると良いらしい。

- 4.5V~5.5V
- 2.5A(12.5W)
- センター径2.1mm
- センタープラス



---

### 要求を満たすACアダプタの例

[秋月電子通商](https://akizukidenshi.com/catalog/top.aspx)で探すなら、[この辺り](https://akizukidenshi.com/catalog/goods/search.aspx?keyword=5V3A+AC&maker=&goods=&number=&name=&min_price=&max_price=&last_sdt=&sort=&style=T&search.x=0&search.y=0)が適合品となる。

[秋月で扱っているACアダプタの性能を調べてくれている人](http://airvariable.asablo.jp/blog/2013/07/14/6902825)がいた。

ちなみにDIGILENTのHPから購入するなら[ここ](https://digilent.com/shop/5v-2-5a-switching-power-supply/)になる。
docker + mysql 日本語対応する

##はじめに
dockerのコンテナの中でmysqlを使用してテーブル表示させたら、日本語で登録しているところが????になっていました。

日本語でちゃんと表示できるように設定します。



##解決策
ローカルのアプリのsrc/db/にmy.cnfというファイルを作成して下記の記述をします。
コンテナの中のmysqlの設定ファイルの内容をこのファイルに書いてそれをコンテナのファイルにコピーします。


```:src/db/my.cnf
[mysqld]
pid-file        = /var/run/mysqld/mysqld.pid
socket          = /var/run/mysqld/mysqld.sock
datadir         = /var/lib/mysql
secure-file-priv= NULL

character-set-server = utf8mb4
collation-server = utf8mb4_unicode_ci
default-authentication-plugin = mysql_native_password

[mysql]
default-character-set = utf8mb4

[mysqld]
character-set-server=utf8mb4

[client]
default-character-set = utf8mb4
```

docker-compose.ymlのvolumes:に下記を追加します。

```docker-compose.yml
#~省略~
  - ./src/db/my.cnf:/etc/mysql/my.cnf
#~省略~
```

あとはコンテナを立て直してデータベースを見ると日本語で表記されていました。

##うまくいかなかったこと

この解決策をいろいろ調べていたらdocker-compose.ymlのcommand: に下記の記述を追加すればいいという回答がたくさん出てきました。

```docker-compose.yml
#~省略~
command: mysqld --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci
```

しかし、うまくいきませんでした。
もし上記のcommandが実行されていた場合にmysqlの設定に記述されるものが先ほど紹介したmy.cnfの中身です。

コマンドで設定するやり方を諦めて、自分で作ってコンテナにコピーといった感じでしょうか。

##最後に
日本語表示はうまくいったのですが、コンソールから日本語を入力してもenterを押すと消えてしまいます。
次はそれを解決しなければ。。。
Vivado2021.1でinitializing language server がスタックする問題について

[TOC]



---

## initializing language server がスタックする問題について

Vivado 2021.1 で initializing language server がスタックする問題が発生した。

この問題について、Xilinxのフォーラムに回避策が書いてあったので、備忘録として残しておく。

[本問題についてのXilinxフォーラム](https://forums.xilinx.com/t5/Design-Entry/Vivado-2021-1-stuck-initializing-language-server/td-p/1259341)

| 環境 | Vivado v2021.1.1 (64-bit) |
| ---- | ------------------------- |

***

### 回避策1

下記のファイルを削除してから、Vivadoを起動する。

C:\Users\<name>\AppData\Roaming\Xilinx\Vivado\tclapp\mainfest.tcl



---

### 回避策2

Vivaoの下記オプションを変更する。



Tools -> Settings -> Tool Settings -> Text Editor -> Syntax Checking -> Syntax checking  を選択

Sigasi -> Vivado に変更する。



Sigasiと比較すると、Vivadoの機能は少なくなりますが、少なくとも正常に動作します。  



---

### まとめ

私の環境では、一度タスクマネージャーから、タスクを終了させ、再起動すると問題なく動作するようになる。

SigasiとVivadoの機能差については、後日調べるとして、とりあえず回避策2を実行して使用してみることとする。
gitの過去のコミットを分割する


# はじめに
gitのコミットを整理することは大事です。特にチーム開発をしている時は、コミット履歴の綺麗さがレビュアーの生産性に直結します。
なので、自分はPRを出す前にコミット履歴をまとめて整理することがよくあります。

ですが、大きなPRを作る時など、整理したつもりが間違えてコミットを作ってしまうことがあります。

例えば次のような感じです。

```
- init project
- create package1
    - package1/file1.txt 追加
- create package2
    - package2/file1.txt 追加
- add files to package1
    - package1/file2.txt 追加
    - package1/file3.txt 追加
    - package1/file4.txt 追加
    - package2/file2.txt 間違えて追加
- add files to package2
    - package2/file3.txt 追加
    - package2/file4.txt 追加
- modify ...
- modify ...
- modify ...- modify ...
....
```

三つ目のコミット「add files to package1」に間違えて`package2/file2.txt`の作成を混ぜてしまっています。本来はこのファイルの作成は次のコミットに含めるべきものです。
直近のコミットなら`git reset HEAD~`なりで修正すれば良いですが、その後にいくつものコミットがある場合は、それらのコミットも全てリセットすることになってしまいます。色々整理し終わっていざpushする直前にこのような間違いに気づくととても大変ですね。

このような状態の時に、簡単に過去のコミットのファイルを移動させる方法です。


# やり方

まず、間違えてファイルを追加してしまったコミットのコミットIDを取得します。

```sh
$ git log --oneline

872653a (HEAD -> master) modify package1/file1.txt
71135ef add files to package2
ffb5ca4 add files to package1 # 今回はこれのコミットID
b876371 create package2
903598c create package1
```

続いて、移動させたいファイルをどのような名前でも良いのでリネームします。すると、gitにはこのような差分として表示されます。

```sh
$ mv package2/file2.txt package2/file2.txt_
$ git status
On branch master
Changes not staged for commit:
  (use "git add/rm <file>..." to update what will be committed)
  (use "git restore <file>..." to discard changes in working directory)
        deleted:    package2/file2.txt

Untracked files:
  (use "git add <file>..." to include in what will be committed)
        package2/file2.txt_
```

この`deleted`として表示された差分だけを`fixup`でコミットします。

```sh
$ git add package2/file2.txt
$ git commit --fixup ffb5ca4 # 先ほどのコミットIDを指定
[master 4d0136f] fixup! add files to package1
 1 file changed, 1 deletion(-)
 delete mode 100644 package2/file2.txt
```

今度は、ファイルを本来追加すべきコミットのコミットIDを取得します。

```sh
$ git log --oneline

872653a (HEAD -> master) modify package1/file1.txt
71135ef add files to package2 # 今度はこれのコミットID
ffb5ca4 add files to package1
b876371 create package2
903598c create package1
```

そして、リネームしたファイル名を元に戻して、`fixup`でコミットします。

```sh
$ mv package2/file2.txt_ package2/file2.txt 
$ git add .
$ git commit --fixup 71135ef # コミットIDを指定
[master bbe31b9] fixup! add files to package2
 1 file changed, 1 insertion(+)
 create mode 100644 package2/file2.txt
```

最後に`rebase`をかけて`fixup`を適用させます。

```sh
git rebase -i --autosquash ffb5ca4~ # 間違えてファイルを追加してしまったコミットのコミットIDを指定
```

これでコミット履歴が素敵になります。


# どういうことか

詳しくは解説しませんが`git fixup`は複数のコミットをまとめるコマンドです。
今回は「間違えてファイルを追加したコミット」と「ファイルを削除」というコミットを1つにまとめ、さらに「ファイルを追加し忘れたコミット」と「ファイルを追加する」というコミットをまとめました。

こうすることにより、擬似的にコミット間でファイルを移動させたというわけです。

# 参考文献
https://dev.classmethod.jp/articles/git-rebase-fixup/
jQueryを用いたフォーム送信時に空欄がある場合にアラートを出す処理

## 概要
この記事は、以下のUdmeyの講座のセクション6の52,53の内容をまとめたものです
フォーム送信時に指定した項目に、空欄もしくは未選択がある場合にイベントが発火し、フォームの送信を中断し、アラートを出す実装内容です。

https://www.udemy.com/course/javascript-kouza/

## コード概要

2つのメソッドを用いて実装します
`checkBlankメソッド`：空欄があるかどうかのチェック。ある場合には、アラートを表示&falseを返す
`$("#f").submit`：フォームにイベントを登録。送信されると発火

## 実装内容

```html:想定されるフォーム
<form action="/" name="f" id="f">
	<label>名前</label>
	<input type="text" id="name" name="name" value="Mike" class="form-control" />
	
	<label>
	  <input type="checkbox" id="chck" name="ok" value="ok" checked /> ok?
	</label>
	
	<p>趣味</p>
	<label>
	  <input type="checkbox" id="hbyMovie" name="hbyMovie" checked /> 映画
	</label>
	<label>
	  <input type="checkbox" id="hbyComic" name="hbyComic" checked /> マンガ
	</label>
	
	<p>性別</p>
	<label>
	  <input type="radio" id="sexMale" name="sex" value="male" /> 男性
	</label>
	<label>
	  <input type="radio" id="sexFemale" name="sex" value="female" /> 女性
		</label>
	
	<p>リスト</p>
	<select class="form-control" id="lst" name="lst" multiple size=4>
	  <option value="lst1" selected>リスト1</option>
	  <option value="lst2">リスト2</option>
	  <option value="lst3" selected>リスト3</option>
	  <option value="lst4">リスト4</option>
	  <option value="lst5">リスト5</option>
	</select>
	
	<p>自由記入</p>
	<textarea class="form-control" rows="3" id="free" name="free">aaaaa</textarea>
	
	<button type="submit" class="btn btn-default" id="btnSubmit">Submit</button>
</form>
```

```jsx:フォームを中断・アラートを出すメソッド
// 入力内容が空かどうか判断する
var checkBlank = function() {
	if (("#name").val() == "") {
		alert("名前が空です")
		return true
	}
	if (("#free").val() == "") {
		alert("自由記入欄が空です")
		return true
	}
	if (("input[name=sex]:checked").val() === undefined) {
		alert("[性別]が選択されていません")
		return true
	}
	if (("#lsts").val() === null) {
		alert("[リスト]が選択されていません")
		return true
	}

	return false
}
// [Submit]ボタンによりイベントが発火
$("#f").submit(function() {
	var isBlank = checkBlank();
	if (isBlank) {
		console.log("stop")
		return false;
	}
});
```

## おわりに

実際に開発現場で開発を行うにあたり、自身のフロントエンドの技術力の乏しさを実感したので、今後JSを中心に学習を進め、その内容を発信していこうと思います！

最後までお読みいただきありがとうございました！
Blazor WebAssembly C#からJavaScriptを実行

#はじめに
この記事ではC#からJavaScriptを実行するまでの記事です。JavaScriptからC#コードを呼ぶ事も出来ますが別記事で記載します。

#JavaScriptコードサンプル
サンプルとしてメッセージ表示系の以下のコードをwwwrootの中に入れています。

```
//アラート
export function displayAlert(message) {
    alert(message);
}

//Ok,キャンセルアラート
export function okCancelAlert(message) {
    return confirm(message);
}

//入力アラート
export function inputAlert(message, def) {
    return prompt(message, def);
}
```

#使い方

IJSRuntimeをInjectし、JSファイルを設定。 後は、JSの関数を指定して実行出来ます。

```
@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />


@code{ 
    [Inject]
    private IJSRuntime JSRuntime { get; set; }
    private IJSObjectReference JSCommand { get; set; }

    protected override async Task OnInitializedAsync()
    {
        this.JSCommand = await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./JsCommand.js");

        await this.JSCommand.InvokeVoidAsync("displayAlert", "メッセージを表示");

        var result = await this.JSCommand.InvokeAsync<bool>("okCancelAlert", "Ok,Cancelメッセージを表示");

        await this.JSCommand.InvokeVoidAsync("displayAlert", result);
    }

}
```

#動作
![11.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/110251/f3b5e277-7677-62dc-473b-c64302149353.gif)
Python3.9.6でNumpyがインストール出来ない。

Numpyインストールの際にかなり手間取ったので、
記載。


Pythonを勉強し始めたのでモジュールとしてNumpyとDjangoをインストールしようと試みたが、
何度やっても


「pip not found」


と出てきてしまい、どんなに調べても解決しなかったので挫けそうになった。


ただ調べていく中で、「pip」は無いが「pip3」は入っている。という事が分かった。

もしやと思い、

「pip intsall numpy」を

「pip3 intsall numpay」に変更したところ、

やっとインストールに成功した。


おそらく最新のpythonバージョンではpip3でのインストールを行う。
的なものなんだと、自身に言い聞かせて終了。

さて、勉強再開しましょ。
Git Actions CI/CD Deployできない

# 起きたこと

Gemfileの変更、マイグレーションファイルの変更機能を実装中に以下のエラーメッセージが発生しました。
解決方法を備忘録としてメモしときます。


```git:エラーメッセージ  
Your local changes to the following files would be overwritten by merge:
Gemfile.lock
```

#該当のソースコード

```
 echo "$PRIVATE_KEY" > private_key && chmod 600 private_key
3
  ssh -o StrictHostKeyChecking=no -i private_key ${USER_NAME}@${HOST_NAME} 'cd SDGs-PF &&
4
  git pull origin main &&
5
  ~/.rbenv/shims/bundle install &&
6
  ~/.rbenv/shims/bundle exec rails assets:precompile RAILS_ENV=production &&
7
  ~/.rbenv/shims/bundle exec rails db:migrate RAILS_ENV=production &&
8
  if [[ -e tmp/pids/puma.pid ]];then sudo kill $(cat tmp/pids/puma.pid); echo kill puma process;fi &&
9
  ~/.rbenv/shims/rails s -e production'
10
  shell: /usr/bin/bash -e {0}
11
  env:
12
    PRIVATE_KEY: ***
13
    USER_NAME: ***
14
    HOST_NAME: ***
15
Warning: Permanently added '***' (ECDSA) to the list of known hosts.
16
From github.com:kinoshitaken123/SDGs-PF
17
 * branch            main       -> FETCH_HEAD
18
   81aaf68..d84ef38  main       -> origin/main
19
hint: Pulling without specifying how to reconcile divergent branches is
20
hint: discouraged. You can squelch this message by running one of the following
21
hint: commands sometime before your next pull:
22
hint: 
23
hint:   git config pull.rebase false  # merge (the default strategy)
24
hint:   git config pull.rebase true   # rebase
25
hint:   git config pull.ff only       # fast-forward only
26
hint: 
27
hint: You can replace "git config" with "git config --global" to set a default
28
hint: preference for all repositories. You can also pass --rebase, --no-rebase,
29
hint: or --ff-only on the command line to override the configured default per
30
hint: invocation.
31
error: Your local changes to the following files would be overwritten by merge:
32
    Gemfile.lock
33
Please commit your changes or stash them before you merge.
34
Aborting
35
Error: Process completed with exit code 128.
```

#原因
git pull origin main コマンドでエラーが起こっています。

pull しようとしている環境で既存の Gemfile.lock に変更がありマージできないようです。

#解決方法

```
$ git status で本番環境で何が変更されているのか確認。
```

```
$ git checkout コマンドでバージョン管理中の最新状態まで戻すことが出来ます。
```

```
$ git checkout -- Gemfile.lock
```
VBAでエクセルテーブルの最終行を取得する

エクセルテーブルで最終行を取得する方法がわからなくなるので、自分用にまとめ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1833986/50b62d98-9eae-2137-1e85-be36d015d1f9.png)

こんな感じのテーブルのデータが入っている最終行を取得したい
列数=4,テーブル行数=15,データの入っている最終行=10

一つ目、テーブルの最終行を取得して、その後テーブル内の最終行位置を取得する

```VBA:test1
Sub test1()

Dim lastRow_Table As Long
Dim lastRow_A As Long

lastRow_Table = Cells(Rows.Count, 1).End(xlUp).Row
lastRow_A = Cells(lastRow_Table, 1).End(xlUp).Row

End Sub
```
二つ目　listobjectを使ってテーブルのA列からの中を上方向に検索かけて行って、最終行を探す			
			
```VBA:test2
Sub test2()

Dim lastRow_A As Long

lastRow_A = Cells(1).ListObject.Range.Columns(1).Cells.Find("*", searchdirection:=xlPrevious).Row

End Sub
```			
もしお困りの方がいれば参考になれば幸いです
システム監査

#監査調査
監査手続の結果をまとめたもの
監査報告書の裏付けとなる資料
監査報告書の基となる資料

監査手続きの過程と監査証拠を監査調書にとりまとめ、それを基に監査報告書を作成する流れになります。

#チェックリスト
チェックリスト法とは、システム監査人が、あらかじめ監査対象に応じて調整して作成したチェックリスト（通例、チェックリスト形式の質問書）に対して、関係者から回答を求める技法をいう。」

#根本原因
システム障害において、直接的に障害の引き金となった要因を直接原因、本質的に障害発生に起因した要因を根本原因と呼びます
誰が入っても、 回るエンジニア組織を作るためにすべきこと


## 前書き
これまで数社エンジニア組織を見てきて、うまく回っている組織には特徴があると思ったので、まとめました。
良い会社に勤めてらっしゃる方は、このぐらいのこと普通にされていると思うのでスルーしてくださいw


# 目次
- 問題1: バグが出る
- 解決策1: 単体テストと総合テスト
- 問題2: レビューがしづらい
- 解決策2: yardコメント
- 問題3: 課題に対する具体的な解決策がない
- 解決策3 KPT振り返りをする


# 問題1: バグが出る

どんな時にバグが発生する?
- rebase
- merge
- 抽象化されたメソッドの変更
- ライブラリのバージョン変更
- 環境変数の欠損
- 機能追加によるソースコードの変更


### 悪い解決策
一人一人が注意する
※ このような解決策では属人的な解決策になってしまい、メンバーが抜けた時に、うまく回らなくなる。

## 解決策1: 単体テストと総合テスト
テストが大事だとはわかっているが、テストをしない理由は工数がかかるから。
ですが、それでバグ対応に追われたりする工数や、致命的なバグで顧客に迷惑をかけるくらいなら、テストに工数をかけた方が良い。

テストをどのくらいやるかチーム内で最低限ラインを決めてやった方が良い。

### 最低限ライン
最低限このぐらいはした方が良いと思う。

単体テスト
検索で起きうるパラメータ。
アクションからレスポンスがあるか?

総合テスト
モンキーテストだと漏れがあるので、
excelやspreadsheetなどで実装者が、テストケースを作成



# 問題2: レビューがしづらい

# 解決策2: yardコメント(Rails)

Railsを使っているのであれば、yardコメントをすることをお勧めする

yardコメントとは、メソッドに、
メソッドの概要、返り値の型と内容、引数の型と内容などを書くものです。

型を入れない言語では特に、このようなコメントアウトを入れるルールをチーム内で作った方が良いです。

```ruby
# 日本語形式の日付に変換
# @param [Date] date 日付
# @return [String] 日付を YYYY年MM月DD日 の形式にしたもの
# @return [nil] 引数が Date 型以外の場合は nil
def convert_jp_date(date)
  (date.class == Date) ? date.strftime('%Y年%m月%d日') : nil
end
```

## yardコメントのメリット
実装者は実装中はどの型なのか意識しているので、コメントを追加することへの、
負担は少なく、実装者以外のレビューへの負担は減ります。

新しく入ったエンジニアはメソッド名からはわからない概要を掴むことができます。

## yardコメントのデメリット
実装者の負担が多少増える。

参考
Rails/Rubyドキュメントをキレイに生成するYARD、早見表付き！
https://morizyun.github.io/blog/yard-rails-ruby-gem-document-html/index.html

# 問題3:課題に対する具体的な解決策がない 

「課題: バグが出ました」という課題に対して、
よくある事例として、「気をつけましょう」、「個人を問い詰める」などがありますが、
これでは、あまり解決策になってないです。

```
課題: バグが出ました

課題に対する対処
- 気をつけましょう
- 個人を問い詰める
```


# 解決策3: KPT振り返り

KPT振り返りとは、このような項目で、週次でチーム内で意見を出しあう
- K：keep ＝ 良かったこと（今後も続けること）
- P：problem＝ 悪かったこと（今後はやめること）
- T：try ＝ 次に挑戦すること



KPTをするときの注意点
- 悪かったことが個人への攻撃にならないこと
- チームとして改善できるか考えて、problemの改善案をtryにつなげる

### 参考
【徹底解説】正しい「KPT」が仕事の成果を生み出す！進め方のコツ、現場の事例を紹介
https://seleck.cc/kpt
WordPressでファイルアップロード32MB設定の対応手順

#WordPressでファイルアップロード32MB設定の対応手順

## 目的
初期値が小さく設定されている為に大きな画像データがWordPressにアップロードできない問題がある場合に、WordPressに32MBの画像データをアップロード可能とする為の手順。

## 前提
* rootに変更する為のパスワードを把握できていること。
* WordPressは一般的なインストール方法にて構築されていること
* /var/www/html/wp配下にWinSCPによるファイルアップロードで作業する場合は、[WordPressフォルダ権限付与手順](https://qiita.com/TITL/items/263d5fed202a69608e98)を、事前に作業してください。

## 手順
### 1. rootユーザになる
以降の操作は全てrootユーザで行いますので、必ずrootに変わってください。

```
su -
```

### 2. パスワードの入力
パスワードの入力を求められるので入力する。

### 3. php.iniの設定

#### (1) 以下コマンド投入。

```
cd /var/www/html/wp
```
#### (2) 以下コマンド投入。

```
vi php.ini
```

以下のソースコードを作成してviエディタを閉じる。
※WinSCPでファイルアップロードでも問題ありません。

```
upload_max_filesize = 32M
post_max_size = 32M
```

### 4. .htaccessの設定
#### (1) 以下コマンド投入。

```
cd /var/www/html/wp
```

#### (2) 以下コマンド投入。
```
vi .htaccess
```

以下のソースコードを作成してviエディタを閉じる。
※WinSCPでファイルアップロードでも問題ありません。

```
php_value upload_max_filesize 32M
php_value post_max_size 32M
```

### 5. memory_limitの設定
#### (1) 以下コマンド投入。
```
cd /etc
```

#### (2) 以下コマンド投入。
```
vi php.ini
```
php.iniより、memory_limitの設定を探す。

以下のように32Mよりも大きくなっていれば問題は無い。
32Mより小さければ、32Mとするか、それ以上の大きさに変更する。

```
memory_limit = 128M
```

viエディタは保存して閉じる。
※おそらく、ディレクトリの権限的に、viコマンドでなければできない。

### 6. php-fpmの再起動
以下を参照しながら、php-fpmを再起動する。

php-fpm再起動手順
https://qiita.com/TITL/items/4b39636e137a694a4779


### 7. apacheの再起動
以下を参照しながら、apacheを再起動する。

apache再起動手順
https://qiita.com/TITL/items/186bddbad9e3fd918fe0


以上です。
プログラミング学習履歴

#２０２０年４月〜７月
* Progate：HTML,CSS,JavaScript,Ruby,Ruby on Rails,Command Line,Git,SQL
* ドットインストール
 * はじめてのHTML
 * はじめてのCSS
 * 詳解HTML 基礎文法編
 * 詳解CSS 基礎文法編
 * Visual Studio Code入門
 * はじめてのJavaScript
 * 詳解JavaScript 基礎文法編
 * 詳解JavaScript オブジェクト編
 * 詳解JavaScript DOM編
 * Ruby入門
 * MySQL入門 基礎編

#２０２０年８月〜１２月
* テックキャンプ

#２０２１年１月〜２月
* １つ目のポートフォリオ作成

#２０２１年２月〜３月
* キタミ式イラストIT塾　基本情報技術者
* Linux標準教科書
* 新しいLinuxの教科書
* Udemy：Git：はじめてのGitとGithub
* Ruby on Railsチュートリアル
* Amazon Web Services　基礎からのネットワーク＆サーバー構築

# ２０２１年４月〜６月
* ２つ目のポートフォリオ作成
    * 使用技術
        * フロントエンド
            * HTML/CSS
            * JavaScript
            * jQuery
            * tailwindcss(1.9.0)
        * バックエンド
            * Ruby(3.0.0)
            * Ruby on Rails(6.1.3)
            * MySQL(8.2.3)
        * インフラ
            * heroku(開発初期)
            * AWS(VPC/EC2/S3/RDS)
            * Nginx（Webサーバー）
            * Puma（アプリケーションサーバー）
        * テスト
            * RSpec
        * CI/CD
            * CircleCI（自動テスト）
            * Capistrano（自動デプロイ）
            * Rubocop（コーディングチェック）
        * バージョン管理
            * Git/GitHub
        * 開発環境
            * VScode
            * Docker
            * docker-compose

#２０２１年７月
* paiza
    * Cランク問題達成
    * Bランク問題挑戦も未達成
* Udemy
    * 超Vue.js 2 完全パック (Vue Router, Vuex含む)
    * Nuxt.js入門決定版！Vue.jsのフレームワークNuxt.jsの基本からFirebaseと連携したSPAの開発まで

#２０２１年８月〜現在
* 転職活動
* ３つ目のポートフォリオ作成
    * 使用技術
        * フロントエンド
            * Nuxt.js
        * バックエンド
            * Ruby on Rails（APIモード）
Laravel Sail 導入時に発生したエラーと解決方法

Laravel Sailを使ってLaravelをインストールしてみようとしたときのうっかりミスとその解決方法。

## うっかり編
[公式ページ](https://laravel.com/docs/8.x/installation#getting-started-on-macos)に書いてあるインストレーションを進める。

```bash
$ curl -s "https://laravel.build/example-app" | bash

docker: Error: remote trust data does not exist for docker.io/laravelsail/php80-composer: notary.docker.io does not have trust data for docker.io/laravelsail/php80-composer.
See 'docker run --help'.
bash: line 16: cd: example-app: No such file or directory

Please provide your password so we can make some final adjustments to your application's permissions.

Password:

Thank you! We hope you build something incredible. Dive in with: cd example-app && ./vendor/bin/sail up
```

エラーが表示されていたが「Thank you!」って言ってるし、進める。

```bash
$ cd example-app && ./vendor/bin/sail up
cd: no such file or directory: example-app
```

ディレクトリがないと言われるので、疑問に感じつつも、自分で作る。

```bash
$ mkdir example-app
```

モッカイヤッテミル。

```bash
$ cd example-app && ./vendor/bin/sail up
zsh: no such file or directory: ./vendor/bin/sail
```

## エラー解決編

もう一度、最初のエラーを解決して進めます。

```
docker: Error: remote trust data does not exist for docker.io/laravelsail/php80-composer: notary.docker.io does not have trust data for docker.io/laravelsail/php80-composer.
```

上記のエラーは、[こちらの記事](https://qiita.com/nasuB7373/items/92166d7958044ab8d450)によるとDockerのセキュリティ機能DOCKER_CONTENT_TRUST（DCT）が有効になっているというのがエラーの原因でした。

```bash
# 環境変数を設定。
$ export DOCKER_CONTENT_TRUST=0

# もう一度実行。
$ curl -s "https://laravel.build/example-app" | bash

# インストレーションが進む中に以下のテキストが、、、！
Application already exists!
```

先ほど、ディレクトリを消し忘れておりました:disappointed:
自分で作った`example-app`を削除し、再度実行。

```bash
$ curl -s "https://laravel.build/example-app" | bash
```
無事、Laravelがインストールされました！

## 結論編

**Laravel Sailはディレクトリは自動生成してくれるので、自分で作らないように。**
あと、エラーがあっても
`We hope you build something incredible. Dive in with: cd example-app && ./vendor/bin/sail up` と進めてくるので注意です。

初歩的なミスでしたが誰かの参考になれば幸いです。
Unity WebGLビルドのgithubへの配置。

### 1.File->BuildSetting->WebGL
ここでモジュールがない場合は、UnityHubからインストール（ダウンロードを促すボタンがある）して、ダウンロード後エディタを再起動。

### 2.９割で止まる問題の回避
https://qiita.com/aguroshou0413/items/1451a6779a92acb96b78

```
Unity -> File -> Build Settings -> Player Settings -> Publish Settings ->
Decompression Fallbackにチェックを付けましょう。
```

### 3.ビルド。フォルダをそのままGithubに投げ込むので、プロジェクト名と同じフォルダ名にするとよい。

### 4.githubへビルドしたフォルダをそのまま投げ込んで、コミット。

### 5.github->SettingでGitHub_Pageが設定されているか確認。
```https://YOU.github.io/YOU_PAGE/投げ込んだフォルダ/ ```にアクセス。

こんな感じになる。

https://gnjo.github.io/UnitySamples/WebGLTest/

### 6.追記 Application.targetFrameRateの回避
```C#
#if !UNITY_WEBGL
// WebGLでは設定しないように
Application.targetFrameRate = 60;
#endif
```
パフォーマンスチューニングのための調査に便利な SQL

PostgreSQL で、スロークエリの調査や、重いクエリを実行してしまって結果が返って来なくなってしまったときなどに活用できる SQL をご紹介します。

（その他便利な SQL などあったら教えていただきたいです。）

## [統計情報コレクタ](https://www.postgresql.jp/document/12/html/monitoring-stats.html)

> PostgreSQLの統計情報コレクタはサーバの活動状況に関する情報を収集し、報告するサブシステムです。

> PostgreSQLは他のサーバプロセスによって現在実行されている正確なコマンドなど現在システム内で起きていること、またシステム内にどんな他の接続が存在するかということについての動的情報を正確に報告する機能を持ちます。

#### [pg_stat_activity](https://www.postgresql.jp/document/12/html/monitoring-stats.html#PG-STAT-ACTIVITY-VIEW)

サーバプロセスあたり １ 行の形式で、状態や現在の問い合わせ等のプロセスの現在の活動状況に関連した情報を表示させる。

```sql
-- 実行中のクエリに関する情報を表示させる
SELECT
  pid
  ,application_name
  ,wait_event_type
  ,wait_event
  ,now() - state_change AS wait_dur
  ,now() - query_start AS query_dur
  ,regexp_replace(regexp_replace(query, '^[[:space:]]+', ''), '[[:space:]]+', ' ', 'g') as query
FROM
  pg_stat_activity
WHERE
  pid <> pg_backend_pid()
  AND state = 'active'
ORDER BY
  query_start ASC
;
```

上記の SQL を実行した結果:

```
  pid  | application_name | wait_event_type | wait_event |    wait_dur     |    query_dur    |        query         
-------+------------------+-----------------+------------+-----------------+-----------------+----------------------
 27464 | Postico 1.5.19   | Timeout         | PgSleep    | 00:00:03.730648 | 00:00:03.730654 | select pg_sleep(60);
(1 row)
```

※ 裏で以下の SQL を実行している

```sql
select pg_sleep(60);
```

#### [pg_stat_user_functions](https://www.postgresql.jp/document/12/html/monitoring-stats.html#PG-STAT-USER-FUNCTIONS-VIEW)

関数ごとに 1 行の形式で、関数の実行に関する統計情報を表示させる。

```sql
-- ストアドファンクションの実行時間を表示させる
SELECT
  funcid
  ,funcname
  ,calls
  ,round((self_time / calls / 1000)::numeric, 1) AS self_time_sec
  ,round((total_time / calls / 1000)::numeric, 1) AS total_time_sec
FROM
  pg_stat_user_functions
ORDER BY
  total_time_sec DESC
;
```

## [システムカタログ](https://www.postgresql.jp/document/12/html/catalogs.html)

> システムカタログとは、リレーショナルデータベース管理システムがテーブルや列の情報などのスキーマメタデータと内部的な情報を格納する場所です

#### [pg_locks](https://www.postgresql.jp/document/12/html/view-pg-locks.html)

ロック対象となる進行中のオブジェクト、要求されたロックモード、および関連するプロセスごとに 1 行の形式で、ロックに関する情報を表示させる。

```sql
SELECT
  pid
  ,granted
  ,locktype
  ,relation::regclass
  ,mode
FROM
  pg_locks
WHERE
  pid <> pg_backend_pid()
ORDER BY
  pid ASC
;
```

上記の SQL を実行した結果:

```
  pid  | granted |  locktype  | relation |      mode       
-------+---------+------------+----------+-----------------
 27464 | t       | relation   | sample   | AccessShareLock
 27464 | t       | virtualxid |          | ExclusiveLock
(2 rows)
```

※ 裏で以下の SQL を実行している

```sql
begin;
select * from sample;
-- commit しないで放置
```

##### 時間のかかっているクエリ、ロックをとっているプロセスを kill したい場合:

`pg_stat_activity` や `pg_locks` から取得した `pid` を使って、[サーバシグナル送信関数](https://www.postgresql.jp/document/12/html/functions-admin.html#FUNCTIONS-ADMIN-SIGNAL-TABLE)で取り消すことができる。

```sql
-- バックエンドの現在の問い合わせを取り消す（SIGINT）
SELECT pg_cancel_backend([pid]);

-- バックエンドを終了する（SIGTERM）
SELECT pg_terminate_backend([pid]);
```
MySQL で実行したときだけ式の解釈が変わる SQL 文

MySQL のコメントの仕様は標準 SQL と異なっている．これを利用すると，MySQL で実行したときだけ解釈が変わるようなクエリーを書ける．

## 標準 SQL と MySQL のコメント
標準 SQL においてコメントは `--` で始まり行末で終わる．Oracle Database，Microsoft の SQL のサーバー，PostgreSQL および SQLite ではこの形式でコメントを書ける．

```sql
select
    *  -- This is a comment
from
    t
where
    t.col1 = 1
    --and t.col2 = 2  -- Commented out
```

MySQL にはコメントのスタイルがいくつかあるが，`--` で始める場合は[その直後にスペースが必要](https://dev.mysql.com/doc/refman/8.0/ja/ansi-diff-comments.html)となる[^1]．コメントアウトするのが若干面倒になりそうだが，この規則は自動生成のクエリーがおかしくなることを防いでいる．

公式ドキュメンテーションいわく，

```sql
UPDATE account SET credit=credit-payment
```

というクエリーで `payment` に `-1` などの負数を当てはめると

```sql
UPDATE account SET credit=credit--1
```

となる．~~そうはならんやろ~~ここで `--1` をコメントとみなすと意図通りの操作にならない．先述の規則によりこれは防がれ，`--1` も式の一部として解釈される．

そんな C のマクロに括弧をつけ忘れたような置換をする人にお金を管理させるのは心配である．

## 式の解釈を変える
先述のコメントの規則により，MySQL と他の RDBMS とで式の解釈が異なるようなクエリーを書ける：[^2]

```sql
select
    case 1  --1
        when 1 then 'This is not MySQL'
        when 2 then 'This is MySQL'
    end as message
```

標準 SQL では `--1` がコメントとみなされ，`when 1 then` の直後の値が `case` 式 の結果となる．MySQL では `--1` が式の一部とみなされ，`1  --1` は `1 - (-1)` すなわち 2 に等しい．したがって `when 2 then` の直後の値が `case` 式 の結果となる．

MySQL では C 言語スタイルのコメント（`/* Block comment */`）を使えるので，次の方法もある．

```sql
select
    case 1 when 1  --0 /*
              then 'MySQL considered harmful'
        -- */ then 'I love MySQL'
    end as message
```

標準 SQL では `--` から行末までが無視される．これに対して MySQL では `/*` から `*/` までの範囲が無視される．

[^1]: `--` の直後は改行でもいいが，その改行自体でコメントが終わるのであまり実用上の意味はない．
[^2]: ただし標準 SQL と Oracle Database では select 文の from 句を省略できない．`from dual` と書き足せば Oracle でも動く．
JuliaのDataFrameをplotする

Julia のDataFramesはPythonでいえばpandasに対応する。Pythonではmatplotlib.pyplot がpandasのデータフレームをサポートしていてそのままぷろっとできるようだ。JuliaだとPlots ライブラリはDataFramesをサポートしていない。

``` julia
julia> d = DataFrame(Dict("key"=>[1, 2, 3, 4], 
  "v0"=>[10, 20, 10, 5], "v1"=>[0, 10, 20, 30]))
4×3 DataFrame
 Row │ key    v0     v1    
     │ Int64  Int64  Int64 
─────┼─────────────────────
   1 │     1     10      0
   2 │     2     20     10
   3 │     3     10     20
   4 │     4      5     30

julia> Plots.plot(d)
ERROR: Cannot convert DataFrame to series data for plotting
```

## StatsPlots

[StatsPlots](https://github.com/JuliaPlots/StatsPlots.jl)
というパッケージがあり、これを使うとDataFrameを直接プロットできる。

``` julia
julia> import StatsPlots
julia> StatsPlots.@df d plot(:key, [:v0, :v1])
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412142/ae2d17c8-b70f-11ce-8e19-4725d62d990b.png)

が、これはなかなかよくわからないライブラリで、マクロで書かれているせいか、挙動がよくわからない。`[:v0, :v1]`を変数として与えるとそれだけで動かない。

``` julia
julia> vs = [:v0, :v1]
2-element Vector{Symbol}:
 :v0
 :v1

julia> StatsPlots.@df d plot(:key, vs)
ERROR: Cannot convert Symbol to series data for plotting
Stacktrace:
...
``` 

## `plot_df`
仕方ないので自分で適当に書いてみる。x軸にする列を`key`として指定すると、残りの列をデータとしてプロットする。ラベルもつける。一気に複数の線を引いて複数のラベルを指定することができるはずなのだが、なんかうまく行かないので、仕方なくループを回して一本ずつ線を引いている。

``` julia
function plot_df(df, key)
    vals = filter((n)->! isequal(n, key), names(df))
    Plots.plot()
    Plots.xlabel!(key)
    for val in vals
        Plots.plot!(df[!,key], df[!, val], label=val)
    end
    Plots.plot!()
end
```

こんなふうにすると、

``` julia
julia> plot_df(d, "key")
```

こうなる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/412142/42903364-1544-d298-fa82-29556e39db8e.png)
WordPressフォルダ権限付与手順

#WordPressフォルダ権限付与手順

## 目的
一般的なWordPressのインストール方法だと、サーバへのログインが許可されたユーザがapacheユーザ以外である為、WordPressにWinSCPから直接ファイルをアップロードすると、権限でエラーになる。
そういった場合、WordPressにWinSCPからファイルをアップロードできるようにする為に、ディレクトリに書き込み権限を付与して解決する。

## 前提
* rootに変更する為のパスワードを把握できていること。
* [任意のアカウント]はWinSCPでログインする、root以外のアカウントであること。
* WordPressは一般的なインストール方法にて構築されていること。

## 手順
### 1. rootユーザになる
以降の操作は全てrootユーザで行いますので、必ずrootに変わってください。

```
su -
```

### 2. パスワードの入力
パスワードの入力を求められるので入力する。

### 3. [任意のアカウント]をapacheグループに追加

以下のコマンドを実行する。

```
gpasswd -a [任意のアカウント] apache
```

以下のメッセージが出力された事を確認する。

```
Adding user [任意のアカウント] to group apache
```

### 4. WordPressのフォルダ全体にグループの書き込み権限を付与

```
chmod -R g+w /var/www/html/wp 
```

### 5. 権限が付与された事を確認

以下のコマンドを投入して検証をする。

```
ls -al /var/www/html
```

以下の画像のようにwpフォルダの権限が変わっていれば良い。
![01. 権限付与-01.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/374511/3eafbb92-8ce8-b303-3b84-6b9753bca31f.png)

```
drwxrwxr-x. 5 apache apache 4096 Sep 13 10:28 wp
```

のように、左から6バイト目がwと表示されていればOK。


### 6. 一旦ログアウトする

TeraTermや、WinSCPにすでにログインしている場合は、一旦ログアウトしてください。

以上です。