OmniAICreator/Qiita-1.07M huggingface dataset:
画像のアップロード機能　Active Storage 導入の仕方

## はじめに

アプリケーション作成にあたって、ファイルのアップロード機能の実装は、割と導入することが多いんじゃないかなーと思っています。

整理してまとめておこうと思います！



## Active Storage
Railsでは**Active Storage**というGemで画像などのファイルのアップロードを簡単にするメソッドが使用できたり、画像を保存するテーブルを簡単に作成できます。



現在Railsに統合されているのでいちいちGemfileに記述をする必要はないそうです。
*※その他に必要なGemがあるのでそちらは記述してインストールする必要があります*

##画像加工ツール
Active Storageでファイルをアップロードして保存しても、サイズや色などを加工することはできません。

そこで画像を加工できるように、画像変換ツールやGemをインストールします。


### ・ ImageMagick
まずはImageMagick。
これはGemではなくソフトウェアです。なので一回インストールしちゃえば、それ以降は基本的にいちいちコマンド実行する必要ないと思います！


コマンドラインから画像に処理を加えることができ、画像の作成やサイズ変更、保存形式の変更などができます。

Homebrewからインストールします。

```:ターミナル
% brew install imagemagick
```

### ・ MiniMagick
こちらはGemです。
先ほどのImageMagickをRubyで扱えるようにしてくれます。


### ・ ImageProcessing
こちらもGemです。

MiniMagickによってImageMagickがRubyが使えるようになったのですが、サイズ調整はできないみたいです。
そこでこのImageProcessingがサイズ調整を担当してくださるそうです。


なんだか、ややこしいですね。。。
魔法を使うにも下準備はたくさんしてあげないとってことなんでしょうか 笑
魔法陣を描いてると思って導入しちゃってください！

```:Gemfile
# Gemfileの一番下に記述する

gem 'mini_magick'
gem 'image_processing', '~> 1.2'
```

からの

```:ターミナル
% bundle install
```

画像加工ツールはこれでOKです

## Active Storage インストール
ターミナルで下記のコマンド入力で完了です

```:ターミナル
% rails active_storage:install

% rails db:migrate
```

データベースを確認して
[active_storage_attachments]と[active_storage_blobs]
というテーブルが作成されていれば、導入成功です。


## どうやって保存するのか

おそらく画像をアップロードして保存する時は他の情報も一緒に保存することが多いと思います。
例えばメッセージと一緒に画像を添付して保存とか

でも、メッセージのテーブルとは別にActive Storageのテーブルが用意されています。なのでその二つのテーブルのアソシエーションを組んであげて関連づけてあげれば問題なしです！
 *※メッセージのテーブルに:imageとかのカラムを作成する必要はありません！！*



上記の例でmessagesというテーブルにレコードが保存される時、画像を添付して保存する方法を説明します。

## アソシエーションを定義

Active Storageのテーブルと messagesテーブルのアソシエーションを組みます。

そのために**has_one_attachedメソッド**を使います

has_one_attachedは各レコードとファイルを1対1の関係で紐づけるメソッドです。
has_one_attachedメソッドを記述したモデルの各レコードは、それぞれ1つのファイルを添付できます。

今回の場合messageモデルに下記のように記述します

```Ruby:app/models/messages.rb
class Message < ApplicationRecord
  has_one_attached :image
end
```

これでアソシエーションは組めました。
あとはmessageのストロングパラメーターに:imageも許可してあげたら、メッセージ送信時に添付されているファイルはActive Storageのテーブルへ保存されるはずです。

## おまけ

最後に、Active Storage関連で重要そうだから名前とざっくりとした役割だけ書いといて、詳しい使い方は調べたり別の回でまとめようと思っているものたちを適当に書いておきます。

### image_tagメソッド
画像関連のimg要素を生成するヘルパーメソッド
ビューですごくご活躍されているイメージ

### attached?メソッド
ファイルが添付されてたらtrue
されてなかったらfalseを返してくれる
オブションでifと一緒に使ってあげると便利そう

### variantメソッド
ファイルの表示サイズが指定できる
'幅 x 高さ'みたいな感じで大きさ調整するみたいなんですが、[ x ]はエックスらしいので、なんだか、それは覚えておこうと思った
E資格 応用数学 レポート

## はじめに
ラビット・チャレンジ Deep Learning 「応用数学講座」の受験レポート
要点のまとめと、確認テストについての考察（感想）


## 要点
### 第１章 線形代数
#### スカラー・ベクトル・行列
スカラー＝普通の数、ベクトル＝スカラーのセット、行列＝スカラーを表にしたもの。
行列の発想は連立方程式の研究から生まれたとのこと。

#### 逆行列
逆行列をかけることで、行列の割り算を表現できる。
割り算を表現するために逆行列の計算が必要ということになる。
逆行列は掃き出し法で計算可能。

#### 固有値・固有ベクトル・固有値分解
正方行列限定

固有値を求めてから固有ベクトルを求める。
固有値を求めるときに2次方程式の解の公式を使用。
～＝０の式の場合、固有値が簡単に求めれる。

固有ベクトルは、固有値を使用して行列の積で方程式を解き、定数倍（比率）を求める。

固有値分解：A=VΛV^-1
Vは固有ベクトルを並べた行列
Λは固有値を対角線に並べた行列
V^-1は逆行列を計算

#### 特異値分解
正方行列以外で固有値分解したいとき（あくまで似たようなこと）

特異値分解：M=UTV^T

正方行列でない行列Mを特異値分解するとき、
MM^Tを固有値分解して
UとS^2を求める。
Uはそのまま使用
SはS^2のルートをとる

M^TMを固有値分解して、V^-1を求めることができる。
直行行列なのでV^-1＝V^Tになるため、
転置することでV^Tとして使用できる。
それぞれ求めたUTV^Tを並べて完成

特異値分解は画像のデータ量を小さくするのに使用できるとのこと。


### 第２章 確率・統計
#### 条件付確率
ある事象X=xが与えられた下で，Y=yとなる確率。
言葉でいうと難しいが、ベン図を描くと理解しやすい。

#### ベイズ則
P(A)P(B|A)=P(B)P(A|B)
これもベン図を描けば直感的に理解可能

#### 確率変数
事象と結び付けられた数値。
プログラムの変数とはイメージが異なる。


#### 期待値
その分布における確率変数の平均の値 or ありえそうな値
P(X)f(X)のSUMのことと理解した方がよいか。


#### 分散・共分散
分散：データの散らばり具合
E(f(X)^2)-(E(f))^2

共分散：データ系列の傾向の違い
E(f(X)^2)-(E(f))^2


#### 確率分布
ベルヌーイ分布：コイントスのイメージ
𝑃(𝑥|𝜇)=𝜇^x(1-𝜇)^(1-x)

マルチヌーイ分布：さいころを転がすイメージとのこと

他：二項分布やガウス分布など

### 第３章 情報理論
#### 自己情報量
どれだけレアか
-log(P(x))

