OmniAICreator/Qiita-1.07M huggingface dataset:
CircleCIのメンテナンスを事前に知る

数か月前、CircleCIで深夜に動作するスケジューリングをしたビルドが動いていなかったことが発覚した。デプロイ先が商用環境であったため、少し問題になった。

本件について問い合わせた結果、CircleCIはメンテナンスに入っており、該当の時間帯にビルドが動作しなかったそうだ。該当のものは以下URLです。
https://discuss.circleci.com/t/database-maintenance-saturday-jan-23-2021/38519

中の人にご確認したところ、CircleCIのメンテナンス情報含め中の人からの周知は以下URLでチェックしてくださいねとのことでした。先ほどの通知は12月に出ています。商用でSaaS型のCircleCIを利用している方は定期的にチェックすることを推奨します。
https://discuss.circleci.com/c/announcements/

このようなメンテナンスが今後もあり、商用環境への同様の処理がスケジュール通りに実施されないと問題になるという結論になり、弊チームは先の処理をサーバレスファンクションに引っ越すことにした。CircleCIは優秀なプラットフォームという認識はかわらないですが、この辺もケアして可用性向上していただけると大変助かるなぁ　というのは独り言です

最後に自己紹介
普段は某IT企業でDevOpsエンジニアをやっています。
ジャズピアニスト・キーボーディストもやっています。

主なリリースは以下です
http://www.ultra-vybe.co.jp/post/SAGA-0001
https://www.wasei.tokyo/after-hours

またCircleCIで知っているとちょっと幸せになれることをメモしていこうと思います。

以上
Python PyAutoGUIを使ってスクリーンショット

# Python PyAutoGUIを使ってスクリーンショット

## PyAutoGUIをインストール

https://github.com/asweigart/pyautogui

```
pip install pyautogui
```

## スクリーンショット

```
import pyautogui


def main():
    # 全体
    screenshot = pyautogui.screenshot()
    screenshot.save("/tmp/samp1.png")
　　
    # 範囲指定
    screenshot = pyautogui.screenshot(region=(100, 200, 1500, 875))
    screenshot.save("/tmp/samp2.png")


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

## 結果

*全体*
![samp1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59264/f0040dee-d6f8-ac79-520d-a12bbe08e516.png)
*範囲指定*
![samp2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59264/43cee885-27a2-fa51-6b12-0108a3ddc77e.png)

---

いいね！と思ったら LGTM お願いします :clap::clap::clap:

【PR】プログラミング新聞リリースしました！ → https://pronichi.com
【PR】週末ハッカソンというイベントやってます！ → https://weekend-hackathon.toyscreation.jp/about/
Python PyAutoGUIを使って自動マウス操作

# Python PyAutoGUIを使って自動マウス操作

## PyAutoGUIをインストール

https://github.com/asweigart/pyautogui

```
pip install pyautogui
```

## マウス移動

### 相対座標移動

現在の場所から指定したピクセル分、マウスを動かす方法
`duration=5`は5秒かけて移動
tweenも設定可能
easeOutQuad・・・最初を遅く、最後を早く
easeInOutQuad・・・最初と最後を早く、道中は遅く
easeInBounce・・・最後に跳ね返る
easeInElastic・・・最後にゴムバンドのような動き


```Python
import pyautogui


def sample1():
    p = pyautogui.position()
    print(p)
    pyautogui.moveRel(500, 500, duration=10, tween=pyautogui.easeOutQuad)
    p = pyautogui.position()
    print(p)


if __name__ == "__main__":
    sample1()
```

```
Point(x=523, y=282)
Point(x=1023, y=782)
```

### 絶対座標移動

備考：Macで絶対座標を調べるには Shift + command + 4で取得可能

```Python
import pyautogui


def sample2():
    p = pyautogui.position()
    print(p)
    pyautogui.moveTo(500, 500, duration=10)
    p = pyautogui.position()
    print(p)


if __name__ == "__main__":
    sample2()
```

```
Point(x=528, y=407)
Point(x=500, y=500)
```

## クリック

x, y：絶対座標
clicks：クリック回数
interval：間隔
button: 押すボタン、right、middleで右、中央クリック

下の例は座標700:700で1秒間隔で5回、左クリック

```Python
import pyautogui


def sample3():
    p = pyautogui.position()
    print(p)
    pyautogui.click(x=700, y=700, clicks=5, interval=1, button='left')
    p = pyautogui.position()
    print(p)


if __name__ == "__main__":
    sample3()
```

```
Point(x=555, y=416)
Point(x=700, y=700)
```

ダブルクリック

```Python
pyautogui.doubleClick()
```

他にも沢山機能はあるのでドキュメントを参考してください

---

いいね！と思ったら LGTM お願いします :clap::clap::clap:

【PR】プログラミング新聞リリースしました！ → https://pronichi.com
【PR】週末ハッカソンというイベントやってます！ → https://weekend-hackathon.toyscreation.jp/about/
【初心者でもわかる】text-shadowよりも大きな影文字を作る方法

#どうも7noteです。text-shadowは大きさを変えれないので他の方法で文字に大きな影をつける。

text-shadowでは作れないような大きなサイズのテキストの影を作る方法を解説していきます。
**この記事ではtext-shadowは使いませんのでご注意ください。**

![sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/1f445f68-377e-e02d-c939-fcf3afc6d77d.png)


## 作り方

```index.html
<h2>NEWS<span>NEWS</span></h2>
```

```style.css
h2 {
  position: relative;  /* 基準位置とする */
  text-align: center;  /* 文字を中央揃えにする */
}

h2 span {
  font-size: 2.4em;   /* フォントサイズを2.4倍に指定 */
  color: #444;        /* 文字色をグレーに指定 */
  opacity: .7;        /* 透明度を0.7に指定 */
  position: absolute; /* 相対位置にする */
  top: -50px;         /* 上方向に適度にずらす */
  left: 50%;          /* 左から50%の位置に指定 */
  transform: translateX(-50%);  /* 要素の半分だけ左に移動 */
  z-index: -1;        /* 背面に移動 */
}
```

## 解説

タイトルにもありますが、**text-shadowで設定できるのは「縦位置・横位置・広がり・色」の4つだけ**です。
テキストに縁取りをする程度で1px太くするくらいならtext-shadowでできますが、今回のように**大きな文字を作るとなると、text-shadowでは難しい(不可能)**です。

なので今回は影用の文字を用意して、半透明にすることで影っぽさを表現しています。


## まとめ

box-shadowなら大きさを指定できるのですが、text-shadowはなぜできないんでしょうね？謎ですね。いつか実装されればよいですが、それまではこの方法が良さそうです。

SEOの事を考えれば同じ文字が2回繰り返しているのはどう影響するかわからないので、一つ一つにクラス名をつけて擬似要素で影を作ってあげる方が無難かも。

```index.html
<h2 class="news">NEWS</h2>
```

```style.css
.news {
  position: relative;  /* 基準位置とする */
  text-align: center;  /* 文字を中央揃えにする */
}

.news::before {
  content: "NEWS";    /* 影にするテキストを指定 */
  font-size: 2.4em;   /* フォントサイズを2.4倍に指定 */
  color: #444;        /* 文字色をグレーに指定 */
  opacity: .7;        /* 透明度を0.7に指定 */
  position: absolute; /* 相対位置にする */
  top: -50px;         /* 上方向に適度にずらす */
  left: 50%;          /* 左から50%の位置に指定 */
  transform: translateX(-50%);  /* 要素の半分だけ左に移動 */
  z-index: -1;        /* 背面に移動 */
}
```

![sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/661092/998dab63-4979-2f40-e811-8ba6efa7cf16.png)


#### おそまつ！
~ Qiitaで毎日投稿中!! ~
[【初心者向け】WEB制作のちょいテク詰め合わせ](https://qiita.com/7note)
SQLを学んでみた①(基本的な命令文)

実務でSQLやDBについて理解していないといけないと思い勉強を始めました。
その内容をまとめます。

## DB(データベース)

例えば電話帳とかも広い意味でDBですよね。
様々なデータを管理する目的で蓄積したものをDBと言います。

## RDB(リレーショナルデータベース)

現在広く使われているデータ管理の種類。
複数の表の形式でデータを管理します。
Excelの表みたいなイメージですね。
その表1つ1つをテーブルといい、列(カラム)と行で構成されます。
下記は例です。
出席番号や名前をカラムといい、それに対しての情報1つ1つが行です。

![スクリーンショット 2021-03-16 13.20.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1051152/e33a35a6-a7db-56d8-a9f0-5ffefc709dad.png)

こんな感じの表にSQLを使ってデータを書き換えたりすることができます。


## DBMS(データベースマネージメントシステム)

SQL→DBでデータが書き換わるのではなく
SQL→DBMS→DBとDBMSを通すことで処理をすることができるようになっています。


## RDBMS(リレーショナルデータベースマネジメントシステム)

DBMSのうち、複数の表の形式てデータの取り扱いを行うものをさします。
例えば、MySQLやPostgreSQLもRDBMSです。


## SQLの使い方


- SELECT
- FROM

`SELECT カラム名`でどのカラムのデータが欲しいか指定します。
`FROM テーブル名`でテーブル名を指定します。

```
例：SELECT 身長 FROM 管理簿
```
もし全てのカラムを取得したい場合は`SELECT * FROM 管理簿`で取得できます。

- WHERE

`WHERE 条件`でさらに条件を絞ってデータを取得することができます。
下記の例では身長が100より高いデータを名前と身長のみのデータで出すことができます。

```
例：SELECT 名前, 身長 FROM 管理簿 WHERE 身長 > 100
```

- INSERT INTO
- VALUES

`INSERT INTO テーブル名`でデータの追加を指示します。
`VALUES (データ内容)`で追加したいデータの中身を書く事でデータを追加することができます。

```
例：INSERT INTO 管理簿 VALUES (6, '関口', 'セキグチ', 95, 25)
```

- UPDATE
- SET

`UPDATE テーブル名`で更新したいテーブルを指定します。
`SET カラム名 = データ`で更新データを入力します。

```
例：UPDATE 管理簿 SET 身長 = 90 WHERE 名前 = 佐藤
```

- DELETE

`DELETE FROM テーブル名`で行を削除することができます。

```
DELETE FROM 管理簿 WHERE 名前 = '関口'
```


何となく分かってくるとパズルみたいで面白いですね。


## 書き方のルール

例えば以下のように横一列でも

```
SELECT 身長 FROM 管理簿
```

以下のように改行しても同じ意味になります。

```
SELECT 身長
FROM 管理簿
```

見やすいのは改行の方ですかね。

ちなみに違うSQL文を続けて入力するときは`;`を入れることで区切りになります。

```
SELECT 身長
FROM 管理簿;　//ここまでで終了
DELETE 管理簿; //ここまでで終了
```

SELECTやFROMなどの単語は大文字で書くことが慣習的に決まっているみたいですが、
どちらでも同じように動作するみたいです。

そのプロジェクトや職場によって変えるようですね。
なるほどなぁ。

以上です。
CSSについて

本日は、CSSの基礎の部分を記事にまとめてみたい
と思います。

### CSS
ブラウザに映す情報を決める言語がHTML。
HTMLに装飾を加えるための言語がCSS。
HTMLで作った骨組みに肉付けをしていく感じ。

```HTML
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>テストサイト</title>
  </head>
  <body>
    <h1>
      見出し
    </h1>
    <p>
      段落①
    </p>
    <p>
      段落②<b>この部分は太字になります。</b>
    </p>
     <a href="https://www.google.com/">クリックすると、Googleへ移動します。</a>
  </body>
