OmniAICreator/Qiita-1.07M huggingface dataset:
dockerでVelocity,BungeeCordをたてたらハマった

# BungeeCord,Velocityとは
https://github.com/SpigotMC/BungeeCord

https://github.com/VelocityPowered/Velocity

複数のMinecraftの鯖を繋ぐことができるプロキシサーバー

# dockerで起動した
## 構成
```docker-compose.yml
version: '3'
services:
    bungeecord:
        container_name: test_bungee
        image: itzg/bungeecord
        ports:
            - "10000:25577"
        tty: true
        stdin_open: true
        restart: always
        volumes:
            - ./server:/server
        environment:
            TYPE: "BUNGEECORD"
            MEMORY: "512M"
    paper:
        container_name: test_server
        image: itzg/minecraft-server
        ports:
            - "10001:25565"
        tty: true
        stdin_open: true
        restart: always
        volumes:
            - ./data:/data
        environment:
            EULA: "TRUE"
            TYPE: "PAPER"
            MEMORY: "2G"
            ONLINE_MODE: "FALSE"
```
```spigot.yml
settings:
    bungeecord: true
```
```config.yml
ip_forward: true
servers:
  lobby:
    motd: '&1Just another BungeeCord - Forced Host'
    address: 127.0.0.1:10001
    restricted: false
```
## 結果
どうやらdockerで起動する場合、何か変える必要があるようだ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758030/3ee47356-6ccf-cf8f-0423-3d3307deadc8.png)
# localhost/127.0.0.1では駄目
コンテナ外へ通信するとき？はlocalhostまたは127.0.0.1では駄目らしい
## 接続先のアドレスを変更する
### コンテナに接続
```shell
$ docker exec -i test_server /bin/bash
```
### コンテナに割り振られたipアドレスを確認
```shell
$ hostname -i
192.168.32.2
```
### ホストに戻る
Ctrl+C
### BungeeCordのconfig.ymlを修正
```config.yml
servers:
  lobby:
    motd: '&1Just another BungeeCord - Forced Host'
    address: 192.168.32.2:10001
    restricted: false
```
## 結果
**どうして...**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758030/dea8c1bf-0f05-01a3-ad7c-01637708961c.png)
# ポートの設定が駄目っぽい
## 数時間後...
GithubのIssueなど色々な記事を見る中であることに気がつきました。  
**接続先がコンテナのポートだと...?**  
## こうすれば動く
```config.yml
servers:
  lobby:
    motd: '&1Just another BungeeCord - Forced Host'
    address: 192.168.32.2:25565
    restricted: false
```
addressのポートをホストのポート(10001)ではなく、コンテナのポート(25565)にしました。
### きた！！！！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/758030/d25ed79f-f0d4-1e07-f394-0d523e034da6.png)
# 結論
## ポートフォワーディング
```docker-compose.yml
ports:
    - "10001:25565"
```
docker-composeでいうこの部分です。ポートフォワーディングは、ホストipの10001に接続が来た時、コンテナipの25565に接続を流すという感じなので、直接コンテナのipアドレス(192.168.32.2)に直接接続する場合は、コンテナのポート(25565)を指定しなければならなかったのです。
## おまけ
docker-composeを使っていれば、dockerのnetworkを勝手に設定してくれるので、今回でいう`paper:25565`で接続できます。`paper`はdocker-composeのservicesの名前です。  
コンテナを作り直したときにipアドレスが変わるそうですが、その対策にもなります。
### ちなみに
今回はBungeeCordを起動しましたが、VelocityやWaterfallなどの他のプロキシ鯖でも同様です。
## 反省
完全に知識不足でした
精進します
Nuxt.js + microCMS + Netlify + Jamstack構成 でブログを作ってみた

# はじめに
こんにちは！タナカ ユウキと申します。
この度、個人blogを、自作してみました。
WordPressのテーマ使ってササッと構築しようかなとも思ったのですが、
Nuxt.js + microCMS + Netlify + Jamstack構成とちょいモダンな構成で
ほぼ1から作ってみてもおもしろいかも思いまして、作ってみました！

# 作成したブログ
個人ブログ(まだ記事少ないです。) https://yuki-tanaka-portalsite.netlify.app  
#### TOP画面
![スクリーンショット 2021-08-29 21.40.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634021/3d29eda7-cd7b-52a3-73f3-0a7018f00afc.png)

#### 詳細画面
![スクリーンショット 2021-08-29 21.42.45（2）.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634021/f896bb58-c57a-3e0c-39fa-e228011e83a7.png)

まだ、追加したい機能だったり、修正しないといけない細かいバグだったりがありましたが、とりあえずデプロイしてみました。
これからどんどん機能付け足す等、イテレーションをどんどん回していく予定です！

# 使用技術・機能  

### 使用技術
- フロント側・・・vue.js nuxt.js(jamstack構成で)
- UI周り・・・vuetify PostCSS
- ブログ部分・・・microCSM
- デプロイ・・・netlify  

blog部分は、Contentful等も選択肢にありましたが、日本製でもあるmicroCMSを採用させていただきました。  

デプロイは、netlifyで行い、連携しているgithubへのpush及びmicroCMSでの変更をwebhookして、generateするといった

jamstack構成にしました。

### 機能(現時点)
- 記事の表示
- カテゴリ別で一覧表示
- ページネーション
- 関連記事の表示

### 今後追加予定機能  

- 検索機能  
- 人気表示(googleアナリティクスと連携)


# 開発の流れ  
### ① vue.js nuxt.jsのキャッチアップ
普段は、バックエンドエンジニアを中心に業務を行っているので、vue.js nuxt.jsはまだ、ガッツリは、触ったことはありませんでした。
公式ドキュメント見ながら、1からキャッチアップしていった感じです。nuxt.jsの[公式ドキュメント](https://ja.nuxtjs.org/)は、めちゃくちゃ分かりやすかった。nuxt.js使うとフロント部分あっという間に構築できちゃいますね！(すごい)
あと、typescript化、commit時にeslintが走るようにhuskyを導入などやってみました！

### ② microCMSのキャッチアップ、構築
microCMSは、日本製ということもあり、日本語の[ドキュメント](https://document.microcms.io/)はすごく充実してキャッチアップしやすかったです。しかも、nuxtとmicroCMSを連携する[チュートリアル](https://document.microcms.io/tutorial/nuxt/nuxt-tutorial)があるし、microCMSの公式ブログはnuxtで作成されているのですが、githubにソースコードが[公開](https://github.com/microcmsio/microcms-blog)されています！(すごい！)
構築自体も API作成 → APIスキーマ作成 → 記事を作成 でサクッと構築でして、思っていたより学習コストがなく、
簡単にできました！

Blog部分のAPIスキーマ構成
![スクリーンショット 2021-08-30 8.39.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634021/71bb4225-eb10-939b-890a-1c13940a5ecb.png)

APIとAPIスキーマを作成したら、あとはBlogを書くだけ！
![スクリーンショット 2021-08-30 8.42.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634021/31d94cd1-7fd4-e956-14c6-9a2e10358010.png)

### ③ netlifyでデプロイ
デプロイ先は、Firebase、Vercel、Netlifyの3つが選択肢としてありましたが、Jamstack構成との相性といろんな記事でnuxt＆netlifyで構築しているものが多かったので、netlifyを採用しました。
netlifyは、アカウント登録し、GitHubのリポジトリを連携するだけでビルド＆デプロイしてくれてすごい便利です！
あとは、netlifyとmicroCMSを連携させて、記事を公開するたびに自動的にNetlify側でビルド＆デプロイを走らせるためのwebhookを作成、設定を行いました！
![スクリーンショット 2021-08-30 8.56.20（2）.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634021/43262fde-ea99-b32c-1f2c-f015f66f6b33.png)

# まとめ
・ microCMSは、構築簡単、ドキュメント充実しており、便利！！
・ Nuxt.js + microCMS + Netlify の組み合わせで思ったよりサクッとjamstack構成のブログが構築できる。
・ やっぱり個人開発楽しい！！

# 終わりに
ここまで読んでいただきありがとうございます！
まだまだ、色んなものを作って成長していきたいと思っています！SNSでのシェアやLGTMしてくださると
今後の開発の励みになります！
Twitter(@tanayu7777)と[github](https://github.com/yuki5664)もよかったらフォローしてくださいね！
OS管理のリソース・マネージメントを使ってみる

2020年8月、OS管理の機能にリソースマネージメントの機能が追加されました。[こちら](https://blogs.oracle.com/cloud-infrastructure/post/know-whats-running-oracle-cloud-infrastructure-instances-os-management-service)のブログのようにTopプロセスやApacheやTomcat、Oracle Databaseなどの特定のアプリケーションの自動検出と監視といったOS内部を監視することができます。以下からは、実際の設定手順について紹介します。

##必要となるIAMポリシー
この機能を使用するためには、OS管理サービスを使用するための動的グループとポリシー、管理エージェントサービスを使用するための動的グループとポリシーをそれぞれ設定する必要があります。
ユーザーに必要な権限やIAMポリシーに関する詳細については[ドキュメント](https://docs.oracle.com/en-us/iaas/os-management/doc/getting-started-resource-discovery-and-monitoring.html)も参照してください。
今回は、Administratorグループのユーザーでテナント全体を対象に設定しています。


### OS管理サービス用の設定

- 動的グループ名: OSMgmt

```
- ALL {instance.compartment.id='コンパートメントID'}
```

- OS管理サービスの利用に必要なポリシーを割り当てる

```
Allow service osms to read instances in tenancy
Allow dynamic-group OSMgmt to use osms-managed-instances in tenancy
Allow dynamic-group OSMgmt to read instance-family in tenancy
Allow dynamic-group OSMgmt to manage management-agents in tenancy
```

### 管理エージェントサービス用の設定

- 動的グループ名: MgmtAgent 

```
ALL {resource.type='managementagent', resource.compartment.id='コンパートメントID'}
```

- Management Agentとリソースマネージメントの利用に必要なポリシーを割り当てる

```
Allow dynamic-group MgmtAgent to manage management-agents in tenancy
Allow dynamic-group MgmtAgent to use metrics in tenancy
ALLOW dynamic-group MgmtAgent to {APPMGMT_MONITORED_INSTANCE_READ, APPMGMT_MONITORED_INSTANCE_ACTIVATE} in tenancy
ALLOW dynamic-group MgmtAgent to {INSTANCE_UPDATE} in tenancy
ALLOW dynamic-group MgmtAgent  to {APPMGMT_WORK_REQUEST_READ, INSTANCE_AGENT_PLUGIN_INSPECT} in tenancy
```
##リソース・マネージメントを利用可能にするまでの流れ

- コンピュートのCloud Agentの管理エージェント・プラグインを有効にする。このプラグインの有効化により管理エージェントがコンピュートにインストールされる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/048b06f6-34fd-b057-b247-9d50cd99515f.png)

- 監視及び管理 -> 管理エージェント -> エージェント。正しく設定ができていれば10分程度で管理エージェントのコンソールに対象のコンピュートが表示される。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/9547bb20-a9b8-7d4b-ca98-9a81962b4efe.png)

- プラグインのデプロイを選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/e22450a1-8017-7e91-1fb5-19d108b25ad8.png)

- Resource Monitoringをチェックして更新
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/b54b6eff-19d8-8a77-2dba-477badc0c175.png)

- 正しくプラグインが有効になれば、コンピュートインスタンスのOS管理にあるMonitored ResourcesとTop processesに情報が表示される
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/d1d59429-ee47-d0f4-60ed-e747df25b355.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562423/1c2d300f-37ab-2e22-0479-15e367a1c963.png)
多分91日後に基本情報技術者試験を受けるFラン私大文系既卒(3日目)

