OmniAICreator/Qiita-1.07M huggingface dataset:
Rails ActiveStorage で PUBLIC な URL を表示する

Rails 5.2 を触り始めて、 ActiveStorage で時間制限がある URL しか取得できなかったので、 PUBLIC な URL 取得するためのメモ

Post モデルに、 `has_one_attached :image` してる想定

```
$ bin/rail c
irb(main):001:0> post = Post.first
irb(main):002:0> post.image.attachment.service.send(:object_for, post.image.key).public_url
=> "https://your-bucket-name.s3.ap-northeast-1.amazonaws.com/dfadadfDEfadfadfaf"
```

これで URL が取得できます
ただ、これだけだとプライベートなファイルのままで、ブラウザで開いても、表示されないので、 ココが一番のポイント
S3 側のバケットポリシーを変更します

```
{
    "Version": "2008-10-17",
    "Statement": [
        {
            "Sid": "AllowPublicRead",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::your-bucket-name/*"
        }
    ]
}
```

そうすると、上の URL で表示されるようになります！
Azure SQL Databaseの閉域構成を検証してみた

# はじめに
前回に引き続き、閉域構成の検証をしてみました。
今回は、タイトル通りAzure SQL Databaseサービスでの検証です！

では、Let’s start!

# 構成
今回もよりセキュアに、接続許可のあるSQL Databaseのみに接続できる構成を検証してみました。
以下の構成図通りに、Linuxサーバにポートフォワーディングを設定し、中継接続することで、接続元サーバーは接続許可のあるSQL Databaseのみしか接続できない構成を実現しました。

**ポイント**
検証中にハマったのですが、Azure内部からSQL Database接続の際は、最初のコネクションがポート1433で応答し、通信確立後は接続元サーバーと直接通信を行います。
その際の通信は、ポート11000-11999動的で行われるため、そのポートに関してもNSGの送信規則で許可する必要があります。←ここ本当重要。
（Azure外部からの接続であれば通信ポート1433のまま、通信されます。)
上記のハマった部分は、@yotan 様にご教示いただきました。ありがとうございます！
※1.Linuxサーバからは任意のSQL Databaseへの接続もできますが、そこはユーザー操作権限等で、Linuxサーバを操作できる人を限定的にすれば問題ないと考えています。
※2.実際、本番で運用される場合は冗長化も検討する必要があるので、Linuxサーバの前段に内部ロードバランサを配置してLinuxサーバを2台構築するなどの対応が必要ですが！あくまで検証のため、冗長化云々は割愛します！

![Azure SQL Database.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348757/f23a1286-0340-f906-9351-a9a503b4ce22.png)

# 確認
接続確認に利用したツールとしては、Azure Data Studioです。
SSMSでも接続確認して、同様に制御が可能な事を確認しています。(こちらは結果の画像はありません。)