</html>
```
上記のHTMLにCSSで装飾していく。

### head要素からCSSを呼び出す
まず、上記のファイルにCSSファイルを呼び出す記述を行う。

```HTML
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>テストサイト</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>
      見出し
    </h1>
    <p>
      段落①
    </p>
    <p>
      段落②<b>この部分は太字になります。</b>
    </p>
     <a href="https://www.google.com/">クリックすると、Googleへ移動します。</a>
  </body>
</html>
```

```html
<link ①rel="stylesheet" ②href="style.css">
      (①参照先のファイルとの関係性)（②参照先のファイルの場所）
```

■link要素
link要素は現在のファイル（HTML）から外部情報（今回であればCSSファイル）を関連付けする際に記載する。rel属性、href属性と一緒に使用するのが一般的。

■rel属性
rel属性は、参照先のファイルが現在のファイルとどのような関係であるのかを明らかにする。
属性値には決められたキーワードを記載。
今回は”stylesheet”というキーワードを指定することでCSS（Cascading Style Sheets）を参照することを表している。

■href属性
href属性は、参照先の外部ファイルの場所。
属性値には、ファイル名を記載する。

### CSSの記述について

```css
①.body {
 ②background-color:③red;
}
①セレクタ ②プロパティ ③値
```
■セレクタ
セレクタとは、CSSによる装飾を、どの部分のHTMLに適用するかを選択するための記述。

■プロパティ
プロパティとはセレクタで指定したHTMLの「何を変えるのか」を選択するための記述。

■値
プロパティで設定する内容を決めるための記述。プロパティと値の間はコロン（ : ）で区切り、値の後にはセミコロン（ ; ）を入力する。

上記のコードの意味は、bodyセレクタの背景色を赤色に変えると言うもの。
このように、背景色、文字色、文字サイズ、要素同士の余白など様々なプロパティが
用意されていて変えることができる。

### class属性とclassセレクタについて

```html
```HTML
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>テストサイト</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>
      見出し
    </h1>
    <p>
      段落①
    </p>
    <p>
      段落②<b>この部分は太字になります。</b>
    </p>
     <a href="https://www.google.com/">クリックすると、Googleへ移動します。</a>
  </body>
</html>
```
上記のコードの段落①と段落②は同じp要素だが、段落①の部分だけ装飾したい場合。
class属性とclassセレクタが登場する。

■class属性
class属性とはHTML要素に対して個別に名前を指定することができる属性。
class属性の属性値をclass名という。

```html
<p ①class=②"first-message">
  段落①
</p>
①class属性 ②class名
```
class名をセレクタと指定して、装飾することができる。

■classセレクタ
HTMLで指定したclass名をCSSのセレクタとして使用することができる。classセレクタを指定する場合は、「.クラス名」の形でCSSファイルに記述する。

```css
.first-message {
  color: red;
}
```
これで、段落①だけがの文字色が赤色になった。
classセレクタを使うことによって、特定のHTMLだけに装飾をすることができる。
つまり、要素に名前をつけてあげることによって、その名前の部分だけを装飾できる
ようになると言うこと。

### id属性とidセレクタについて
class属性とclassセレクタの他にも、特定の要素を装飾する方法がある。
それが、id属性とidセレクタ。

■id属性
id属性とは特定のHTML要素のみに対して、名前を指定することができる属性。
id属性の属性値をid名という。
id属性には「1つのページ内で、同じid名を複数のHTML要素に付与しない」という慣例が存在する。ブラウザに関連する他の言語が、想定した挙動にならない場合があるためとのこと。
「1つのページ内には、同じid名を持つHTML要素が存在しない」ように命名を気をつける。

```html
<p ①id=②"second-message">
  段落②
</p>
①id属性(属性) ②id名(属性値)
```
CSSではid名をセレクタと指定して、装飾することができる。

■idセレクタ
HTMLで指定したid名をCSSのセレクタとして使用することができる。idセレクタを指定する場合は、「#id名」の形でCSSファイルに記述する。

```css
#second-message {
  color: blue;
}
```
idセレクタを使うことによって、特定のHTMLだけに装飾をすることができる。
classセレクタは「.」、idセレクタは「#」を先頭につける。

以上がCSSの基礎の中の基礎部分。
色々な用語が出てきて頭が混乱しますね。
探索的データ解析（EDA）のためのautovizを試してみた

* 製造業出身のデータサイエンティストがお送りする記事
* 今回は、探索的データ解析（EDA）の一つであるautovizを試してみた。