# CPUの動作
* 命令フェッチ
* デコード
* オペランドフェッチ
* 実行
* 結果の書き込み

# プログラム記憶方式
* プログラム記憶方式とは?
 * 命令もデータもとりあえずメモリに置いてあって、必要な時にメモリから取り出して実行する方式
 * 別名ノイマン型

# ALU(Arithmetic and Logic Unit)
* ALUとは?
 * 四則演算や論理演算を行う装置

# プログラムカウンタ
* プログラムカウンタとは?
 * 次に実行する命令のアドレスを保持するレジスタ

# 命令レジスタ
* 命令レジスタとは?
 * メモリから取得した命令を保持するレジスタ

# アキュムレータ
* アキュムレータとは?
 * 計算結果を保持するレジスタ

# 汎用レジスタ
* 汎用レジスタとは?
 * 主に計算に使うデータや、計算結果などを保持するレジスタ。
 * 役割が特定されていない

# インデックスレジスタ
* インデックスレジスタとは?
 * 有効アドレスの計算に用いるレジスタ

# ベースレジスタ
* ベースレジスタとは?
 * 有効アドレスの計算に用いるレジスタ

# CISC(Complex Instructure Set Computer)
* CISCとは?
 * 複合命令セットコンピュータ
 * 単純な命令から高度な命令まで用意
 * 命令の解読をマイクロプログラム制御を行うことが多い

# マイクロプログラム
* マイクロプログラムとは?
 * CPUの一部の処理を担うソフトウェア

# RISC(Redundant Instruction Set Computer) 
* RISCとは?
 * 縮小命令セットコンピュータ
 * 実行する命令の使用頻度の高い単純な命令に限定
 * 命令の解読をワイヤードロジック方式で行うことが多い

# ハザード
* ハザードとは?
 * パイプライン処理で起こる問題の要因

# アドレッシングモード
* アドレッシングモードとは?
 * オペランドのアドレス指定方法

# パリティ
* パリティとは?
 * 1ビットの誤りを発見する技術

# ハミング符号
* ハミング符号とは?
 * 1ビットの誤りを検出し、正しい値に訂正できる
[Flutter] multipart/form-dataを使ってサーバーに画像を送る

# はじめに
`multipart/form-data`を使って画像を投げる処理を実装する機会があったのでそれについてメモがてら
どうせすぐ忘れちゃうしね！
ついでに誰かの役に立てば

# 実装
なんとなく`DIO`を使ってみたかったので`http`ではなく今回は`DIO`を使ってます(ちゃんと選定して使え)
基本的に`DIO`のREADME.mdに書いてある実装通りする感じで問題ないです
下のURLの`Uploading multiple files to server by FormData`のSampleを参考にしてください
https://pub.dev/packages/dio#examples

とりあえずやってみた実装はこんな感じ
色々省いてるので実装する際は細かいところもちゃんと書いたほうがいいです。
`FormData`を使うと`Content-Type`を`multipart/form-data`として扱ってくれるらしい

```Dart
Future<Object?> uploadFile({
  required String url,
  required File file,
}) async {
  final dio = Dio();
  final formData = FormData.fromMap({
    'file': await MultipartFile.fromFile(
      file.path,
      filename: file.path.split('/').last,
    ),
  });
  
  final response = await dio.post(
    url,
    formData
  );
  return response.data;
}
```

## 動かしてみよう
サーバーサイドの方の設定によってはこれでいけるかもしれません

ただ自分の場合は415が返ってきました
なにそれ

調べてみるとこういうエラーらしい
***415 Unsupported Media Type***
>  HTTP 415 Unsupported Media Type クライアントエラーレスポンスコードは、ペイロードフォーマットがサポートされていないフォーマットであるため、サーバーがリクエストの受け入れを拒否することを示します。
フォーマットの問題はリクエストされた Content-Type または Content-Encoding によるものか、または直接データを検査した結果に起因する可能性があります。

https://developer.mozilla.org/ja/docs/Web/HTTP/Status/415

ほー
んじゃ`Content-Type`を設定すればいいのか〜
どうやらサーバー側では`Content-Type`が`image/jpeg`以外は弾いているらしいので415が返ってきてたみたいです

ちなみに`MultipartFile`側でこっちから`Content-Type`を指定しなかった場合は以下のように設定されてるようでした
`application/octet-stream`
こいつはこういうやつらしい
> 汎用的なバイナリデータ (または本当のタイプが不明なバイナリデータ) は application/octet-stream です。

はじめてしった

## MultipartFileにContent-Typeを指定する
`MultipartFile`の引数の`contentType`の型は`MediaType`なので、
まずは以下のパッケージをimportします
`import 'package:http_parser/http_parser.dart';`

そこから`contentType`に以下のように`MediaType`を渡しましょう

```Dart
'file': await MultipartFile.fromFile(
  file.path,
  filename: file.path.split('/').last,
  // ここ↓
  contentType: MediaType.parse('image/jpeg'),
),
```

動かしてみると

200が返ってきた

俺の勝ち！

# 最後に
いつになったらプログラミング初心者を卒業できるんだろうか
間違ってたら優しい口調で教えてください

そして相変わらず日本語は難しい
nexusがtypescriptを適用してくれない！！

趣味でgraphqlを触っていて、技術選定として、
ApolloServer + Prisma + nexusの組わせを
使っていたが、nexusの

####型作成コマンド
```
ts-node --transpile-only src/schema // src/schemaのパスは各自のshcema定義ファイルを指定
```
によるtypesが適用されなかった。

原因は以下のコードだった。

```
const schema = makeSchema({
    types: [ NexusPrismaScalars, types ],
    plugins: [
        connectionPlugin(),
        fieldAuthorizePlugin()
    ],
    outputs: { //　こいつが原因！！！！！
        schema: path.join(__dirname, 'generated/schema.gen.graphql'),
        typegen: path.join(__dirname, 'generated/nexusTypes.gen.ts'),
    },
    contextType: {
        module: path.join(__dirname, './types/context.ts'),
        export: "Context"
    },
    
    sourceTypes: {
        modules: [
            { module: "@prisma/client", alias: "prisma" },
        ]
    },

})
```