ちなみに、Azure Data StudioとSSMSの比較は《[Azure Data Studio for SQL Server](https://cloudblogs.microsoft.com/sqlserver/2018/09/25/azure-data-studio-for-sql-server/)》が役立ちます！

**確認結果**
任意のSQL Databaseへは接続できなかったが・・・・。
![20190417_000001_censored (2).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348757/f9a791c0-e0c4-4f61-7704-df4b578a6061.jpeg)
![20190417_000000_censored.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348757/2cf598c5-5985-95bc-5afb-94958a814937.jpeg)

接続許可(サービスエンドポイント利用)のあるSQL Databaseへは接続できました！
![20190417_000002_censored.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348757/5645cadc-b2f2-1d6f-b802-7da9c2ffe5a6.jpeg)
![20190417_000003_censored.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348757/92b06c1c-dead-b7c7-dd68-871d0cd21e6c.jpeg)


まとめ
今回はSQL Databaseで構成を記載しましたが、Azure SQL Data WarehouseやAzure Database for PostgreSQLでもほぼ同一構成(ポートの変更は必要)で、セキュアな構成が実現できることを確認しました。

セキュアな環境でPaaSやSaaSの使用を諦めていたユーザー様にも、セキュアな閉域構成を維持した状態で、よりクラウドの特性を活かしたPaaSやSaaSサービスが浸透すればいいなと思います！

ご一読いただき、ありがとうございました！

# 参考文献
[・Azure SQL Database と SQL Data Warehouse へのアクセスの制御-ファイアウォールとファイアウォール規則](https://docs.microsoft.com/ja-jp/azure/sql-database/sql-database-control-access#firewall-and-firewall-rules)
[・Azure SQLDBにlinux踏み台サーバ経由で接続するには](https://qiita.com/imaiworks/items/b34d9228527ce1a3dd88)
[・SQL Database v12 の接続のリダイレクトについて](https://blog.engineer-memo.com/2016/09/10/sql-database-v12-%E3%81%AE%E6%8E%A5%E7%B6%9A%E3%81%AE%E3%83%AA%E3%83%80%E3%82%A4%E3%83%AC%E3%82%AF%E3%83%88%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/)
PRISM Templete Packから、Autofac新規プロジェクトが作成できないときの対応方法

# 対象
- Visual Studio 2017
- Visual Studio 2019
- PRISM Templete Pack 2.1.6

# 現象
PRISM TEMPLETE PACKから、下記エラーで新規プロジェクトが作成出来ない場合

> Requested value 'Autofac' was not found.

> 要求された 'Autofac' が見つかりません

![55850156-34c01d00-5b8e-11e9-92c2-bff6ee7f4251.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309770/d1116f4f-3235-459a-ffd2-8061c96c8351.png)

# 対処法
1.レジストリエディター(regedit)を開く
2.下記パスへ移動
`HKEY_CURRENT_USER\Software\Prism `
3.SelectedContainer keyをUnityに変更
![SnapCrab_レジストリ エディター_2019-4-18_15-32-10_No-00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309770/0b246972-7556-da28-03c7-366f2a858112.png)

# 原因
Autofacのサポートがされなくなったため

# 参考
https://forums.xamarin.com/discussion/comment/370943#Comment_370943
Arduinoで開発を始める準備

#はじめに

ここでは、Arduinoのプログラムを始める前の事前準備を行います。

目次へ戻るには [ここ](https://qiita.com/hsgucci/items/085680123f758c8c3eb4#%E5%AE%9F%E9%A8%93%E6%89%8B%E9%A0%86) をクリック

※本ページは実験のテキストです。

#Arduinoの接続

Arduinoスターターキットの箱からArduino本体とUSBケーブルを取り出し、図１のように接続します。

![experimental_setup.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/31504481-de43-a7cb-0595-fac6abc92148.png)
図１　ノートパソコンとの接続

#Arduino IDEの起動

次にノートパソコンを起動して、図２のショートカットアイコンを探してArduino IDEを起動します。

![arduino_icon.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/aac07ff7-d8fd-7854-d561-f2a982850d2b.png)
図２　Arduino IDEのショートカット

Arduino IDEが起動すると、図３のようなウィンドウが現れます。
![ArduinoIDE.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/2d924327-8e1d-b849-bbdb-20baedc19bfd.png)
図３　Arduino IDE画面

#マイコンボードの種類の確認

使用するマイコンボードの種類を設定します。

今回使うのは『**<font color="red">Arduino UNO</font>**』です。

図４のように、メニューバーから、[ツール]-[ボード:(何かのボード名)]とたどり、
「**<font color="green">Arduino/Genuino UNO</font>**」をクリックします。

ライセンスの事情で、「Arduino UNO」と「Genuino UNO」の二種類のボードがあるのですが、
どちらも同じ設定で使用することが可能です。

- Arduino UNO： https://www.switch-science.com/catalog/789/

- Genuino UNO： https://www.switch-science.com/catalog/2895/

![boardtype.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/aea54ace-aeaf-6f8f-b16b-9e8640df5bc9.png)
図４　マイコンボードの選択

#シリアルポートの確認

次にシリアルポートを設定します。

パソコンとArduinoマイコンボードは、物理的にはUSBケーブルでつながっていますが、
Windowsの内部的には**<font color="darkred">COMポート</font>**として認識されています。
COMポートは、シリアルポート、RS-232Cポートとも呼ばれることもあるのですが、
Arduinoでは**<font color="darkgreen">シリアルポート</font>**と呼んでいます。

図５のように、メニューバーから、[ツール]-[シリアルポート]とたどり、
(**<font color="green">Arduino/Genuino UNO</font>**)の添え字がされているCOMポート番号をクリックします。
図ではCOM4となっていますが、パソコンによって、挿したUSBポートによっても番号は変わるので、番号自体は気にしないでください。
![comport.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/3edc36cf-a640-58ae-662d-21f9bd805743.png)
図５ COMポートの選択

余談ですが、
Arduino UNOボードがどのようにWindowsに認識されているか確認する方法も紹介します。

図６のように、スタートメニューを**右クリック**してメニューを出し、[デバイス マネージャー]をクリックします。
![device_manager1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/59c8f781-418d-4e1a-d10c-21cae9dbbcb7.png)
図６　デバイスマネージャーの開き方

デバイスマネージャーのウィンドウが開いたら、図７のように[ポート(COMとLPT)]をクリックして詳細を開きます。

![device_manager2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256470/fd23be4a-6999-6a93-7b22-b24547e1d41e.png)
図７　COMポートの確認

COM4として、USBシリアルデバイスが存在するのがわかりますが、これがArduino UNOボードです。
パソコンによっては、別のCOMポートが存在していることもあります。
図７ではCOM1とCOM3に別の装置がつながっていますね。

#おわりに

これでArduino UNOの開発の準備が整いました。

 [目次](https://qiita.com/hsgucci/items/085680123f758c8c3eb4#%E5%AE%9F%E9%A8%93%E6%89%8B%E9%A0%86) へ戻って次の作業を行ってください。
WHERE句で正規表現を使う

WHERE句で正規表現使えることを初めて知った！
これを知ってしまうと、もう普通のLIKE文を使うことはない気がする。

```sql

SELECT * FROM MASTER_TABLE
WHERE 
  REGEXP_LIKE(FIELD_NAME, '_[0-9]+')
ORDER BY SEQ
```

[oracleの公式doc](https://docs.oracle.com/cd/E16338_01/appdev.112/b56259/adfns_regexp.htm)

[MySQLの公式doc](https://dev.mysql.com/doc/refman/5.6/ja/regexp.html)

[Postgresqlの公式doc](https://www.postgresql.jp/document/9.4/html/functions-matching.html)
CSS超初心者 ~CSSを知ろう~

# CSSとは
CSSは、Webサイトのデザインの部分を担当し、HTMLをどのように表示、提示するかを制御するものです。
HTMLはデータを扱い、CSSでそのデータを綺麗に整形して見せるというイメージです。（HTML→骨組み　CSS→装飾）
Webページを見たとき、文字の色が変わっていたり大きさが違うのは、だいたいCSSが使われているからです。

## CSSで出来ること
1.  配置場所の変更
2.  フォントの色・大きさ・種類の変更
3.  下線を引く
4.  背景の色をつける
5.  行間をあける
6.  余白の調整

たくさんありますね。

# CSSの適用方法
### 外部CSSファイルとして適用させる
スタイルシートとHTMLファイルを別のファイルに分割してリンクさせることにより、CSSファイルに記述されているスタイルをHTMLファイルに適用できます。
この際に作成するCSSファイルの[拡張子](https://ja.wikipedia.org/wiki/%E6%8B%A1%E5%BC%B5%E5%AD%90)は「.css」となります。

外部CSSファイルをHTMLに適用させるためには、head タグ内にファイルをリンクさせるための記述が必要となります。
`<link rel="stylesheet" href="CSSファイルのパス" type="text/css">`

#### 外部cssファイルとして適用させることのメリット
1. HTMLとCSSを分離できるため記述内容がわかりやすく管理しやすい。
2. １つのCSSファイルを複数のHTMLファイルに適用できるため、外部CSSファイルを修正することによりサイト内の全ぺーじのデザインを一気に変更できる。
Rails5.1,Slimでタグ内ERBと文字を同居させる

####※解決記法以下はコメント内容をご参考ください。

####問題: html.erb以下内容がhtml.slimで表現できない
```
<title><%= yield(:foo) %> | bar</title>
```
Railsチュートリアルでのページごとにタイトルを変えるやり方をSlimでやろうとしました。

- 環境: AWSCloud9
rails: 5.1.6

####解決記法:

```
title
　== yield(:foo)
　|  | bar
```
ERB（出力）と文字を同じインデントで改行します。
yieldにはhtmlエスケープを伴わない出力 == を使います。
一つ目のパイプ | のあとはスペース2文字分開けています。 
※当記法には誤りがあります。コメントをご参考ください。
AWS DeepRacer リーグに参加してみた

# はじめに

諸般の事情で AWS Summit Singapore に行くことになりましたので、DeepRacerワークショップと DeepRacer リーグに参加してきました。

# DeepRacer ワークショップ

ワークショップは 2 パートに別れており、前半は強化学習や DeepRacer についての説明がありました。後半は [aws-samples/aws-deepracer-workshops](https://github.com/aws-samples/aws-deepracer-workshops) に沿ったハンズオンでした。

![workshop.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390120/0d6cf210-a5fd-4c96-7fb1-55e4cbe2dceb.png)


ハンズオンでは、現在プレビュー中の DeepRacer コンソールを使ってモデルのトレーニングと評価を行います。AWS アカウントは用意されていたものを使用しました。

[公式ドキュメント](https://docs.aws.amazon.com/deepracer/latest/developerguide/deepracer-get-started-training-model.html)である程度雰囲気はわかりますが、SageMakerを直接操作する場合に比べ、設定範囲は限られており、

* トレーニングするコース
* 報酬関数
* ハイパーパラメータ
* アクション空間（選択しうるスピードとステアリングの組み合わせ）

を入力することになります。デフォルトでは 60 分間のトレーニングとなります。

用意されているサンプルの報酬関数を使って 60 分ほどトレーニングすると、
シミュレータ上では 1 週 30 秒台で完走できるモデルになりました。

# DeepRacer リーグ

ワークショップで作成したモデルを持ち込んで、リーグに参加することができました。
[公式ルール](https://d1.awsstatic.com/DeepRacer/AWS-DeepRacer-League-2019-Official-Rules-English-March-2019.pdf) にある通り、4分間走らせて、一番早いラップタイムで順位付けされます。コースアウトするとスタッフの方が戻してくれます。

![league.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390120/89c5c8b8-3896-7d8e-e2c4-1f85f375fd19.png)

DeepRacerコンソールからダウンロードしたモデルをUSBメモリに書き込み、DeepRacer本体に差し込みます。ステアリングは自動ですが、スロットルは人間が操作するため、出力を上げすぎると、曲がりきれずに壁に激突しました。

たまたまコースアウトせずに周れた時があり、今回は 12 秒台という記録でした。
ほとんどのラップではコースアウトしていたため、安定感がない代わりに、
シミュレーションよりもかなり早い結果になりました。

[Singapore Summit Results](https://d3akhm1epsal2g.cloudfront.net/bigscreen/?event=singapore)

# 感想

一周でも完走できれば OK というルールなので、スロットル調整（と運）が重要だと感じました。
スロットルを思いきり上げて運良く一周できれば、好成績を収められるのではないでしょうか。
Googleに魂を売っているのでGoogleテクノロジーだけで短縮URLのChrome拡張を作った話

私は「Googleに魂を売った絵画修復士」として巷で有名です。おおよそ30人くらいの巷で。

GDGとGCPUGのオーガナイザーを福島でやっています。
基本的に**発表に使うスライド資料はGoogleテクノロジーのみ**になるようにという自分ルールを作っていまして、今回Googleがサービスを終了してしまったURL短縮をかなり使っていたので、bit.lyを使うことになるのかぁとちょっと自分ルールと葛藤していました。

そこで私はカリフォルニアに向かって頭を下げたあと、bit.lyのChrome拡張をインストールしました。

ところが…

**ログインを求められるではありませんか！！**

**めんどくさい！！！**

ということで、Firebase DynamicLinksを使うChrome拡張を作りました。

かなり単純なことをやっているだけなので、コードだけあればいいよ！って方は以下のリポジトリを直接見てみてください。
https://github.com/donuzium/firebase-url-shortener/tree/master

# やったこと
- Firebase Dynamic Linksの設定
- カスタムドメインの設定
- Chrome拡張の作成
- ストアに配信せず、ローカルのファイルを読み込んでDeveloper Modeで使ってみる。

この記事は以下に移行しました。

https://li.dott.dev/aJ2e
NetworkX と Matplotlib の使い方 （Node の色と大きさ）

次のプログラムを改造して Node の色と大きさを変えました。
[NetworkX と Matplotlib の使い方](https://qiita.com/ekzemplaro/items/6b08be21f23ba1953fca)

```py:example_sieze01.py
#! /usr/bin/python
#
#	example_size01.py
#
#						Apr/18/2019
# ------------------------------------------------------------------
import sys
import networkx as nx
import matplotlib
import matplotlib.pyplot as plt
# ------------------------------------------------------------------
def draw_graph(edges):
	G = nx.DiGraph()
	G.add_edges_from(edges)
#
	# Specify the edges you want here
	edge_colours = ['black' for edge in G.edges()]
	black_edges = [edge for edge in G.edges()]

	# Need to create a layout when doing
	# separate calls to draw nodes and edges
	pos = nx.spring_layout(G)
	colors = ["red","green","yellow","blue","magenta"]
	sizes = [1200,1800,2400,3000,3600]
	nx.draw_networkx_nodes(G, pos, cmap=plt.get_cmap('Reds'), \
		node_color = colors, node_size=sizes)
	nx.draw_networkx_edges(G, pos, edgelist=black_edges, arrows=True)
	nx.draw_networkx_labels(G,pos,font_size=12,font_family='TakaoExMincho')
	
	plt.axis('off')
	plt.show()
#
# ------------------------------------------------------------------
edges = [('明治','大正'),('大正','昭和'),('昭和','平成'), \
		('平成','令和'),('令和','明治')]
draw_graph(edges)
# ------------------------------------------------------------------
```

実行結果
![matplot02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/42af3893-a50a-44bf-4372-14fa364063e1.png)
自己紹介

##プロフィール
文系の情報学部に通う大学生(2021年卒業予定)

<b>趣味</b>
・ゲーム（PokemonGO,Splatoon,Minecraft,その他RPG）
・料理
・アニメや映画の鑑賞

<b>触れたことのある言語</b>
・Ruby
・C#

<b>勉強している言語など</b>
・Python3
・HTML5
・CSS
##プログラミングを始めたきっかけ
　高校生の時は特にやりたいこともなく、志望校も定まらなかったので勉強にも身が入らず成績も悪かったため、なんとなく情報系の分野も学べて、誰でも入れそうな大学に進学。1年次に超入門的なプログラミングの講義があり、初めてプログラミングに触れた。（kojoと呼ばれるScalaを使って亀を動かして絵を描く講義）自分でプログラムしたとおりに亀が動くことに感動し、もともとモノづくりが好きな自分はすごく興味が湧いた。それからいろいろな情報系の講義やゼミを受け、プログラミング勉強を始めたのは2年次の冬から。あまり勉強が得意ではないため、ちょこちょこ勉強する程度…笑
##投稿する内容
まだまだかけだしの冒険者レベルなので、日記や備忘録などに使っていきたいと思っています。ぐだぐだなコードばかり書いてしまうと思いますが、改善点があれば指摘していただけるととても嬉しいです。よろしくおねがいします。:relaxed:
【3分入門】コピペで導入！Rails API server のテストに json-schema を使う

【3分入門】 コピペで導入！シリーズです。

API server の json を担保したいというのは人類共通の思いかと思います。

そんなあなたはgraphqlを使えばそんな悩みも軽減されるかもしれません。

https://qiita.com/nishisuke/items/c4f6065b069b2c1f3083

全員が全員, rest apiからgraphqlに乗り換えれるわけではないので、

テストを書いていきましょう！ :muscle: 

## json schemaとは
https://tools.ietf.org/html/draft-wright-json-schema-validation-01

ietfに定義されています。

jsonの構造をjsonで表現します。

こんな感じ

```
schema = {
  "type" => "object",
  "properties" => {
    "message" => {"type" => "string"}
  }
}
```

この定義はこのjsonの表現です。

```
{
  message: 'Hello world!'
}
```

キーと型を記述していく感じです。

## rspec + factorybot code

```spec/requests/users_request_spec.rb
RSpec.describe 'users API', type: :request do
  let(:user) { create(:user) }
  let(:res) { YAML.load_file(File.expand_path("../fixtures/res/#{res_name}.yml", __dir__)).to_json }

  before do
    get url, { headers: { Authorization: "Bearer #{user.token}" } }
  end

  shared_examples 'valid json' do
    it 'successes' do
      expect { JSON::Validator.validate!(res, response.body, version: :draft4, strict: true, json: true) }.not_to raise_error
    end
  end

  describe 'GET #index' do
    let(:res_name) { 'user' }
    let(:url) { me_url }

    it_behaves_like 'valid json'
  end
end
```

```spec/fixtures/res/user.yml
type: object
properties:
  id:
    type: integer
  name:
    type: string
  age:
    type: integer
```
[Golang] ファイル読み込みサンプル

## はじめに
Golangのファイル読み込みをまとめました。バージョンは1.11.2で確認しました。

### os.File Read使用

os.Openでファイルのオープンで取得したos.FileオブジェクトのReadメソッドを使用して読み込みを行います。
Readメソッドの引数に指定した[]byteスライスに内容が読み込まれます。

```golang
func useFileRead(fileName string) {
	fp, err := os.Open(fileName)
	if err != nil {
		panic(err)
	}
	defer fp.Close()

	buf := make([]byte, 64)
	for {
		n, err := fp.Read(buf)
		if n == 0 {
			break
		}
		if err != nil {
			panic(err)
		}
		fmt.Println(string(buf))
	}
}
```

### ioutil.ReadFile使用
ioutil.ReadFileメソッドを使用してファイルを読み込みます。一度に全データを取得するのでファイルサイズが大きい場合は注意が必要ですが、記述量は少なくて済むのが利点です。

```golang
func useIoutilReadFile(fileName string) {
	bytes, err := ioutil.ReadFile(fileName)
	if err != nil {
		panic(err)
	}

	fmt.Println(string(bytes))
}
```

### bufio.NewReaderSize使用
bufio.NewReaderSizeを使用してファイルを1行ごと読み込みます。1行のサイズが第二引数で指定したサイズを超える場合には、戻り値のisPrefixにfalseが返却されます。

```golang
func useBufioNewReaderSize(fileName string) {
	fp, err := os.Open(fileName)
	if err != nil {
		panic(err)
	}
	defer fp.Close()

	reader := bufio.NewReaderSize(fp, 64)
	var tmp []byte
	for {
		line, isPrefix, err := reader.ReadLine() // size を超えるとisPrefixがfalse
		if err == io.EOF {
			break
		}
		if err != nil {
			panic(err)
		}
		tmp = append(tmp, line...)
		if !isPrefix {
			fmt.Println(string(tmp))
			tmp = nil
		}
	}
}
```

### bufio.NewScanner使用
bufio.NewScannerを使用してファイルを1行ごと読み込みます。bufio.NewReaderSizeを使用した場合と比べてシンプルに書けます。

```golang
func useBufioScanner(fileName string) {
	fp, err := os.Open(fileName)
	if err != nil {
		panic(err)
	}
	defer fp.Close()

	scanner := bufio.NewScanner(fp)
	for scanner.Scan() {
		fmt.Println(scanner.Text())
	}
}
```

### csv.NewReader
csv.NewReaderを使用してcsvファイルを1行ごと読み込みます。csv.NewReaderを呼ぶとcsv.Readerが返却されます。csv.ReaderのCommaに区切り文字を指定すると指定した文字列でデータを分割します。デフォルトは","です。csv.ReaderのReaderメソッドを呼び出すと1行分の分割されたデータがスライスで返却されます。

```golang
func userCsvNewReader(fileName string) {
	fp, err := os.Open(fileName)
	if err != nil {
		panic(err)
	}
	defer fp.Close()

	reader := csv.NewReader(fp)
	//reader.Comma = ','
	reader.LazyQuotes = true
	for {
		record, err := reader.Read()
		if err == io.EOF {
			break
		} else if err != nil {
			panic(err)
		}
		fmt.Println(record)
	}
}
```
エディタで置換する事例集

すぐ忘れるので地道に書き溜めます。
# Visual Studio Codeの場合
|やりたいこと|Find|Replace|置換前|置換後|
|:--|:--|:--|:--|:--|
|日付や時間のあるCSVファイルの数字を0埋めしたい|([/,])([0-9]{1,1})([,:])|`$10$2$3`|2021/01/4,18:13,0:00|2021/01/04,18:13,00:00|
|小文字スネークケースをローワーキャメルケースにしたい|`_([a-z])`|`\U$1`|hoge_name|hogeName|

# Sublime Textの場合
## 大文字スネークケースから○○ケースにしたい

```text:置換前
PONSUKE_TAROU_NAME
```

|○○ケース|Find|Replace|置換後|
|:-:|:-:|:-:|:-:|
|パスカルケース|`(_){0,1}([A-Z])([A-Z]+)`|`\2\L\3\E`|PonsukeTarouName|
|小文字スネークケース|`([A-Z_]+)`|`\L\1\E`|ponsuke_tarou_name|

## キャメルケースをスネークケースにしたい
- Find: `([a-z])([A-Z])`
- Replace: `\1_\l\2`

```text:置換前
ponsukeTarouName
```
```text:置換後
ponsuke_tarou_name
```

## Javaのプロパティ定義からプロパティ名だけ抜きたい
- Find: `( )+private ([A-Za-z]+) ([A-Za-z]+);`
- Replace: `$3`

```java:置換前
     private String createdBy;
     private String createdByLastNm;
     private String createdByFrstNm;
     private Date createdAt;
```
```java:置換後
createdBy
createdByLastNm
createdByFrstNm
createdAt
```

## Javaのプロパティ定義をCREATE TABLEの列定義っぽくしたい
- Find: `( )+/\*\* ([^\x01-\x7E]+). \*/\n( )+private ([a-zA-Z]+) ([a-zA-Z]+);`
- Replace: `\t\5\t\4\tCOMMENT '\2',`

```java:置換前
    /** 更新日時. */
    private Date updatedAt;
    /** 更新者. */
    private String updateUser;
    /** エンティティ識別子. */
    private int entityId;
    /** エンティティ名. */
    private String entityName;
    /** 項目名. */
    private String itemName;
    /** 変更前の値. */
    private String brforeValue;
    /** 変更後の値. */
    private String afterValue;
```
```java:置換後
	updatedAt	Date	COMMENT '更新日時',
	updateUser	String	COMMENT '更新者',
	entityId	int	COMMENT 'エンティティ識別子',
	entityName	String	COMMENT 'エンティティ名',
	itemName	String	COMMENT '項目名',
	brforeValue	String	COMMENT '変更前の値',
	afterValue	String	COMMENT '変更後の値',
```

## スペースで区切られた文字の順序を入れ替えてPHPの配列の要素を作る
データベースの定義を抜いてテストコード用の配列を作りたかった

- Find: `([1-4]+)   ([^\x01-\x7E]+)` :left_right_arrow:()の間は半角スペース3つ
- Replace: `'$2' => [$1],`

```php:置換前(数字と文字の間は半角スペース3つ)
1   さる
2   うさぎ
3   ぽんすけ
4   ねずみ
```
```php:置換後
'さる' => [1],
'うさぎ' => [2],
'ぽんすけ' => [3],
'ねずみ' => [4],
```
aws-serverless-expressで配列なクエリパラメータを扱う

※ 2019/04/18時点の記事です。

# やりたかったこと

`aws-serverless-express`を利用している開発で、GETリクエストに配列のクエリパラメータを指定したかった。

[expressのドキュメント](https://expressjs.com/en/api.html#req.query)のこんな感じで。

```js
// GET /shoes?color[]=blue&color[]=black&color[]=red
req.query.color
// => [blue, black, red]
```

で、プログラムの方でいい感じにデータ取りたかった。
素直にやろうとしたらできなかったので諸々調べた備忘録として残す。

# 最終的な実現方法

ちょっと邪悪な感じになってますので、よりよい方法なんかがあればアドバイスください...

```ts:tsです
export function handle(event: APIGatewayEvent, context: Context): void {
    if (event.queryStringParameters && event.multiValueQueryStringParameters) {
        Object.keys(event.queryStringParameters).forEach(key => {
            if (key.match(/\[\]/) && Object.keys(<any>event.multiValueQueryStringParameters).includes(key)) {
                (<any>event.queryStringParameters)[key] = (<any>event.multiValueQueryStringParameters)[key];
            }
        });
    }
    proxy(server, event, context);
}
```

`aws-serverless-express` の `proxy()` に渡す前に、`event.multiValueQueryStringParameters`の値を`event.queryStringParameters`に突っ込みました。

# 環境

## AWS

- apiGateway
- lambda（lanbdaプロキシ）

## 利用しているパッケージ等（package.jsonから抜粋）

- "typescript": "^2.9.2"
- "aws-serverless-express": "^3.3.6"
- "@types/aws-lambda": "^8.10.24"
- "@types/aws-serverless-express": "^3.3.0"
- "serverless-offline": "^3.33.0"

# 経緯

## え、配列のクエリ動いてない？

```js
// GET /shoes?color[]=blue&color[]=black&color[]=red

console.log(req.query);

{
    color: ["red"]
}
```

**なるほど（震える）**
そうですかキー上書きされますか。

ちなみにこの段階で利用していたパッケージのバージョン

- "typescript": "^2.9.2"
- "aws-serverless-express": "^3.2.0"
- "@types/aws-lambda": "^8.10.7"
- "@types/aws-serverless-express": "^3.0.1"
- "serverless-offline": "^3.25.6"

## 各サービスやパッケージの対応状況を調べる

### apiGateway

- 配列のクエリパラメータに対応してる
    - というか、比較的最近対応した
    - [リリース](https://aws.amazon.com/about-aws/whats-new/2018/10/amazon-api-gateway-adds-support-for-multi-parameters/) / [ドキュメント](https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html#api-gateway-simple-proxy-for-lambda-input-format) / [ブログ](https://aws.amazon.com/blogs/compute/support-for-multi-value-parameters-in-amazon-api-gateway/)
    - multiValueQueryStringParameters ってやつ
    - `?color=blue&color=black&color=red` て感じで使えるようである

### @types/aws-lambda

- apiGatewayの機能追加に追従してる
    - https://github.com/DefinitelyTyped/DefinitelyTyped/blob/10aca630788ef193f994ac31de63ea9cf44630a3/types/aws-lambda/index.d.ts#L72
    - 当初のものだと古いので、`npm update`でバージョンあげた

これで型使えます

### serverless-offline

- apiGatewayの機能追加に追従してる
    - https://github.com/dherault/serverless-offline/pull/507
    - 当初のものだと古いので、`npm update`でバージョンあげた

ローカルも対応できます

### aws-serverless-express

**https://github.com/awslabs/aws-serverless-express/issues/196**

コア部分なので、お前だけが頼りだ的状況にも関わらずお前だけ...

まあ一応本パッケージと型定義のバージョンはあげておく

それでどう対応しようか考えた結果、 [冒頭の「最終的な実現方法」](#%E6%9C%80%E7%B5%82%E7%9A%84%E3%81%AA%E5%AE%9F%E7%8F%BE%E6%96%B9%E6%B3%95)のような対応をしました。
悪口特許を検索してみた。

悪に関する特許があるかどうか調べようとした。
https://www.j-platpat.inpit.go.jp/web/all/top/BTmTopPage

# 悪 180934件
>検索結果が3000件を超えました(180934件)。検索条件を変更して、再度検索を行ってください。

# 悪口　3
# 1
(11)【公開番号】特開2010-233552(P2010-233552A)
(43)【公開日】平成22年10月21日(2010.10.21)
(54)【発明の名称】高病原性口腔細菌の高感度検出法
(21)【出願番号】特願2009-88239(P2009-88239)
(22)【出願日】平成21年3月31日(2009.3.31)
(71)【出願人】
【識別番号】504300181
【氏名又は名称】国立大学法人浜松医科大学
(71)【出願人】
【識別番号】504176911
【氏名又は名称】国立大学法人大阪大学
(72)【発明者】
【氏名】梅村  和夫
(72)【発明者】
【氏名】外村  和也
(72)【発明者】
【氏名】仲野  和彦
(72)【発明者】
【氏名】大嶋  隆
(72)【発明者】
【氏名】野村  良太
(72)【発明者】
【氏名】和田  孝一郎

出血増悪口腔細菌
タンパク質抗原であるＰＡおよび／またはコラーゲン結合タンパク質であるＣＢＰ


#2
(11)【公開番号】特開平６－６２７８１
(43)【公開日】平成６年（１９９４）３月８日
(54)【発明の名称】ニンニク・ネギ類の悪臭処理方法
(21)【出願番号】特願平３－２６５４４５
(22)【出願日】平成３年（１９９１）９月１８日
(71)【出願人】
【識別番号】０００１６２６２９
【氏名又は名称】境  功
(72)【発明者】
【氏名】境  功

悪口臭、体臭
カルボン酸をバッハとして使用して重炭酸ソーダ
辛味成分のキノバチン

# 3
特願昭48-073339 
特開昭49-030544 
 1973/06/30 
 1974/03/19 
 コウナイセイジヨウザイ 
 アストラ　レ－ケメデル　アクチエボラ－グ 

# まとめ
悪口
ではなく、
悪口臭などの熟語の一部として現れるものが出ていることがわかった。
### 最後までおよみいただきありがとうございました。
いいね　💚、フォローをお願いします。
####  Thank you very much for reading to the last sentence.
Please press the like icon 💚　and follow me for your happy life.
Swift5 での Data.withUnsafeBytes

# 前提

Double の連続のデータが Data の中にあるとしてそれを [ Double ] にしたいとします。

```swift
let	d: Data ....
```

# Swift5 より前

`withUnsafeBytes` の `$0` は `UnsafePointer<ContentType>` だったので以下のような感じだったのですが、これは swift5 で deprecated になりました。

```swift
Array(
	UnsafeBufferPointer( 
		start	: d.withUnsafeBytes{ p -> UnsafePointer< Double > in p }
	,	count	: d.count / 8
	)
)
```


# Swift5 以降

`withUnsafeBytes` の `$0` は `UnsafeRawBufferPointer` になったので、以下のような感じがいけます。

```swift
d.withUnsafeBytes{
	Array(
		UnsafeBufferPointer( 
			start	: $0.baseAddress!.assumingMemoryBound( to: Double.self )
		,	count	: $0.count / 8
		)
	)
}
```

とか

```swift
Array(
	d.withUnsafeBytes{
		UnsafeBufferPointer( 
			start	: $0.baseAddress!.assumingMemoryBound( to: Double.self )
		,	count	: $0.count / 8
		)
	}
)
```

## メリット

クロージャの中でデータの count が取れるので、Data を保持するための変数（ここでは d ）を定義せずに以下のように書けるようになりました。

```
Data( ... ).withUnsafeBytes ...
```


## 補足

ちなみに、最初のデータひとつだけが必要なのであれば、以下の書き方ができます。

```swift
d.withUnsafeBytes { $0.load( as: Double.self ) }
```
npm-run-all を使用すれば、sever起動時のロックを防いでワンライナーで複数処理が実行できる

##TL;DR
- npm-run-allを使用することで、サーバー起動時の Listening処理により発生するロックの影響を受けず、別処理を実行することができる
- scriptもスッキリと短く記入できる

#### 経緯
モックサーバーを`:3000`、ローカルサーバー（クライアント側のエントリーポイント）を`:8000`で、ワンライナーで立ち上げたかったのですが、
`npm run <Mock Run> && <Local-Server Run>` とすると、Mockの方でリスニング状態になってしまい、 ローカルサーバーの起動が実行されない。
デフォルトのスクリプトでは、ワンライナーではサーバーを並列実行できない　？　→ 導入しました。


## install
[npm-run-all](https://www.npmjs.com/package/npm-run-all)　こちらの公式サイトを参考に　npm install.


## コマンド 一覧
`npm-run-all` 

>公式より
The main command is npm-run-all. We can make complex plans with npm-run-all command.
Both run-s and run-p are shorthand commands. run-s is for sequential, run-p is for parallel. We can make simple plans with those commands.

- 日本語訳
    - メインコマンドは`npm-run-all`だよ。
    - `run-s`コマンドと`run-p`コマンドはショートハンドで、
        - `run-s`は直列（連続）実行
        - `run-p`は並列（同時）実行
   
## 実例
モックサーバーの立ち上げと、webpackのホットリロードを同時に立ち上げてみました。


`npm run dev`で、`npm run api` と `npm run serve`を同時に実行しています。


```package.json
{
    "scripts": {
      "serve": "vue-cli-service serve", 
      "build": "vue-cli-service build",
      "lint": "vue-cli-service lint",
      "test:unit": "vue-cli-service test:unit",
      "api": "npx json-server --watch db.json",
      "dev": "run-p api serve"
  },
}
```
docker-compose up したらdriver failed programming external connectivity on endpointが出てきた

#どんなエラーか
`docker-compose-up`したら

```
ERROR: Cannot start service　 コンテナ名　: b'driver failed programming external connectivity on endpoint
```

って出てきました。

原因は`docker-compose up`する前にdockerで使っていたポートを掴んだままだったからこんな問題が起きたっぽいです。

ググって調べてみたら「Docker for Macを再起動したら治る」という事が分かり

#あっさり解決

①タスクバーにいるクジラマーク（Docker）のアイコンをクリック
②Restartを押す
③クジラの背中に乗ってるコンテナが動かなくなるまで待つ
④もう一度`docker-compose-up`

普通に治りました。

OSの再起動では治らなかったので、しっかりDockerの再起動をしてやる事が大事なんだと思いました。
ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

```html
<p *ngFor="let item of items">{{item.name}}</p>
```

*ngForを使うと上記のようなエラーを返してくる。
そして{{item.name}}が何も返してくれない。


<br>

サーチするといろいろ、*ngForはArrayなどに使うのであってObjectには対応していないのだよ　とかムツカシイお答えが多い。
対応方法も？？？なものばかり。

<br>

### 解決方法はズバリ

<br>

ビルトインPipeを使えばよい。

```html
<p *ngFor="let item of items | async">{{item.name}}</p>
```



<br>
` | async`を追加。


これだけ。

<br>
### こういうやり方もある

```typescript
this.someCollection.valueChanges()
                    .subscribe((items) => this.items = items);
```

ObservableのvalueChanges()にitemsを登録する（subscribeする）だけ。



<br>



以上。

おつかれ → オレ
自分のVim環境を整理してみる(個人的な見解です)


# 私のvimrcを公開してみる。

※個人的な見解ですのでご注意ください。

こんにちは、  
最近真面目にVimを使い出したので、一度自分の中のVimについて整理したいと思い、この記事を書き始めました。  

私は、たいして使いこなしてませんが、かれこれVimと付き合って６、７年目でしょうか。  
私とVimとの出会いは衝撃的で、初めて手にした、故障したPCを祖父から譲ってもらったのがきっかけ。あの頃は若かった。  
苦労して動かす方法を探して、そんな中、Linuxに出会う。  
CUIぐらいしかまともに動かせないスペックだったのでとりあえず何か書こうとViに出会い困惑し、その後Vimに出会いました。  
Viを使えばファイルが扱えるという当時右も左もわからない初心者がViなど使えるわけもなく。  
そのような状況下で、Vimの存在を知ってようやくまともにファイル編集ができた感動が今でも忘れられません。  
そのボロボロのPCを頑張って2年ほど使ったのちにMacBookAirを買った。  
GUIの素晴らしさを体感したと同時にVimとしばらくお別れしました笑  
sublime textというエディターに出会ってしまったのです。  
でも、時を重ね、だんだんとSSHでの作業が多くなってゆき、再びVimに戻ってきました。  

そんな私は、いくつかVimプラグインを使ってきました。

Vimプラグインに出会った時は本当に感動しましたが、プラグインを導入しすぎて、Vimの起動が非常に重くなってしまった時は絶望でした。笑  
NeoBandleにはお世話になりましたが、最近ではすっかりvim-plugに移行してしまいましたね。  

また、論文を書くときもVimを使うようになりました。  
LaTexとの出会いです。  

それまでの私は、Microsoft OfficeのWordにお世話になりまくってましたが、結局Vimに還っていくのだなと、改めてVimが自分とコンピュータとの原点だなと感じました。
そして、最近実現したのですが、このQiitaの記事もVimで書く事になるとは夢にも思っていませんでしたね。  

とりあえず、vimrcをあげてみたいと思います。↓  

```sh:.vimrc
" TeX Setting Start.
filetype plugin on
let tex_flavor = 'latex'
set grepprg=grep\ -nH\ $*
set shellslash
let g:Tex_DefaultTargetFormat = 'pdf'
let g:Tex_ViewRule_pdf = 'open -a Skim.app'
let g:Tex_CompileRule_dvi = 'platex --interaction=nonstopmode $*'
let g:Tex_CompileRule_pdf = 'dvipdfmx $*.dvi'
let g:Tex_FormatDependency_pdf = 'dvi,pdf'
let g:latex_fold_enabled = 0
" TeX Setting Fin.

"vim-plug Start.  https://github.com/junegunn/vim-plug
" Specify a directory for plugins
" - For Neovim: ~/.local/share/nvim/plugged
" - Avoid using standard Vim directory names like 'plugin'
call plug#begin('~/.vim/plugged')
" Make sure you use single quotes
" vimtex https://github.com/lervag/vimtex
Plug 'lervag/vimtex'

" ruby https://vimawesome.com/plugin/vim-ruby
Plug 'vim-ruby/vim-ruby'

" python https://vimawesome.com/plugin/python-mode
Plug 'klen/python-mode'

" post web.
Plug 'plasticboy/vim-markdown'
Plug 'kannokanno/previm'
Plug 'tyru/open-browser.vim'
Plug 'mattn/qiita-vim'
Plug 'mattn/webapi-vim'

call plug#end()
" vim-plug Fin.

" colorscheme murphy

" NERDTree Start.
 autocmd StdinReadPre * let s:std_in=1
 autocmd VimEnter * if argc() == 0 && !exists("s:std_in") | NERDTree | endif
 map <S-e> :NERDTreeToggle<CR>
 let g:NERDTreeDirArrows = 1
 let g:NERDTreeDirArrowExpandable  = '▶'
 let g:NERDTreeDirArrowCollapsible = '▼'
" NERDTree Fin.

" esc
noremap <C-f> <esc>
noremap! <C-f> <esc>

" clipboard enable
set clipboard+=unnamed

""" markdown {{{
  autocmd BufRead,BufNewFile *.mkd  set filetype=markdown
  autocmd BufRead,BufNewFile *.md  set filetype=markdown
  " Need: kannokanno/previm
  nnoremap <silent> <C-p> :PrevimOpen<CR> " Ctrl-p Preview.
  let g:vim_markdown_folding_disabled=1
" }}}
```

これが今の私の最適解です。  
起動処理は遅すぎず、最低限の機能を保つvimrcです。  

今日はここまで、また、時間ができたとき詳しく解説していきたいと思います。
git のリモートリポジトリの URL を変更する

研究室の git サーバが移行することになったので，ローカルの git の設定の変更方法を残しておきます。

```bash
$ git remote set-url [name] [URL]
```
- [name]: リモートリポジトリ名
- [URL]: 設定したいURL

例:

```bash
$ git remote set-url origin git@git.example.com:foo/bar.git
```

ちなみに…

```bash
$ git remote
```

で，そのローカルリポジトリのリモートリポジトリ名の一覧が表示されます！
HTMLタグ_2　リスト　（覚書）

#HTMLタグ−2
##リスト
### \<ul> \</ul> :順序なしリスト　<font color:"Red">u</font>nordered list
<ul>
 <li>野球</li>
 <li>サッカー</li>
 <li>水泳</li>
</ul>

### \<ol> \</ol> :順序なしリスト　<font color:"Red">o</font>rdered list

<ol>
 <li>アメリカ</li>
 <li>中国</li>
 <li>日本</li>
</ol>

##記述例

```
<ul>
 <li>野球</li>
 <li>サッカー</li>
 <li>水泳</li>
</ul>

<ol>
 <li>アメリカ</li>
 <li>中国</li>
 <li>日本</li>
　<ul>　　　　　　　　　　<!--　リストの入れ子 -->　　
    <li>東京</li>
    <li>大阪</li>
    <li>北海道</li>
　</ul>
</ol>

```
【typescript】material uiのwithStylesをつけてreactのClass Componentをexportしたら、エラーがでた

#環境
- react 16.8.5
- redux 4.0.1
- material-ui 3.9.2
- typescript 3.4.3
    - @types/react 16.8.10
    - @types/react-dom 16.8.3
    - @types/react-redux 7.0.5
    - ts-loader 5.3.3


# エラー
material uiの`withStyles`をつけて`export`したら、エラーがでた。
エラーの内容がよく理解できなかった。

```javascript:UserHomeTemplate.tsx
TS2604: JSX element type 'UserHomeTemplate' does not have any construct or call signatures.
```

## エラーが出たコード

とりあえず、いろいろ試して原因のコードを特定

```
import React from "react";
import * as Actions from "./redux/actions";
import { connect } from "react-redux";
import { bindActionCreators, compose } from "redux";
import withStyles, {
    WithStyles,
    StyleRules
} from "@material-ui/core/styles/withStyles";
import Grid from "@material-ui/core/Grid";


const styles = (theme: any): StyleRules => ({
    root: {
        ...
    }
});

interface PropsFromRedux extends React.Props<any> {
    ...
}

interface PropsFromParent extends React.Props<any> {
    ...
}

interface State {
    ...
}

class UserHomeTemplate extends React.Component<
    PropsFromRedux & PropsFromParent & WithStyles<typeof styles>,
    State
> {
    constructor(
        props: PropsFromRedux & PropsFromParent & WithStyles<typeof styles>
    ) {
        super(props);
        this.state = {
            ...
        };
    }

    render() {
        const { classes } = this.props;

        return (
            <Grid container justify="center">
                <Grid item xs={12} sm={7}>
                    ...
                </Grid>
            </Grid>
        );
    }
}

interface IStateToProps {
    ...
}
const mapStateToProps = (state: any) => ({
    ...
});

interface IDispatchToProps {
    ...
}
const mapDispatchToProps = (dispatch: any) =>
    bindActionCreators(
        {
            ...
        },
        dispatch
    );

// ここが原因
export default compose(
    withStyles(styles, { withTheme: true }),
    connect<IStateToProps, IDispatchToProps>(
        mapStateToProps,
        mapDispatchToProps
    )
)(UserHomeTemplate);
```

## 解決したコード

問題があったコードを以下に変更

```
export default connect<IStateToProps, IDispatchToProps>(
    mapStateToProps,
    mapDispatchToProps
)(withStyles(styles)(UserHomeTemplate));
```
Google Spreadsheetのセルに入っている値の型をGoogle Apps Scriptから確認

# 結論

* `getValues`で取得した値はスプレッドシート上での扱いに応じて`boolean`,`number`,`string`
* `getDisplayValues`で取得した値は表示される文字列が入るのですべて`string`
* ノートや式やフォーマットの指定は文字列なのですべて`string`
* 数値のフォーマットを変えても値の型は不変だが、値を変更する際の解釈が変わる

# 確認手順

## 1.セルを埋める 
縦1000行、横26列を適当に埋める。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15158/07c02447-53e6-b359-3334-de8c34618bee.png)

## 2.スクリプトを書く
getValues, getDisplayValues, getNumberFormats, getNotes, getFormulasで得られる2x2配列の中に入っている値の型をtypeofで調べてカウントする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15158/158fd8e1-cc3a-50d6-80a1-85efe232bdc9.png)

## 3.実行してログを確認
GASで伝統的に使われてきた`Logger`じゃなくて`console.log`に出力するようにしたので、G Suite Developer Hubでログを確認する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15158/da02098e-2df0-5e1e-20df-355b3da30acf.png)

# 数値のフォーマット
数値のフォーマットにはAutomaticとPlain Textがある。これを切り替えてもすでに入力されている値の型は影響を受けない。`boolean`や`number`もそのままである。しかし値を変更する際には影響を受ける。例えばAutomaticとなっているときにtrueとタイプすれば`boolean`として解釈されるが、Plain Textとなっているときにtrueとタイプしてもただアルファベット4文字からなる`string`として解釈される。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15158/44b697a6-1ca1-c967-865f-81610249ecae.png)
vue-chartjsでレーダーチャートの目盛などを変更する方法

時間があるときにちゃんとまとめる（ほんとか？）が、取り急ぎメモ程度に。
ドキュメントが全然なくて苦戦しました。

設定項目は分かりやすくまとめたいと思います。
以下の記事も参考になります。
https://qiita.com/muuuuminn/items/2e977add604dcec920d3

```js

chartOption: {
        scale: {
          ticks: {
            label: false,
            min: 0,
            max: 10,
            fixedStepSize: 2,
            showLabelBackdrop: false,
            fontSize: 0,
            color: '#eee',
          }
        },
      },
```
CIFAR-10の画像を変換してみる

CIFAR-10の画像を変換してみたという話

#CIFAR-10とは
airplane(飛行機)，automobile(自動車)，bird(鳥)，cat(猫)，deer(鹿)，dog(犬)，frog(蛙)，horse(馬)，ship(船)，truck(トラック)のいずれかが写っているサイズが32x32のカラー画像を集めたデータセットのこと．[こちら](https://www.cs.toronto.edu/~kriz/cifar.html)からダウンロードできる．

###内容確認
CIFAR-10 python versionをダウンロードし解凍する．中身は以下の通り

```
cifar-10-batches-py
├── batches.meta  
├── data_batch_1  // training data 1
├── data_batch_2  // training data 2
├── data_batch_3  // training data 3
├── data_batch_4  // training data 4
├── data_batch_5  // training data 5
├── readme.html
└── test_batch    // testing data
```

#####batches.meta
```
{b'num_vis': 3072, b'num_cases_per_batch': 10000, b'label_names': [b'airplane', b'automobile', b'bird', b'cat', b'deer', b'dog', b'frog', b'horse', b'ship', b'truck']}
```


#####data_batch
すべて表示すると長くなるためキーだけ表示している．

```
dict_keys([b'filenames', b'data', b'batch_label', b'labels'])
```

- data - 10,000x3,072の配列．配列の各行には32x32のカラー画像が格納されている．
- labels - 0から9の範囲の10,000個の数字のリスト．数字の値はbatches.metaファイルのlabel_names配列のインデックスを表している．つまり，0なら飛行機の画像である．


#画像の描画
まずは，画像を描画してみる．

```Python:drawing.py
import numpy as np
import matplotlib.pyplot as plt 

def unpickle(file):
    import pickle
    with open(file, 'rb') as fo: 
        dict = pickle.load(fo, encoding='bytes')
    return dict

X = unpickle("./data_batch_1")[b'data']
X = X.reshape(10000, 3, 32, 32).transpose(0,2,3,1).astype("uint8")

plt.imshow(X[0])
plt.show()
```

このプログラムを解凍先のディレクトリで実行する．
実行結果は以下の通り．ちなみにこれは蛙の画像である．
<img src="http://drive.google.com/uc?export=view&id=1IiYEoNUeRtl1y8t5HQoOUyFJg8DI9nE5">

#画像の変換
次に画像の変換を行ってみる．

```Python:convert.py
import numpy as np
import matplotlib.pyplot as plt
from PIL import Image

def unpickle(file):
    import pickle
    with open(file, 'rb') as fo:
        dict = pickle.load(fo, encoding='bytes')
    return dict

X = unpickle("./data_batch_1")[b'data']
#(10000, 3072) => (10000, 3, 32, 32) => (10000, 32, 32, 3)
X = X.reshape(10000, 3, 32, 32).transpose(0,2,3,1).astype("uint8")

img = Image.fromarray(X[0])

#元の画像を保存
img.save('./a.png')

#画像を拡大
img_resize = img.resize((224,224))
img_resize.save('./b.png')

#グレイスケール
img_gray = img_resize.convert("L")
img_gray.save('./c.png')

#2値化
#230より下は0になる．
img_2 = img_gray.point(lambda x: 0 if x < 230 else x)
img_2.save('./d.png')

#回転
img_roll = img_resize.rotate(90, expand=True)
img_roll.save('./e.png')
```

実行結果は以下の通り

| 処理 | 出力画像 |
|:--:|:--:|
| 元画像 | <img src="http://drive.google.com/uc?export=view&id=140XeC9CoNZi9XRrJRE-SE6hb1_rHrkry"> |
| 拡大 | <img src="http://drive.google.com/uc?export=view&id=1mw7CgOo9gNbhnimn8Zq_dGt39-rmWN9V"> |
| グレイスケール | <img src="http://drive.google.com/uc?export=view&id=1f1MQaBJ7VCNmXa26KR3n-BewNv8hHwd7"> |
| 2値化 | <img src="http://drive.google.com/uc?export=view&id=1kQVhxe5JtOuxEmw9FNGwQRTwQEuNJFw7"> |
| 回転 | <img src="http://drive.google.com/uc?export=view&id=1LWzSQ5mlZ23z3RWEV0aHoVY3_SHCaaAN"> |


#参考
[TensorFlow_CNN_3](https://spwhite1337.github.io/Portfolio/Projects/TensorFlow_CNN/)
[PIL/Pillow チートシート](https://qiita.com/pashango2/items/145d858eff3c505c100a)
Macのログイン画面に管理者(Admin)のアカウントしか出てこないとき

表題の通り、Macのログイン画面に管理者(Admin)のアカウントしか出てこないときの対応です。

## FileVaultの許可ユーザーを設定 (99%これで解決)

1. システム環境設定 -> セキュリティ -> FileVaultのタブにアクセス
2. 左下の鍵マークを選択し、管理者パスワードを入力
3. 許可されていないユーザーがあります的なボタンが出てくるので、それを押してそのユーザーのパスワードを入力

## IsHidden要素を設定

ユーザーに設定されているIsHidden要素が1だとログイン画面に出てこないらしい。

1. Terminal.appで下記コマンドを実行。

    ```bash
    sudo dscl . create /Users/(ユーザー名) IsHidden 0
    ```
2. （変更確認方法） Terminal.appで下記コマンドを実行

    ```bash
    dscl . -read /Users/_(ユーザー名)
    ```

参考
[macOS でユーザアカウントを非表示にする \- Apple サポート](https://support.apple.com/ja-jp/HT203998)

## 適当なユーザーを作って削除

よく分からんが自分の場合はこれで解決

1. 適当なユーザーを作成する
2. 再起動してログイン画面に表示したいユーザーと作成したユーザーが出ることを確認
3. 作成したユーザーを削除
vue-chartjsでチャートを中央配置する方式

vue-chartjsでチャート(グラフ）を中央配置（中央寄せ）するのに苦戦したので、備忘として残しておきます。

デフォルトでは左寄せされます。
responsiveをtrue（デフォルトではtrue)にしている場合は気にならないですが、falseにした場合にはこれを中央寄せしたいです。

## やりたかったけどできなかった方法
`<canvas>`に直接`margin:auto`を指定する。
これを指定してあげれば中央寄せができるのですが、vue-chartjsからは<canvas>のstyleを直接指定できなさそうなので断念しました。

## 実現できた方法
html側でcomponentを記述する際にstyle属性に`display:flex`と`justify-content:center`を指定することで中央寄せができました。

例)

```html
<radar-chart :chartData="chartData" :options="chartOption" :styles="{'display':'flex', 'justify-content':'center'}"></radar-chart>
```

チャートが展開されると`<canvas>`が`<div>`に囲われます。sytle属性で指定するとこのdivにstyleが適用されます。

vueのtemplateは1つのroot要素が必要ですが、`<canvas>`要素はroot要素になれないため`<div>`で囲んでいるそうです[^1]。




[^1]: https://github.com/apertureless/vue-chartjs/issues/70
プログラミング初心者がProgate PHPⅠを終えてつまづいたところ

#はじめに

[未来電子テクノロジー](https://www.miraidenshi-tech.jp/intern-content/program/)でインターンに参加している、tomokiyo_hiromuです。
今回は、Progate PHPIを終えてつまづいたところを発信しようと思います。

#foreach文について
foreach文には、先頭のデータから繰り返し処理を行うものです。
ここでは、配列に含まれる要素だけが繰り返し処理されます。
命令、forやwhileのように繰り返しを終了させる条件式がありません。


#戻り値と引数について
勉強中に定義をきちんと理解できなかったので、確認の意味も込めてここで整理したいと思います。
引数とは、関数に渡す値のことです。
戻り値とは、関数の命令を実行して返された結果の事を言います。
引数をひとつ決めておくと、値を変えても計算結果を簡単に出すことができます。
見た目もスッキリするし、複雑な処理をシンプルにしてくれるメリットがあるんですね。


#まとめ
PHPを学習するようになってから、専門用語が増えたので理解するのが大変になりました。
ひとつずつ覚えるのも大切ですが、実際に手を動かしながら覚えていきたいと思います。
プログラミング初心者であるため、内容に誤りがあるかもしれません。
もし、誤りがあれば修正するのでどんどん指摘してください。
最後まで読んでいただき、ありがとうございました。
【.NET Framework】supportedRuntime要素のsku属性について

# はじめに

.NET Frameworkはビルド時のバージョンと実行時のバージョンが異なっても
app.exe.configに以下の追記をすれば動作できるようになっています。

```xml:app.exe.config
<startup useLegacyV2RuntimeActivationPolicy="true|false" > 
    <supportedRuntime version="runtime version" sku="sku id"/>  
</startup>
```
※互換性の問題は当然アプリ側で考慮（検証）が必要です。

versionやskuに設定できる値等は公式ドキュメントをみていただくとして、
v4.0のときのskuの設定値について備忘録のために記載します。

[supportedRuntime要素](https://docs.microsoft.com/ja-jp/dotnet/framework/configure-apps/file-schema/startup/supportedruntime-element#sku)


# なぜv4.0なのか

前提として.NET Framework4.5以上はインプレース更新となるため、
4.5以降は同居できないものと想定しています。


[.NET Framework のバージョンおよび依存関係](https://docs.microsoft.com/ja-jp/dotnet/framework/migration-guide/versions-and-dependencies)

> .NET Framework 4.5 はコンピューターの .NET Framework 4 を置き換えるインプレース更新であり、.NET Framework 4.5.1、4.5.2、4.6、4.6.1、4.6.2、4.7、4.7.1、4.7.2 は .NET Framework 4.5 のインプレース更新です。つまり、同じバージョンのランタイム バージョンを使用しますが、アセンブリのバージョンが更新され、新しい型とメンバーが含まれます。 

同居ができないのにsku属性はなぜ必要なのかと思ったのがきっかけです。
（結局常に最新をみるのでは？）


# 結論

versionがv4.0の場合のskuは最低バージョンとなるようです。

例えば、sku=".NETFramework,Version=v4.7.2"と記載すると、
4.6.2までしか入っていないと起動時にメッセージが表示されます。

```xml:app.exe.config
<startup useLegacyV2RuntimeActivationPolicy="true" > 
    <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.7.2"/>  
</startup>
```

自端末には既に4.7.2がインストールされていたので、
適当に4.8とかに記載してみたところ以下のようなメッセージが表示されました。

ちなみに「はい（Y）」を選択するとMSのサイトに飛ばされます。
（4.8だと4.7.2のインストールサイトに飛ばされました）

> hoge.exe - This application could not be started.
> 
> This application requires one of the following versions of the .NET Framework:
>  .NETFramework,Version=v4.8
> 
> Do you want to install this .NET Framework version now?
> 
> はい(Y)   いいえ(N)   


バージョン指定できるので、
一瞬過去バージョンでも動作できるのかと迷ってしまいましたが、
インプレース更新ということを思い出して納得しました。
スタート タイルに IE を含むカスタム済みレイアウトを設定するとアイコンが消失する

# このドキュメントの要旨

Windows 10 のスタート画面はレイアウトをカスタマイズできます。そのため、カスタム済みレイアウトを作成し、そのテンプレートを標準化する企業は多いと思います。
しかし、タイルに Internet Explorer が設定されているカスタム済みレイアウトを指定していると、本来 Internet Explorer アイコンが表示されるべき場所が空白になってしまうという事象が報告されています。このような状況は、企業環境において問題となりかねません。
そこで、本ドキュメントでは、その問題について解決方法及びその原因を説明します。

# スタート画面から Internet Explorer が消えた場合の対処方法

まず、レイアウトが記載されている xml ファイルをテキスト エディターで開きます。
続いて Internet Explorer のレイアウト記述を検索します。大抵の場合、以下のように記述されています。

```
<start:DesktopApplicationTile Size="2x2" Column="0" Row="0" DesktopApplicationLinkPath="%APPDATA%\Microsoft\Windows\Start Menu\Programs\Accessories\Internet Explorer.lnk" />
```

該当の記述を以下のように修正します。

```
<start:DesktopApplicationTile Size="2x2" Column="0" Row="0" DesktopApplicationID="Microsoft.InternetExplorer.Default" />
```

# スタート画面から Internet Explorer が消えてしまう原因や条件

Windows 10 1703 以降の環境において、インストールされていないアプリケーション向けのタイルが含まれている場合に、本事象が発生するようです。

> [スタート画面のレイアウトのカスタマイズとエクスポート (docs.microsoft.com)](https://docs.microsoft.com/ja-jp/windows/configuration/customize-and-export-start-layout)
> Windows 10 バージョン 1703 では、スタート画面のレイアウトに、後でレイアウトが適用されるデバイスにインストールされていないアプリのタイルが含まれている場合、それらのアプリのタイルは空になります。 空のタイルは、次回ユーザーがサインインするまで維持されます。サインインしたときに空のタイルは削除されます。 一部のシステム イベントによって、次回のサインインの前に空のタイルが削除されることがあります。

補足すると、Internet Explorer のショートカットは、ユーザー プロファイル上にあります。そのため、初回ログオン時はプロファイルに Internet Explorer のショートカットが生成されておらず、上記条件に合致してしまうために発生すると考えられます。少なくとも事象は以下のような条件で再現します。

- スタート画面のカスタマイズ時点で Internet Explorer へのショートカットが利用できないと事象が発生する。(ユーザーの初回ログオン時等)
- スタート画面のカスタマイズ時点で Internet Explorer へのショートカットが利用できると事象は発生しない。 (ユーザーの二度目以降のログオン時等)

そして、本事象は DesktopApplicationID を指定することで回避できるとあります。

> [Windows 10 デスクトップ エディションのスタート画面のレイアウト XML (リファレンス) (docs.microsoft.com)](https://docs.microsoft.com/ja-jp/windows/configuration/start-layout-xml-desktop)
> Windows 10 バージョン 1703 のスタート画面のレイアウトでは、グループ ポリシーまたは MDM を使用してスタート画面のレイアウトを適用しており、アプリケーションがユーザーの初回サインイン以降にインストールされている場合は、DesktopApplicationLinkPath ではなく、DesktopApplicationID を使用してください。




# スタート画面のカスタマイズ方法

最後に、スタート画面のカスタム済みレイアウトを作成する方法と、そのレイアウトを設定する方法を紹介します。


カスタム済みレイアウトは xml ファイル形式で作成できます。書式には規程がありますが、現在のレイアウトを xml ファイル形式で出力すると、そのサンプルを入手できます。
Windows 10 1809 の場合、以下の PowerShell Cmdlet で現在のレイアウトを出力できます。

```
Export-StartLayout -UseDesktopApplicationID -Path layout.xml
```

なお、-UseDesktopApplicationID パラメーターは Windows 10 1809 より前の OS では対応していないようです。

入手した xml ファイルは必要に応じてカスタマイズできます。ショートカットを修正したい、環境変数を利用したいといった場合はこの工程で変更してください。

続いて、作成した xml ファイルをコンピューターの任意のフォルダーに保存します。

最後に、グループ ポリシーでこの xml ファイルを指定します。指定は「スタート画面のレイアウト」ポリシーで行えます。ポリシーはコンピューターとユーザーの両方で設定できます。具体的な場所はこちらです。

- [コンピューターの構成]\\[管理用テンプレート]\\[タスク バーと [スタート] メニュー]
- [ユーザーの構成]\\[管理用テンプレート]\\[タスク バーと [スタート] メニュー]

本手順についてはこちらで画像付きで紹介されています。併せてご参照ください。
[Windows10 Proでスタート画面とタスクバーをカスタマイズする方法（GPO使用） (qiita.com)](https://qiita.com/a_o_i_k_o/items/d333a49528c9481ba139)


# 参考文献

[Win10　スタート画面タイルがGP適用後消えてしまう (social.technet.microsoft.com)](https://social.technet.microsoft.com/Forums/ie/ja-JP/5ff40149-f8a6-4ce1-9c25-b5bf82771204/win10-gp?forum=win10itprogeneralJP)
[カスタマイズしたスタート画面から消えたタイルを復活させる方法 (qiita.com)](https://qiita.com/a_o_i_k_o/items/f07bb276bffa494e77fa)
manコマンドをテキストファイルに出力

Web上のmanページが環境に合っているのか分からないので、計算機のman結果をWindowsで読める様にして展開することがそこそこあります。

単純に書くなら以下。
最近はcolコマンドで制御文字抜かなくても大丈夫みたいですけど一応。

```
man AAA | col -bx | > BBB
```

自分は一々長いコマンドを打つのが面倒なので~/.bashrcに以下のシェル関数を追加しています。
ついでに引数でセクションを選択出来る様にしてます。

```
function man2txt
{
    if [ $# = 1 ]; then
        man $1 | col -bx > ${1}.man
    elif [ $# = 2 ]; then
        man $1 $2 |col -bx > ${2}_${1}.man
    else
        echo "ex)man2txt [section] word"
    fi
}
```
laravelのタグシステム

# やりたいこと

- `$post->tags`で記事につけられたタグをすべて取りたい
- `$tag->posts`でタグが付いている記事をすべて取りたい

## 環境
laravel5.8

# 必要なマイグレーションとモデルを作成
ポストのマイグレーションとモデルを作成

```
php artisan make:model Post -m
```

タグのマイグレーションとモデルを作成

```
php artisan make:model Tag -m
```

中間テーブルはマイグレーションのみ作成

```
php artisan make:migration create_post_tag_table --create=post_tag
```

## マイグレーションの編集
ポストのマイグレーション

```
class CreatePostsTable extends Migration
{
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('name'); // 追加
            $table->string('body'); // 追加
            $table->softDeletes(); // 追加
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('posts');
    }
}
```

タグのマイグレーション

```
class CreateTagsTable extends Migration
{
    public function up()
    {
        Schema::create('tags', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('name'); // 追加
            $table->softDeletes(); // 追加
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('tags');
    }
}
```

中間テーブルのマイグレーション

```
class CreatePostTagsTable extends Migration
{
    public function up()
    {
        Schema::create('post_tag', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->integer('post_id'); // 追加
            $table->integer('tag_id'); // 追加
            $table->softDeletes(); // 追加
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('post_tag');
    }
}
```

## モデルの編集

ポストモデル

```
class Post extends Model
{
    protected $table = 'posts';

    public function tags()
    {
        return $this->belongsToMany(App\Tag::class);
    }
}
```

タグモデル

```
class Tag extends Model
{
    protected $table = 'tags';

    public function post()
    {
        return $this->belongsToMany(App\Post::class, 'post_tag', 'tag_id', 'post_id');
    }
}
```

## あとは

- `php artisan migrate`をする
- 3つのテーブルにデータを入れる
AWS Batch

# 特徴
- AWS上でバッチ処理を実行・管理するフルマネージドサービス
- ジョブ定義（実行内容やインスタンスの種類など）を設定すると、自動でインスタンスを確保して実行する
- 自分が用意したインスタンスを使用することも可能(アンマネージド)
- 並列実行（配列ジョブ）可能
- ジョブの依存関係の指定が可能
- ジョブの再試行可能

# ジョブ定義
使用するdockerイメージと実行するコマンドを指定するだけ

# ジョブキュー
ジョブと実行環境の紐付け。自動でインスタンスを確保するか自前のインスタンスかを選ぶ。


# 実行
ジョブ定義とジョブキューを指定して登録する
配列ジョブにするにはここで指定してやる

定期実行はCloudWatchイベントをトリガーとしてジョブを送信する機能があるのでそれを使う
VSCodeにcodicの拡張を入れて変数名を考えてもらっちゃおう大作戦

自分はよく変数などの命名に困ったときに[codic](https://codic.jp/)というサービスを利用しているのですが、

VSCodeの拡張機能を追加したら捗りんぐでしたのでみなさんも追加してみましょう!



### 1. トークンの取得

<img width="941" alt="スクリーンショット 2019-04-18 11.45.51.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/ab5967bd-fa2b-7357-7c43-1f62dee5a8ff.png">


ユーザー登録を済ませて適当なプロジェクトを登録するとサイドバーのAPIからトークンが確認できるので控えておきませう。



### 2. 拡張機能のついか

<img width="727" alt="スクリーンショット 2019-04-18 11.43.30.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/32ff47c6-3417-d588-3bd1-41abda74bcb5.png">

VSCodeの拡張機能の検索ボックスでcodicと入れれば出てくるのでポチッと押してくださいな



### 3. トークンを設定

`⌘,`とかで設定を開いてcodicと調べればトークン入れるとこがあるので貼り付けましょう。

<img width="524" alt="スクリーンショット 2019-04-18 11.44.02.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/7c0fff89-10b3-432f-f0dd-94c8c63c1392.png">

<img width="1061" alt="スクリーンショット 2019-04-18 11.44.29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/c2d68319-9acd-3cde-228f-a63e92f38155.png">




### 4. 使ってみよう

コマンドパレット(`Shift+⌘+P`)をひらいてcodicとかTranslateとか入れればつかえますー
<img width="712" alt="スクリーンショット 2019-04-18 11.49.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/04cf7293-ea58-50c3-d755-a98a6268a417.png">
<img width="721" alt="スクリーンショット 2019-04-18 11.51.21.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/2899f827-8c61-4b4f-54f9-ed9584168ac4.png">

あとは選択していけば自動入力してくれます

<img width="724" alt="スクリーンショット 2019-04-18 11.51.35.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/08e98228-6bce-b417-76be-d4a52f774abd.png">
<img width="721" alt="スクリーンショット 2019-04-18 11.52.06.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/1a1bb138-782c-31be-3a5d-9db93b92fe9a.png">
<img width="297" alt="スクリーンショット 2019-04-18 11.52.10.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/193857/cbd8a253-0e52-52a8-113a-6f31e695a7ac.png">


スネークケースとかにもパレットから変えられるのでいろいろいじってみてくださいな。
GitLabにPushしようとすると、Access Denied されるときの対処法

# 症状

GitLab上のリモートリポジトリにpushしようとしたところ、Access Deniedというメッセージが出て、push出来なかった。

####環境
筆者はSourcetreeを使っている。

# 対処法
1)
https://qiita.com/mcddx330/items/8d36108553030071f403
以上の記事を参考にする

2) それでも出来ない時
GitLab上で、PrivateAccessTokenを作る。