##はじめに
探索的データ解析（EDA：Exploratory data analysis）は、機械学習などのデータ分析業務を実施する際に、データの理解を目的として実施する作業を指します。
つまり、現場の問題を解決する際に、どのようなデータセットを扱っているのか、どのような状況にあるのかを、しっかりと理解するのが重要であり、探索的データ解析は上記を目的とした作業です。
過去には下記ライブラリーを使用した方法を整理しておりますので、参考にしてください。
* [Pandas-profiling](https://qiita.com/DS27/items/033193b452a17739b952)
* [sweetviz](https://qiita.com/DS27/items/178416f5ccf3a86db4e6)

##autoviz実行例
今回は、探索的データ解析ツールの一つである「autoviz」を使ってみようと思います。

今回もUCI Machine Learning Repositoryで公開されているボストン住宅の価格データを用いてPandas-profilingを実装します。

pythonのコードは下記の通りです。

```php
# 必要なライブラリーのインポート
import pandas as pd
import numpy as np
from autoviz.AutoViz_Class import AutoViz_Class
```

次にデータを読み込みます。

```php
# データセットの読込み
df = pd.read_csv("../data/Boston.csv")
df.head()
```

![スクリーンショット 2021-03-18 9.45.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/743453/ec9a23d6-2b8b-c0c8-6f40-0c2801b45f32.png)

次にautovizを実装します。

```php
autoviz = AutoViz_Class().AutoViz("../data/Boston.csv")
```

これで実装は終了です。
autovizはjupyter notebook上で結果を確認できます。

カラム間の関係性は下記のような感じで確認できます。

![スクリーンショット 2021-03-18 9.50.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/743453/b43384a5-4818-3dd0-d82b-9fab0d7a01c1.png)

また、各カラムのヒストグラム、箱ひげ図、正規確率プロットも確認できます。

![スクリーンショット 2021-03-18 9.51.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/743453/37d6b223-5b74-ad85-d210-1354583649e1.png)

連続値については、ヴァイオリンプロットが表示されます。

![スクリーンショット 2021-03-18 9.52.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/743453/145e70bf-fee8-27b5-6fad-d6e54b45d2a9.png)

カテゴリ毎の相関係数も確認できます。

![スクリーンショット 2021-03-18 9.53.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/743453/7de5a051-ce23-76ca-cfde-1da94234ed41.png)

##さいごに
最後まで読んで頂き、ありがとうございました。
今回は、探索的データ解析の一つであるautovizを使ってみました。上手く活用するという意味では有効な方法の一つであると思いました。ただ、このライブラリーだけで全ては完結しないとは思いましたので、上手く活用できたらと思います。

訂正要望がありましたら、ご連絡頂けますと幸いです。
【Rails】ログインしていないユーザーはログイン画面にリダイレクトさせる

# 目的
railsアプリ作成にあたり、ログインしていないユーザが直接URLを打ち込んで、各ページにアクセスしようとしてきたユーザに対し、ログインページにリダイレクトさせる。
ユーザー認証関係はdeviseを使用しています。

# 方法

上記のアクセス制限したいコントローラに対し、この１行を追加するだけです。

```ruby
before_action :authenticate_user!
```
これで各アクション実行される前にこのメソッドが実行され、ログインされているか判定されます。ログインしていなければ、ログインページにリダイレクトされるようになります。

# 参考にした記事

https://qiita.com/tobita0000/items/866de191635e6d74e392
【Project Euler】 Problem4 【解いてみた】

# はじめに
【Project Euler】とは、プログラミングで解く数学の問題集です。

本投稿では初学者なりに、Problem1 を解くにあたっての考え方を解説しています。
ちなみに言語はRubyを用いています。


※本投稿は、Project Eulerのガイドラインに従い、解答例としてのコードは載せておりません。
　また、問題に関しては私が翻訳しています。ミスがあればご指摘ください。
　　
【Project Euler】について知りたい方はこちらから↓

 https://projecteuler.net/

# 問題(original ver.)
A palindromic number reads the same both ways. The largest palindrome made from the product of two 2-digit numbers is 9009 = 91 × 99.

Find the largest palindrome made from the product of two 3-digit numbers.

# 問題(翻訳ver.)
回文数とは、前後どちらから読んでも同じ数のことである。2桁の数の積で表される回文数のうち、最大のものは
9009 = 91 × 99　である。3桁の数の積で表される回文数のうち、最大のものを求めよ。

## 問題を解く上でのヒント
①アプローチとしては単純に100~999までの数字をかけ合わせた上で、積が回文数であれば任意の配列に入れ、最後に配列の中で一番大きいものを調べる、というアプローチが考えられます。

②100~999をかける作業は言い換えれば、値の範囲が決まっている繰り返し作業になります。つまり、範囲オブジェクトに対して繰り返し処理をおこなうと楽に記述できます。

③次に回文数かどうかの判定を行うことを考えます。
一つの手段として、数字を文字列に変換する方法が考えられます。数字を文字列に変換するのはto_sメソッドを使いましょう。
そのうえで、文字列を逆さにしたものと値が等しいか調べます。その際は、reverseを使うと良いです。

④最後に繰り返し処理の中で、条件に合致したものを配列に入れ、最大のものを出力すれば終わりです。
配列に値を追加する方法は割愛します。配列の中で最大のものを出力する方法は、配列名の末尾に.maxをつけるだけです。


# おわりに
今回は【Project Euler】の問題4を解く上での考え方、流れを解説してきました。
一見複雑そうに見える問題も、整理すれば非常に簡単に解けることに感動します。
プログラミングってすごいですね。

このほかにも多くの問題が存在しているので、気になる方は最下部のリンクから挑戦して見てください。
また今後、私自身その他の問題にも挑戦し、同じような備忘録を投稿していきます。
私の備忘録が少しでも皆さんの参考になれば幸いです。ありがとうございました❗


https://projecteuler.net/about

問題を閲覧するにはアカウント登録が必要です。↑
デプロイ

# Herokuデプロイやり方

ターミナルに
% brew tap heroku/brew && brew install heroku

その後　バージョン確認
% heroku --version

Herokuにログイン
heroku login --interactive

=> Enter your Heroku credentials.
・メールアドレスを入力
  => Email:
・パスワードを入力して、エンターキーを押す
  => Password:

👇と出ればOK
ーーーーーーーーーーーーーーーーーーーー
Logged in as sample@sample.com
ーーーーーーーーーーーーーーーーーーーー

#### デプロイしたいプロジェクトへ移動
% heroku create (デプロイしたいプロジェクト名)

mySQLを使用可能にする
heroku addons:add cleardb

#### 設定変更
% heroku_cleardb=`heroku config:get CLEARDB_DATABASE_URL`
% heroku config:set DATABASE_URL=mysql2${heroku_cleardb:5}

#### credentials.yml.encの中身を確認
EDITOR="vi" bin/rails credentials:edit

#### masterkeyの設定
##### 環境変数の設定
% heroku config:set RAILS_MASTER_KEY=`cat config/master.key`
##### 環境変数の確認
% heroku config

#### Herokuで利用するStackを指定
heroku stack:set heroku-18 -a (プロジェクト名)

#### git push heroku masterを実行
% git push heroku master

#### Heroku上でマイグレーションを実行
% heroku run rails db:migrate


% heroku apps:info
で公開確認
Web URL: 　〜でURLを確認
【Docker】Dockerコマンドのupとか-dとか

## docker-compose
これは複数のコンテナを同時に取り扱うDocker Composeという機能を使うためのコマンド。

## up
``docker-compose up``これはよく使う。
Docker Composeでコンテナを起動させるときに、upを使う。

## -d 
この``-d``をつけることによって、コンテナをバックグランドで起動させることができる。
コンテナを起動後もターミナルでの操作ができる。
Reactで、LinkedIn-Cloneを作ってみた

#1,参考動画

https://youtu.be/QaYts9sPmcY

#2,使った技術
>**Firebase Authentication**
**Firebase Hosting**
**Redux**
**Material-ui**

#3,完成品
![2021-03-17_17h33_01.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/654025/be78e048-d137-fbd2-16f6-840842b10347.gif)
#4,最後に
今回は、Linkedin のクローンに挑戦しました。
メッセージを投稿すると、アニメーションと当時にメッセージがポップアップするような見た目です。
Reduxを理解するのにが大変でした。でも、とても丁寧に説明してくれていたのでわかりやすかったです。
最終的には、firebaseにデプロイするところまでを実装することができました。
firebaseには、２つのステータスがあるのですが、Sparkというクラスにアップグレードしないとfirestoreが使えませんでした。
無料の範囲で利用することが可能なので、ぜひトライしてみてください。
dayjsを使用して生年月日から年齢を算出する

下記の記事を参考にしながらdayjsを使用して生年月日を算出していきます。
[Moment.jsを使って年齢計算](https://qiita.com/Butterthon/items/ca6ab7e411ca6b4c2d44)

### 環境
```
nuxt.jsのcompositionAPIを使用
@nuxtjs/dayjsのモジュールをインストール済み
```

実際のコード

```js

function calcAge(birthday) {
  const today = $dayjs()
  const birthDate = $dayjs(birthday)
  const baseAge = today.year() - birthDate.year()
  const thisBirthday = $dayjs(`${today.year()}-${birthDate.month() + 1}-${birthDate.date()}`)
  return today.isBefore(thisBirthday) ? baseAge - 1 : baseAge
}
```

少しコメントを加えると

```js
// 筆者の誕生日 birthday = 1998-06-03 とする
function calcAge(birthday) {
  // 今日の日付を取得
  const today = $dayjs()
  // => d {$L: "ja", $d: Thu Mar 18 2021 09:13:01 GMT+0900 (日本標準時), $x: {…}, $y: 2021, $M: 2, …}

  // birthdayをパースする
  const birthDate = $dayjs(birthday)
  // => d {$L: "ja", $d: Wed Jun 03 1998 00:00:00 GMT+0900 (日本標準時), $x: {…}, $y: 1998, $M: 5, …}

  // 単純に現在の年から生年月日を引く
  const baseAge = today.year() - birthDate.year()
  // => 23

  // 今年の誕生日を取得
  const thisBirthday = $dayjs(`${today.year()}-${birthDate.month() + 1}-${birthDate.date()}`)
  // => {$L: "ja", $d: Thu Jun 03 2021 00:00:00 GMT+0900 (日本標準時), $x: {…}, $y: 2021, $M: 5, …}

  // 今年の誕生日が今日より前であればまだ誕生日は来ていないという事なので1引く
  const age = today.isBefore(thisBirthday) ? baseAge - 1 : baseAge
  // => 22

  return age
}
```

いくつか実際にやってみる

```js
calcAge('1994-5-25')
=> 26

calcAge('19920820')
=> 28

calcAge('1998-08-10')
=> 22
```

問題なさそうですね。
以上です。参考になればLGTMいただけると幸いです。

## 追記
コメントで指摘いただいたのですが、単純にyearの差分だけで出せるみたいです。

```js
const birthday = $dayjs('1998-06-03')
const today = $dayjs('2021-04-22')

console.log(today.diff(birthday, 'year'))
=> 22
```

なのでリファクタリングすると下記のようになります。

```js
function calcAge(birthday) {
  const today = $dayjs()
  const age today.diff(birthday, 'year')
  return age
}
```
バインディング式でクリックイベントを取得する

DataBindingのバインディング式で、クリックイベントを取得する方法です。

# `android:onClick`属性を設定する

クリックイベントを取得したいウィジェットに、`android:onClick`を指定します。


```xml
// 引数のViewなし
android:onClick="@{() -> viewModel.clickText()}"
// 引数のViewあり
android:onClick="@{viewModel::clickButton}"
// バインドされているデータを渡す
android:onClick="@{() -> viewModel.clickText(model)}"
```

```ViewModel.kt
// android:onClick="@{() -> viewModel.clickText()}"の処理
fun clickText() {}

// android:onClick="@{viewModel::clickButton}"の処理
fun clickButton(view: View) {}

// android:onClick="@{() -> viewModel.clickText(model)}"の処理
fun clickText(model: Model) {}
```

# その他のイベント

```xml
// EditTextの入力を監視する
android:onTextChanged="@{viewModel::onTextChange}"

// SwipeRefreshLayoutのリフレッシュイベントを取得する
app:onRefreshListener="@{() -> viewModel.refresh()}"
```


```ViewModel.kt
// android:onTextChanged="@{viewModel::onTextChange}"の処理
fun onTextChange(s: CharSequence, start: Int, end: Int, count: Int) {}

// app:onRefreshListener="@{() -> viewModel.refresh()}"の処理
fun refresh() {}
```

# まとめ

詳細は「developersの [レイアウトとバインディング式](https://developer.android.com/topic/libraries/data-binding/expressions?hl=ja#event_handling) 」に書いてあるので、見てみて下さい！
【Rails6】herokuデプロイエラー時の対処

#開発環境

Rails 6.1.1
Ruby 2.7.2
git  2.30.0
heroku/7.50.0 darwin-x64 node-v12.16.2
mac 0S Big Sur 11.2.3
#エラーが発生

Railsで作成したアプリをHerokuの登録を行い、

```
$ git push heroku HEAD
```
コマンドを入力した際に以下のようなエラーが発生。

```
! [remote rejected] HEAD -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/＊＊＊＊＊＊＊＊＊.git'
```

# bundleのバージョン変更
ターミナルのログを確認すると

```
buildpack-detect-order
remote: -----> Ruby app detected
remote: -----> Installing bundler 2.2.11
remote: -----> Removing BUNDLED WITH version in the Gemfile.lock
remote: -----> Compiling Ruby/Rails
remote: -----> Using Ruby version: ruby-2.7.2
remote: -----> Installing dependencies using bundler 2.2.11
```
ここからbundleのバージョンがローカルと異なるのが原因と考えバージョンを確認

```
＄ bundle -v →→→　bundler-2.2.6
```
``bundler 2.2.6``をアンインストール

```
$ bundle uninstall -v '2.2.6'
```
ここで``bundle 2.2.11``を再インストール
参考　https://qiita.com/manbolila/items/f412a29782e4352d1168

```
＄ bundle _2.2.11_ install
```
バージョン確認

```
＄ bundle -v →→→　bundler-2.2.11
```
確認後、git add, commitし，再push!


```
$ git push heroku HEAD
```
エラーは変わりませんでした。。


# Gemfile.lockの編集
ここで改めてブラウザ上でherokuのBuild Logを確認すると、、

```
Installing dependencies using bundler 2.2.11
Running: BUNDLE_WITHOUT='development:test' BUNDLE_PATH=vendor/bundle BUNDLE_BIN=vendor/bundle/bin BUNDLE_DEPLOYMENT=1 bundle install -j4
Your bundle only supports platforms ["x86_64-darwin-19"] but your local platform
is x86_64-linux. Add the current platform to the lockfile with `bundle lock
--add-platform x86_64-linux` and try again.
```
「あなたのプラットフォームはサポートされてないよ」という意味でしょうか？
記述に従いコマンド入力してみます。

```
$ bundle lock --add-platform x86_64-linux
```
コマンド入力後、git add, commitし，再pushするとデプロイできました！

# まとめ

- Macやbundleのバージョンによっては Gemfile.lock/PLARFORMSにHerokuの環境構築に必要なgemが入っていないケースがあるようです。


- Herokuを使用する際はBuild Log確認も忘れずに





参考
https://devcenter.heroku.com/articles/bundler-version#known-upgrade-issues
【Laravel】seedデータの作り方

```php

<?php

use Illuminate\Database\Seeder;
use App\Models\User;

class UserTableSeeder extends Seeder
{
  /**
   * Run the database seeds.
   *
   * @return void
   */
  public function run()
  {
    factory(User::class, 5)->create();
    User::create([
      'id' => '100',
      'name' => '田中太郎',
      'name_kana' => 'タナカタロウ',
      'email' => 'test@rikai.technology',
      'tel' => '1234567890',
      'password' => bcrypt('password'),
    ]);
  }
}
```

database/seeds/UserTableSeeder.phpにこのような記述で、ダミーのデータを投入することができる。
初学者のプログラミング　コンソールを起動しテストデータを作る

コンソール上で複数のテストデータを作成する方法。

```console
irb(main):001:0> (1..5).each do |i|
irb(main):002:1* Book.create(
irb(main):003:2* name: "Test#{i}",
irb(main):004:2* published_on: Time.parse("20191224").ago(i.months),
irb(main):005:2* price: (i * 1000),
irb(main):006:2* )
irb(main):007:1> end
)
```
１行目：作成するテストデータの数をeach文で指示
２行目〜５行目：カラムに入れるデータを指定
以上でテストデータの作成ができる。また、
`irb(main):008:0> Book.all`
で作成したテストデータを確認することができる。

## さいごに
プログラミングの初学者です。その日に学んだことを学習の一環としてアウトプットしています。より深く学習していきたいと考えておりますので、ご指摘等いただけますと幸いです。

参考図書：パーフェクト Ruby on Rails【増補改訂版】すがわらまさのり/前島真一/橋立友宏/後藤優一/五十嵐邦明
【Swift】NavigationBarに戻るボタンともうひとつボタンを並べる

# どういうことか

NavigationBarの左上に戻るボタンともうひとつボタン（Aボタンとしよう）を並べたい。
通常、遷移した先では何もしなくても戻るボタンが表示されるが、この場合Aボタンを実装すると戻るボタンは表示されない。なので自分で作る。

## 実装

遷移した先のControllerにコードを書く。
結論から言うとボタンを定義して配列で並べてあげればいい。
注意しなければいけないのは `navigationItem.leftBarButtonItem` ではなく `navigationItem.leftBarButtonItems` という**複数形**にすること。

```swift:SecondViewController.swift
    override func viewDidLoad() {
        super.viewDidLoad()

        // Aボタン
        let aButton = UIBarButtonItem(image: UIImage(named: "button"), style: .plain, target: self, action: nil)
        notificationIcon.tintColor = UIColor.black
        
        // 戻るボタン
        let goBackButton = UIBarButtonItem(image: UIImage(named: "back"), style: .plain, target: self, action: #selector(goBack))
        goBackButton.tintColor = UIColor.black
        
        // NavigationBar左上にアイコンを2つ並べる
        navigationItem.leftBarButtonItems = [goBackButton, aButton]
    }
    
    // 戻るボタンを押したときに発動する戻る処理
    @objc func goBack() {
        self.navigationController?.popViewController(animated: true)
    }
```

おわり(´・ω・｀)
画像はなし。
Pythonのクラスを理解する【備忘録】

Pythonのクラスを学習したんで、その備忘録をつけていく


## クラスの書き順

1.  `class クラス名:` でクラスを定義する
2.  `def __init__(self,引数)` で初期設定？設計書？を定義する
3.  `self.属性名` で属性(プロパティ)を与えていく

### クラスの書き方例

```python
class Persson00:
    def __init__(self,name,age):
        self.name = name
        self.age = age
```
これで実行すると、クラスが定義される。
まだ定義しただけなので、特に何も起きない。
なので、定義したクラスを使える処理をしていく。

## インスタンスの作り方

1. `インスタンス名 = クラス名(引数)` でインスタンスを定義。
2. `インスタンス名.属性名` でインスタンスを実行できる。

### インスタンスの実行例-その１-

```python
#上で書いたクラスを使ってます

mittsu00 = Persson00("みっつ",29) #インスタンスを定義
mittsu00.name #インスタンスを実行
#実行結果:みっつ

mittsu00.age #インスタンスを実行
#実行結果:29
```

`Persson00` で定義した属性を使って `mittsu00` っていうインスタンスを作り上げた、ってことか。

そしてそのインスタンスを使って、アレコレやっていく、みたいな感じなんですかね。

### インスタンスの実行例-その２-

```python
yottus00 = Persson00("よっつ",35) #インスタンスを定義
yottsu00.name #インスタンスを実行
#実行結果:よっつ

yottsu00.age #インスタンスを実行
#実行結果:35
```

同じ `Persson00` クラスを使って、別のインスタンスを作ることもできる。

なるほど、、、。

そうやって頻繁に使うであろう属性ってのを、予めクラスの中で定義しておいて、それを使い回す、
みたいなイメージかな。

## クラスの中にメソッドを定義する

1.  `class クラス名:` でクラスを定義する。
2.  `def __init__(self,引数)` で初期設定を定義する
3.  `def メソッド名(self,引数名)` でメソッドを定義する
4. ３で作ったメソッドの中身を書いていく

### メソッドの書き方例

```python
class Persson01:
    def __init__(self,name,age):#この辺はさっきと同じ
        self.name = name
        self.age = age

    def main(self,name):#ここからがメソッドの定義
        print ("私の名前は、"+name+"と申します")
```

ここまでで、クラスとメソッドの定義完了。
後は上記と同様に、インスタンスを作り、メソッドを実行していく。

### メソッドの実行例-その１-

```python
mittsu01 = Persson01("みっつ",29)
mittsu01.main("みっつ")

#実行結果：私の名前は、みっつと申します
```

`Persson01` を元にした `mittsu01` というインスタンスを作り、クラス内で定義した `main` メソッドを実行する。

そして引数を渡して実行することで、 `main` メソッドの処理である、 `print` が走る、
ってわけか。

## selfを使ったメソッドの定義

```python
class Persson01:
    def __init__(self,name,age):
        self.name = name
        self.age = age

    def main(self,name):
        print ("私の名前は、"+name+"と申します")
        print ("私の名前は、"+self.name+"と申します")#ここでselfを使ってる

mittsu01 = Persson01("みっつ(これはインスタンス名)",29)

mittsu01.main("みっつ（こっちは引数名）")#インスタンスを実行

#実行結果：私の名前は、みっつ（こっちは引数名）と申します
#実行結果：私の名前は、みっつ（これはインスタンス名）と申します
```

メソッドの処理の中に、 `self.○○` をつけることで、インスタンスで定義した値を設定することが出来る。

なるほど、これは便利かも。
## 所感
Pythonってか、オブジェクト指向って呼ばれる言語は、クラスを使えてなんぼ、みたいなところがありますね...。
なので、この辺は頑張って理解していきます。

PySideでGUIを作る場合、
- ウィンドのタイトル名とか、
- 実行ボタンを予め持たせておく、とか

まぁそんな感じで、ひな形みたいなのを作っておくと、便利なのかなぁ、、、。
なんて思いながらやってました。

この後は**クラスの継承**とかも覚えて、より実践的な書き方をマスターしていきたいですね。

### 手書きのメモ
![CE1D6F3E-D0E8-439C-B331-028ACCA5FDF5.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/136274/b1458921-7cbc-d031-363e-9607afbb3452.jpeg)

やっぱりプログラムとは言え、なんやかんや、アナログでメモった方がいいな。
頭の中でソースが書けてないと、タイピングも出来ないしね。

まぁ、実行出来ないんでミスってても気づかないんですけど(笑)
ajaxで連想配列を渡す際にハマった話

#ajaxで値を渡せずにハマった話

###発生した問題
javascriptのajax通信でphpに連想配列を渡そうすると、\$request->xxxや\$_POST['xxx'],\$reuqest->input['xxx']の方法を使ってもnullになって、手も足も出ませんでした。

###解決方法
エンコードが必要

```js
var hoge = {
      name : 'hoge'
}
$.ajax({
      type: 'POST',
      url: '1',　//個人で変えてください
      contentType: "application/json",
      data: JSON.stringify(hoge),
      dataType: 'text',
    })
```

このように記述することで、phpで\$request->nameで呼び出す事が出来ます。js側でエンコードした連想配列を渡しただけなので、おそらく、php側でのデコードも必要だと思いますが、とりあえず動いたので、後日調べようと思います...
投稿中に気づいたのですが、dataTypeをjsonにすると上手く動かないので、近いうちにこれも調べて追記しようと思います。

そもそもajax通信が初めてで、javascriptからphpに連想配列を渡したことがなく、エンコードとデコードが何かわかっていませんでした。
どこでも使えるような言語にするための翻訳みたいな役割らしい。

とりあえず、phpからjsなど別言語に連想配列や値を渡す際はエンコードやデコードが必要かどうかを考えたほうがよさそうです。
【C#】enumじゃないけどそれっぽく設定ファイル読み込みユーティリティを作る

# 0. INDEX
- 1. 概要と目的
- 2. ユーティリティを作る
- 3. あとがき

# 1. 概要と目的
この記事のC#版。なので目的は一緒。コードアシストを使ってtypoしたくない！

https://qiita.com/neonemo/items/38461d0c9db1e6ed1cee

という事で、App.configを使った設定ファイル読み込みユーティリティを作ります。


# 2. ユーティリティを作る

## 2.1. 動作サンプル
元々、App.configを使うつもりだったんだけど、paiza.ioでは `System.Configuration.ConfigurationManager.dll` が使えないようなので、急遽XMLとして読み込むように修正している。
本記事の実装とは違っているが、違和感はないハズ…

https://paiza.io/projects/mY5cRbMSP-MEIPHP7W-bjQ


## 2.2. 設定ファイルの中身
```xml:App.config
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
    <appSettings>
        <add key="hoge" value="hogehoge" />
        <add key="fuga" value="12345" />
        <add key="mossari" value="fusafusa" />
    </appSettings>
</configuration>
```

## 2.3. ソースコード
`readonly`もついてるしフィールドを`public`でもいいかなあとは思ったけど、このサンプルでは`getter`を使うようにした。お好みで変えてくだし。

```cs:Config.cs
using System;
using System.Configuration;

public class Config {
    
    private readonly string key;
    private readonly string value;

    private Config(string key)
    {
        this.key = key;
        this.value = ConfigurationManager.AppSettings.Get(key);
    }
    
    public string GetKey()
    {
        return key;
    }

    public string Get()
    {
        return value;
    }

    public static readonly Config Hoge = new Config("hoge");
    public static readonly Config Fuga = new Config("fuga");
    public static readonly Config Mossari = new Config("mossari");
}
```

ポイントは、最後の方に書いているこの記述が、設定ファイル1項目分として機能するところ。
文字リテラルが埋まった状態で外からは見えなくなり、**利用時はVSがこのフィールド名を補完してくれる**ので、typoを防ぎやすいはず。（ミスれば文法エラー出るしね！）

```cs
public static readonly Config Hoge = new Config("hoge");
```

## 2.4. 使い方
```cs:Hello.cs
using System;

public class Hello {
    public static void Main(){
        Console.WriteLine(Config.Hoge.Get()); // "hogehoge"と出力
        Console.WriteLine(Config.Fuga.Get()); // "12345"と出力
        Console.WriteLine(Config.Mossari.Get()); // "fusafusa"と出力
    }
}
```

# 3. あとがき
最近C#の業務利用を始めました。個人的にはUnityでお遊びがてら書いたりはしてたのですが…。
今回の記事を書くにあたってC#は列挙型にメソッドが持てない事に気づいてJavaの便利なところだったんだなーと気づきました。

仕事上はこういうユーティリティ開発は賛否両論で、無ければ無いで開発上の問題は無い事も多いのが一因なのかなーと思います。
とはいえ、チーム開発時や、一人でも期間が開いてしまった時の開発でミスるので、個人的にはなるべくIDEのアシストを使いたいクセが付いています。

そうすると、そんな事は時間と金の無駄だという外圧との戦いが繰り広げられたりするのですが、どう説得すればよいのか日々悶々としてます。
そういう案件に限って、ズルズルと改修依頼が来ますしね。[^1]

[^1]: 更に改修コストが高くなってくるとちゃんと設計して実装しろ的な指摘をポロっと言われて内心穏やかじゃなくなったりする。藤竜「ユ゛ー゛テ゛ィ゛リ゛テ゛ィ゛な゛ん゛か゛無゛駄゛だ゛っ゛て゛言゛っ゛て゛止゛め゛さ゛せ゛た゛じ゛ゃ゛な゛い゛で゛す゛か゛あ゛あ゛あ゛あ゛！」

読み返したら単なる愚痴になってますね。この辺でやめておきます。
ではﾉｼ
今日からPYTHONやめます

#UPDATE

以下の発言について、一部を見直しました。

### ionic+VUE.js
あっさりとやめることにしました。
何故かと言えば、まともにVUEも触れない人間にとって、あまりにもハードルが高いためです。

```
IONIC+Vue.Jsといった、スマホアプリ開発にもシフトしていく　
→　htmlのWebstorageなどにより、MVCモデルもローカルで完結できる時代だし、そもそも構築済みのクラウドサービスを使えば選択肢は無限にある（ただしセキュリティポリシーは考慮する必要あり）
```

### アンドロイドアプリ開発
月並みな話題ですが、やっと時代に追いついてきました。
今後の取り組みでは、以下の二つに集中しようかと考えています。

* KOTLIN
* JAVA

どちらもAndroidスタジオを使うことになりますが、まずはKOTLINで何かアプリを作り、
アンドロイドでリリースしてみようかと思います。

実はJAVAは、これまでも何度かトライして、その度に吐き気を覚えて挫折してきた言語なのですが、
その理由は開発環境の使いかたにあったような気がします。

幸いKOTLINは、VSCODEで開発できそうですので、これまでの開発環境を生かせそうです。
https://www.youtube.com/watch?v=QeVl8fXteI0

そして、あわよくばJAVAの習得などにも繋げてみたいです。

###やらないこと

　最初に、やらないことを決めないと、ブレまくります。

Ionic,Flutter,Xamarin →　やらない
PHP,RUBY →　やらない
PYTHON →　卒業

Javascript →　VUE.JS　CLI開発　→　やる
Node.JS　→　あくまでVUE.JSのコンパイラ起動のみ
（NODE.JSでバックエンドを動かすとかいうのは、あまりニーズは無い様子→ やるんだったらＧＯ？　FIREBASEか？）

## AI開発
これはITエンジニアのスキルとは、別次元かもしれない・・・

PYTHON →　やることはやりますが、あくまで理論的なことを学ぶだけです。
Tensorflow.JS　→　本命
Tensorflow.JAVA　→　次点
（ＡＩのデファクトスタンダードって、これから一体どうなるのであろうか？？？）


# 理由
* flask,djangoは十分に使えるスキルを得ており、いつでも最終手段を講じれるから
→　これまでのEXCEL+VBA+ACCESSの置き換えとして、完全にPandas+SQLAlchemy+WEBが使えるようになったからです

* DeepLearningのためにPython一択で考えてきたが、AIフレームーワークという枠組みの中でのCording自体は、非常に単純なライブラリコールに過ぎず、その程度のPythonであれば、読み書き自在のレベルに達したため

* WEB-APP開発においては、Pythonはフロントエンドには成れず、結局はHTML+CSS+JSの習得が必須なため　→ バックエンドがREST-API開発に特化されていく現状では、Python一択の意味が無くなってきている。

* VUE.JSによるWEBフレームワークの充実により、PythonのWEBフレームワークのニーズは、ますます減ってくると予想され、いっそうJavaScriptのスキルが重要になってきている。

* AI領域においても、tensolflow.JSといったフロント側でのＡＩエッジ開発が盛んになってきたため。バックエンド処理に特化したＡＩ処理が不必要かつ、各種クラウドサービスが選択可能な時代になってきたため

#今後の軸足
* 上記のこともあり、現在取り組んできたPython習得をいったんクローズすることとした。
→ もちろんやり残している、REST-API開発などもあるが、これは別言語でも対応可能である。

* これからはNode.Js、Vue.Js＋Nuxt.Jsを中心に触っていき、フロント、バックの両方に取り組んでいく
→　データベース領域は残るがこれはpython以外を選択していきたい（その場合はPHP,ASP(C#),JAVAなどいろいろあるが、基本的にSQLベースは変わらず、ORMにはあまり頼らないようにしたい）

* IONIC+Vue.Jsといった、スマホアプリ開発にもシフトしていく　
→　htmlのWebstorageなどにより、MVCモデルもローカルで完結できる時代だし、そもそも構築済みのクラウドサービスを使えば選択肢は無限にある（ただしセキュリティポリシーは考慮する必要あり）

#　終わりに
５０代のＶＢＡマクロプログラマからの離脱を決意し、３年前にPython習得を宣誓したが、ついにPythonから離脱宣言をすることとした。https://qiita.com/EasyCording/items/8f00da6ef352afb46d9d
GNU Radioを使用した周波数変調方式（FM）レシーバのデザイン

入門ガイド(https://reference.digilentinc.com/reference/programmable-logic/b205mini/getting-started)ではGNU Radioを使用したFMラジオレシーバのデザインについて簡単に順を追って説明します。ソフトウェアドライバーとGNUラジオのLinux OSへのインストール方法、リアルタイムDiscrete Fourier Transform（DFT:離散フーリエ変換）の実行例、FMラジオレシーバをゼロから作成する方法についてそれぞれ学ぶことができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/616703/0ca6085d-5b23-dc8b-693f-86ac20dacf80.png)

FMレシーバは変調信号（つまりVHF帯域の電波）の入力から20 Hz〜20 kHzの幅のオリジナルの音声信号を生成します。まず初めに、ターミナルでGNU Radio Companionが開きます。それからSample Rate、Frequency、USRP、そしてQT GUI Sinkのブロックを追加します。さらに、ローパスフィルタを使います。音声信号の帯域幅が200 Hz〜20 kHzであることに注目してください。ローパスフィルタが追加できたら、次はFM復調を実行してください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/616703/274e71f0-21b9-0db2-3bfa-b61420b9c0d0.png)

出力信号は耳で聴くことができるため、この信号がサウンドカードに送られます。これが実際は96 kHzくらいのサンプルレートのDA（Digital/Analog）コンバータとなっています。Rationalリサンプルブロックが使用されて、x（補間）が出力周波数、y（デシメーション）が入力周波数となるx/y操作が行われます。最後に、出力信号がスピーカから流れるようAudioシンクブロックが追加されます。生成が行われたらPythonのスクリプトがUSRP B205mini-iに送られて実行されます。出力信号はタイムと周波数のドメインに表示されます。
MacでJavaを利用するときのメモ（2021年3月）


いつも何も考えずbrew install openjdkとかでインストールしていたが、いろいろ奥が（闇が）深いらしいのでメモ。

>javaをAndroid以外の開発で利用することはほとんどないので謎ワールド。

## brew install openjdk

### インストール

brewコマンドで簡単インストール。

```bash
brew install openjdk
```

が、どうやらkeg-onlyとうものであるため/usr/local/bin等にリンクが自動で張られない。
通常brew installすると/usr/localCellarに実体がインストールされ/usr/local/binにシンボリックリンクが設定され、PATHが通りますが、key-onlyでは実体だけのようです。

>2021年3月現在、15.0.2がインストールされるみたい。

### PATHの設定

そのため、.zshrcに

```bash
export PATH="/usr/local/opt/openjdk/bin:$PATH"
```

必要に応じて

```bash
export CPPFLAGS="-I/usr/local/opt/openjdk/include"
```

も追加。

### その他 設定

JAVA_HOMEの管理ツール？である/usr/libexec/java_homeの管理対象となるためには/Library/Java/JavaVirtualMachinesに実体かシンボリックリンクがある必要があるみたいなので追加しておきます。

```bash
sudo ln -sfn /usr/local/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk
```

### JAVA_HOME

macでは設定不要との記述が散見されるが、javaエコシステムのツールはJAVA_HOMEが設定されていることが前提で動いているものが多いので設定しておくことが無難っぽい。
静的に記述するのではなく先述の/usr/libexec/java_homeを使うのが一般的らしい。

```bash
export JAVA_HOME=`/usr/libexec/java_home -v 15`
```

設定は/usr/libexec/java_homeコマンドを使うのが主流らしい。。

## brew cask install java

brew cask installでインストールしたJavaは何もしないでいいらしい。Oracleのビルド版がインストールされるらしい。

```bash
brew cask install java
```

>caskは主にGUIベースのアプリインストールをするもので/Applicationsにインストールされる。

## その他

openjdkよりadoptopenjdkとかの方がいいという記述がちらほら。

```bash
brew cask install adoptopenjdk
```
初学者のプログラミング　railsの略称や英語表記

railsを学習していて、いちいち略称が出てくるたびに？となるのでまとめた。

##一覧表

|略称 |名称|意味/内容|
|--- + -------------------------- +---------------------------------------------- |
|CoC|Convention over Configuration|「設定より規約」という意味。規約に則って開発することを求めている。|
|DRY|Don't Repeat Yourself |同じ記述を繰り返さず一箇所にまとめる|
|REST|Representatial State Transfer|Webアプリの設計概念の一つ。各ページには固有のURI(URLの一意性)が存在する。|
|CRUD|Create Read Update Delete|データベースのレコードに対する基本的な操作。|
|MVC|Model View Controler |M：データ操作担当、V:視覚情報担当、C：MとVの連携担当|
|CSRF|cross-site request forgeries|Webサービスの脆弱性の一つ。悪意を持つ第三者により用意されてリンクなどにより、本人の意思にないデータの処理(削除など)が実行されること。|
|admin|Administrator|システム管理者のこと。例えば、プロフィールを変更できるのをユーザー自身にすれば、プロフィールのアドミンはそのユーザーとなる。|
|XSS|クロスサイトスクリプティング|プログラムが意図しないような文字列を渡して、あるページに対して自由にJavaScriptを埋め込み、実行させる攻撃方法のこと。|
||クエリストリング|URLの末尾に「?」に続けて「名前＝値」の形式で記述してあるもの。Webアプリケーションなどでクライアントからサーバーにデータを送信する方法として用いられる。クエリ文字。|

今後新しく出てきた際に追記していこうと思う。
・３月２2日CSRF,admin追記
・３月２３日XSS、クエリストリング追記

## さいごに
プログラミングの初学者です。その日に学んだことを学習の一環としてアウトプットしています。より深く学習していきたいと考えておりますので、ご指摘等いただけますと幸いです。

参考図書：パーフェクト Ruby on Rails【増補改訂版】すがわらまさのり/前島真一/橋立友宏/後藤優一/五十嵐邦明
UnrealEngine4でC++を使いたいけどVisualStudioは既にインストール済みな時に設定を変更する方法

#概要
UnrealEngine４のC++コードをVisualStudioで編集したい時、VisualStudioでC++のオプションを設定する必要があります。この設定をしてないとプロジェクトをパッケージ化する時にエラーが出ることもあるかもしれません。

普通はVisualStudioをインストールする時にオプションを設定すれば大丈夫です。
この記事では既にVisualStudioをインストール済みな時にC++のオプション設定をする方法を書いていきます。
#本文
Windowsの設定を開いてアプリを選びます
![スクリーンショット (2024).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/6e0430c5-f9ed-b165-6f18-f65d68075710.png)
アプリと機能の右上にあるプログラムと機能を選び
![スクリーンショット (2025).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/af3f35d2-fdf7-ba1e-8a11-40a4d39c5909.png)
VisualStudioCommunityから変更を選択
![スクリーンショット (2027).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/4da508c0-c43a-e4af-ddda-34252490743b.png)
「C++によるゲーム開発」を選択すると右側にC++用のインストール詳細が表示されます。項目の中から必要な部分にチェックを入れます。
![スクリーンショット (2028).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/00cd4af3-520d-bc1a-4506-076e2777a99e.png)
最後に更新を押すとC++用オプションのインストールが始まります。
インストールが完了するとUnrealEngine4のC++コードをVisualStudioで編集できるようになります
2020年度にサクッと深度推定を試す

# 1. はじめに
手元にあるkinectが動かないので、画像から深度推定を吐き出してくれるものを試しました。単に、githubからクローンして実行しました、という話だけです。

# 2. おすすめ

githubで、depth estimation と検索すると、トップにあがるのが、こちらです。

https://github.com/ialhashim/DenseDepth

こちらが、特に苦労せずに動きます。

# 3. 実行

anacondaで試しました。GPU無し、CPUのみで動かしています。

次で、必要なものを入れます。

``` conda install tensorflow keras pillow matplotlib scikit-learn scikit-image pydot GraphViz pyopengl ```

DenseDepthをクローンします。

そのフォルダに、readmeにある、Pre-traind modelsの２つをダウンロードします。(NYU Depth V2, KITTI)

試したい画像を640x480にして、examplesフォルダに入れます。既に入っている画像は別に移しておくのが良いです。

test.pyを実行するのですが、いくつか変更します。

- 画像 : pngであればそのままでOKです。jpgであれば、16行目の```examples/*.png```を```examples/*.jpg```に変更します
- 出力 : ```outputs```に全画像分が格納されます。それを利用することになります。私はhsv色相配色のヒートマップが欲しかったのでtest.pyの最後に次を追加しました。

```python

from  PIL import Image
import numpy as np
myhsv = plt.get_cmap('hsv')

for uilp in range(len(outputs[:,0,0,0])):
	#tmpout = Image.fromarray(np.uint8(myhsv(outputs[uilp,:,:,0])*255))
	tmpout = Image.fromarray(np.uint8(myhsv((outputs[uilp,:,:,0]-outputs[uilp,:,:,0].min(0).min())/(outputs[uilp,:,:,0].max(0).max()-outputs[uilp,:,:,0].min(0).min()))*255))
	fnames = 'result'+str(uilp)+'.png'
	tmpout.save(fnames)

```
![IMG_0475_ss.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698531/d31b479e-748e-25ac-5b48-808a68f53c79.jpeg) ![IMG_0475_s_result0.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/698531/07e9ec7a-a3ca-324d-926c-e1c90f1eb937.jpeg)


# 4. おわりに

深度推定が話題になっていた頃のものは、tensorflowがv1用だったりと、サクッと試すには不向きでした。ialhashim氏のリポジトリは、現行の環境に合わせてメンテされていて、大変助かりました。
pi picoでmicropython その11

#概要

picoでmicropythonやってみた。
pioアセンブラで、Lチカ、やってみた。

#サンプルコード

```
from machine import Pin
from rp2 import PIO, StateMachine, asm_pio
@asm_pio(set_init = PIO.OUT_LOW)
def tic():
   set(pins, 1)
   set(x, 31)
   label("loop0")
   nop()
   jmp(x_dec, "loop0")
   set(pins, 0)
   set(x, 31)
   label("loop1")
   nop()
   jmp(x_dec, "loop1")
sm = StateMachine(0, tic, freq = 1000, set_base = Pin(25))
sm.active(1)

```


以上。
Python: PyShorteners で短縮URLを簡単に作る



https://dev.to/theinsightfulcoder/create-your-very-own-url-shortener-expander-using-python-4nfd

PyShorteners というやつで非常に簡単にURL短縮ができるらしい、というメモ。
[記事の筆者のソースはこちら](https://github.com/SaiAshish-Konchada/Python-Projects-for-Beginners/tree/main/URL%20Shortener%20%26%20Expander)。



## PyShortenersとは

https://pyshorteners.readthedocs.io/en/latest/
`pip install pyshorteners` して使う。

>pyshortenersは、最も有名なURL Shortenersを使ってURLを短縮したり拡張したりするのを助けるPythonライブラリです。pyshortenersを使うと、短いURLを生成したり、別のURLを拡張したりすることが、次のように入力するだけで簡単にできます。(DeepL翻訳)

```sample.py
import pyshorteners

s = pyshorteners.Shortener()
print(s.tinyurl.short('http://www.g1.com.br'))
```


で、例えば以下のようなツールが簡単に作れる。

```shortener.py
from pyshorteners import Shortener

# passing instance
s = Shortener()
# asking user for choice
choice = int(input("1 or 2 ? (短縮化したいときは 1、元に戻したいときは 2 を入力してください) :"))

# link shortener
def short():
    link = input("短縮化したいリンクを入力してください: ")
    shortened_link = s.tinyurl.short(link)
    print(" The Shortened Link is: " + shortened_link)


# link expander
def expand():
    link = input("元に戻したいリンクを入力してください: ")
    expanded_link = s.tinyurl.expand(link)
    print("The Expanded link is: " + expanded_link)


if choice == 1:
    short()
elif choice == 2:
    expand()
else:
    print("1 か 2 を入力してください")
```


例えばQiitaの記事URLを: https://qiita.com/e99h2121/items/419c3bd39d8dea40f21a
`https://tinyurl.com/yy9rpy4y` などと短縮した例。

```bash
root@d545fa0ed72b:~/opt# python shortener.py
1 or 2 ? (短縮化したいときは 1、元に戻したいときは 2 を入力してください) :1
短縮化したいリンクを入力してください: https://qiita.com/e99h2121/items/419c3bd39d8dea40f21a
 The Shortened Link is: https://tinyurl.com/yy9rpy4y
root@d545fa0ed72b:~/opt# python shortener.py
1 or 2 ? (短縮化したいときは 1、元に戻したいときは 2 を入力してください) :2
元に戻したいリンクを入力してください: https://tinyurl.com/yy9rpy4y
The Expanded link is: https://qiita.com/e99h2121/items/419c3bd39d8dea40f21a
root@d545fa0ed72b:~/opt#
```

## TinyURLとは (怪しくないの？)

短縮URLサービスの先駆け。
https://ja.wikipedia.org/wiki/TinyURL


https://ja.wikipedia.org/wiki/%E7%9F%AD%E7%B8%AEURL

短縮URLにてスペースが節約できる一方、URL偽装等にも使えるため、「TinyURLのリンクをスパムと認識してブロックするため、直リンクにしない」等の策がとられているようだ。

以上メモ。なにがしかの参考になればさいわいです。
pi picoでmicropython その10

#概要

picoでmicropythonやってみた。
pioアセンブラを、調べてみた。

#疑似命令編

#nop
nop命令
ノーオペレーション

#word
？


#label
ラベル命令
ラベル

#wrap_target

無限ループの始まり。

#wrap

無限ループの終了。

以上。
1.12より前のAndroidプロジェクトのアップグレード方法 (requires your app to be migrated to the Android embedding v2. flutter の対処方法)

##ステップ１

```dart:MainActivity.java 
import android.os.Bundle;
import io.flutter.app.FlutterActivity ;
import io.flutter.plugins.GeneratedPluginRegistrant;
```

public class MainActivity extends FlutterActivitｙ{}メソッド内の

```dart:MainActivity.java 
@Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  GeneratedPluginRegistrant.registerWith(this);
}
```
を消す。

##ステップ２

```dart:MainActivity.java 
import io.flutter.embedding.android.FlutterActivity;
```
を追加。


```dart:AndroidManifest.xml  
android : name="io.flutter.app.FlutterApplication" 
```


```dart:AndroidManifest.xml 
<meta-data>
```
を消す。

##ステップ3

```dart:AndroidManifest.xml
  <!-- Specify that the launch screen should continue being displayed -->
  <!-- until Flutter renders its first frame. -->
  <meta-data
    android:name="io.flutter.embedding.android.SplashScreenDrawable"
    android:resource="@drawable/launch_background" />
``` 
を追加。

##ステップ4


```dart:AndroidManifest.xml
<meta-data
  android:name="flutterEmbedding"
  android:value="2" />
``` 
を追加。

引用
(https://github.com/flutter/flutter/wiki/Upgrading-pre-1.12-Android-projects)
【2層目:データリンク層】Ethernet(イーサネット)とは？

#OSI-model
データリンク層は、ＯＳＩ参照モデルの下から２番目、物理層の次に位置しています。

![Osi-model-jb.svg.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1162957/37af099e-a175-6e58-2c63-a1abdb5118be.png)


##データリンク層とは?

データリンクが何かと一言で言うならば、**プロトコル**です。
何のためのプロトコルかというと、物理層で直接つながれた機器間でのデータの識別と転送です。

データリンクには複数のプロトコルがあります。その一例が以下の表です。

| データリンク名 | 規模 |伝送速度 | 通信媒体 |
|:-:|:-:|:-:|:-:|
|Ethernet   |   LAN| 10Mbps  |  同軸ケーブル<br>ツイストペアケーブル<br>光ファイバーケーブル |
| Fast Ethernet  |  LAN | 100Mbps  |  ツイストペアケーブル<br>光ファイバーケーブル |
|   Ggabit Ethernet|  LAN | 1Gbps  |   ツイストペアケーブル<br>光ファイバーケーブル |
|Bluetooth|LAN|下り723k,上り57k |-|
|10Gigabit Ethernet  |   MAN| 100Mbps  | 光ファイバー|

みんながなじみがあるのは,bluetoothだと思います。このプロトコルもデータリンクに属します。

通信媒体には、赤外線、光ファイバー、電波、同軸ケーブル、ツイストペアケーブル、などいろいろな種類がある。


####詳しく書くと

隣のネットワーク機器にフレームを転送するきまりを司る。
データを送信する場合、フレーム*1を2進数の電気信号などに変換(送信したいデータを01001010101のように変換)して、物理層で送信する。送信先の物理層で電気信号を受信して、2進数のデータをフレームに再度変換する。

この時に、送信側と、受信側のデータの決まりを作っておかないとやり取りが正しくできない。ユーザ事に決まりを作るとネットワーク間でのやり取りが大変になる。会話などで例えるなら、送信側が日本語で送っても、受信側が英語でしか解釈できない場合、情報の正しい伝達ができない。

ユーザの数だけ独自の解釈方法が生まれてしまうので、何語を使うかということを規定することで汎用的なやり取りができるようにする必要が生まれた。
その正しい情報伝達をLAN上で実現するために作られた規格が、Ethernetである。

１*フレームは、ほぼパケットと同じ意味。データリンクで使われる用語
#

##LAN・WAN
とは

LAN (Local Area Network)つまり近くを結ぶネットワーク。キャンパス内や1つの建物の中など、狭いつながり。

WAN (Wide Area Network)は、LANとLANを結ぶことで生まれる広いネットワークを指す。

##Ethernetとは

- LANの規格の一種

LANの中で、高いシェアを誇るのがEthernet。
Dec Intel Xeroxの三社共同でDIX規格を作りIEEE802.3で標準化された。

*IEEE（アイトリプルイー）とは、米国電気電子技術者協会のこと。
IEEE802は、LAN関連の規格に関する委員会
IEEE802.3は、Ethernetに関する規格

イーサネットの規格では、
コネクタの形状、ケーブルの種類、フレームの形状、信号、媒体アクセス制御などについて定められてる。


*媒体アクセス制御とは送信権を誰が得るか決めるための方式。LANは、1本の線をみんなで共有しているから誰が送るのか決めなければならないから。

##その他の規格

なじみ深いものとしては、Bluetooth

そのほか、最近はほぼ普及していないが、
FDDI , ATM , PPPなどが存在している。

##フレームの形状


|プリアンブル(8)|宛先MACアドレス(6)|送信元MACアドレス(6)|タイプor長さ(2)|データ(~1500)|FCS(4)|
|---|---|---|---|---|---|

かっこの中はバイト数

Ethernetの規格では、上記の形のフレーム単位でデータを送信する。

* プリアンブル　これからフレームが始まることを示すデータ
* MACアドレス　イーサネットなどのLANが使用する物理アドレス
* タイプ　　　　上位層のプロトコルを識別するための値(DIX規格）
* 長さ　　　　　フレームの長さ（IEEE802.3規格)
* FCS　　　　　エラー検出用のCRCコード

＊CRCとは、誤り検出方式の一つで、データを値とみなしてある定数で割った余り（余剰）を用いて誤りの検知を行なうもの。 その検査用の値をCRC値、CRC符号、巡回冗長符号などと呼ぶが、値自体をCRC（Cyclic Redundancy Code）と呼ぶこともある。

##MACアドレス

MACアドレスは物理アドレスと呼ばれている。LANは一本の線で複数のコンピュータを結ぶので、そのコンピュータ自体に物理的なアドレスを持たせることで、情報を送るべきところを判定している。

LANを通して、一斉に情報が送られる。その時に、宛先のMACアドレスとコンピュータ自体が持つMACアドレスが一致する場合、情報を受信する。宛先MACアドレスが異なる場合は、送られてきたデータを破棄することで、特定の送信先にデータを送ることを実現している。

EthernetなどのLANに接続する時には、**NIC**(Network Interface Card)が必要

このNIC(ニック）のROMにMACアドレス(物理アドレス）が焼きこまれている。NICはユニーク（unique:オンリーワンで）世界中に同じMACアドレスを持つNICはそれしかない。

MACアドレス上記の図でも書かれているように6バイトつまり48ビットの長さである。
![NIC.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1162957/bbc1cc25-b13f-49f6-0cb5-1105e8345a9b.jpeg)

上記の図がNIC（ネットワークインターフェースカード）
LANケーブルを挿す穴がついている。このカード一つ一つがユニークなMACアドレスを持ち、データの送信先を識別するものとして機能している。
このカードを拡張スロットに増設することで、LANにつなぐことができる。また、ノートパソコンの場合は、最初から内蔵されている（ビルトイン）コンピュータも多い。


#####参考

* マスタリングTCP/IP

* CCNAネットワーク基礎講座「イーサネットって何？」
https://www.youtube.com/watch?v=heMazym79vM
JavaScriptの関数の定義の仕方

##はじめに

今回は**javascript**の**関数の定義の方法**について書いてみました。
大前提でこの記事は**RubyonRails**をある程度理解の上で書いてます。
でも初めての投稿なので参考になるかどうかわかりませんがよろしくお願いします。


##1.javascriptとは？

まずjavascriptの関数の定義の仕方が今回の記事の目的ですが
その前に**javascript**とは何かを簡単に説明していこうと思います。


**javascript**はプログラミング言語の一つで
Webアプリ開発現場では、**ほとんど使われている人気の言語です。**
javascriptを使うことで例をあげると
**画面を移動することなく画面の表示を切り替えることができる。**
（例：フリマアプリなどでトップページで欲しい商品のカテゴリを選択できる。)
このようにjavascriptを使うと、**とても便利な機能がついたアプリケーションを開発できます。**

ここではjavascriptの簡単な説明は以上です。



##2.javascriptの関数とは？

javascriptの関数の定義の仕方を理解するにはまず、**JavaScriptの関数**について知らなければなりません。

さっそくですがjavascriptの関数とは**Rubyでいうところのメソッドのことを****javascriptでは関数と言います**
Rubyでメソッドを定義するときは

```
 def メソッド名
  
 end
  ```
と記述しましたが**javascript**では

```
function 関数名(引数){
  
}
```
というふうに**function**を使います。


##3.javascriptでの関数の定義

先ほども記述したとうりjavascriptで関数を定義するときは**functionを使い、**functionを使うことでその後の**関数を定義することができます。**

ちなみに**デベロッパーツール**という**検証ツール**を使うことで誰でも簡単にjavascriptのコードを
実行できます。

例：

```
function fruits(){
  console.log("りんご")
}　
 
fruits()
```
とコンソールに記述するとこのように

```
function fruits(){
  console.log("りんご")
}

fruits()

りんご
```
というふうにりんごと表示されます。

---
ここからは一つ一つ説明していきます

まず**function**という関数を定義するために必要なものを記述して
その後に関数**fruits**を定義しています。

そしてここで一つ重要なのが関数の隣の**()**この中には引数を定義するのですが
**引数を定義していなくても()は記述しなくてはいけません。**
記述していないとこのように

```
function fruits {
  console.log("りんご")
}

fruits()

✖️Uncaught SyntaxError: Unexpected token '{'　 VM⚪️⚪️:1
```
というふうに**Uncaught SyntaxError: Unexpected token '{'  VM136:1**のようなエラーが出ます。
このエラーは**予期せないトークン**が入っていますよというものです。
もうちょっと簡単にいうと**変な記号が入っているよー**ということになります。

〜tokenの後ろに記述されているのが変な記号の部分です
つまり今回は **'{'** が変な記号となります。

ですが **{ }** はこの中に処理を書くので必要不可欠です。なので
'{'の後ろの**VM⚪️⚪️:1**という記述をクリックするとエラーが起こっている行(今回は **:1**となっているので一行目)を教えてくれます。

そして今回は引数を記述する **( )** がないのでこれを記述するとエラーが発生せずりんごが表記されます。


次は **{ }** のなかに書いてある

```
function fruits(){
  console.log("りんご")
}

fruits()
```

 **console.log** ですがこれは**コンソールにメッセージを出力できる関数**です。
自分はRubyでいうところの**puts**だと思っています。


最後に**関数( )**と記述することでメッセージを出力できます。
(今回は**fruits( )**)


##4.あとがき

今回はjavascriptの関数定義の仕方の一部を紹介させていただきました
まだjavascriptの関数定義には

**関数名なしで関数を定義できる無名関数**
**関数を定義するとすぐに実行される即時関数**
**より省略した記述にできるアロー関数**
があります。これはまた他にて説明したいと思います。
署名付きURLのリージョン指定を間違えたメモ

コマンド実行時に正しいリージョン(エンドポイント)を指定できていなかった結果、
署名付きURL…ちゃんと発行できてるのに…なんや301って…
となって若干はまったのでメモ。

#### 状況
↓のようにデフォルトで東京リージョンが指定されている状態で、us-east-2にあるオブジェクトに対して署名付きＵＲＬを発行。(PowerShellからCLIで実行)

```PowerShell
> aws configure
AWS Access Key ID [********]:
AWS Secret Access Key [********]:
Default region name [ap-northeast-1]:
Default output format [yaml]:
```

```PowerShell
> aws s3 presign s3://mybucket/test.csv
https://s3.ap-northeast-1.amazonaws.com/mybucket ...
```

一見問題なさそう。

#### 結果
ダウンロードできない

```PowerShell
> curl -o test.csv "https://s3.ap-northeast-1.amazonaws.com/mybucket ..."
curl : リモート サーバーがエラーを返しました: (301) 完全に移動したリダイレクト
発生場所 行:1 文字:1
+ curl -o test.csv "https://s3.ap-northeast-1.amazonaws.com/mybucket ...
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo          : InvalidOperation: (System.Net.HttpWebRequest:HttpWebRequest) [Invoke-WebRequest]、WebExce
    ption
    + FullyQualifiedErrorId : WebCmdletWebResponseException,Microsoft.PowerShell.Commands.InvokeWebRequestCommand
```

#### 対応
正しいリージョンを指定

```PowerShell
> aws s3 presign s3://mybucket/test.csv --region us-east-2
https://s3.us-east-2.amazonaws.com/mybucket ...
> curl -o test.csv "https://s3.us-east-2.amazonaws.com/mybucket ..."
```

#### その他メモ
ブラウザからアクセスするとエンドポイントが違うよって教えてくれます。

```xml
<Error>
<Code>PermanentRedirect</Code>
<Message>The bucket you are attempting to access must be addressed using the specified endpoint. Please send all future requests to this endpoint.</Message>
<Endpoint>mybucket.s3.us-east-2.amazonaws.com</Endpoint>
<Bucket>mybucket</Bucket>
<RequestId>********</RequestId>
<HostId>********</HostId>
</Error>
```