どうやら型作成コマンド時に、 outputsのパスが、
[型作成コマンド](######型作成コマンド)で指定したスキーマファイルのパスと同じ階層か、
指定したパス以下の階層を指定してやらなければ適用されないらしい。
もしそれでもtypescriptのタイプが敵意されなかったらouputsの
パスをいじくってみると正常に動くと思う... ...
【祝】CentOS 8+PostgreSQLにて動作するプリザンターを使用しCUI上で情報公開機能を設定する。【.NET Core版への統合】

# プリザンターとは
大好きです。

https://pleasanter.org/

# 祝.NET Core版に統合！
.net framwork版と統合でgithubのissueもなんとなく書きやすくなる。
.net frameworkがメインでユーザーガイドが記載されているから。今後読み替えがいらなくなったらいいなぁ。

https://pleasanter.org/archives/net5_integration

# テーブル公開機能
ログイン無しで、テーブルを公開することが可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179066/f7b897bd-9da4-6f75-8f3d-66af1df2e204.png)

https://pleasanter.org/manual/table-management-publish

# 設定
## 環境
以下の構成でAzureVMを使用し構築済みです。SSH接続が可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179066/06586c59-2b25-19aa-d132-b4251a034764.png)

### VMにログイン後、DBユーザーにログイン
```bash:
sudo su - ポスグレユーザー名
```

### PostgreSQLへの接続
```bash:
psql -U ポスグレユーザー名
```

### プリザンターのデータベースへ接続
```bash:
\c "Implem.Pleasanter";
```

### レコードのアップデート
```bash:
UPDATE "Tenants" SET "ContractSettings" = '{"Extensions":{"Publish":true}}';
```

### データベースから切断
```bash:
\q
```

### 公開機能の有効化
もしかしたら、間違いがあるかもしれないので自己責任でお願いします。
その他は以下のURLを参考にしてください。

https://pleasanter.org/manual/table-management-publish

以前メモ書き程度で書いたので再度書き直しました。
Dr.Sum Data Funnelで前回値を取得してみた

#1. はじめに

前回の記事「[Dr.Sum Data FunnelでCSVファイルを連携してみた](https://qiita.com/LuiLui/items/ae0ce6b36a68ee134fed)」ではDr.Sum Data Funnelの基本的な説明とCSV連携を説明しました。
今回はData Funnelで受信したデータを加工して、前回値というデータを作成したいと思います。

#2. パイプライン定義で前回値を取得

「計算項目の追加」をクリックします。
※パイプライン定義は前回の記事で使用した「mqttpublish_test」を流用します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/5b9e8b8b-5e21-dd82-a136-045bb6ca6ddc.png)

計算項目の追加画面で以下を設定して「追加」ボタンをクリックします。
項目名：LASTTIME_VALUE(任意)
項目のタイプ：値の参照
参照する項目：VAL（前回値）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/771a63a7-98db-d5dd-c788-1a748ac4aa08.png)

項目が追加されたことを確認して「OK」ボタンをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/aebf8388-f587-011f-88c5-b81afb718c29.png)


#3. プレビューで確認
設定した処理の動作確認をするために、サンプルデータを使用してプレビューすることができます。

パイプライン定義の編集画面から「取り込みデータ」の「テーブル化の設定」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/7edf5922-31d9-70ba-1030-5ab7ebc14604.png)

赤枠の部分に想定するサンプルデータを張り付けて「プレビュー」ボタンをクリック、プレビュー画面にデータが表示されたのを確認して「OK」ボタンをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/027f7ffe-a0cf-fd49-2916-86a08b0eb9a7.png)

「サンプルデータ」の「［テーブル化の設定］のプレビューデータを追加」をクリックして、サンプルデータが表示されることを確認します。
※「選択セルから貼り付け」ボタンを使用すると、タブ区切りのCSVファイルやExcelから直接貼り付けも可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/b6a38424-388b-aa67-6dba-65e18e7f423e.png)

「データ処理」の「プレビュー」ボタンをクリックして「02:計算項目の追加」を選択します。
2. で作成した「LASTTIME_VALUE」が正しく取得できていることが確認できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1569715/ada7db39-5eed-c4ab-c2be-0f4e8f8add6e.png)

#まとめ
Dr.Sum Data Funnelの加工処理の「前回値」の取得とパイプライン定義の作成中に加工処理の動作を確認するプレビュー方法について説明しました。プログラムを書かなくても手軽に加工処理ができることがわかっていただけたと思います。

ウイングアーク1st社のホームページからDr.Sum Data Funnelハンズオンの申込ができるようです。
興味がある方はぜひ申込してみてください！
TypeScript+ReactでのuseContext(転何知人T+Rその7)

# [前回](https://qiita.com/botanic7arc/items/ac5f8431c5fde5a561bd)までの状態

useEffectについて学習した。

# 今回の目的

useContextについて

# useContext

値を受け渡す際に使用する。
propsを使用してコンポーネントからコンポーネントへ値を受け渡す場合、親コンポーネントから子コンポーネントへのバケツリレーになる。しかしuseContextを使用すると直接値を受け渡すことができる。

宣言

``` 
const Contextの変数名 = React.createContext(Contextの初期値);
``` 

受け渡し

``` 
<Contextの変数名.Provider value=受け渡す値>
<Contextを使用するコンポーネント>
</Contextの変数名.Provider>
``` 

## 手順

前回作成したindex.tsxを以下のように変更、追加する。

``` tsx
import ReactDOM from 'react-dom';
import { useState, useEffect, useContext } from 'react';//useContext追加
import React from 'react';//追加

const Name = React.createContext('')//追加


const TextOutput = () => {
  const name = useContext(Name);//追加
  return (
    <p>Hello, {name}!</p>//変更
  );
}

//コンポーネント追加
const Space = () => {
  return (
    <TextOutput />
  );
}

const TextInput = () => {
  const [str, setStr] = useState('初期値');

  useEffect(() => {
    document.title = `input is ${str} !`;
  });

  return (
    <div>
      <form >
        <label>
          入力欄<br />
          <textarea
            value={str}
            onChange={event => setStr(event.target.value)}
          />
        </label>
      </form>
      <Name.Provider value={str}>{/* 追加 */}
        <Space />{/* 変更 */}
      </Name.Provider>{/* 追加 */}
    </div>
  );
}

ReactDOM.render(
  <TextInput />,
  document.getElementById('root')
);
``` 

いつも通り、npm startでプロジェクトを実行する。
'Hello, [入力した文字列]!'が表示されれば成功。

![スクリーンショット 2021-08-30 165446.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/792099/463ff3b8-8ec2-34fe-edc4-c9d27270e477.png)


# 解説

``` tsx
import { useState, useEffect, useContext } from 'react';//useContext追加
import React from 'react';//追加
``` 

useContextを使用するため、インポートしている。

``` tsx
const Name = React.createContext('')//追加
``` 

Nameを''で初期化し宣言している。

``` tsx
const TextOutput = () => {
  const name = useContext(Name);//追加
  return (
    <p>Hello, {name}!</p>//変更
  );
}
``` 

Nameの値をuseContextを使用してpropsを使用することなくnameに受け取り、表示させている。

``` tsx
//コンポーネント追加
const Space = () => {
  return (
    <TextOutput />
  );
}
```

useContextを使用するのが孫コンポーネントでも問題ないことを明らかにするために追加したコンポーネント。

``` tsx
      <Name.Provider value={str}>{/* 追加 */}
        <Space />{/* 変更 */}
      </Name.Provider>{/* 追加 */}
``` 

Space以下のコンポーネントで、値がstrのNameを受け渡すことをProviderを使用して宣言している。

# 要約

useContextを使用することでpropsなしの値受け渡しが可能になる。

# 次

- 作成中

2021/11追記:転職できました

# 参考文献

- [【useContext編】React hooksをイチから理解しよう](https://onityanzyuku.com/react-hooks-usecontext/)
- [React Contextの使い方 - Qiita](https://qiita.com/ryokkkke/items/dc25111fcf52ea579d58)
- [React hooksを基礎から理解する (useContext編)  - Qiita](https://qiita.com/seira/items/fccdf4e73c59c491558d)
- [useContext / React Hooks – React入門 - to-R Media](https://www.to-r.net/media/react-tutorial-hooks-usecontext/)
- [コンテクスト – React](https://ja.reactjs.org/docs/context.html)
Azure KeyVaultで保管しているシークレットを他のAzureリソースから参照する方法


今回はWebAppsのアプリケーション設定の値をKeyVaultに保管しているシークレットを参照したいと思います。

## 参照する前にやること

- WebAppsの [Id] からidentityをオンにしてオブジェクトIDを取得します。（後で使うのでコピー）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/467168/4476f175-851f-81f0-eb6e-3572558dc1a4.png)
（👆画像はWebAppsではなくFunctionsですが気にしないでください）

- 参照先のKeyVaultの [アクセスポリシー] でこのWebAppsがアクセスできるようにします
  - 「アクセスポリシーの追加」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/467168/e02d8f93-9f9b-6160-03cb-4d2c1f7b1709.png)

  - 「シークレットのアクセス許可」から取得にチェックを入れる。

  - 「プリンシパルの選択」から先程取得したオブジェクトIDを入力して選択して [追加] ボタンで追加する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/467168/4f8e2256-9ecc-9b59-76d9-7601e885ea04.png)


- 次に保管しているシークレットを見に行き、参照させたいシークレットを選択して、「シークレット識別子」をコピーして、下準備は終わりです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/467168/89041b86-837b-41ec-1b91-c87c3f0d184f.png)


## 設定する

- もう一度WebAppsに戻ってもらい、 [構成] ⇒ [アプリケーション設定] から「新しいアプリケーション設定」をクリック。


- 任意の名前を入れてもらい値には「@Microsoft.KeyVault(SecretUri=hogehoge)」を入力て追加します。「hogehoge」には各自コピーしたシークレット識別子に置き換えてください。
- 以上の設定をした後、忘れずに「保存」を行います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/467168/d23cf666-2226-a7c3-fb6b-52246306a73d.png)