#### シャノンエントロピー
自己情報量の期待値
-SUM(P(x)log(P(x))

#### カルバックライブラーダーバージェンス
同じ事象・確率変数における異なる確率分布P,Qの違い

#### 交差エントロピー
KLダイバージェンスの一部分を取り出したもの
Qについての自己情報量をPの分布で平均


## 確認テストについての考察（感想）
### 第１章 線形代数
確認テストの特異値分解の問題が全く理解できなかったが、動画を見返し、計算式の何が答えにつながるかを改めて整理することで、何とか回答することができた。
計算に時間がかかるため、Ｅ資格で実際に解く際には、答えが特定できるところでやめる戦略も必要となるかもしれない。


### 第２章 確率・統計
用語の説明（定義）が問題に書かれていたので回答することができたが、確率用語が自分としては直感的にわかりにくいこともあり、用語の説明がない問題に対応するため、もう少し問題のパターンをこなしたいと思った。


### 第３章 情報理論
計算式を暗記したので問題には答えれたが、何に使うのか理解しきれていない。
この後の機械学習・ディープラーニングで用語が出た際に復習することで、理解度を高めたいと思う。
SwifUIでボタンを押したか押さないかでAlertの表示を変える

前回は、ボタンを２回目押すときは１回目押した時と同じアラートが出てそれを押すと戻るというものでした。
しかし、それでは少しかっこが悪いので、なんとかならないかと調べていたら@cloudsnowさんの投稿
https://qiita.com/cloudsnow/items/0e0e3550c7410971b03d
が自分のやりたいことに近い内容だったため、これを参考にさせていただき作ることができました！

ShowAlertFlagsとflagsの関係を頭の中で整理しないといけないのでとても難しかったです
また、@cloudsnowさんの投稿でもおっしゃていたようにif文だとalertが表示されず、自分のコードの書き方もあると思いますが、上手く行きませんでした。

```swift
struct ContentView: View {
    @State var array = ["あいうえお","かきくけこ","さしすせそ","たちつてと","なにぬねの","はひふへほ","まみむめも","やゆよ","らりるれろ","わをん"]
    @State var ShowAlertFlags = Array(repeating: false, count: 10)
    @State var flags = Array(repeating: false, count: 10)
    
        
    var body: some View {
            ScrollView{
                ForEach(0..<array.count) { num in
                    Button(action: {
                        self.ShowAlertFlags[num].toggle()
                    }) {
                        Text(array[num])
                                 .font(.title2)
                                     .fontWeight(.black)
                                     .foregroundColor(Color.white)
                                     .multilineTextAlignment(.center)
                                     .padding(.all)
                                     .background(Color.blue.opacity(0.5))
                                     .cornerRadius(5)
                                     .padding(.all)
                            .shadow(color: .gray, radius:flags[num] ? 0:4, x: flags[num] ? 0 : 5, y: flags[num] ? 0 : 5)
                            .offset(x: flags[num] ? 5 : 0,y: flags[num] ? 5 : 0)
                    }.alert(isPresented: $ShowAlertFlags[num]) {
                        switch(flags[num]) {
                            case false:
                                return Alert(title: Text("このボタンを押す"),
                                             primaryButton:.default(Text("いいえ")),
                                             secondaryButton: .default(Text("はい")){
                                                self.flags[num].toggle()
                                             })
                            case true:
                                return Alert(title: Text("戻す？"),
                                             primaryButton:.default(Text("いいえ")),
                                             secondaryButton: .default(Text("はい")){
                                                self.flags[num].toggle()
                                             })
                        }
                    }
               }
        }
    }
}
```

<img width="300" alt="swiftui.gif" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1104236/190d7ea2-6cdf-fb30-c320-640c67cae7d9.gif">
seeds.rbの情報を本番環境に反映させたくない時

##状況
ローカル環境をCloud9で構築、EC2環境にアプリをデプロイしている状況です。
そこでseeds.rbに記載した情報を本番環境に反映させたくなかったので、その対処法です。
seeds.rbには管理者ユーザーのログイン情報を記載しており、GitHubにその情報を載せるとセキュリティ上良くないので、GitHunbへのpushは行っていません。

##作業

まず結論としては、seeds.rbの内容を反映させるためのコマンドを「rake db:seed RAILS_ENV=production」
ではなく、「rake db:seed」としていたことです。

では順番にエラー遭遇と上記コマンド入力までの流れをみていきます。

今回GitHubにseedsファイルの情報は載せていないので、本番環境上で追記してあげます。

```:本番環境のターミナル
アプリ名 $ vi db/seeds.rb
#なければtouch db/seeds.rbにて作成
```

```:db/seeds.rb
 User.create!(
  name: "管理者",
  email: "admin@example.com",
  password: "admin",
  password_confirmation: "admin",
  admin: true)
```

次に設定を反映させます。

```:本番環境のターミナル
アプリ名 $ rake db:seed
```
これだと失敗します。
本番環境でログインしてみますが、ログインできません。

きちんとデータ保存できているのか確認するために、一度コンソールを開いてみます。

```:本番環境のターミナル
アプリ名 $ rails c
[1] pry(main)> User.all
   User Load (0.3ms)  SELECT `users`.* FROM `users`
   => [#<User:0x0000000005adab60 id: 1, name: "管理者", email: "admin@example.com", password_digest: "[FILTERED]", created_at: Tue, 25 May 2021 14:33:34.000000000 UTC +00:00, updated_at: Tue, 25 May 2021 14:33:34.000000000 UTC +00:00, admin: true>,
```

あれ、保存されている…？
タイプミスがあったのかと思い再度ログインを試みるが、全くログインできる気配無し…。

調べたところ「rake db:seed RAILS_ENV=production」にて反映させる必要があるとのこと。
という訳で入力してみます。

```:本番環境のターミナル
アプリ名 $ rake db:seed RAILS_ENV=production
```

これで無事反映されて、ログインできるようになりました。

ユーザー情報が保存されていた為理由が分からず焦ってしまいましたが、本番環境にしっかりと反映させるためにRAILS_ENV=productionを明示する必要があると学びました。
Cisco Smart License(スマートライセンス)対応している機種/IOSバージョンって？

##Cisco Smart Licensing とは

Cisco機器を利用するときに必須となる認証方法。

参考

https://www.cisco.com/c/ja_jp/products/software/smart-accounts/software-licensing.html

##対応している機種/バージョンについて

ページの上の方に表示されている【View Smart-Enabled Product Families】をクリックすればExcelファイルで一覧が入手でき、どの機種とバージョンがsmartlicense対応なのかがわかる


https://www.cisco.com/c/en/us/products/software/smart-accounts/software-licensing.html

■Current Licensing　（現在の対応ライセンス）
　Smart Only か Hybrid のどちらかが記載されている。
　Hybridであれば従来のlicenseでも可。

■First Hybrid Release Date　（最初のハイブリッドリリース日）

■First Hybrid Version　（最初のハイブリッドバージョン）

■First Smart Only Release Date　（最初のスマートオンリーリリース日）

■First Smart Only Version　（最初のスマートオンリーバージョン）

■First Smart Licensing　（最初のスマート ライセンス）

■Smart Licensing Documentation　（スマート ライセンスのドキュメント）
　各機種のSmartLicenseに関する詳細なページのリンクが記載されている



##まとめ
私個人的には一度SmartLicenseで引っかかった。
VIRL（Virtual Internet Routing Lab）（現バージョンはCML）を利用するとき、
インターネット経由で認証する際に特殊なポート番号を利用することを知らず、
なかなか認証されず困った。

個人で購入する分にはどれでも問題無いが、法人で購入する場合、smartlicenseのみ対応なのか、従来のlicenseで良いのか、意外と気にするポイントになってくる。
購入した後で実はsmartlicenseのみ対応でしたとかなると取り返しがつかないことに...

上記のCiscoのサイトは常に最新版には更新されていないようなので、
購入ベンダに確認するのが一番の方法です。

※間違いがあればご指摘ください。
勉強メモ22_Windowsコマンドのrobocopyを利用してミラーリング（コピー元のフォルダの中身全てをコピー先のフォルダに複製、更新、削除）

#1 はじめに
サーバーにあるフォルダの中身全てをローカルにコピーする際、
Ctrl+C、Ctrl+Vでもできるが、Windowsコマンドのrobocopyを利用して、コピーしてみる
※サーバーは用意していないので、今回はローカル⇒ローカルで実施

#2 コピー実施前のコピー元情報とコピー先情報
```shell:コピー元情報
#1 C:\RoboInの中身を確認 
C:\RoboIn>tree /F

C:.
├─01_要件定義
│      ├─aaaa.txt
│      ├─あああ.txt
│
└─02_基本設計
    │  ├─いいいい.xlsx
    │
    └─bk
       ├─ver1_いいいい.xlsx
```

```shell:コピー先情報
#1 C:\RoboOut\このフォルダーにコピーするの中身を確認
C:\RoboOut\このフォルダーにコピーする>tree /F
サブフォルダーは存在しません
```

#3 robocopyを利用してミラーリング実施

```shell:
#1 cdコマンドでC:\RoboOutに移動
C:\>cd C:\RoboOut
#2 robocopy実施
C:\RoboOut>robocopy "C:\RoboIn" "%cd%\このフォルダーにコピーする" /MIR /DCOPY:DAT

-------------------------------------------------------------------------------
   ROBOCOPY     ::     Windows の堅牢性の高いファイル コピー
-------------------------------------------------------------------------------

  開始: 2021年5月29日 18:09:03
   コピー元 : C:\RoboIn\
     コピー先 : C:\RoboOut\このフォルダーにコピーする\

    ファイル: *.*

  オプション: *.* /S /E /DCOPY:DAT /COPY:DAT /PURGE /MIR /R:1000000 /W:30

------------------------------------------------------------------------------

                           0    C:\RoboIn\
        新しいディレクトリ       2      C:\RoboIn\01_要件定義\
100%      新しいファイル                       0        aaaa.txt
100%      新しいファイル                       0        あああ.txt
        新しいディレクトリ       1      C:\RoboIn\02_基本設計\
100%      新しいファイル                    6190        いいいい.xlsx
        新しいディレクトリ       1      C:\RoboIn\02_基本設計\bk\
100%      新しいファイル                    6190        ver1_いいいい.xlsx

------------------------------------------------------------------------------

                  合計     コピー済み      スキップ       不一致        失敗    Extras
   ディレクトリ:         4         3         1         0         0         0
     ファイル:         4         4         0         0         0         0
      バイト:    12.0 k    12.0 k         0         0         0         0
       時刻:   0:00:00   0:00:00                       0:00:00   0:00:00


       速度:              651578 バイト/秒
       速度:              37.283 MB/分
   終了: 2021年5月29日 18:09:03

C:\RoboOut>

```

#4 robocopy実施後の中身確認(コピーできていることを確認)

```shell:コピー先の中身
C:\RoboOut>tree /F
フォルダー パスの一覧:  ボリューム ローカル ディスク
ボリューム シリアル番号は 14XX-B2XX です
C:.
└─このフォルダーにコピーする
    ├─01_要件定義
    │   ├─aaaa.txt
    │   ├─あああ.txt
    │
    └─02_基本設計
        │───いいいい.xlsx
        │
        └─bk
           │─ver1_いいいい.xlsx
```

#5 おしまい
Xcode オートコンプリート（コード補完）のアイコンの意味

Xcodeオートコンプリートの略号のチートシートです。

## 例
![スクリーンショット 2021-05-29 17.19.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/505421/4e012b89-85cf-034d-9808-8cc192690c11.png)
このコード補完の一番左にあるカラフルなSとかVとかの意味です。

## まとめ
| 色 | 略語  | 意味       |備考|
|:--:|:-------:|:-:|:-:|
|紫🟪 |C|Class|クラス
|紫🟪|CE|Class Extension|
|紫🟪| Pr|Protocol|プロトコル
|紫🟪| S | Struct |構造体
|橙🟧|E|enum|列挙型
|橙🟧|T| Type|型
|橙🟧|Ex| Extension|
|緑🟩|f|function|関数
|緑🟩|F|Field|フィールド
|緑🟩|K|constant|
|緑🟩|L|Local variable|ローカル変数
|緑🟩|O| IBOutlet|
|緑🟩|V| Variable|変数
|緑🟩|x| parameter|引数
|青🟦| A|IBAction|
|青🟦|M|Method|メソッド
|青🟦|P| Property| プロパティ
|灰⬜| {}| snippets|
|茶🟫|C  | modeled Class  |
|茶🟫|M|modeled Method|
|茶🟫|P| modeled Property| 


## 参照
Xcodeでコードを書いていると、オートコンプリート（コード補完）が出現しますが、意味がわからないものがあったので、まとめてみました。
公式では見つけられず、AppleのDeveloper Forumsとstack overflowを参考にしました。
https://developer.apple.com/forums/thread/131642
https://stackoverflow.com/questions/6662395/xcode-intellisense-meaning-of-letters-in-colored-boxes-like-f-t-c-m-p-c-k-etc
クリップボードにテキストをコピーするボタンの実装

GitHubでレポジトリのURLをクリップボードにコピーするボタンありますよね。
そんな感じのボタンをJavaScript（React）で作りたかったので調べました。

## Clipboard APIを使おう

Clipboard APIを使うと簡単に実装できます。
Clipboard APIはIE以外ほぼすべてのブラウザでサポートされています。

クリップボードコピーの方法を調べるとまず最初に出てくるのが`execCommand`ですが、こちらは最近のブラウザではサポートされてないらしく、Mozillaでも使わないよう警告されています。
Clipboard APIはその代替手段という感じでしょうか。

以下のような関数を作ればコピー機能を実装できます。

```js
function copyTextToClipboard(text) {
  navigator.clipboard.writeText(text)
  .then(function() {
    console.log('Async: Copying to clipboard was successful!');
  }, function(err) {
    console.error('Async: Could not copy text: ', err);
  });
}
```

### ポイント： `writeText`メソッドを使う

`writeText()`でプレーンテキストをクリップボードにコピーすることができます。
返り値は`Promise`なので、`then`などを使って適切に処理する必要があります。

プレーンテキスト以外をコピーする場合は、`write`メソッドを使います。
また、逆にクリップボードにコピーされているものを取得する際は、`readText`や`read`メソッドを使います。

### ボタンの実装

これは単純に`onClick`イベントに↑の関数を指定するだけです

```react
<Button onClick={() => copyTextToClipboard()}>
  Copy!
</Button>
```

### おまけ ： ボタンクリックしたときに「コピーしたよ！」とメッセージを出したい

ボタンをクリックするだけだとコピーされたかどうか分かりにくいのでメッセージを表示してあげたいですよね。
こんな感じ
![スクリーンショット 2021-05-29 17.50.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/385478/ff18b570-7a9b-4f72-312b-b35944b2a9f0.png)

自分はデザインライブラリとして[Semantic-UI](https://react.semantic-ui.com/)を使っているので、簡単に実装できました。
`semantic-ui-react`の`Popup`パターンを使います。

```react
<Popup
  trigger={
    <Button onClick={() => copyUrlToClipboard()}>
      <Icon name='linkify' />
      <div>リンクを<br/>コピー</div>
    </Button>
  }
  content='Copied!'
  on='click'
  position='left center'
/>
```

---

## 参照
- [Clipboard - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard)
- [Async Clipboard APIでJavaScriptからクリップボードを操作する](https://sbfl.net/blog/2018/03/03/async-clipboard-api/)
- [ブラウザ上でJavaScriptを利用したクリップボードへのコピー機能の実装Clipboard API版](https://www.seeds-std.co.jp/blog/creators/2019-12-24-145415/)
- [Document.execCommand() - Web API | MDN](https://developer.mozilla.org/ja/docs/Web/API/Document/execCommand)


間違っている点や説明が足りない部分がありましたら、コメントして下さい！ ><
chromebookにandroidアプリをインストールするまで

2021/2/19に書いたもの．
cordova開発環境で開発したandroidアプリをwifi経由でデベロッパモードのchromebookにインストールする．そして開発環境PC側(以降PC側と表記)でchromeブラウザのデベロッパツールを用いてchromebook 上のandroidアプリをデバッグする．以上の環境の構築の手順をまとめる．

## 前提  
* cordova開発環境が準備されている
  <https://qiita.com/danishi/items/c7656d45bde73bf62feb>  

* adbコマンドが使える(覚えていないがググればすぐだった気がする)
  <https://sp7pc.com/google/android/34263>

* chromebook をデベロッパモードにしてある
  <https://qiita.com/kurun_pan/items/252487246bc45d986b97>  

* chromebookとPCが同一ネットワークに接続されていること
  wifi経由でchromebookにインストールするので

## chromebook側の設定
1. chromebook を起動したら Ctrl + Alt + 「→(F2相当の位置)」キー を押してシェル画面に  
2. chronos と入力してログイン(パスワードいらない)
3. 以下のコマンドを入力
  
   ```
   chronos@localhost / $ sudo /usr/libexec/debugd/helpers/dev_features_rootfs_verification
   chronos@localhost / $ sudo reboot  //再起動
   
   再起動後，再びログインして以下のコマンドを入力

   chronos@localhost / $ sudo /usr/libexec/debugd/helpers/dev_features_ssh
   ```
Ctrl + Alt + 「←(F1相当の位置)」キー でシェル画面からデスクトップ画面に切り替えられる  

* 注意  
  この1-3の手順はchromebookを一度電源オフにしたらその度ににやり直す必要がある．
  シェルの画面ではUS配列と認識されるらしく「_」を入力するときはJIS配列だとShift + 「0の右隣の-」

* ipアドレスの確認  
  シェル画面でifconfigコマンドでローカルネットワークのipアドレスをメモしておこう．
  192.168.--.-- 的なやつ．後で使います． 

## PC側の設定
windows のコマンドプロンプトを開いて以下のようなコマンドを入力

```
$adb kill-server
$adb connect 192.168.--.--:22    #先ほどchromebook側で確認したipアドレス
connected to 192.168.3.7:22
$adb devices
192.168.--.--:22 device # こんなかんじに出力されればOK
```

* 注意  
  adb devices コマンドの出力結果で「ipアドレス  unauthorized」と標示されることがある．  
  このように device の表示にならないとandroidアプリをchromebookにインストールする手順に進めない．  
  unauthorized，device などの表示に関しては本マニュアル最後の「そのほか参考」の1項目を参照．  
  このようなときはPC側を再起動して上記のadb kill-server から再開するとよいです．

### android アプリのchromebookへのインストール (PC側の操作)
ここでは cordova環境でandroidプラットフォームを追加しandroid用にビルドされているとする．つまり，

```
$ cordova emulate android
```

このコマンドでandroidアプリをエミュレータで起動できる状態にした．
では以下のディレクトリに移動．

```
/プロジェクト名/platforms/android/app/build/outputs/apk/debug
```
このディレクトリにはapp-debug.apkというapkファイルがある．これを以下コマンドでchromebook にインストールする．

```
$ adb install -r app-debug.apk
Performing Streamed Install
Success
```
このよう表示されたら，chromebookを見てみるとアプリがインストールされたのを確認できる．  

## PC側からアプリをデバッグする
chromeブラウザで <chrome://inspect/#devices> にアクセス．　　
1. Devices欄のconfigureボタンをクリックし「chromebookのipアドレス:ポート番号(22)」と入力しDoneクリック  
2. 上の設定を終えた後，chromebookでインすとーすしたアプリを起動すると PC側のRemote Target欄
の一番下にinspectボタンが現れるのでクリックすると，デベロッパツールが起動する．デベロッパツールのUIでデバッグができるようになる．

以上  

## そのほか参考
* <https://news.mynavi.jp/article/androidnow-145/#:~:text=adb%E3%81%A8%E3%81%AF%E3%80%81%E3%80%8CAndroid%20Debug,%E3%81%99%E3%82%8B%E3%81%9F%E3%82%81%E3%81%AE%E3%82%82%E3%81%AE%E3%81%A7%E3%81%99%E3%80%82>
本サイト表01はdevice, unauthorized 等の状態の解説がある．

* <https://support.google.com/chromebook/answer/1080595?hl=ja>
  chromebook のデベロッパモードをもとに戻す際に復元する必要がある．
【個人アプリ開発】アプリ公開後半月で利用者がいない状態での改善案

#概要
アプリ開発するために学習してアプリを完成させたのに使ってもらえていません。
そこで使ってもらえない原因と解決策を考えました。

これからアプリを作ってみたい人、アプリを作ったけど使ってもらえない人にお役に立てれば幸いです。

#現状
アプリを作成し公開して半月が経ちましたが利用者が増えません。
具体的には身内含めて、利用者が4名という状態です。(内訳はQiita記事経由1名、他身内です。)
さらに、継続して使ってもらえていないので、実質利用者が0という状態です。

####告知したこと
利用者増加のためにしたこと
1. twitter（フォロワー100名ほど）での周知と
2. Qiitaでの記事作成とURLの貼り付け( https://qiita.com/saima88/items/bb041d6ee516c7636ba3 )

#3つの問題点
考えられる問題点として、以下3つを考えています。

1. 認知されていない
2. コンセプトが魅力的でない(メリットを提示)
3. 利用者のタスクが明確化でない(アプリで何をするのか)

####1. 認知されていない
まずアプリが認知されていおらず使ってもらえないという仮説です。

認知数が多ければ少なくとも訪問者数は増えるはずです。
なぜなら、ダメアプリでも多くの人に知ってもらえればアプリに訪れてくれるからです。

例えば、認知数1,000名の良いアプリと認知数100,000名のダメアプリなら後者の方が利用者数は多いと思います。

つまり利用者数を増やすには認知してもらう必要があります。

####2. コンセプトが魅力的でない
次に700名ほどに記事を読んでいただいているのに、訪問者数が1名なのはアプリのコンセプトに問題があるのではという仮説です。

コンセプトが魅力的であれば1％くらいは訪問してくれるはずです。
なぜなら魅力的なコンセプトはそれだけで多くの人に期待してもらえるからです。

例えば、**初心者からエンジニアになれる方法を伝える**と**記事を読んだ初心者のエンジニア転職を成功させる**の二つのコンセプトがあったとして、エンジニア転職を目指している人の1％は後者の記事を読むと思います。

このように魅力的なコンセプトは人を惹きつけると思います。
僕のアプリのコンセプトは目標設定を明確にするという誰得？なものになっているのでより魅力的なコンセプトにする必要があります。

####3. 利用者のタスクが明確化明確でない
最後に利用者のタスクが明確ではないのではという仮説です。

Qiita記事経由で訪問してくれた方がほとんどアプリを使っていなかったのですが、これはアプリ内で何をすれば良いのか分からなかったのではないかと考えています。

訪問者が何をするのか？これを簡潔に伝える必要があると考えています。

#解決策
問題の重要度として1〜3の順番で解決する必要があると考えています。
特に上位2つの**認知されていない**ことと**コンセプトが魅力的でない**ことは早急な対応をしようと考えています。

なぜなら使ってもらわなければ解決すべき問題が明確にならないからです。

####知ってもらう
認知を増やすためのタスクとして考えているのがQiita記事での宣伝です。
twitterを育てるよりQiitaがより多くの人に告知できると考えているためです。
実際に最初に添付した記事は700名ほどに読んでいただいており、この記事以外の記事も400名ほどの方に読んでいただけています。一方twitterは10名が見てくれていたら良い方でしょう。

長期的(数年？)に見るとtwitterの方が良いかもしれませんが、今は保留としています。(僕は複数のことを同時に進めるだけの集中力がないため)

####アプリの存在意義を明確にする
目標設定を明確にするというコンセプトですが、**誰の何を解決するのか？**これが明確になっていません。とヒトデさんのYoutubeを見ていて気づきました。

そこで、**エンジニアになりたい初心者のために目的を明確にしてモチベーションを保ちプログラミング学習に集中できる状態にする**をコンセプトにアプリ修正と広報してみることにしました。

アプリを作ろうと思った背景として、プログラミング学習に対するモチベーションが維持できない時期がありました。エンジニアになるために学習を始めたのにYoutubeや漫画を見たり、ブログも面白そうだなと集中できませんでした。

そういう不真面目な人が僕以外にもいるはず？たぶん、、、

#まとめ
せっかく頑張ってアプリ作ったのに使ってもらえないのは悲しいです。
100人ぐらいには使って欲しいので改善しつつ広報していきます。

プログラミング学習に集中できない初心者の方はぜひ使ってみてください！
https://amaimon-decision.herokuapp.com/
Exchange Online を我が社に合うように設定する

# Microsoft365 をカスタマイズ

Microsoft365 をグループウェアとして使おうとしたときにデフォルト状態だとユーザーに説明しづらいので、わかりやすい見た目に変えようと苦労した覚書きです。

1. Outlook でアドレス帳を開くと「All Address Lists」「All Contacts」など出てくるが日本語にしたい。不要なものは削除したい
2. Microsoft365 管理センターのリソースに追加した会議室は「All Rooms」にまとまって表示されるが備品はまとまらない。備品もまとめたい


今回は日本語に変更と備品をまとめるを実施しました。

## 事前準備

ExchangeOnlineで色々カスタマイズするにはPowerShellでの操作が必要なので事前に準備をしておきます。

### Exchange管理センターで管理者の役割追加

1.2.を変更するにはアドレス一覧(AddressList)を操作する必要がありますがMicrosoftのドキュメントにもあるようにデフォルトではできませんでした。以下手順で役割を追加してください。

> 既定では、Exchange Online のアドレス一覧の役割はどの役割グループにも割り当てられません。 アドレス一覧の役割を必要とするコマンドレットを使用するには、その役割を役割グループに追加してください。 詳細については、「役割グループの変更」を参照してください。

* Exchange管理センターで「役割」→「管理者の役割」で「役割グループを追加する」
* 名前を適当に決める「AddressList management」など
* 「アクセス許可」に「Address Lists」を追加して、「管理者」に管理ユーザーを追加する

※ 私の場合すぐには反映されず、翌日に操作できるようになっていました。

### PowerShellでExchagenOnlineに接続

Powershellを管理者として開き以下実行。すべてYesで進める。Microsoftアカウントのサインインは上で役割を追加したユーザーで。

```powershell:
Set-ExecutionPolicy RemoteSigned
Install-Module -Name ExchangeOnlineManagement
Connect-ExchangeOnline
```

## 「All Rooms」を「会議室」に変える

```powershell:
Set-AddressList -Identity "\All Rooms" -Name 会議室 -DisplayName 会議室
```

Identity や Name DisplayName を確認するのは以下コマンドでできます

```powershell:
Get-AddressList|Format-List
```
Nameを変えるとIdentityも会議室に変わってしまいましたので以後「会議室」で指定します

## 「会議室」の下層に「本社会議室」を作成

※ 本社の会議室はMicrosoft365管理センターのユーザーのところで事業所を「本社」にしています

```powershell
New-AddressList "本社会議室" -Container "会議室" -RecipientFilter "((Alias -ne `$null) -and (ResourceType -eq 'Room') -and (Office -eq '本社'))"

# 早くアドレスリストに反映させるためにUpdate-Recipientを実行します
# (参考) https://social.msdn.microsoft.com/Forums/ja-JP/fd0ed6da-263d-4adb-9531-1a10094bd00a/exchange-online?forum=exchangeteamjp
Get-Recipient -Filter (Get-AddressList "本社会議室").RecipientFilter | foreach{ Update-Recipient -Identity $_.Identity }
```

## 「備品」、「本社備品」を作成

会議室はフォルダにまとまっているのに備品はAll Usersの中から探さないといけないのでアドレスリストを作ってまとめます

```powershell
New-AddressList "備品" -RecipientFilter "((Alias -ne `$null) -and (ResourceType -eq 'Equipment'))"
New-AddressList "本社備品" -Container "備品" -RecipientFilter "((Alias -ne `$null) -and (ResourceType -eq 'Equipment') -and (Office -eq '本社'))"

Get-Recipient -Filter (Get-AddressList "備品").RecipientFilter | foreach{ Update-Recipient -Identity $_.Identity }
```

こんな感じで少しずつ我が社向けにカスタマイズしていきます。
プログラミング初心者がSwiftUIでCoreDataを使ってみた。

# CoreData
アプリ上のデータの保存、編集、削除、更新するプログラムを簡単にかける仕組みです。
データを簡単に扱えるので良いなぁと思いながら学習を始めたのですが、まずCoreDataの概念を理解するのに苦労しました。

画像のオブジェクトとデータベースの橋渡し役を担っているのが、CoreDataみたいです。
ここらへんの仕組みを理解しなきゃ！と思うと沼にハマっていくので、こんな仕組みで動いてるんだなぁくらいでいいのではないかと思います。
まだまだ理解ができていないところが多いので学習をしていきます。
## 📗参考文献
やっとわかったSwift/CoreData入門 【part1：概念編】
https://qiita.com/pe-ta/items/89203ccc72d964277818

SwiftUI × CoreDataでCRUD機能を持つ簡単なメモアプリを作ってみた
https://zenn.dev/tomsan96/articles/e76a1088bcf78d
Rook/Ceph 雑記

後で整理するかもするし、しないかもしれない。

# インストール時

万人が引っかかりっそうなチェックポイント。

Rook/Ceph わかってないやつのメモなので、直ちに信じてはいけない。自己責任。

## Helm でのデプロイ

* `image.tag` を明示したほうが良い。
    * デフォルトは master で、後述する問題の遠因になりうる。
* `csi.enableCSIHostNetwork` の設定をチェックする。
* `csi.provisionerPriorityClassName` は高めの値で設定したほうが安全。
    *  `addon-priority` とか `high-priority` とか。
* `csi.pluginPriorityClassName` `agent.priorityClassName` `discover.priorityClassName` も同様。
* `agent.flexVolumeDirPath` は公式に説明がある。必要に応じて設定しないと動かない(かもしれない)。

## CephCluster CRD

* `spec.cephVersion.image` は、想定しない(古い)バージョンのイメージを operator へ与えると、reconcile されない。適切に設定する必要がある。(Helm で「`image.tag` を明示したほうが良い」としたのは、これに掛かってくる)
* `priorityClassNames.all` 設定を行ったほうが安全。そして複数形であることに注意。
* `spec.network.hostNetworks` は必要なら `true`。
* `spec.storage.storageClassDeviceSets[].portable` は managed クラスタなど PVC-Based を選択できるとき、更にいうとノードのオートスケールを考えている場合は、 `true` を強く推奨。

## 運用

* Ceph が WARN (もしくは更に悪い)状態である場合、CephCluster CRD を変更しても、 operator は reconcile を行わない。
 * よって何かがおかしいときは Ceph クラスタを安定させる方を優先する。
* Ceph 層の運用、特に障害対応では toolbox コンテナを使う。
【ウェブデザイン技能検定3級】筆記対策_過去問チェックポイントまとめ(令和3年度版)

令和3年度のwebデザイン技能検定3級を初受験しました。学科の過去試験のおけるチェックポイント、キーワードについてまとめたため、試験前の総チェックにお役立てください。
##目次
[試験細目](#試験細目)
[項目](#項目)
[まとめ](#まとめ)

##試験細目
詳細は公式HPにて細目をご確認ください。
[■ウェブデザイン技能検定　試験細目](https://www.webdesign.gr.jp/img/2020/03/20190401.pdf)

##項目
####（１）インターネット概論
**①インターネットと技術：**
SSH、TLS、SFTP、SMTP、OS参照モデル、標準ポート番号、HTTPステータスコードなど

**②セキュリティに関する法律：**
不正アクセス行為の禁止等に関する法律、サイバーセキュリティ基本法、

**③不正アクセス・攻撃方法：**
パスワードリスト攻撃、ワーム、フィッシング詐欺、セッションハイジャック、マルウェア、クロスサイトスクリプティング（XSS)、DDoS攻撃、DoS攻撃
####（２）WWW法務
産業財産権、著作権、商標権
####（３）デザイン技術
**①タグ、プロパティ一覧**
blockquote、source、outline、q、fieldset、caption、font-style:oblique、marquee、acronym、dfn
（pタグなど基本的なものは省略）

**②その他確認事項**
・input typeの種類
・HTML5の変更点（[■HTML5リファレンス](http://www.htmq.com/html5/)）
・一部JavaScriptの知識
####（４）ビジュアルデザイン
・色の基礎知識（補色、光の三原色、色の三原色）
・画像ファイル形式とその違い（jpeg/gif/png/svg）
####（５）インフォメーションデザイン
ワイヤーフレームとサイトマップの違い
（前者は単ページ、後者は全体の設計図）
####（６）アクセシビリティ・ユニバーサルデザイン
アクセシビリティ、ユーザエクスペリエンス、ユニバーサルデザイン

####（７）その他
細目では以下も出題範囲に指定されていますが、常識問題のため対策は不要と考えます。
・ウェブ標準
・ウェブサイト運用・構築技術
・ウェブサイト運用・管理技術
・安全衛生・作業環境構築
##まとめ
　学科の過去試験のおけるチェックポイント、キーワードをまとめました。実際の試験では過去問からの出題は5割程度と少し心もとないため、理解不足を感じている項目があれば調べることをお勧めします。
M1 MacでFirebaseUIのビルドが通らない時の対処方法

# はじめに
**最新のFirebaseUIは、M1対応ができていますので本記事の対応する必要がありません。**
FirebaseUIを導入してシミュレーターを実行しようとビルドしたらエラーとなってしまいはまったのでその解決方法について調べたので共有します。

# エラーメッセージ
このようなエラーメッセージが表示されました。

![スクリーンショット 2021-05-29 14.56.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/42735/a2aa97f1-f433-25bd-1cdc-625ab4352c72.png)

よくよく見ると ` building for iOS Simulator, but linking in object file built for iOS, file （中略） for architecture arm64` と書いてあります。
これは、arm64アーキテクチャでリンクができなかったと書いてあります。

この原因は、M1 Macに搭載されているApple SiliconがARMベースのプロセッサーになっており、ARMアーキテクチャのバイナリーがないためエラーとなっていました。

# 解決方法
解決方法としては、Xcode自体はRosetta2上で実行しIntel Mac同等にすることによって従来のMac同様となりIntel Macのシミュレーター用バイナリが使えるようにしてエラーを解決します。
解決手順について記載します。

1. Finderを起動し、メニューバーの移動よりアプリケーションを選択します。
2. Xcodeを選択し、右クリック＞情報を見るを選択します。
3. Rosettaを使用するにチェックします。
4. Xcodeを終了し再起動します。
5. メニューバーのProduct＞Clean Build Folderを選択し、ビルド情報を消去します。
6. シミュレーターを実行するために▶️ボタンを選択します。

![スクリーンショット 2021-05-28 23.41.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/42735/521ee061-e24d-d8a8-2101-e68b76d6fe47.png)

# 最後に
他のライブラリーでも時々シミュレーターで実行すると同様のエラーとなる場合があります。
その時は、同じ手順で解決できることが多いです。全てのライブリーがM1 Mac対応になることを祈る限りです。
AI  For Everyoneを受講する

5月からJDLA(日本ディープラーニング協会)とcourseraが提供を開始している
AI/ディープラーニングのオンライン学習コンテンツ「AI For Everyone」を受講したので感想も兼ねて投稿します。

全体としては、5時間ほどの内容で、AIの概念の説明から始まりAIプロジェクトの推進方法や
AIが社会に及ぼす影響、問題などを学習できる内容となっている。

テストもあるが、実際に手を動かしてディープラーニングをコーディングした人で
あれば問題なく合格できる難易度であったと感じた。

アンドリュー先生だけでなく、JDLAの松尾先生や岡田さんもお話しされていたが、
AIを「作る」ことと同じくらい「使う」ことが大事であると感じた。
そのための第一歩としてこの「AI For Everyone」はどんなビジネスパーソンにもお勧めできる内容だと感じた。
今までは、いきなりG検定が入ることになっていたので、少しハードルが高かったが、このコンテンツができたことで、
より多くの人がAIの概念を知ることができる可能性が高まったのではないかと考えている。

「AI For Everyone」と「G検定」を取得したので、次はいよいよ実装スキルを試す「E検定」取得を目指そうと思う。

受講が完了すると<a href="https://coursera.org/share/c0bf5aa1334784d4566de6a926d5a8aa">修了証<a/>が発行されます！

受講サイトは<a href="https://www.coursera.org/learn/ai-for-everyone">こちら</a>

一般社団法人日本ディープラーニング協会のサイトは<a href="https://www.jdla.org/">こちら</a>
「IFTTT」で「Google Assistant」を連携させる方法

先日、「IFTTT」を初めて使用しました。
連携先として、興味を持ったチャンネルが「**Google Assistant**」。
自宅にある「Google Home」を活用し切れていないため、さっそく使ってみました。

##認証失敗
まず、アカウントがうまく認識されなかった失敗事例です。
以下のように設定したのですが、「Google Home」から思いどおりの反応が返ってきません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/97b1839e-4418-5e08-1e1f-8261c1b3e525.png)

後から判明した原因は、「Google Home」の登録アカウントが相違していた点でした。
「IFTTT」には自身のGoogleアカウントと連携していたのですが、「Google Home」は夫のアカウントだったため、認証失敗していました。
今回は、私が躓いたアカウントの連携方法にポイントを絞り、記事にしています。
※以下、個人情報はマスキングしています。

##アカウント連携方法
１．トップページ＞右上の自身のアカウント（アイコン）を選択＞「**My service**」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/7424284f-dc21-1067-931a-58fdc28f9af2.png)


２．「**My service**」のページより、「**Google Assistant**」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/33de263e-b1b2-f10e-a628-a8c8a4a54ff7.png)

３．右上の「**Settings（歯車マーク）**」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/b0b9676f-f93c-1a2c-c788-fe9e3c846a72.png)

４．「**Edit**」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/916fadb9-0089-1f07-3dcf-5e26c3f9ac96.png)

５．連携したい**アカウント**を選択
新規登録する場合は、**「別のアカウントを使用」**を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/4d42b57e-4d2f-5dc1-c514-c7ffe616cd9d.png)

６．アカウントのリクエストで「**許可**」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1280625/c757d456-36b3-dfbf-2b88-2851d004a4f5.png)


以上で、設定完了です。
あとは、アプレット作成のトリガー「If This」「Then That」で「**Google Assistant**」を選択して、お好みの設定をするのみです。
【Kotlin】 基本文法文法1



#■文字列　リテラル　段落

``` kotlin
//\nで改行してる。
var a = "こんにちは。\nよろしくです。"

//こんにちは。
//よろしくです。


//"""を3つ付けて段落を変えると表記も段落が変わる。
var b = """こんにちは。
　よろしくです。"""

//こんにちは。
//         よろしくです。
```

ご覧の通り"""3つの場合はなんかずれてる。
■解決法
.trimMargin()を使うとちゃんと並ぶ。

``` kotlin
var b = """こんにちは。
　          |よろしくです。""".trimMargin()
//こんにちは。
//よろしくです。
```


#■nullとnull許容型
null　値がない事

``` kotlin
//非null型
//fooと言う変数はデフォルトの型なのでnullを禁止してエラーななっています。
var foo: String = "foo"
foo = null //エラー

//Nullable型
//nullを許容するには型に?をつける。
var foo2: String2 = "foo"
foo = null //エラーでない
```


■同値確認(==)  同じ値かどうか
■同一確認(===)　同じオブジェクトかどうか 

``` kotlin
var a: Int = 10000
var b: Int = a
var c: Int? = a

println(a==b)  //結果 true
println(a===b) //結果 true
println(a==c) //結果 true
println(a===c) //結果 false

```

``` kotlin
 var foo1: String? = "foo"
var foo2: String = foo1 //エラー　非null型にNullable型を入れれない

var a1: String? = "a"
var a2: Any = a1 //エラー Anyでも非null型なのでエラー
var a3: Any? = a1 //これは通る
```

#■型変換
型を変えれる

``` kotlin
//サフィックスで変更1.2がfをつける事によってFloat型に
var a: Float = 1.2f

//bはInt型だがtoString()でString型に変更
var b: Int = 1
a.toString()

//色々ある。 toLong() toFloat() 等　好きな物に変更できる。
```

#■配列とコレクション

■配列

``` kotlin
var a = arrayOf(1,2,3)

//Int型限定の配列
var b = intArrayOf(1,2,3)

//全部nullの配列 文字型のnull配列
var c: Arra<String?> = arrayOfNulls(3)
//結果[null,null.null]


//ラムダ式の配列 index番号3つ用意0.1.2これをiとしてi*2をして配列になる。
var b = Arra(3, {i -> i * 2})
//結果 [0,2,4]

```
■コレクション　list set map 中身を後から変更できない 読み取り専用

``` kotlin
//ただのList 配列と同じ表記
var list = listOf("あ","い","う")
println(list)
//結果 [あ,い,う]

//setは重複した値を飛ばして表示する。
var set = setOf("A","B","A","C","B","D")
println(set)
//結果 [A,B,C,D]

//map型　他の言語で言う辞書型と同じ
var map = mapOf("First" to 1, "Second" to 2, "Third" to 3)
println(map)
//結果 {First=1, Second=2, Third=3}

```
■mutableコレクション
mutableをつける事によって後から変更可能になる。

``` kotlin
//mutableを付けて変更可能になる。
var list = mutableListOf(1,2,3)
list[2] = 4
println(list)
//結果 [1,2,4]


var list1 = mutableListOf(1,2,3)
//普通のList<Int>これは普通のlistコレクションの配列の型を表している。
//listtコレクションの配列にmutableListコレクションを代入
var list2: List<Int> = list1
//値の変更はmutablelistの配列で変更
list1[2] = 4
//変更された配列がlist2に入る。
println(list2)
//結果 [1,2,4]
```




#■範囲演算子
「m..n」というように書く m~nの範囲を表現する事ができる。
1..20で1から20の数字の間にはiの10が含まれているから結果は10になる。

``` kotlin
val i = 10
println(i in 1..20)
//結果 true
```

#■for文を使用した時の範囲演算子

``` kotlin
for(i in 1..3) {
print(i)
}
//結果 1.2.3

// untilを使うとこの場合3を含めない最後の値を含めない感じ
for(i in 1 until 3) {
 print(i)
}
// 結果 1.2

//逆にインクリメントをダウンして表示する downTo
for(i in 3 downTo 1) {
 print(i)
}
//結果 3.2.1

//step指定した値分飛ばす(範囲演算子と使う)
for(i in 1..10 step 3) {
 print(i)
}
//結果 1.4.7,10
```
GWTの新しい書き方 JBOSS elemento

# GWTの新しい書き方 JBOSS elemento

GWT ( Google Web Toolkit) の新しい書き方を勉強中です

[GWT] (http://www.gwtproject.org/terms.html)


GWTは、JavaをJavaScriptに変換してWebアプリを作るテクノロジーです。
TypeScriptはTypeScriptをJavaScriptに変換しますが、その文法を覚えなければなりません。
記憶力が衰えてしまった私には、新しい言語(TypeScript)を覚えなくて良いというのが非常に魅力的に思えてなりません。



最新情報は [Modern GWT] ( https://padlet.com/lofidewanto/gwtintro) というサイトにまとめられています。

一番左の Introduction Articlesの中に記事をみつけました。

[Modern GWT, first steps] (https://dev.to/ibaca/modern-gwt-first-steps-509k)

この長い記事の中央ぐらいに、 4.Spice it up という項目「図」があります。

今後は、Elemental2 を使うか、RxJavaを使うかのどちらかが、良いそうです。

Elementoというのは、Elemental2を使うためのライブラリです。

とりあえず、Elemento が簡単に動作できたので、しばらくはこちらを勉強することにしました。

ソースは [elemento   Github] (　https://github.com/hal/elemento　)からダウンロードできます。

maven は、たぶん [ こちら ] (https://mvnrepository.com/artifact/org.jboss.elemento/elemento-core) 
です。


なお、上記の　Modern GWT, first steps の書き方は、少々古い様子です。
elemento   Github のサンプルの方が最新ですので、こちらを信用しましょう。

elemento   Github　を一式ZIPでダウンロードして、Windows10 + AdoptOpenJDK8で
動作できました。

あらかじめ、AdoptOpenJDK8とMaven 3系をインストールしておきます。
上記ZIPを展開し、 cd samples/gwt29
pom.xmlの45行目を HEAD-SNAPSHOTから 1.0.3に変更します


```pom.xml
        <!-- dependency versions -->
        <elemento.version>1.0.3</elemento.version>

```

あとは、同フォルダーの README.md を参考にして、以下のコマンドでコンパイルして実行できます。

```CMD.EXE
mvn gwt:devmode
```


ApplicationElement.javaの書き方が非常に特徴的です。

elemental2 の　Javaは、自動生成によって、生成されたクラスだそうで、あまりJavaっぽくない書き方になるそうです。ですが JBOSS Elementoを使うことで、Javaっぽい書き方ができるそうです。

JBOSS Elemento の書き方は、ビルダー（デザインパターンのビルダー）です。

StringBuilderは使われたことがあると思います。

```Foo.java
StringBuilder sb = new StringBuilder();
sb.append("abc");
sb.append(123);
sb.toString();
```

JBOSS Elemento では、以下のJavaコードにより、その下のHTMLが生成できます

```Bar.java
nav().css("todoapp").element();
```

```Bar.html
<nav  class="todoapp"></nav>
```


先頭の nav() が、 new StringBuilder()に相当します。

最後の .element() は、 .toString()に相当します。


先頭の nav()が、不思議な書き方ですが、これはimport 文に秘密があります

```Sample.java
import static org.jboss.elemento.Elements.*;
```

上記Elementsクラスの中に static なメソッドが沢山定義されています。

nav() はHTMLのnav とか、table() はHTMLのtableなど、HTMLの名前と
ほぼ対応が取れているので、すぐに覚えられるでしょう。

なお、以下のコードは、本番モードでコンパイルすると、GWTがJavaからJavaScriptに
変換して、ブラウザー内で、動いている点に注意してください。

```Bar.java
nav().css("todoapp").element();
```

今日は、ここまで。お読みいただき、ありがとうございました。
【メモ】npm install -gがエラーになった時

# 問題点

`npm install -g serve`のコマンドを入力したら、以下のエラーが出ました。

![スクリーンショット 2021-05-29 16.35.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/657751/45324d7c-032d-26f0-5f18-1c33ab0c0fb2.png)

# 解決法

- `$ mkdir ~/.npm-global`
- `$ npm config set prefix '~/.npm-global'`
- `$ echo ' export PATH=~/.npm-global/bin:$PATH' >> ~/.bash_profile`
- `$ source ~/.bash_profile`

【参考記事】
https://docs.npmjs.com/resolving-eacces-permissions-errors-when-installing-packages-globally

# 結果
　無事に解決できました。:sunny:
![スクリーンショット 2021-05-29 16.43.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/657751/beb95e3b-4fa9-a206-408a-cb6417fb0c45.png)
kaliでDVWAを使いたい(ハッキングラボの構築で詰まったところ)

kaliでDVWAを使いたい！
現在セキュリティについて勉強しており、とりあえずハッキングラボの作り方という本を進めていますが、その中でWebアプリのハッキングを体験するという章があります。
その章でDVWAという脆弱性のある練習用で使われるらしいアプリを使うのですが導入がうまくいきませんでした。
導入や使ってみた的な記事は見つかったのですがこのトラブルに対してはなにもなかったので参考になれば

#何が起きたのか
DVWAアクセスしたときの画面が白くてログインできない

#version
kali-linux-2020.4
php 7.3.28
mysql Ver 15.1 Distrib 10.3.24-MariaDB

#解決策
本内では
'http://localhost/DVWA-master/login.php'
にアクセスとなっていますがここで'login.php'ではなく'setup.php'にアクセスしてみました。

#別の問題
'Database Setup'画面で'Create/Reset Database'ボタンを押すとメッセージが出るとありましたが、ここもうまくいきませんでした。
上手くいっているサイトなどを見るとどうやらphp moduleのSQL関連のものが入っていないみたい、Xplicoを扱う際にPHPの変更が関係していそう、なんて思いながらmoduleを入れるとうまくいきました。
最初に'http://localhost/DVWA-master/login.php'から遷移しなかったのもデータベースの参照ができてないからだと思われます。

#これで解決！
とりあえず本の内容に戻れそうです。
メモ書き程度ですが、同じ問題にぶつかった方がいらっしゃた時に参考になれば幸いです。

#p.s.
初投稿です。
ここをこうしたらいい、とか、ここはどうやったとかあればぜひコメントいただきたいです。
Tableau Specialist 見直し 

Tableau Specialist を取得するための学習メモ。

#データとの接続と準備
1.データソース(.tds)
・データ ソース タイプ
・データベース サーバーのアドレス、ポート、ローカル ファイルの場所、表など、データ ソース ページで指定される接続情報
・グループ、セット、計算フィールド、ビン
・数値形式、集計、並べ替え順序などの既定のフィールド プロパティ
接続情報、フィールドプロパティのデフォルト設定、ソート順、といっ たデータソースのメタデータを保存する。tdsファイルはデータベースそのものではない。

2. 結合
![スクリーンショット 2021-05-28 13.47.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/95c4166a-13f7-76d1-4f8e-ed31e44fdd5a.png)
   
  データブレンド
![スクリーンショット 2021-05-28 13.53.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/2bcfacec-2dc6-8e01-e766-9e287a222164.png)
データブレンドの方法：
少なくとも1つのフィールドをプライマリデータソースよりビューに加える。そしてデータペインでセカンダリデータソースとしたいデータソースをクリックし、リンクフィールドアイコンをクリックする。データブレンドはシート単位で行われる。
 <ブレンドの例>
![スクリーンショット 2021-05-28 14.34.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/e689e7bf-74c9-146e-9a29-aeb7860640dc.png)
                         

3.Tableauの操作順番


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/9aede52a-6d7c-bd28-8e34-a78d278e8604.png)

4.insightの共有
一般的に、最も注意をひきたい重要な情報はダッシュボード上部、左上のコーナー箇所におく。人の眼は自然と左上コーナーから順に情報を追う傾向がある。

？ダッシュボード上の 1 つのワークシートでエレメントを選択すると、同じダッシュボ ード上の別のワークシート上でも変更されるような設定にしたい
A.フィルターアクションを活用することで、別ワークシートの項目をフィルターすることができる。また、ハイライトアクションを活用すると、別ワークシートの項目をハイライトすることができる。

5.メジャー集計の外し方
分析→メジャー集計をクリック

-----------------------------------------------------
6.日付フィールドへの変換がうまく行われない場合、フィールドのデータ型を文字列に戻した上で、DATEPARSE関数を使って算出する(DATEPARSE関数が使用できない際は、代わりにDATE関数を使用する)
<日付型への変更方法>
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/a1060186-9b9d-ab98-3802-efec96260b4d.png)
データソースペインかディメンションでデータの型を変更

地名がうまく読み取られないとき
タブローのマップが米国に設定されていない場合は、「マップ(M)」➔「場所の編集(L)」 を使用し「国/地域」を「米国」に設定する必要がある。

7.データを読み込む際の注意点
![スクリーンショット 2021-05-29 16.33.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1451692/c830ce45-9114-e076-104b-4ec22185c3b7.png)
OpenAPI Specificationを利用したAPI仕様作成フロー

## 概要
自分がAPI仕様を作成するときのやり方をまとめる。

## 使うもの
- Git, Github, Github Pages
- Stoplight Studio
- VSCode

## 手順
#### リポジトリ作成 & Swagger UIファイル取得
- OpenAPI Specificationの表示用にSwagger UIファイル取得
- https://github.com/swagger-api/swagger-ui のdistフォルダの中身が必要。
- Github Pagesでdocsフォルダを公開予定なのでそこに入れる。

```sh
$ git clone git@github.com:swagger-api/swagger-ui.git
$ mkdir docs
$ cp -r swagger-ui/dist/* docs
$ rm -r swagger-ui
```

#### ドキュメントを書く
- 効率化のため Stoplight Studio を利用
- 現状 Swagger UI が OpenAPI 3.1.0 に対応していないため3.0系利用
  - https://github.com/swagger-api/swagger-ui/issues/5891
- 例: https://github.com/yoshikipom/todo_api/blob/main/docs/reference/todo-api.yaml
- エンドポイントが多い時はTag付け推奨

#### Swagger UIのデフォルトページを作成したAPIのものにする
- Swagger UIの `index.html` を編集。
- 例: https://github.com/yoshikipom/todo_api/blob/main/docs/index.html#L42

#### ローカルで確認
mainブランチにマージするまでGithub Pagesに反映されないため、プルリク段階では別の手段での確認が必要。
VSCodeプラグインを利用。

- `Swagger Viewer` プラグインを導入
  - https://marketplace.visualstudio.com/items?itemName=Arjun.swagger-viewer
- VSCodeエディタでStoplight Studioで作ったyamlを開き、 `Show All Commands` で ``Swagger Preview` を実行
- 表示確認

#### プルリク
- プルリク -> レビュー -> マージ
- PR例: https://github.com/yoshikipom/todo_api/pull/1/files

#### Github Pagesに展開
- Githubリポジトリの設定で `/docs` フォルダをGithub Pagesで公開
- 例: https://yoshikipom.github.io/todo_api/index.html
【ウェブデザイン技能検定3級】試験内容の概要と対策(令和3年度版)

令和3年度のwebデザイン技能検定3級を初受験しました。
試験概要と勉強方法についてまとめたため、試験を検討している方の参考となれば幸いです。
#####　筆者の経歴
・Webコーディングの勉強を始めてから15ヶ月程度
・小規模サイト4,5件作成
・JQ、phpはほぼ初心者

##目次
[・試験の概要](#試験の概要)
[・試験内容](#試験内容)
[・試験対策](#試験対策)
[・本試験の感想](#本試験の感想)
[・まとめ](#試験対策)
#試験の概要

**・試験日程**：毎年計4回（5、8、11、2月）
**・難易度**：合格率7-8割程度。Webコーディング初心者でも簡単なレベルです。
**・受験資格**：なし。2級からは受験資格が問われます。

　詳細は以下公式HPにて確認できます。
　[■ウェブデザイン技能検定](https://www.webdesign.gr.jp/summery/schedule/)
#試験内容
　PCを操作する実技と、マークシート回答の学科があり、一日で実施します。
####(1)実技
**・出題形式**：PCを操作し、フォルダ整理・コード修正など指定の操作を実施。6問中5問を回答する選択問題式です。
**・回答時間**：1時間。慎重に進めても30分程度で回答できました。
**・合格基準**：70点以上
####(2)学科
**・出題形式**：マークシートを用い、Web知識についてYes/No[10問]、4択[15問]で回答。
**・回答時間**：45分。回答時間はかなり余裕があります。
**・合格基準**：70点以上

　詳細は公式HPにて細目が提示されております。
　[■ウェブデザイン技能検定　試験細目](https://www.webdesign.gr.jp/img/2020/03/20190401.pdf)

#試験対策
試験対策としては過去問3回分の練習で十分です。
試験1ヶ月前には公式サイトの練習問題を実施し、試験と自身の知識レベルを確認します。私の場合、ノー勉でも合格ラインが目指せそうだったので、心の余裕を持って勉強方法を計画することができました。

**・実技：**最新の過去問題は毎回ほぼ同じ内容でした。実戦は練習問題だけで問題ありません。
**・学科：**過去問3回分の総復習。あとは関連キーワードを確認しておけば良いと思います。

#本試験の感想
####(1)実技
おおよそ過去問と同レベルの問題が出題され、特に難しい問題ではありませんでした。コードの修正漏れを防ぐため、コードチェックはcont+Fで入念に実施しましょう。
####(2)学科
過去問にない問題が半分を占め、完全正当できたのは6割5分程度でした。満点を目指すには3年分の過去問だけでは不十分なため、他のサイトを確認いただけたらと思います。

#まとめ
ウェブデザイン技能検定3級はWebコーディング関係の勉強を始めた方でも十分合格を狙える簡単な資格です。ウェブデザイン技能検定2級の受験資格にもなっているため、2級受験を目指している方は早い段階で挑戦してみてはいかがでしょうか？
Kotlinは引数の初期化に引数が使える

ギョームで使って便利だなーと思ったので備忘録。

Kotlinは引数の初期化に引数が使えます。

```kotlin
data class A(
  val a: String,
  val aa: String = a.repeat(2),
)
```

```
Welcome to Kotlin version 1.5.10 (JRE 15.0.2+7)
Type :help for help, :quit for quit
>>> data class A(val a: String, val aa: String = a.repeat(2))
>>> println(A(a = "hello "))
A(a=hello , aa=hello hello )
```

面白いね！

# 役立ったところ

（一部脚色してます）性別や職種に応じてデフォルトの敬称(Honorific)を設定するのに使いました。

```kotlin
data class User(
  val name: String = "",
  val sex: Sex = Sex(),
  val occupation: Occupation = Occupation(),
  val honorific: String = honorific(sex, occupation),
) {
  companion object {
    private fun honorific(
      sex: Sex,
      occupation: Occupation,
    ): String {
      return when {
        (なんか条件１) -> "さん"
        （なんか条件２） -> "くん"
      }
    }
  }
}
```
ゼロから作るDeepLearningまとめ

#ニューラルネットワーク

##ニューラルネットワークの構成

ニューラルネットワークは層というものを積み重ねて作ることができる。
以下に3種類の層からニューラルネットワークの例を示す。
・第0層　入力
・第1層　中間層
・第2層　出力層

入力層→中間層→出力層
○　　　　○　　　○
○　　　　○　　　○
 　　　　○

ニューラルネットワークの入力層の丸は入力を表している。
入力から流れてきた信号は次の丸に伝わる。
次の丸では入力に対して何らかの変換処理を行う。（なんらかの変換処理は活性化関数というものによって行われる）

##パーセプトロン
ニューラルネットワークはパーセプトロンという「丸と矢印で表す流れ」で構成されている。

○→
○→

パーセプトロンの出力は下記の通り計算される。


```式
バイアス＋入力1×重み1+入力2×重み2・・・入力N×重みN
```

バイアスとは入力、重みとは別パラメータである。
入力と重みはパーセプトロンの丸の数だけ増える。

##活性化関数
前の層から流れてきた信号を何らかの値に変換する関数である。
具体的に言うと前の層からの信号（バイアス＋入力1×重み1+入力2×重み2・・・）を別の値に変換する。

###活性化関数の種類
####・シグモイド関数
信号を0~1の間の数に変換して返してくれる。
グラフで表すと滑らかになっている。

####・ステップ関数
シグモイド関数とは違って入力に対して0か1のどちらかしか返さない。
いらない信号は捨てちゃうよってところがポイント。

####・ReLU関数
0以下の値は0で返し、0以上の値はそのまま返すという関数。
最近はこれが使われることが多いらしい。

#出力について
ニューラルネットワークでは最終的に出力層に信号が伝わりなんらかの出力をするのだが、
出力でも関数を使って出力層に渡ってきた信号をなんらかの値に変換する。

##出力層に使う関数の種類は？

###・恒等関数
入力をそのまま出力するだけの関数。
そのまま出力するので関数ということをあまり意識しなくても問題ない。

###・ソフトマックス関数
前の層の全ての丸を足し合わせた信号を何らかの値に変換して出力する関数。
全ての変換結果を足すと1になるという特徴がある。
全て足すと1になるというところから確率であるという解釈ができる。
例えば0.5という値が出力されたらそれは50％ですよってこと。

##出力層の数
出力層の数は解く問題によって適切に変更する。
例えば0〜9の数字を分類して認識する問題を扱っている時は出力層の丸の数は数字の0〜9に対応して10個となる。

以上がニューラルネットワークの構成となる。
簡単に言うと入力になんらかの値を入れると丸と矢印をたどって答えとなる出力が得られるということになる。
例）手書き数字の0～9の数字を分類したい場合は手書き数字の画像を入力に入れるとその予測結果（0～9の各数字に当てはまる確率）

#学習について
ニューラルネットワークは訓練データと呼ばれるデータ（例として手書き数字の0～9の画像データとその正解）を使って学習させる必要がある。
つまり学習するためのデータ（教師データ）がなければニューラルネットワークは知能を持つことができない。

##損失関数
ニューラルネットワークで学習を行うためには損失関数という関数を用いる。
損失関数とはニューラルネットワークの出力が答えとどれだけ差があるかを表すものである。

###損失関数の種類は？
####・2乗和平均誤差
全ての教師データと全ての出力結果の差分を2乗して最後に2/1する。

####・交差エントロピー
出力結果の自然対数と教師データを掛け合わせた値を全て足す。
one-hot表現※1では正解ラベルに対してだけ計算が行われる。

※1　one-hot表現
正解となる出力だけを1としてそれ以外は0で表す方法。

##ニューラルネットワークの学習方法の種類
ニューラルネットワークは損失関数で得られた値が小さくなるように（出力と正解が近づくように）何回も重みの値を変えていく。
これをニューラルネットワークの学習という。
学習方法にはいくつか種類がある。

###学習方法の種類は？

###・確率的勾配降下法（SGD）
無造作に選び出したデータに対して勾配降下法で学習する方法である。
勾配降下法とは損失関数が小さくなるような方向に重みの値を更新していく方法。

続きは気が向いたら
外部キー制約をかけてる親と子の削除の仕方（Laravel ）

プログラミング初心者です

まず外部キー制約とは、ざっくり自分の理解だと
　『親テーブルと子テーブルがあって、「子テーブルのこのカラムには好き勝手な値を入れちゃダメだよ。親テーブルのこのカラムから選んで入れてね」な制約のこと』

で、親テーブルのあるレコードと、関係してる子テーブルのレコードを同時に消したい。
でも制約があるからControllでただ```delete()```実装してもエラーになりました（でも実装は必要です）

そんな時は、外部キー制約を実装したmigrationファイルにこう書きます

```php
$table->foreign('folder_id')->references('id')->on('folders')->onDelete('cascade');
```

foreignには　子テーブルで親と連携したいカラム
referencesには　親の何のカラムと連携したいか
onには　親migrationのテーブル名
の後ろに

```php
onDelete('cascade');
```
を入力したら

親が削除されたら子も削除できるようになりました！

あ、

```
php artisan migrate:refresh
 ```
忘れずに。
【GAS】②スプレッドシート→htmlに渡した値をテーブル形式に（jquery）


まとめ・最終完成形・対象など
[スプレッドシート⇆html 双方向の値受け渡し　CRUD（追加更新・削除）処理　（GAS、javascript、jqueryのみ）　](https://qiita.com/forever---beginner/items/2afe3b48202041297e78)

前回
[【GAS】①スプレッドシート→htmlへ値受け渡し（ロード、テンプレ読み込み時）](https://qiita.com/forever---beginner/items/8e6f1e9c019070d43954)

次回
[【GAS】③webページでテーブルの行削除→スプレッドシートも同じ行削除](https://qiita.com/forever---beginner/items/88878e4ccd474a73dfed)


###◆今回やること

前回スプシからhtmlにデータを渡して表示しました

●スプシ
![スクリーンショット 2021-05-29 14.41.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1563301/cd9c5dc7-5639-3d1e-0ec6-774d2283a81f.png)

●webページ
![スクリーンショット 2021-05-29 14.40.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1563301/a7e291a9-00d4-88ef-2879-52d40d081ce5.png)


今回は、webページに出力したデータを、
tableに、順番に入れていきます。


---


##◆実際のコード

###GAS値取得、html出力
 前回とほぼ同じです。
 前回との相違：shiftでヘッダー削除しています。
　　　　　　　繰り返し時にthだけの処理を入れるのが面倒なので、、、






```javascript:コード.gs


function doGet(){
  let hotpt = HtmlService.createTemplateFromFile('index').evaluate();
  hotpt.setTitle('CRUDテスト');
  return hotpt;
}

function valsget() {
  let ss = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("テスト");
  let vals = ss.getDataRange().getValues();
  vals.shift();　//ここを前回から追加
  return vals;
}

```


###htmlで値受け取り、tableに入れていきます


```html:index.html
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>  
    <table id="tbl"><!--前もってthだけ作っておきます。-->
      <tr>
        <th>地域</th>
        <th>都道府県</th>
　　　　　<th>県庁所在地</th>
      </tr>
    </table>
  </body>
</html>

<!--jQueryのCDN読み込み-->
<script
  src="https://code.jquery.com/jquery-3.6.0.slim.min.js"
  integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="
  crossorigin="anonymous"></script>


<!--以下、クライアント側javascript-->

<script>

  window.onload = function(){

    google.script.run.withSuccessHandler(function(dt){　//dtにvalgetの取得値を渡す
      for(let i =0;i<dt.length;i++){   　//dtの配列の数だけ繰り返し
        let $tr = $('<tr></tr>');        //jqueryオブジェクトでtr作成
        $tr.append($('<td></td>').text(dt[i][0])); //trにtdを追加していく
        $tr.append($('<td></td>').text(dt[i][1])); 
        $tr.append($('<td></td>').text(dt[i][2])); 
 
        $('#tbl').append($tr);　　　//出来上がったtrをtableに行追加       
      }     
    }).valsget();
  }

</script>
```


---
###◆結果のwebページ
table形式で表示されました。
![スクリーンショット 2021-05-29 15.47.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1563301/6747bb13-ef92-f379-a279-c42bfe5ffddc.png)
[Node] AWS Lambda標準ライブラリでPOST

こんにちは takeです。
AWS LambdaでSlack botを作成しました。

参考にさせていただいた記事

https://qiita.com/rei-ta/items/931caaaef2684c97e4cf

## お急ぎの方用
```javascript
const https = require('https');
const querystring = require('querystring');
.
.
.
var post_data = querystring.stringify({channel:'',text:}, null);
    let options = {
        host: 'slack.com',
        path: '/api/chat.postMessage',
        port: 443,
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
//他にtokenなど
        },
        method: 'POST',
    };
    var post_req = https.request(options, function(res) {
        res.setEncoding('utf8');
        res.on('data', function (chunk) {
          console.log('Response: ' + chunk);
          context.succeed();
        });
        res.on('error', function (e) {
        console.log("Got error: " + e.message);
        context.done(null, 'FAILURE');
        });
     });
    post_req.write(post_data);
    post_req.end();
```

今回のPOST先 

https://api.slack.com/methods/chat.postMessage

## 詳細

今回AWS Lambda上で定期的に動作するSlackBotを作成しました。

Slackにメッセージを送るためにはSlack APIへPOSTしなければならなかったのですが、requestを使ってPOSTをしようとすると

```
Task timed out after 3.00 seconds
```

とタイムアウトしてしまうように

原因を探ってみるとどうやらrequestを使用するためにはlocalでnpm installを行ってnode_moduleをzipファイルにしてアップロードする必要があるようです。

面倒ですよね、、

なんとか標準ライブラリを使用してブラウザでコードを書いてLambdaからPOSTしようと思い今回調べてみました。