- 👆の画像のようにキーコンテナの状態に緑色チェックが入っていれば成功です。
  - もしエラーが出ている場合、多くは👇が原因である可能性があります。
    - KeyVaultのアクセスポリシーがおかしい
    - アプリケーション設定で入力した値がおかしい
    - アクセスポリシーを追加する前にアプリケーション設定で参照を行った（アプリケーション設定から一度削除して、もう一度追加しなおしたら直った）
【SwiftUI】TextEditorにプレースホルダーを表示する

# はじめに
SwiftUIのTextEditorは標準でプレースホルダーを表示することができません。
ここではZStackを用いてTextEditorにプレースホルダーを表示する方法を紹介します。

# 実装

``` Swift
import SwiftUI

struct ContentView: View {
    @State var text = ""

    var body: some View {
        Form {
            ZStack {
                if self.text.isEmpty {
                    HStack {
                        Text("プレースホルダー").opacity(0.25)
                        Spacer()
                    }
                }
                TextEditor(text: self.$text)
                    .lineLimit(nil)
            }
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/559317/e6c310f4-8db6-ccbd-c36e-820d7b102c3a.png)

# 簡単に解説

textが空の時にZStackでプレースホルダーを重ねています。

``` Swift
if self.text.isEmpty {
    HStack {
        Text("プレースホルダー").opacity(0.25)
        Spacer()
    }
}
```
4.4(標準) 二変量正規分布

## 方針

X_1,X_2の同時分布の確率密度関数は，

```math
\begin{align}
f_{X_1,X_2}(x_1,x_2)&=\frac{1}{2\pi\sqrt{(1-\rho^2)\sigma_1^2\sigma_2^2}}\exp\\
& \left[\frac{1}{2(1-\rho^2)}\{(\frac{x_1-\mu_1}{\sigma_1})^2-2\rho\frac{x_1-\mu_1}{\sigma_1}\frac{x_2-\mu_2}{\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\}\right]
\end{align}
```

である．今，X_2=x_2が与えられているので，x_2を定数扱いすることによって条件付き分布を求める．

ところで，「条件付き〜」の文脈で「X=xが与えられた時」と言われたらxは定数であり，1とか2とか，陽性とか陰性とか，具体的な値だと思えば良い．例えば，X=xのもとでのg(X,Y)の条件付き期待値：

```math
\mathbb{E}[g(X,Y)|X=x]=\int g(x,y)f_{Y|X}(y|x)dy
```

では，xは条件付けられた値であるから，期待値は「定数」である．一方，Xが与えられた時のg(X,Y)の条件付き期待値：

```math
\mathbb{E}[g(X,Y)|X]=\int g(x,y)f_{Y|X}(y|x)dy
```

では，期待値は確率変数なので，期待値や分散を考えることができる．このように，いずれの「条件付き」でも変数を定数扱いするのに変わりはないが，条件づける値が具体的な定数なのか，実際は変数だがひとまず定数として見て条件付けているのか，で若干意味合いが異なる．そのため，「X=xを与えた時」「Xを与えた時」で区別されている．

最後に，条件付き分布を求める時，

```math
\begin{align}
f_{X|Y}(x|y)&= \frac{f_{X,Y}(x,y)}{f_Y(y)}\\
&= \frac{f_{X,Y}(x,y)}{\int f_{X,Y}(x,y)dy}
\end{align}
```

を考えたくなるが，f(x,y)を持っているならyを定数扱いすれば良いのでわざわざ積分したりする必要はない．

## 答案

X_1,X_2の同時分布の確率密度関数は，

```math
\begin{align}
f_{X_1,X_2}(x_1,x_2)&=\frac{1}{2\pi\sqrt{(1-\rho^2)\sigma_1^2\sigma_2^2}}\exp\\
& \left[\frac{1}{2(1-\rho^2)}\{(\frac{x_1-\mu_1}{\sigma_1})^2-2\rho\frac{x_1-\mu_1}{\sigma_1}\frac{x_2-\mu_2}{\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\}\right]
\end{align}
```

である．expの{}の中身は，

```math
\begin{align}
& (\frac{x_1-\mu_1}{\sigma_1})^2-2\rho\frac{x_1-\mu_1}{\sigma_1}\frac{x_2-\mu_2}{\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\\
&= \frac{1}{\sigma_1^2}x_1^2-2(\frac{\mu_1}{\sigma_1^2}+\rho\frac{x_2-\mu_2}{\sigma_1\sigma_2})x_1+\frac{\mu_1^2}{\sigma_1^2}+2\rho\mu_1\frac{x_2-\mu_2}{\sigma_1\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\\
&= \frac{1}{\sigma_1^2}\{x_1^2-2(\mu_1+\rho\frac{\sigma_1}{\sigma_2}(x_2-\mu_2))x_1\}+\frac{\mu_1^2}{\sigma_1^2}+2\rho\mu_1\frac{x_2-\mu_2}{\sigma_1\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\\
&= \frac{1}{\sigma_1^2}\{x_1-(\mu_1-\rho\frac{\sigma_1}{\sigma_2}(x_2-\mu_2))\}^2\\
&\ \ \ \ -\frac{1}{\sigma_1^2}\{\mu_1-\rho\frac{\sigma_1}{\sigma_2}(x_2-\mu_2)\}^2+\frac{\mu_1^2}{\sigma_1^2}+2\rho\mu_1\frac{x_2-\mu_2}{\sigma_1\sigma_2}+(\frac{x_2-\mu_2}{\sigma_2})^2\\
&= \frac{1}{\sigma_1^2}\{x_1-(\mu_1-\rho\frac{\sigma_1}{\sigma_2}(x_2-\mu_2))\}^2+\frac{1-\rho^2}{\sigma_2^2}(\frac{x_2-\mu_2}{\sigma_2})^2
\end{align}
```

と変形できる．ゆえ，expの中身は

```math
-\frac{\{x_1-(\mu_1+\frac{\rho\sigma_1}{\sigma_2}(x_2-\mu_2))\}^2}{2(1-\rho^2)\sigma_1^2}+(1-\rho^2)\frac{(x_2-\mu_2)^2}{2\sigma_2^2}
```

従って，X_2=x_2が与えられた時のX_1の確率密度関数は，

```math
\begin{align}
f_{X_1|X_2}(x_1|x_2)&= \frac{1}{\sqrt{2\pi\sigma_1^2}}\exp\{-\frac{\{x_1-(\mu_1+\frac{\rho\sigma_1}{\sigma_2}(x_2-\mu_2))\}^2}{2(1-\rho^2)\sigma_1^2}\}\\
&\ \ \ \ \ \times\frac{1}{\sqrt{(1-\rho^2)\sigma_2^2}}\exp\{(1-\rho^2)\frac{(x_2-\mu_2)^2}{2\sigma_2^2}\}
\end{align}
```

×以降は定数なので，題意が従う．またX_1,X_2が無相関，つまりrho=0の時,


```math
X_1\sim\mathcal{N}(\mu_1,\sigma_1^2),\ \ X_2\sim\mathcal{N}(\mu_2,\sigma_2^2)
```

が成り立つ．

## 参考文献

- 『[現代数理統計学の基礎](https://www.kyoritsu-pub.co.jp/bookdetail/9784320111660)』(久保川達也　著)
コマンドプロンプトがスクロールできない時の対処法

## Windowsのコマンドプロンプトがスクロールできなくなった時の対処法

Windowsのコマンドプロンプトでgitのbashを使いたくて、gitの再インストールなどをしていたら、コマンドプロンプト上でスクロールができなくなっていました！

日本語で調べてみたけど解決法がなかなか見つからなかったので、備忘録と英語無理な人のために記録しておきます。

## 解決法

cmdのタブを__右クリック__して一番の下の__プロパティ__を開きます。

プロパティを開いたら、その中の__レイアウト__をクリックします。

レイアウトの中の__画面バッファーサイズ__の高さを9999などの大きい数字に設定するとスクロールができるようになりました

## まとめ

何か難しいことをするまでもなく解決してしまいました...

これが最適解なのか分かりませんが、一応作業はできるようになったのでOKとしましたが、もっといい方法があったらコメントで教えてください！

## 参考
https://superuser.com/questions/161125/how-do-i-enable-scrolling-in-windows-command-prompt
Unityビルドエラートラブルシューティング


# クラスライブラリの出力タイプを持つプロジェクトを直接起動することはできません
VisualStudio側のソリューションエクスプローラのスタートアッププロジェクトの設定の参照がクラスライブラリに向いていると発生する。
ソリューションエクスプローラでスタートアッププロジェクトの設定を修正するか、UnityのExternalToolでRegenerateProjectFilesを実行すると直る。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1336886/9368fdc9-e354-927f-5b0b-d7396aab11d9.png)
DynamicBoneのColliders項目のMissingやNoneを一括で削除する

2022.07.16
VRChatのPhysBoneアップデートにあたり、PhysBonesに対応した記事を以下に書きました。
https://qiita.com/shoshoi/items/85f3a16e2ee5cf247928

# はじめに
VRChatアバターのDynamicBoneColliderを削除すると、そのColliderを参照しているDynamicBoneコンポーネントのColliders項目にMissingやNoneが表示されます。
MissingやNoneのままだと、VRChatのパフォーマンスランクのコライダー数制限としてはカウントされたままとなってしまうため、一つ一つ削除する必要があります。

この削除作業がなかなか面倒なため、CollidersのMissingやNoneを一括で削除するUnityEditor拡張を作成しました。

本記事では一括削除の手順を説明します。

![mendo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/89b9bd8b-7f93-178c-522d-04ff57e95d9d.png)

# CollidersのMissingやNoneの一括削除手順

## 作業の前提
- プロジェクトのバックアップをとっていること
- VRChat SDK2 または VRChat SDK3-Avatarをインポートしていること
- DynamicBoneをインポートしていること

## VRoidAvatarSetupUtilsの導入
1. 以下のURLから最新版（右上の赤いボタン）を入手します。  
https://jirko.booth.pm/items/3232745
2. ダウンロードしたファイルを展開（解凍）します。
3. 中に入っている**unitypackage**ファイルを、**Assets**にドラッグ＆ドロップし「import」します。
![new_capture1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/286c3e31-4e4f-1928-0aeb-1d9ae84e5c35.png)


## MissingやNoneの一括削除
VRoidAvatarSetupUtilsでCollidersのMissingやNoneの一括削除を行います。

1. 上の**VRoidAvatarSetup**メニューから**Remove MissingDynamicBoneColliders**を選択します。
![1_new.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/677699b6-ebb6-a53d-5e0e-fe64598b1abe.png)


2. ダイアログウィンドウが開くので、Destination AvatarにMissingやNoneを削除したいアバターをヒエラルキーからドラッグします。
![2_new.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/cb250901-c1da-a20d-ed75-75bd822834b9.png)


3. ウィンドウ下部の**Delete**ボタンを押下します。
![3_new.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/3a2509ed-4793-b8aa-f543-83e52c15c3ae.png)


4. 正常に削除が完了すると、**Delete**ボタンの下に「削除しました」を含むメッセージが表示されます。
![4_new.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/d12d6b4a-624a-568a-7f12-ec0b2c25bf97.png)


以上で手順は完了です。
![kanryo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1945857/07a0753e-8be7-3187-464f-94dc8d934f07.png)
【定期】最近、所属している会社が運営する転職サイトにて、ブログを書かせてもらっているのでそのリンクを貼っておく。

## 掲載サイト
* **[WhiteBiz](https://white-biz.com/)**  

## 掲載記事
* **[エンジニアの心得①](https://white-biz.com/articles/blog/tips-for-engineers/18)**  
* **[エンジニアの心得②](https://white-biz.com/articles/blog/tips-for-engineers/19)**  
* **[エンジニアの心得③](https://white-biz.com/articles/blog/tips-for-engineers/20)**  
* **[エンジニアの心得④](https://white-biz.com/articles/blog/tips-for-engineers/22)**  

ご覧いただいて良いなと思ったら、ぜひ、LGTMよろしくお願いします！！！
Immersalの英語ドキュメントの日本語訳 自分的メモ (Introduction to Mapping編)

https://immersal.gitbook.io/sdk/tutorials/how-to-map

こちらのページを日本語で要約していきます。(といってもDeepLで日本語訳したものをちょっと手直ししたものになります)

# 基礎編

マップはImmersal Cloud Serviceにて構築されます。

まず最初に、**画像**と**メタデータ**を送信(Submit)して、マップ構築の処理を開始する必要があります。

数十枚程度の小規模な処理であれば数秒で完了しますが、数百枚の画像を扱う処理では数十分かかることもあります。
マップを構築するためのインプットは、**カメラ画像郡**と**メタデータ**です。
メタデータの内容としては

- **カメラの基本情報**: ピクセルの焦点距離と主点のオフセット
- **カメラのpose情報**: メートル法による画像の相対位置と向き
- [オプション] **GPS座標**

最新のiPhoneに搭載されているLiDARデータはデバイスの制限があるため現在のところ使用されておりません。
Immersal Cloud Serviceの入力は**2D画像**でなければならず、**3D点群を**機械的に読み取り可能なMapに変換することはできません。 

## 地図作成のプロセス

- 入力された画像から、コントラストの高い領域や形状などの明確な視覚的特徴を見つける。
- 異なる視点で撮影された画像の視覚的特徴を照合する。
- 一致した特徴の視差を利用して、三次元構造を算出する。

三次元構造は、出力するMapの基礎を構築します。

# Quick Start

Immersal Cloud Serviceに画像を送信するには、REST APIを使用する個が可能ですが、最も簡単な方法は Immersal Mapper Appを使用することです。

[iOS版](https://apps.apple.com/au/app/immersal-mapper/id1466607906?l=ja)
[Android版](https://play.google.com/store/apps/details?id=com.immersal.sdk.mapper&hl=ja&gl=US)
こちらからアプリをダウンロード。

上手に行うためのTipsを共有します。

- 対象となるオブジェクトや場所の**周りを回る**という意識
- 小さな場所であっても、たくさんの画像を撮影すること (最低でも3枚)
- 複数の視点から撮影するときに、重なり合うように撮影すること
- 目安は2枚の画像の重なり率は30~50%
- 画像は縦長でも横長でもOK
- できるだけ多くの情報を画像に含めることが大事 (Skyのような画像は役に立たない)
- ユーザーが完成したAppを使用するときによく映る風景の写真を取ることが大事

<iframe width="560" height="315" src="https://www.youtube.com/embed/XjVPQsrpJtc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

# 空間の条件

空間マッピングと相性が悪い空間を紹介します。

例えば

- 反射率が高い表面は相性が悪い
- はっきりとした特徴がない場所は相性が悪い
- 真っ白な壁は最悪
- ダイナミックな照明の空間も相性が悪い
- 暗い空間も相性が悪い

# マッピングの練習

こちらは元のWebページの画像をパラパラ見るのが良いです。
英語が読めなくても画像で理解できます。

例として

- ARスポット
- インドア
- アウトドア

といったパターンに対しての撮影の仕方について紹介しています。

https://immersal.gitbook.io/sdk/tutorials/how-to-map
iPhoneアプリ作成入門に最適なUdemyのオススメSwift講座4選

iOSアプリを初めて開発すつ人にまずオススメしたいUdemyのSwift講座をまとめました。
ネイティブアプリでなくとも何らかのアプリ開発経験がある方が望ましいですが、強いモチベーションさえあればプラグミング未経験でもOKです。

## 【iOS14】SwiftUI 超入門 - Swift を基礎から学んで iOS (iPhone) アプリを開発しよう
おすすめ度：★★★★★
・[【iOS14】SwiftUI 超入門 - Swift を基礎から学んで iOS (iPhone) アプリを開発しよう](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fswiftui-ios-iphone%2F)
### この講座で学べる内容
・CoreML(機械学習)
・iOSアプリの作り方
・SwiftUIの基礎
・Swiftの基礎
・Xcodeの基礎

## みんなのiOS講座 ゼロからSwiftで学ぶiPhoneアプリ開発の基礎おすすめ度：★★★★★
・[みんなのiOS講座 ゼロからSwiftで学ぶiPhoneアプリ開発の基礎](	https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fios-apps%2F)
### この講座で学べる内容
・iOSアプリ開発の基礎が身につきます
・プログラミング言語Swiftの基礎が身につきます
・iOSの様々な機能を実装できるようになります
・さらに高度なアプリを開発するための下地が身につきます
・作りたいアプリを具体的にどのように実装するのか、想像できるようになります
・アプリの開発力が大きく向上します
・アプリ開発のモチベーションが向上し、オリジナルアプリを作ってみたくなります
## 【6日で速習】iOS 13アプリ開発入門決定版 20個のアプリを作って学ぼう（Xcode 11, Swift 5対応中）
おすすめ度：★★★★★
・[【6日で速習】iOS 13アプリ開発入門決定版 20個のアプリを作って学ぼう（Xcode 11, Swift 5対応中）](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fios11basics%2F)
### この講座で学べる内容
・Xcode 11 を使用してiOS 13用アプリを開発できるようになります。
・実機でビルドしたアプリを確認できるようになります。
・CoreMLでAIアプリを作れます。
・ARKitの基本を実機で体験できます。
・地図を表示するアプリを作れるようになります。
・カメラで撮った写真を表示するアプリを作れるようになります。
・Web APIを使用した天気情報検索アプリが作れます。
・iOS 13の新機能を理解することができます。
・Swift 5の基本を理解できます。
## SwiftとXcodeの基本を完全マスター　絶対に挫折しないiPhoneアプリ開発講座 Swift4, Xcode9対応
おすすめ度：★★★★
・[SwiftとXcodeの基本を完全マスター　絶対に挫折しないiPhoneアプリ開発講座 Swift4, Xcode9対応](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fiphone-swift4-xcode9%2F)
### この講座で学べる内容
・iPhoneアプリ開発の基本をマスターできます
・iPhone, iPadアプリ開発の書籍や記事を読んで十分理解できるレベルの知識が身につきます
・Appストアで公開するiPhone, iPad, Apple Watchのアプリを開発する基礎ができます
・アプリ開発業界で働く基本的なスキルを身に付けられます
・アプリ開発で疑問が起きたときに解決する力が身につきます

## 関連リンク
・[Java初心者に超オススメ出来るUdemy動画講座7選まとめ。最速マスター特化](https://qiita.com/ykimura517/items/946193f715776db44770)
・[Typescript入門におすすめのユーデミー講座5選。JS未経験者も可](https://qiita.com/ykimura517/items/1f3f59f64193a495542f)
・[【Androidアプリ開発】Kotlin初心者向けの超おすすめUdemy講座6選をまとめた](https://qiita.com/ykimura517/items/2ca099a9f19ec5ff4e4e)
・[SQL未経験者にオススメのユーデミー動画講座6選!データ分析したい人向け](https://qiita.com/ykimura517/items/24a5ba6cb742b4872640)
・[【Python】サーバーサイド初心者にオススメのUdemyのDjango動画講座5選](https://qiita.com/ykimura517/items/322fa40c6a4bac0bc111)
【UiPath】OrchestratorのAPIを使ってみる②～認証からAPI実行まで～

# 前回のつづき

[前回](https://qiita.com/yoshiyuki-iwata/items/98304a4ff2a40d8aa92c)は、UiPath OrchestratorのWebAPIを紹介しました。
認証が必要なんじゃない？というところで止まっていたので、今回はそこから続けます。

# ログイン認証方法

UiPath OrchestratorのAPIは、**Bearer認証**と呼ばれる方式で認証を行います。
Bearer認証の詳細については省略しますが、ざっくり説明すると、

+ 認証APIがトークンを返す
+ 以降、認証が必要なAPIを叩くときに、返ってきたトークンも渡して叩く

という感じです。

# 認証APIを叩いてみる

## 認証APIの仕様を確認

マニュアルのページから、`/api​/Account​/Authenticate`の仕様を確認します。
マニュアルのURLは以下でしたね。

```
https://[OrchestratorのURL]/swagger/index.html
```

パラメーターの部分を見ると、このようになっています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517338/bc34f600-e79b-0d79-d706-e9d19b066530.png)

JSON形式で、テナント名・ユーザー名・パスワードを指定してあげればよさそうです。

## 叩いてみる

いつもの[Talend API Tester](https://chrome.google.com/webstore/detail/talend-api-tester-free-ed/aejoelaoggembcahagimdiliamlcdmfm?hl=ja)を使って、認証APIを叩いてみます。

こんな感じで、POSTで叩いてあげましょう。
ユーザー名もパスワードも、Orchestratorにログインするときのユーザーを指定します。
パスワードは平文です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517338/219755ca-5ae8-427e-d723-f2a1710aff06.png)

## 結果をみてみる

認証できた場合は、HTTPステータス200が返ってきます。

また、JSON形式でBearerトークンが返ってきます。
以下の、`result`の部分です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517338/fb1ed8a6-4c25-f9ca-d6b4-35f7185b80b2.png)

ちなみに、ユーザー名やパスワードが違う場合は、こんなJSONが返ってきます。

```JSON
{
  "message": "Invalid credentials, failed to login.",
  "errorCode": 1000,
  "resourceIds": null
}
```

# トークンを渡して他のAPIを叩いてみる

次に、認証が必要なAPIを叩いてみます。
ここでは、`[GET] ​/odata​/Users`を叩いてみましょう。

## 叩いてみる

先ほど取得したBearerトークンを、HTTPヘッダ`Authorization`に設定します。
このとき、`"Bearer [Bearerトークン]"`というように設定する必要があります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517338/20d667c6-15cd-a48d-f7e1-705b18a91b8c.png)

## 結果をみてみる

このような感じで、JSONで結果が返却されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517338/2adb16ce-ad8e-61b2-7360-70159475af7a.png)

# 次回

今回は認証の通し方を説明しました。
シンプルなAPIだったので、他のAPIを叩く場合のパラメーターなどはマニュアルを参考にしてください。

次回は、APIを使ったツールを作ってみようと思います。
macOS Big SurでSPRENSENSE SDKを使う

macOS Big Surで、SPRESENSE SDKの構築に手間取ったのでそのメモ。

# KCONFIGのインストール

https://www.macports.org/install.php

よりMacPortsのmacOS Big Sur版をダウンロードして、インストール。

```
sudo port install kconfig-frontends
```

# SPRESENSE SDKの構築

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

```
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"
brew install wget
```

```
curl -L https://raw.githubusercontent.com/sonydevworld/spresense/master/install-tools.sh > install-tools.sh
bash install-tools.sh
```

```
source ~/spresenseenv/setup
```

※ sourceコマンドは.bash_profileに追記しておく

```
git clone --recursive https://github.com/sonydevworld/spresense.git
```

# コンフィグレーション

```
cd spresense/sdk
```

```
tools/config.py examples/hello
```

ここで、下記メッセージが表示

```
tools/config.py examples/hello
WARNING: New loader v2.2.0 is required, please download and install.
         Download URL   : https://developer.sony.com/file/download/download-spresense-firmware-v2-2-000
         Install command:
                          1. Extract loader archive into host PC.
                             ./tools/flash.sh -e <download zip file>
                          2. Flash loader into Board.
                             ./tools/flash.sh -l /Volumes/Datas/workspace_sony/sdk/spresense/firmware/spresense -c <port>
```

https://developer.sony.com/file/download/download-spresense-firmware-v2-2-000

に接続し、`spresense-binaries-v2.2.0.zip`をGet。

Host PC(Mac)に取り込み

```
./tools/flash.sh -e ~/Downloads/spresense-binaries-v2.2.0.zip 
```

SPRESENSEに焼き込む、この時 /dev/tty.*で認識されているSPRESENSEのデバイスを指定する。

```
./tools/flash.sh -l /Volumes/Datas/workspace_sony/sdk/spresense/firmware/spresense -c /dev/tty.usbserial-14430
```

# Build

```
make
```

# 焼き込む

```
tools/flash.sh -c /dev/tty.usbserial-14430 nuttx.spk
```

# 動作確認

```
screen /dev/tty.usbserial-14430 115200
```

```
NuttShell (NSH) NuttX-8.2
nsh> hello
Hello, World!!
nsh> 
```

CTRL + Aを押したあとにkを教えて終了
【Python】サーバーサイド初心者にオススメのUdemyのDjango動画講座5選

web開発(特にバックエンドかいはｔ)に入門したい人向けに、Django関連のおすすめUdemy講座をまとめました。
初心者OKのものがほとんどですが、Pythonの簡単な文法（for文、if文など）はあらかじめ知っていることが望ましいです。
（またはPythonに全く馴染みがなくても、多言語の経験があればOKです。）


## 【徹底的に解説！】Djangoの基礎をマスターして、3つのアプリを作ろう！（Django2版 / 3版を同時公開中です）
おすすめ度：★★★★
・[【徹底的に解説！】Djangoの基礎をマスターして、3つのアプリを作ろう！（Django2版 / 3版を同時公開中です）](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fdjango-3app%2F)
### この講座で学べる内容
・Djangoを使って作成したウェブサイトを作ることができるようになります。
・Djangoの基礎的なコードの書き方を学ぶことができます。
・Djangoで作ったサイトを公開することができるようになります。
・フレームワークやデータベースの概念を知ることができます。
## 【3日でできる】Django 入門 ( Python 3 でウェブアプリを作って AWS EC2 で公開！）
おすすめ度：★★★★★
・[【3日でできる】Django 入門 ( Python 3 でウェブアプリを作って AWS EC2 で公開！）](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fdjango-beginner%2F)
### この講座で学べる内容
・Python と Djangoでかんたんなウェブアプリケーションが書けるようになります
・サーバー環境にDjangoのアプリケーションを配置できるようになります
・Ubuntu 16.04上にDjangoの動作環境を構築できるようになります。
・Bootstrap 4.0を適用してレスポンシブなウェブアプリを作れるようになります。
・Amazon Web Service EC2のインスタンス管理・料金チェックなどができるようになります。
・Gunicorn（アプリケーションサーバー）でDjangoアプリを動かせるようになります。
・WSGI（ウィズギー）を使用してNginx（Webサーバー）Gunicorn・Djangoを使って、アプリを運用できるようになります。
・Djangoでログイン機能を実装できるようになります。（収録中）
・Djangoと決済システムの連携ができるようになります。（予定）
## 最新版：Python + Django3.1　Djangoを超詳細に解説、Pythonアプリケーション開発マスター講座
おすすめ度：★★★★
・[最新版：Python + Django3.1　Djangoを超詳細に解説、Pythonアプリケーション開発マスター講座](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Fpython-django-web%2F)
### この講座で学べる内容
・プログラミング
・python
・Django
・アプリケーション開発
## [基礎編]React Hooks + Django REST Framework API でフルスタックWeb開発
おすすめ度：★★★★★
・[[基礎編]React Hooks + Django REST Framework API でフルスタックWeb開発](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Freact-hooks-django-rest-framework-api-web%2F)
### この講座で学べる内容
・React Hooksの使い方
・Django REST FrameworkでのAPI開発
・React と Django REST FrameworkのAPI連携
・SPA(シングルページアプリケーション)のReactでの基礎
・ReduxのcombinedReducesとHooksの組み合わせ
## [Instagramクローン編] React Hooks + Django Restframework
おすすめ度：★★★★
・[[Instagramクローン編] React Hooks + Django Restframework](https://click.linksynergy.com/deeplink?id=Qw*xM8wv/u4&mid=47984&murl=https%3A%2F%2Fwww.udemy.com%2Fcourse%2Finstagram-react-hooks-django-restframework%2F)
### この講座で学べる内容
・React最新技術を使ったInstagramクローンアプリ開発(ハンズオン)
・Django REST Frameworkを使ったAPI Endpoint開発
・Axiosを使ったフロントエンドとAPI Endpointの連携

## 関連記事
・[Java初心者に超オススメ出来るUdemy動画講座7選まとめ。最速マスター特化](https://qiita.com/ykimura517/items/946193f715776db44770)
・[Typescript入門におすすめのユーデミー講座5選。JS未経験者も可](https://qiita.com/ykimura517/items/1f3f59f64193a495542f)
・[【Androidアプリ開発】Kotlin初心者向けの超おすすめUdemy講座6選をまとめた](https://qiita.com/ykimura517/items/2ca099a9f19ec5ff4e4e)
・[SQL未経験者にオススメのユーデミー動画講座6選!データ分析したい人向け](https://qiita.com/ykimura517/items/24a5ba6cb742b4872640)
Ubuntu20.04.3のセットアップ

最近、開発環境をCentOSからUbuntuに切り替えているのでセットアップを行う機会が多くある。
自分なりのセットアップ手順をまとめた。

## ホスト名の変更

初期設定のままだとわかりにくいので、以下のように変更する

```sh
root@vultr:~# hostnamectl set-hostname hoge
root@vultr:~# exit
```
一度、ログアウトし再度ログインすると、ホスト名が変更できているのが分かる

```sh
root@hoge:~# 
```

## SSH
私はproxmoxにubuntuを入れて動かしているのでサーバーのIPアドレスを確認しSSHを行う。
サーバーにVNCが出来たら、初期設定にて設定したユーザー名とパスワードでログインを行う。
その後`ip a`を実行しサーバーのipを確認する。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/593714/5f4c3377-6a7c-1030-2f28-40b10f95ee86.png)

`1:lo`というのはループバックアドレスといって今回は利用しない。
`2: ens18:`が今回利用するアドレスだ。
`inet 192.168.1.167/24`となっているので、これにSSHを行う。

## visudoを既定でvimで編集する

```
sudo update-alternatives --config editor
```
以下のように表示されるため、3番を選択する。vim.basicとvim.tinyではvim.basicを選択する。

```
There are 4 choices for the alternative editor (providing /usr/bin/editor).

  Selection    Path                Priority   Status
------------------------------------------------------------
* 0            /bin/nano            40        auto mode
  1            /bin/ed             -100       manual mode
  2            /bin/nano            40        manual mode
  3            /usr/bin/vim.basic   30        manual mode
  4            /usr/bin/vim.tiny    15        manual mode
```

## ログインユーザーをパスワード無しでsudoを実行可とする

```
sudo visudo
```

25行目の`# Allow members of group sudo to execute any command`の下に以下を追加する。
以下はパスワード無しでsudoを実行可とするユーザー名がubuntuの場合だ

```sh
ubuntu ALL=NOPASSWD: ALL
```
## プロンプトの色を変更する
```sh
sudo -i
```

```sh
echo "export PS1='\[\033[01;32m\]\u@\h\[\033[00m\]:\[\033[01;34m\]\w\[\033[00m\]\$ '" >> /etc/profile.d/prompt.sh && \
echo "export PS1='\[\033[01;31m\]\u@\h\[\033[00m\]:\[\033[01;34m\]\w\[\033[00m\]\\$ '" >> /root/.bashrc
```
## sshを公開鍵認証に変更
いくつか選択を求められるが、全てEnterでよい

```sh
ssh-keygen -t ed25519
```
```
cat .ssh/id_ed25519.pub >> ~/.ssh/authorized_keys
chmod 0700 ~/.ssh/ && chmod 0600 ~/.ssh/authorized_keys
sudo systemctl restart sshd
```

## 参考文献
visudoに関して　@koara-local 
https://qiita.com/koara-local/items/35b999631b6ab41fdc9f

sudo のパスワードを入力なしで使うには @RyodoTanaka 
https://qiita.com/RyodoTanaka/items/e9b15d579d17651650b7

Centos8セットアップ(softetherセットアップ向け)-プロンプトの色を変更する @honahuku 
https://qiita.com/honahuku/items/8d74833e649ccc511fdc#%E3%83%97%E3%83%AD%E3%83%B3%E3%83%97%E3%83%88%E3%81%AE%E8%89%B2%E3%82%92%E5%A4%89%E6%9B%B4%E3%81%99%E3%82%8B
開発中のDjangoプロジェクトをiPhoneで確認する

# 環境
- Mac OS Big Sur 11.5.2
- iPhone 12 Pro


# 実機確認
基本的には、[こちら](https://qiita.com/k3ntar0/items/16047db352236b1ffe09#%E6%96%B9%E6%B3%95%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%83%8D%E3%83%83%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF%E3%81%AEip%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9%E3%81%A7%E6%8E%A5%E7%B6%9A%E3%81%99%E3%82%8B)の方法に準じますが、これではDjangoプロジェクトのレンダリング等が反映されないため、一部異なります。

## Mac側
### ①　ファイアウォールの設定をOFFにする

[システム環境設定]>[セキュリティとプライバシー]>[ファイアウォール]
 ![スクリーンショット 2021-08-30 15.28.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/407666/a7c73e4d-4ac5-7d6c-0f64-7fd122384935.png)


### ② ローカルネットワークのIPアドレスを確認する

MacのIPアドレスを表示する
[システム環境設定]>[ネットワーク]>[詳細]>[TCP/IP]

![スクリーンショット 2021-08-30 15.28.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/407666/57e16619-e2ea-e6be-8dc1-e6a76c6558ea.png)

ここで確認した、Iv4Pアドレスを使用します。今回は、**172.16.10.7**です

### ③Djangoサーバーの立ち上げ

```terminal
python manage.py runserver 172.16.10.7:8000
```
 
## iPhone側

ブラウザを開き、**172.16.10.7:8000**とすることで開けます。
Javaマルチスレッド

# なんでマルチスレッド使う

例えば、複数なユーザーがバイクレースゲームするとし、みんながそれぞれログインして、見てる画面が同じとか、ウィブで記事を見ながら音楽も聴けます、トイレしながらスマホをいじったりとか。こいうような複数な処理を行うのがマルチスレッドの役割です。

ご存知のように、javaのプロジェクト一つにあたり、メインメソッドが一つしかない、じゃ上記の場合には複数のメインメソッドが必要になりますね。

↑を解決するために、マルチスレッドを使います。

# マルチスレッド作成種類

作成するのに以下の三種類があります。

## thread(重要)

以下三つのステップでスレッド作れます。
①Threadクラスを継承する
②runメソッドをオーバーライドする
③startでスレッド開始する

[Threadクラスドキュメント](https://docs.oracle.com/javase/jp/8/docs/api/)

```java:ThreadTest.java
package com.maekawa.base;

//Threadクラスを継承する
public class ThreadTest extends Thread{
   // runメソッドをオーバーライドする
    @Override
    public void run() {
        for (int i = 0; i <100 ; i++) {
            System.out.println("処理事項その二");
        }
    }

    public static void main(String[] args) {
        // startでスレッド開始する
        ThreadTest threadTest = new ThreadTest();
        threadTest.start();

        for (int i = 0; i < 100; i++) {
            System.out.println("処理事項その一");
        }

    }
}
```

## runnable(重要)

Threadクラスにすでに実装されたインターフェースrunnableを使う。
①Threadクラスを継承する
②runメソッドをオーバーライドする
③startでスレッド開始する

```RunnableTest.java
package com.maekawa.base;
/*
マルチスレッド作成方法
①Threadクラスを継承する
②runメソッドをオーバーライドする
③startでスレッド開始する
 */
public class RunnableTest implements java.lang.Runnable {
    @Override
    public void run() {
        for (int i = 0; i <100 ; i++) {
            System.out.println("処理事項その二");
        }
    }

    public static void main(String[] args) {

        RunnableTest runnableTest = new RunnableTest();
        //書き方1
        //Thread thread = new Thread(runnableTest);
        //thread.start();
        //書き方2
        new Thread(runnableTest).start();

        for (int i = 0; i < 100; i++) {
            System.out.println("処理事項その一");
        }

    }
}
```

## callable(理解程度)

[公式ドキュメント](https://docs.oracle.com/javase/jp/8/docs/api/java/util/concurrent/Callable.html)

この記事のコードが分かりやすい。

https://www.infoscoop.org/blogjp/2014/10/09/callable-future/

# ラムダ(Lambda)式

参考記事↓

https://www.bold.ne.jp/engineer-club/java-lambda-expression
PHPで超ミニマムお問い合わせ画面を作る

PHPでのメール送信について説明する機会があったので、最小限のサンプルをここにも書いておきます。
さくらのレンタルサーバ ライトプラン(PHP7.4)で動作確認しました。

# 対象の読者
- 「お問合せ」画面の仕組みを作りたい(サイトに訪れた人が「お問合せ」画面で入力し、「送信」ボタンを押すと管理人にメールが届く)
- PHPが動くサーバがある

# mb_send_mail とは
PHPに最初から備わっている「メール送信ができる関数」。
詳しくは[リファレンス](https://www.php.net/manual/ja/function.mb-send-mail.php)を参照。

# 確認してみる
メール送信の部分だけを確認するため、余分なところは省いていますが、このままコピペでも動きます。
(さくらのレンタルサーバであればwwwフォルダに以下の2ファイルを作成して、 http://ドメイン名.sakura.ne.jp/test.html で確認できます。)

### test.html

```html
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<form action="mail.php" method="POST">
  <input name="name">
  <input name="contact">
  <textarea name="text"></textarea>
  <input type="submit">
</form>
```

### mail.php

```php
<?php
mb_send_mail(
  "postmaster@XXXXXXXX.sakura.ne.jp",
  "ポートフォリオ問合せ",
  "ポートフォリオの問合せ画面に入力がありました。
    お名前： {$_POST["name"]}
    ご連絡先：{$_POST["contact"]}
    内容：{$_POST["text"]}
  ",
  "From: postmaster@XXXXXXXX.sakura.ne.jp
Return-Path: postmaster@XXXXXXXX.sakura.ne.jp
Content-Type: text/plain;charset=UTF-8");
?>
お問い合わせありがとうございます。<br>
お問い合わせを受け付けました。<br>
内容を確認してお返事いたしますので、お待ちくださいませ。<br>
<br>
<a href="<?=$_SERVER["HTTP_REFERER"]?>">戻る</a>
```

※ メールアドレスのXXXXXXXXと、htmlの各<input>のname="XXXX"と、phpの$_POST["XXXX"]は適宜修正しましょう。<form>のaction="mail.php"は、htmlとphpが別のフォルダにある場合は修正しましょう。

以上です。
【Rails】初学者の私が復習に使う記事まとめ（Qiita以外）

#目的
Qiitaで参考サイト管理を完結させるため。
自己満でブックマークの代わりとして使います。

#参考リンク

###機能
▷　【Rails】 ransackを使って検索機能がついたアプリを作ろう！
https://pikawaka.com/rails/ransack

###レイアウト
▷動くWebデザインアイディア帳
https://coco-factory.jp/ugokuweb/

▷Font Awesome
https://fontawesome.com/

▷Bootstrap Snippest
https://bootsnipp.com/

###ツール
▷ネーミングcodic
https://codic.jp/engine

▷DeepL翻訳
https://www.deepl.com/ja/translator

###クラウド
▷　やさしく学ぶAWS入門
https://www.sbbit.jp/article/cont1/43183

▷ バックアップ・災害対策での AWS 国内導入事例 Powered by AWS クラウド
https://aws.amazon.com/jp/solutions/case-studies/backup-dr/

#参考書籍

###Rails
▷　現場で使えるRubyonRails5速習実戦ガイド

###コーディング
▷　リーダブルコード
Google App Scriptでベイスターズの試合後に借金を数える

#動機
- なぜGAS?
    - いろいろ簡単だった
        - 環境構築不要
        - JavaScript
        - 日時で動かせる
        - 無料
- なぜベイスターズ?
    - 弱かった
        - 新監督
        - 戦力の流出
    - ~~今年はなぜかオリックスが強かった~~

#流れ
ベイスターズの試合の日、かつ敗北した日に開幕から現在までの勝敗をカウントする
↓
試合スケジュールはGoogle Calenderから取得
↓
正規表現で勝ち、負け、引き分け、試合中止を出すカウントする
↓
結果をdiscordで教える

# ベイスターズの試合日
Googleカレンダーがあるのでそれを拝借
https://calendar.google.com/calendar/u/0/embed?src=bnBiXzNfJTU5b2tvaGFtYSslNDRlJTRlJTQxKyU0MmF5JTUzdGFycyNzcG9ydHNAZ3JvdXAudi5jYWxlbmRhci5nb29nbGUuY29t

# カレンダーを読み込む
`CalendarApp.getCalendarById(id)`で読み込み、`getEvents(開幕日から今日)`で回す

```JavaScript
const bsCalId = "npb_3_%59okohama+%44e%4e%41+%42ay%53tars#sports@group.v.calendar.google.com"
const bsCal = CalendarApp.getCalendarById(id)
const today = new Date()

bsCal.getEvents(new Date("2021-03-26 00:00:00"), today).map(l => {
      if (gameResult(l.getTitle()) === "W") {
        countWin++
      } else if (gameResult(l.getTitle()) === "L") {
        countLose++
      }
    })
```
# 試合結果を正規表現でごにょごにょする
試合前
`BayStars @ Swallows`
試合後
`BayStars (33) @ Swallows (4)`
で記載されるので、
`WDLN`の4つのどれかを返す

```JavaScript
// in : BayStars (33) @ Swallows (4)
// out : W D L N
function gameResult (game) {
  const bsSocre = game.replace(/.*BayStars \(([0-9]*)\).*/g,"$1")
  const otherSocre = game.replace(/BayStars \([0-9]*\)/g,"").replace(/.*\(([0-9]*)\).*/g,"$1")

  // 試合中止
  if (game === bsSocre || game === otherSocre) {
    return "N"
  } else if (bsSocre - otherSocre > 0) {
    return "W"
  } else if (bsSocre - otherSocre < 0) {
    return "L"
  }
  return "D"
}
```
#GASからdiscordにpost
qiitaにいっぱい載ってるので略
割と簡単にできた

```JavaScript
function post(url, message) {
  const payload = {
    'content' : message,
    'parse' : 'full',
  }

  const params = {
    'method' : 'post',
    'payload' : payload,
    'muteHttpExceptions': true,
  }
  
  UrlFetchApp.fetch(url, params)
}
```
#GASを日時で動かす
トリガー
↓
トリガーを追加
↓
実行する関数を選択、時間ベースのトリガーのタイプを選択(時間を選択)

#結果
リーゼントがとても伸びた(正式にはポンパドールらしい)
![スクリーンショット 2021-08-30 2.08.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1705850/b223da0f-291d-fc6f-de54-6bed3f81dee0.png)
ログイン後の遷移先を変更する方法

# 内容
deviseを用いてログイン機能を実装し、特に何も設定していないと root_path で指定したページに遷移すると思います。
そこで、ログインやゲストログイン後の遷移先を自由に指定する方法を紹介します。

# ログイン後の遷移先の指定
```application_controller.rb
class ApplicationController < ActionController::Base
  before_action :authenticate_user!
  
  #以下のメソッドを記入
  def after_sign_in_path_for(resource)
    prefix_path #遷移させたいページのpathを記述
  end
end

```

/users/application.rb に after_sign_in_path_forメソッドを用いて、ログイン、サインイン後に遷移させたいページのprefix_pathを指定することで変更できます。

# ゲストログイン後の遷移先の指定

```sessions_controller.rb
class Users::SessionsController < Devise::SessionsController
  def guest_sign_in
    # ゲストアカウントでログイン
    sign_in User.guest
    # 以下を変更
    redirect_to prefix_path #遷移させたいページのpathを記述
  end
end
```

ゲストログイン後の遷移先は、users/sessions_controller.rb のredirect_to でpathを指定することで変更できます。