OmniAICreator/Qiita-1.07M huggingface dataset:
Djangoで出てくるthroughとは

[Udemy講師](https://www.takux.one)をしている藤本です。

[Djangoコース](https://www.takux.one/#django-ecweb-vegeket)の中で何気なく使っていた `through` について、質問をいただいたので、解説を書き残しておきます。

## 質問内容

> Item.tags.throughはどういう意味があるのでしょうか。

上記の質問の through はコース内では admin.py で使用しました。

```python
...

class TagInline(admin.TabularInline):
    model = Item.tags.through

class ItemAdmin(admin.ModelAdmin):
    inlines = [TagInline]
    exclude = ['tags']

...
```

## サンプルのモデル解説

コースではItemモデルとTagモデルがあって、それらをManyToManyFieldで繋げています。

Itemモデルはアイテム（商品）だと思っていただき、Tagモデルは各アイテムに設定するタグです。

カテゴリーの場合はForeignKeyでいいのですが、タグの場合は少し用途が異なります。

- あるアイテムは複数のタグを持つことが可能です。
- あるタグは複数のアイテムから参照されてOKです。

図にすると下記のような感じです。

```mermaid
graph LR
    A[Item1]
		B[Item2]
		C[Item3]
		D[Tag1]
		E[Tag2]
		F[Tag3]

		A --- D
		A --- E
		B --- D
		B --- F
		C --- F
		C --- E

		
	
```

例えばItem1はTag1とTag2を持っています。

Tag1を見ると、Tag1はItem1だけでなく、Item2とも繋がっています。

このようなケースでは一対多のForeignKeyでは表現できないのでManyToManyFieldを使っています。

## ManyToManyFieldが行なっていること

ManyToManyFieldを使えば多対多を表現できますが、どのようにそれを実現しているかというと、

モデル間（テーブル間）に中間テーブルを作成して実現しています。

つまり今回の例ではItemモデルとTagモデルを直接結びつけるのではなく、中間テーブルを介して間接的に繋げているということです。

図にすると次のようなイメージです。

```mermaid
graph TD
    A(Itemテーブル) ---|ForeignKey 一対多| B(中間テーブル)
    C(Tagテーブル) ---|ForeignKey 一対多| B(中間テーブル)
```

中間テーブルを介することで、Itemテーブルと中間テーブルはForeignKeyをはることができ、Tagテーブルと中間テーブルに関しても同様です。

中間テーブル自体は参照元IDと参照先IDをレコードとして保持します。

## throughは中間テーブルを指す

ManyToManyFieldを使えば中間テーブルが自動的に作成されます。その中間テーブルを呼び出すにはどうすればいいかというと、この時に `through` を使います。

今回は `through` をadmin.pyの中で設定しています。

この目的を解説しておくと、

まずDjangoはデフォルトで管理画面があります。

（簡単な設定さえすれば）管理画面では各テーブルのレコードを見ることができます。

例えば各アイテムなどです。あるアイテムページを開くと、そのアイテムが持っているフィールドの値を確認することができます。

今回の例ではアイテムはタグを持っているので、タグも表示させたいです。

ただし、タグとは多対多なのでデフォルトでは見栄えがあまり良くないです。なので、見やすくするために `TabulerInline` をadmin.pyで設定しています。

 `TabulerInline` を使うには、どのモデルかを渡さなければいけません。この場合は両方のモデルを参照している中間テーブルを指定してあげます。

そのために `through` を使っています。

```python
model = Item.tags.through  # この行
```

そうすることで、あと少しの設定などをすればアイテムページでタグを見やすく表示できます。

以上です。

今回の例ではadmin.pyで使用していますが、どこでも使えます。気になった方は中間テーブルの中身を確認してみるのもいいかもしれませんね。
Javaで何か作ってみる(2022/11/06 Day17)

## 今日やった事
- 本当何もしなかった。
## 参考にしたもの
- 特になし。
## 所感
- 今日は本当何も勉強しなかった、ただただ反省。。。
## 明日の予定
- 引き続き、GitHubの整理を進めていく。
Javaで何か作ってみる(2022/11/05 Day16)

## 今日やった事
- [**Other**](https://github.com/takamatsuryota3/Other)というリポジトリを作成し、そこに既存リポジトリ**Test**を統合した。
## 参考にしたもの
- [gitリポジトリの統合 - Qiita](https://qiita.com/CORNER/items/2e608f1091f305794f0a)
- [【Git】2つのGitリポジトリを履歴を保持して統合したい - Qiita](https://qiita.com/no_kawai/items/5efe8e47e54ebccd0bf8)
## 所感
- やり方について、まだ見ながらでないと出来ないので、見ずに出来るようになりたい。
## 明日の予定
- GitHubの整理を終わらせたい。
- Javaの勉強も再開したい。
【github】リポジトリの連携をやり直す

# リポジトリの連携
連携がおかしくなっている場合や、新しくリモートリポジトリを作ったけど連携できない、というときには**ローカルもしくはリモートリポジトリに余計なつながりが残っている**場合が多いです。
ローカルだけ、もしくはリモートだけ消しても解決できないので、**つながりを完全に削除してから連携し直しましょう**。

また、同じ名前のファイルやリポジトリがある場合は先に整理しましょう。
同じ名前の物があると、後にリポジトリの作成ができなかったり、どのローカルのファイルと連携させているのか・編集しているのかがわからなくなってしまうため、**同じ名前のファイルがないかの確認・編集も必ずしましょう**。

**連携し直しの手順**

```ruby
1. リモートリポジトリの削除
   git remote rm origin

2. .gitの削除
   rm -rf .git

3. .gitの追加
   git init

4. リモートリポジトリの追加
   git remote add origin [追加したいリポジトリURL]

5. commit,pushする
```


# おまけコマンドメモ
## .gitの追加・削除

```ruby
#.gitを追加
git init

#.gitを削除
rm -rf .git
```

## リモートリポジトリの追加・削除

```ruby
#リモートリポジトリの追加
git remote add [追加するリモートリポジトリ名] [追加したいリポジトリ]  
#originがリポジトリ名のデフォルトなのでよく使うのはこれ↓
git remote add origin [追加したいリポジトリURL]

#存在しているリモートリポジトリの一覧取得
git remote
git remote -v  #URLまで出る

#リモートリポジトリの削除
git remote rm [削除したいリモートリポジトリ名]
#originがリポジトリ名のデフォルトなのでよく使うのはこれ↓
git remote rm origin

#URLを変更
git remote set-url origin [変更先のURL]

#リポジトリ名を変更
git remote rename [変更前リポジトリ名] [変更後リポジトリ名]
```


参考：https://www.sejuku.net/blog/71492

もっと詳しく調査したい場合：
https://git-scm.com/book/ja/v2/Git-%E3%81%AE%E5%9F%BA%E6%9C%AC-%E3%83%AA%E3%83%A2%E3%83%BC%E3%83%88%E3%81%A7%E3%81%AE%E4%BD%9C%E6%A5%AD
エンジニア初心者がモブで開発するときに意識していたこと

# はじめに
モブプログラミングでチーム開発をしていたときに意識していたことをまとめてみます
モブはエンジニアに転生してから2つ目の案件で導入していました。

# 意識していたこと
- やりたいことを理解する
    - 作業の途中で理解が追い付かなくなることを防ぐため。また、やりたいことが理解できていないとテスト駆動開発ができないため
- 質問する
    - メンバー教育の目的でモブを導入していたので経験の浅い自分は出来るだけ質問するようにしていました
- 自分の理解度をメンバーに伝える
    - 自分の頭を整理してから質問することもあれば、整理できていない状態で質問することもありました。モブ中は常に私のペースで進むわけではなかったので後者になることが多かったです。

# 良かった点
- メンバーが状況を察して気にかけてくれるようになった
    - 自分の理解度を伝えたり頭を整理して考えていると、メンバーから「追いつけていますか？」「ここまで分かりましたか？
か？」と気にかけてくれることが増えました。出来るだけ自分で理解しようとすると途中から追いつけなくなりがちなので、そういった際は甘えることにしていました。

# 気をつけたい点
- 考えるあまり発言が減るときがある
    特に経験の浅い自分は考えたり、メンバーの考えを理解することに全集中しがちでした。気づいたら作業開始時に比べて口数が減っているといったことが多かったです。更にメンバー全員が詰まった際はもくもく会になることもありました。そういった際は個別で考える時間を設けていました。考える時は静かにしたい、話しながら考えたい、人によって様々だと思いますが、メンバー間で上手く調整できると良いと思います。



# おわりに
モブを導入する際はモブの考えやメリットを大まかに把握していただけで、具体的な取り組み方までは手探りでした。
この記事で取り組み方の1例として参考になればと思います。
tsc --watchの際のエラーを解消した

# 現状

TS練習用ディレクトリを作り、`tsc --watch`しようとしたところ、

> error TS6059: File 'S:/TypeScript/practice/promise.ts' is not under 'rootDir' 'S:/TypeScript/working'. 'rootDir' is expected to contain all source files.
  The file is in the program because:
    Matched by default include pattern '**/*'

というエラーが出てしまい、コンパイルできなかった。


現在のディレクトリ構成はこちら

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2666100/0e10540e-72f9-107d-c54c-e835174af9b9.png)

カレントディレクトリは`S:/TypeScript`

既に`tsconfig.json`に、以下の2つを設定してある。
+ コンパイルしたいtsファイルを含むディレクトリ(rootDir)
+ コンパイル先(outDir)

```tsconfig.json
{
    "compilerOptions": {
        // 略
        "rootDir": "./working",
        // 略
        "outDir": "./working",
        // 略
    }
}
```

# やりたいこと

workingフォルダのa.tsをコンパイルし、同フォルダにa.jsを作りたい。

エラー文の一部をコピペして検索すると、

https://qiita.com/masato_makino/items/bf640a253d56b708fe0b

> 解決策として、tsconfig.jsonにrootDirとincludeの両方のオプションを設定します。

とあった。

`tsconfig.json`を以下のように編集してみる。

```tsconfig.json
{
    "compilerOptions": {
        // 略
        "rootDir": "./working",
        // 略
        "outDir": "./working",
        // 略
    }
    "include": ["working"]
}
```
　
これで実行してみると、先ほどとは違ったエラー文が出力された。

> error TS18003: No inputs were found in config file 'S:/TypeScript/tsconfig.json'. Specified 'include' paths were '["working"]' and 'exclude' paths were '["./working"]'.

再びエラー文の一部をコピペして検索すると、

https://bobbyhadz.com/blog/typescript-error-no-inputs-were-found-in-config-file

この記事のうち今回のエラーの原因に当てはまりそうな部分は、

> Another thing that causes the error is if you add all the files in your TypeScript project to the exclude array by mistake.

> エラーが発生したもうひとつの原因は、誤ってあなたのtsプロジェクトの全てのファイルを配列`exclude`に入れてしまったこと（かどうかです？）。

配列`exclude`が何のことかわからなかったが、とりあえず指示通りに記述してみる。

```tsconfig.json
{
    "compilerOptions": {
        // 略
        "rootDir": "./working",
        // 略
        "outDir": "./working",
        // 略
    }
    "include": ["working"],
    "exclude": ["node_modules"]
}
```

これで再び`tsc --watch`してみると、エラーはなくなり、a.jsファイルが生成された。

# 解決した方法をまとめる

```diff_json
{
    "compilerOptions": {
        // 略
        "rootDir": "./working",
        // 略
        "outDir": "./working",
        // 略
    }
+    "include": ["working"],
+    "exclude": ["node_modules"]
}
```

# なぜこれで解決したのか

現在のフォルダにはexcludeしたnode_modulesフォルダはそもそも含まれていない。
解決はしたが理屈が分からないままなので、調べてみる


https://qiita.com/ryokkkke/items/390647a7c26933940470

https://www.typescriptlang.org/ja/tsconfig

> Exclude -exclude
includeの解決時にスキップさせるファイル名やパターンのリストを指定します。
重要: excludeはincludeの結果として、どのファイルが含まれるべきかのみに影響を与えます。 excludeに指定されたファイルは、コードでのimportやtypesでのインクルード、/// <reference ディレクティブ、filesリストの指定によって、コードベースの一部となり得ます。
excludeはコードベースに含まれているファイルの読み込みを防ぐための仕組みではありません。include設定の結果を変更するだけです。


結局分かりませんでした。
進展あったら追記します。
master, main, develop への commit を禁止する

master, main, develop ブランチ上で作業して、そのまま間違えて commit してしまうことが稀によくあるので、commit 自体禁止してしまおうと考えました。


# .githooks/pre-commit ファイルを作成する

```bash
#!/bin/bash
# 他の方の学習用も兼ねているため、しつこい程コメント追加

# commit 禁止 branch
readonly REJECT_COMMIT_BRANCHES=('master' 'main' 'develop')
# 現在のブランチを取得
branch="$(git symbolic-ref HEAD 2>/dev/null)" || "$(git describe --contains --all HEAD)"
# commit 禁止ブランチをループ
for reject_commit_branch in ${REJECT_COMMIT_BRANCHES[@]}; do
    # commit 禁止ブランチと一致するか
    if [ "${branch##refs/heads/}" = "${reject_commit_branch}" ]; then
        # commit 駄目だよメッセージを出力
        echo "[commit-error] ${reject_commit_branch} ブランチへの commit は禁止です。"
        # 0 以外を返すと commit が中断されるので 1 を返却
        exit 1
    fi
done
```

# commit 時に pre-commit スクリプトが起動するようにする

## .git/config 編集

```config
[core]
        repositoryformatversion = 0
        filemode = true
        bare = false
        logallrefupdates = true
        # 追加
        hookspath=.githooks
```

それでも動かない場合は、スクリプトの実行権限が無いかもしれないので追加

```bash
# 実行権限を追加
chmod 755 .githooks/pre-commit
```

# [追記] ついでに PHPUnit とか php-cs とか phpstan とか動かしたい

```bash
# PHP コンテナ名を入力
PHP_CONTAINER="xxxxxxxxxxxxxxxxxxxxxxx"

# 現在のディレクトリパスを取得
CURRENT_DIR=`pwd`
# A = 追加 M = 修正
# 追加修正したファイルの一覧を取得する（PHPファイルのみ）
COMMIT_PHP_FILES=$(git diff --name-only --cached --diff-filter=AM | grep '\.php' )

# エラー判定用変数
error=false
# PHP ファイルの追加・変更があれば続行
for commit_php_file in $COMMIT_PHP_FILES; do
    # コンテナ起動確認
    command="docker ps | grep ${PHP_CONTAINER}"
    if [ $? == 0 ]; then
        echo "[commit-error] PHPコンテナ [${PHP_CONTAINER}] を起動してください."
        error=true
    fi
    # 初回のみでループを抜ける
    break
done

# 取得した「追加修正ファイル」をループ
for commit_php_file in $COMMIT_PHP_FILES; do
    # テストファイルパスを作成
    # パスを置換
    test_path="${commit_php_file#app}"
    # ファイル名を置換
    test_php_file="${test_path/.php/Test.php}"
    # unit, feature テストファイルパスを作成
    unit_test_file="tests/Unit${test_php_file#app}"
    feature_test_file="tests/Feature${test_php_file#app}"
    # unit テストファイルと feature テストファイルを配列化
    TEST_FILES=($unit_test_file $feature_test_file)

    # 配列化したテストファイルをループ
    for test_file in $TEST_FILES; do
        # テストファイルが存在しているか
        if [ -e $test_file ]; then
            # docker exec 該当コンテナでコマンド実行
            # -c オプション コマンド実行
            docker exec ${PHP_CONTAINER} /bin/bash -c "php artisan test ${unit_test_file}" > /dev/null 2>&1
            # $? = 直前に終了したコマンドのステータス
            if [ $? != 0 ]; then
                echo -e "[test-error] ${test_file}"
                error=true
            fi
        fi
    done
done

if "${error}"; then
    echo -e "[commit-error] コミットに失敗しました"
    exit 1
fi
```

追記していきます
【備忘録・初心者向け】OCI(Oracle Cloud Infrastructure)でBastion接続時にエラー

# Bastionサービスとは

OCIのマネージドサービスとしての「踏み台サーバー」です。直訳で要塞と訳されますが、踏み台と読み替えましょう。

Bastionを利用することで、Private Subnetに所属するサーバーへSSH/RDPできます。Pubric Subnetに踏み台のコンピュートを作成する必要がありません。

https://oracle-japan.github.io/ocitutorials/intermediates/bastion/

また、データベースへの接続も可能。

https://qiita.com/liu-wei/items/e86e01ac3d61999aa811

# Bastion導入手順

Bastionを初めて導入する場合、以下チュートリアルをご利用ください。

https://oracle-japan.github.io/ocitutorials/intermediates/bastion/

# チュートリアル時にエラー発生⇒トラブルシュート

私の環境ではチュートリアルに沿うとエラーが発生しました。
正しくは、チュートリアルのVCN作成は知識があったため自己流で行っていましたため、エラー発生に至りました。

エラーメッセージの一部抜粋
```
Bastion plugin must be in the RUNNING state on the target instance
```

接続ターゲットとなるコンピュートの管理画面を確認するとBastionプラグインは有効化できているのですが、RUNNING状態ではないようです。

有効化したら自動で利用できるものと思い込んでいたので少しはまりました。

### 根本原因：
BastionプラグインをダウンロードするためのOracle Yum Repositoryに到達できていない。（プラグインをコンピュートが管理画面から有効化しても、OCIサービスとつながっていない場合、Bastionプラグインがダウンロードできていない。）

### 解決策：
VCNのサービス・ゲートウェイを有効化（ルート変更）、コンピュート再起動でうまく接続できました。

手順は以下が役に立ちました。

https://k21academy.com/1z0-1072/plugin-bastion-not-present-bastion-service-setup-on-oci-bastion-host-error/

# まとめ
VCN作成のチュートリアルは必要ないと思い、自己流で作成していました。
Object Storageをはじめ、「VCNの外にあるOracleサービス」はVCNから接続するためサービス・ゲートウェイが必要で、本件もそれに該当します。
【エラー解決方法(Rails API)】 406 Not Acceptable,...is missing a template for this request format and variant

# 概要
Rails7とReactでjbuilderを使用して値を返した際に出力された406エラーを解決するための記事です。

### エラー内容
``` docker
api_1    | Completed 406 Not Acceptable in 24ms (ActiveRecord: 5.6ms | Allocations: 1086)
api_1    | 
api_1    | 
api_1    |   
api_1    | ActionController::UnknownFormat (Api::V1::PostsController#index is missing a template for this request format and variant.
api_1    | 
api_1    | request.formats: ["text/html"]
api_1    | request.variant: []):
api_1    |
```
### ソースコード
```posts_controller.rb
module Api
  module V1
    class PostsController < ApplicationController
      def index
        @posts = Post.all.order(created_at: 'DESC')
      end
    end
  end
end
```

```app/views/api/v1/posts/index.json.jbuilder
json.set! :posts do
  json.array! @posts do |post|
    json.extract! post,:user, :id, :user_id, :text, :title, :image, :created_at
    post.current_user = current_api_v1_user
    json.favorited_by post.favorited_by?
  end
end
```

```routes.rb
  namespace :api do
    namespace :v1 do
      resources :posts, only: %i[index create edit update destroy] do
        resources  :favorites, only: %i[index create destroy]
      end
    end
  end
```

# 解決方法
routes.rbにformat: 'json'の指定をすると解決しました。


```routes.rb
  namespace :api, format: 'json' do
    namespace :v1 do
      resources :posts, only: %i[index create edit update destroy] do
        resources  :favorites, only: %i[index create destroy]
      end
    end
  end
```

指定しないと、レスポンスがjson形式で返されず406エラーになったものと思われます。
ヌル変換(Null Replacement)

[Teradata Vantage - Vantage Analytics Library](https://docs.teradata.com/r/Vantage-Analytics-Library-User-Guide/January-2022)[2022/9/22時点]の翻訳です。
(リリース番号 : 2.1.1 | リリース日 : January 2022)
> この記事はVantageアナリティクスライブラリ シリーズのコンテンツです。

# 概要
NULL変換を使用して、指定した列のNULL値をリテラル値、列の平均値、中央値、最頻値、または別のテーブルから結合した帰属値で置き換えることができます。列の値が偶数である場合、2 つの中間値の平均を取るか取らないかの中央値を要求することができます。

# 前提条件
・Teradata Vantageインスタンスにアクセスできること。
・Vantage アナリティクス・ライブラリがインストールされていること。

::: note info
Vantage アナリティクス・ライブラリのインストールについて、既にVantageを導入頂いているお客様はTeradataサポートサービスにお問い合わせください。
Vantage Express (評価版)やクラウドサービスのDIYでご利用頂く場合は[Teradata Dounload](https://downloads.teradata.com/download)からダウンロードし利用可能です。
Vantage アナリティクス・ライブラリのインストール手順は「[Vantageアナリティクス・ライブラリのインストール](https://qiita.com/ykswi/items/12d0da2ac69b4b161881#vantage%E3%82%A2%E3%83%8A%E3%83%AA%E3%83%86%E3%82%A3%E3%82%AF%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB)」の記事に従い行います。
:::

# データの準備
## サンプルデータの入手とデータベースへの格納方法
こちらの「[チュートリアル用のサンプルデータを用意する](https://qiita.com/tmsky/items/4d86ca35aef753290020)」を参照ください。


# 実行方法
## SQLから実行する場合の例
Sales,QuantityにNullが含まれている場合は0に置き換えます。
DiscountにNullが含まれている場合は平均値に置き換えます。
ProfitにNullが含まれている場合は最頻値に置き換えます。
```SQL
CALL td_analyze (
  'vartran',                          /* 分析手法　*/
  '
  database        = QID;              /* データベース名 */
  tablename       = Superstore;       /* テーブル名 */
  keycolumns      = Row_id;           /* KEYカラム */
  nullreplacement =
     {nullstyle (literal, 0), columns (Sales,Quantity)}
     {nullstyle (mean)      , columns (Discount)}
     {nullstyle (mode)      , columns (Profit)}
  ;                                   /* 導出項目の定義 */
  '
);
```

## オプションの説明
|Nullスタイルパラメータ|説明|
|:-|:-|
|literal,{value}|valueはリテラル値を指定します|
|mean|平均値|
|median|中央値|
|medianwithoutaveraging|平均なしの中央値|
|mode|最頻値|
|imputed,{tablename}|tablenameは入力データベースに存在し、null 置換を持つ各列に一致する列が含まれている必要があります。|

:::note information
出力結果をテーブルに書き込む場合は以下オプションを指定可能です。
outputdatabase = 出力データベース名;
outputtablename = 出力テーブル名; 
overwrite = {true | false}; --- 未指定の場合はtrueで上書きします
:::

## 出力結果
データ量が多いため上位10件を表示しています。
|Sales|Quantity|Discount|Profit|
|:-|:-|:-|:-|
|73.164|6|0.8|-186.5682|
|25.92|5|0.2|9.072|
|18.9|3|0|8.694|
|769.184|4|0.2|-163.4516|
|15.552|3|0.2|5.4432|
|39.48|1|0|11.0544|
|399.98|2|0|171.9914|
|19.312|2|0.2|3.1382|
|209.792|2|0.2|26.224|
|9.648|6|0.8|-16.884|
|～|～|～|～|

# おわりに
:::note information
サンプルコードはSQL関数から掲載し順次Pythonコードも掲載していく予定です。
:::

:::note warn
警告
この本書は[Teradata Vantageドキュメンテーション](https://docs.teradata.com/)よりトピックに必要な情報を抜粋したものです。掲載内容の正確性・完全性・信頼性・最新性を保証するものではございません。正確な内容については、原本をご参照下さい。
また、修正が必要な箇所や、ご要望についてはコメントをよろしくお願いします。
:::

#### Teradata Vantageへのお問合せ
[Teradata Vantage へのお問合せ](https://www.teradata.jp/About-Us/Contact)
インターンシップ体験記

# 自己紹介
+ 都内の国立大学の工学系大学院に所属しています。 
+ 高校や大学で、C言語やBASICについて基礎的な内容は習いましたが、今回のインターンで使用したPythonについて使用経験はありませんでした。
+ プログラミングの実務経験もありません。
# インターン概要
+ インターンに参加させていただいたBEMACでは主に船舶向けの電気設備の設計や開発を行っていますが、私は主に船舶データの活用と課題の解決を目的として設立された、東京データラボにて業務を行いました。 
+ 期間は週３日程度、４週間にわたって行われました。
+ 主にリモートワークを主体に作業を進めさせていただきましたが、必要があれば出社も可能とのことでシフトも柔軟に対応していただきました。 
+ インターン期間中には１泊２日の本社訪問の機会も頂き、本社工場の見学や、造船所の見学をさせていただきました。 

また、会社の寮に宿泊させていただきましたが、最近建設されたとのことで非常に快適で良い環境でした。 
# インターンでの業務内容 

+ 船舶の機関系における異常検知とトラブルシューティングの開発に役立つデータの基礎分析と、ダッシュボードアプリの作成 
+ 異常検知とトラブルシューティング開発に際して機関のモニタリングデータに対する基礎分析作業の効率化を目標として、収集データから船舶機器の異常検知に資する基礎分析や分析結果・収集データを効率的に可視化するアプリケーションの開発を目指しPythonを用いて課題に取り組みました。 
# インターンの所感 
業務については、どのような方法で進めていくか自主性が重視されており、知識のある方なら柔軟に課題に取り組める環境と感じています。 
私自身にはPythonの使用が初めてだったことと、扱った船舶の機関に関するデータが想像以上に項目が多く、複雑でデータの物理的な意味を理解することが難しく課題はかなり私自身にはタフだったと感ましたが、メンターの方とのフィートバックの機会も多く設定していただき、分からないことや躓いたことについても相談した際は、的確なアドバイスをいただき最終的には一つの成果物として提出することができました。 
また、データの取り扱いやPythonの利点なども認識できたので知識を深めていきたいと考えています。 
# 求められるスキル等について 

事前にデータ分析の知識があると非常に取り組みやすいと感じました特に社内ではPythonが主に使用されているのでこれを用いたデータ分析についての知識があればより取り組みやすいと感じました。 
また、インターンシップでは船舶に関係するデータを扱う機会が多いと思うので、船舶に関係する知識（船舶の構造や機関の構成、航海の概要）や海運業界の概要などを簡単にでも知っておくと非常に取り組みやすいと思います。 
私も特に機関に関する知識があれば、扱ったデータの物理的な意味や、項目間相互の関係についてもう少し深く扱えたと感じており、もし機会があればこの点を改善したいと考えています。 
# まとめ 
BEMAC社が課題として取り組んでいる船舶分野はソフトな側面だけでなくハードウェア的な視点も必要となりますが、新しい発見や多くの刺激がある分野ですので、プログラミングだけでなくデータ分析に興味のある方はぜひ飛び込んでみてはいかがでしょうか。
【laravel】ユニットテストざっくり

## 概要
laravelでは下記テストが用意されている。
- ユニットテスト　/tests/Unit
クラスやメソッドなどモジュール単位で動作を検証する

- フィーチャテスト　/tests/Feature
WebページやAPI機能など
コントローラの動き（リクエストを受けてレスポンスを返すまで）を検証する

今回はユニットテスト練習用を作成した際のまとめ。

## テスト対象の作成

```sample.php
   public function sample(int $english, int $math, int $science)
    {
        $average = ($english + $math + $science) / 3;
        //３教科の平均でクラス分け
        if ($average >= 85) {
            $class = 'advance';
        } else {
            $class = 'basic';
        }
        return array($average, $class);
    }
```

## テストクラスの生成
make:testコマンドでテストクラス生成
```
php artisan make:test SampleTest --unit

// ディレクトリを指定してファイル作成
php artisan make:test User/SampleTest　--unit
```
## テストメソッドを作成する
アサーションメソッド使って作成していく

```php
use App\Http\Controllers;
use Tests\TestCase;

class SampleTest extends TestCase
{
    /**
     * @test
     */
    public function sampleTest()
    {
        $result = (new Grouping)->grouping(90, 85, 80);
        $this->assertEquals($result[0], 85);
        $this->assertEquals($result[1], 'advance');
    }
}

```

## テスト実行

```
./vendor/bin/phpunit tests/Unit/SampleTest.php
PHPUnit 9.5.24 #StandWithUkraine

..                                                                 
Time: 00:00.471, Memory: 20.00 MB
OK (2 tests, ２ assertions)
```

テスト結果に「OK」が表示されれば成功！
上記だと２つのテスト、２つのアサーションが実行されたことがわかる


以上、簡単までに。
NASAのAPIのLINEBotでwebアプリを作りたい！～こんな形の日記、、、知らない～

NASAのAPIのLINEBotでwebアプリを作りたい！
--------------------
以前作ったNASAのAPIのLINEBotでwebアプリを作りたい！
↓過去作

https://qiita.com/kminamicric/items/4cd1083b0898f7f99963

このLINEBotでは毎日NASAがこれまでにとらえた天体画像が送られてくる。
自分で作ったっていうこともあり毎日NASAの写真を取得していた。しかしここで毎日こくられてくる中で、自分がいいなと思った写真がどこかに行ってしまう現象が起き始めた。

そんな問題を解決すべく今回はそこで取得した写真を記録できるWebアプリを作りたいと思った。


**（未）完成品**
----------
LINEBotの情報に加えその日の出来事を記録できるサイトを作りたかった。
しかし時間の都合上ここまでしかできなかった。

https://fabulous-douhua-583802.netlify.app/

**ソースコード**
----------------
<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="poKgXbZ" data-user="Southeecric" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Southeecric/pen/poKgXbZ">
  ToDoアプリ</a> by Southeecric (<a href="https://codepen.io/Southeecric">@Southeecric</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

先人の作品をヒントに取り掛かる
----------------------
LINEBotで得た情報を含め記録しておく機能を作りたかったので[My ToDo App](https://codepen.io/pen/?template=gOMMBgK)と[歴代推し一覧を登録するアプリ～推しは多いほどいいよね～ #CodePen #Bootstrap](https://qiita.com/yurisg/items/9742feb1af82a6033480)の作り方を参考にした。

自分が使いたい機能がコードのどの部分かというのを見つけ出すのに時間がかかった。

また、ただ写真を記録するだけの機能ではほかのやり方もあると思うが、今回はAPIで得た情報に加え自分の日記を書けるようにし**写真と日常を結び付けたい**と思った。

また、宇宙感を出すために背景を[COSMOS Title Card CSS3](https://codepen.io/sarazond/pen/vYNoxE)からとってきてWebページの雰囲気を作った。



**感想**
----------
CodePenは非常に便利だった。コード自体が分からないので、サンプルを使いコードを少しづつ変えながらどこが反映されるかというのを、見極めながら進めた。一か所変えるだけですべてに影響が出たり、何か所変えても自分の思い通りに行かない。そこに終始悪戦苦闘した。最近よく、**コードが示している部分がどの部分なのかを示してくれる機能があればいいのに**と思う。

**コードが書けないからここまでしかできなかった**というのか**コードが書けないのにここまでできた**、どちらにもとれるそんな挑戦だったと思う。

今回は完成させることができなかったが、LINEBotのままだとトーク履歴の中に消えていくだけであったが、このページを作ったことによって写真の記録だけではなくその日の自分の一日も記録することができる。ふとした瞬間に見返すと笑ってしまう新しい日記になると思う。
Visual Studio Codeで保存時に自動整形する方法

# はじめに

Visual Studio Codeでは、
デフォルトでコードを整形するショートカットキーが割り当てられています。
このショートカットキーを押すことでもフォーマット(整形)されますが、毎回保存前に押すのは非常に面倒くさいです。

| Windows | mac OS |
|:-----------:|:------------:|
| Shift + Alt + F | shift + ⌥ + F |

実はVisual Studio Codeでは保存時に自動整形する方法があります。
設定しておくと便利なので是非設定しておきましょう。

# 手順

以下のようなコードがあるとします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/fdf360c7-df8f-af87-c8e9-b129f70bd829.png)

設定を開き、そこから「format on save」と検索します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/94fcdba6-9dc9-5af1-bc5a-b85e1bf2d46e.png)

Format On Saveにチェックを入れるます。
あとは保存時にフォーマッターが効いて、ソースコードにインデントが適用されれば完了です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/acc6fbd9-92d5-2313-5fa2-bd8524a4b151.png)

## インデントの種類の変更

ちなみにインデントの種類の変更に関してですが、
Visual Studio Code右下のこちらの画像では「スペース:2」となっている箇所をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/7cca9787-0571-ff16-0459-dec30e79b3c5.png)

スペースによるインデントを押下。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/f56f903e-d0ce-ecea-c287-fca52d659504.png)

変更したいタブのサイズを選択します。
4に変更してみます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/b2b24131-0722-7d29-da1c-e5bc34d95491.png)

保存時に変更が適用されてインデントのスペーずが4つでフォーマットされました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/392337/b9ce56cc-f100-cab7-a363-55646fe784b2.png)
チュッパチャップスベイブレード制作秘話

どうもみかんせいじんです。
ここでは私の作品「チュッパチャップスベイブレード」
の制作秘話を書いていきます


# チュッパチャップスベイブレードとは？


https://twitter.com/mikanseizin427/status/1588456610435076096?s=61&t=uEhHWy6HlW05UauqcC8kAw


今年の11月上旬頃に筆者が投稿した作品。
タイトル通りチュッパチャップス✖️ベイブレードというテーマ

「『ベイブレード』（Beyblade）は、1999年7月からタカラトミー（旧タカラ）が発売している現代版のベーゴマ（玩具）である。」(Wikipediaより引用)

# 「チュッパチャップスベイブレード」制作のきっかけ
とあるはじプロ配信にてプレイされたゲームの中にチュッパチャップスが有った。
私は感動した。細い円柱で出来た棒、球で出来た飴。
そして何より帯である。チュッパチャップスには必要不可欠である帯も含め、完璧なチュッパチャップスをはじプロで作れる事を知ったのだ。
そこからはあっという間だった。
モチベーションが無限に湧き上がってくる。
# 制作開始
突然だが私は、操作キャラとカメラを既に作ってある
「3Dテンプレート」
を過去に制作している!
(公開はしていない)。
3Dのゲームを制作する際にコピーして使うのだ。
話を戻して、早速私はチュッパチャップスを作った。
![8B21822A-A4B3-4614-8725-0DFA83CF0473.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/acfe7ad4-4393-17e1-8172-881799a5751d.jpeg)



なかなかチュッパチャップスしている。
チュッパチャップスベイブレードなので回転させなければならない。
というわけで棒の部分をまわせるモノに変えてY軸回転に定数を繋げた。![A64F384E-2BFC-4996-82B1-972CB0CA3F8F.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/ad9de12d-861c-5ceb-fea3-7f2c26a3ed02.jpeg)
どんな感じかな〜とゲームを開始して様子を見てみる。
チュッパチャップスベイブレードにぶつかってみた。すると…！
![8A720134-2800-447F-82F6-E4F7B36F7C6F.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/5e009f7f-c285-1572-912c-470fb3f50bf6.jpeg)
倒れないのだ！　私は感動した。そしてめちゃくちゃテンションが上がった。
こうしてチュッパチャップスベイブレードの素体が完成した。
次に私はステージの制作に取り掛かった。
原作のベイブレードでは中央が窪んだステージが一般的に使用されている。
![E0310FD3-9F93-411C-A9FA-52467E2CD7DC.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/536d177b-f06d-08e4-afd8-761811916dd7.jpeg)
はじプロでこのような地形を作る方法はいくつかあるが、今回私はモノ発射ノードンを使用する方法で作ることにした。
![48A7916C-036F-41C1-8143-4536408B261D.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/dd8cca33-4894-f63f-ab06-6c9f094ef673.jpeg)
非常に見辛い図で申し訳ないが、要約すると少し傾けたモノ発射ノードンを回転させている。
ゲームを開始すると下のようにステージが出来る。
![27FBB533-2E8E-4AD1-94F9-88D6FA292CCA.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2957000/9afd8266-1d1d-5122-6463-e4e0d98018f9.jpeg)
そして先程作ったチュッパチャップスベイブレードを増やしたりなんやかんやするとチュッパチャップスベイブレードを遊べるようになった。
そろそろモチベーションが死んできたのでまとめに入らせて頂く。

# まとめ
本記事ではチュッパチャップスベイブレードの制作に至ったきっかけ等制作秘話を書かせて頂いた。
チュッパチャップスベイブレードは公開しているので是非あなただけのチュッパチャップスベイブレードを作り　
#チュッパチャップスベイブレード　
を付けてツイートして欲しい。

# 後書き
最後まで読んで頂きありがとうございます。
元々は数行で済ませるつもりが、
モチベーションが爆発し一気に書き進めました笑
こういう記事を書いたのは初めてなので、
読みづらい所があったかも知れません。
最後に、アドベントカレンダーを企画して下さった
tak.ham様ありがとうございました。

おしまい
Power Pagesでショッピングカートを作ってみた

■注意
この記事はまだ作成途中です。カートの新規作成→取引先担当者のカートIDの更新が未設定です。

■やりたいこと
Power Pagesで商品を選択し、発注を行う。Power Appsはできるだけ使用せずにPower Pagesを駆使する。


### 1.商品探すページから、カツカレー弁当を選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/7fe06803-b6ef-aeda-b32e-73d1bd1b896d.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/b7f7c1c7-e2f2-12f1-bf5a-7b563e21988a.png)


### 2.数量を入力
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/e7a81b83-4769-440a-716a-b4e1e11005be.png)

### 3.カートタブをクリックすると、現在のカートの内容を確認できる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/ffd25b96-0bc0-4bdd-835e-eba668e08b3d.png)

右の矢印から更新、削除も可能。（サブグリッド利用）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/fba9e0b3-9fda-2ae6-6834-9ef0e83ad55f.png)

### 4.発注タブから発注先の入力へ進むをクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/88b66756-0295-30e0-6410-13b13d5bd60e.png)

必要な情報を入れて購入を確定する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/cd07b5dc-fabc-004d-42ee-60d198c6f888.png)

### 5.発注履歴をみると注文日時が入った形で履歴を確認できる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/39a76b1d-a028-4b0f-a9fd-d9bc27e1022e.png)

## 設定でつまずいたポイント（11/7カートの新規登録、取引先担当者のカートIDの更新ができていません。）
A-1.購入を確定するをクリック→カートの注文日時の項目に現在日時を設定。（注文確定となる）
A-2.カートを新規作成→（まだできていない）
A-3.取引先担当者.カートIDを、カート新規作成したカートIDに更新する（まだできていない）

購入を確定するをクリック→カートを新規作成したいがまだできていない。URLパラメータで新規作成できるのか調査中。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/ac2f05fa-c4d4-588b-b213-0aac228bce8b.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/4af0a724-c6f2-327e-cb0f-aeb17088c670.png)


こちらは参考にした資料
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/69757e5e-6503-fc2f-c951-54c8f6c5cdd5.png)

https://powerplatformconf.connpass.com/event/245996/presentation/


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/1075c259-dc92-bc45-bcd9-ff768c93c99c.png)



■参考にした元ネタ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/dbb7f4f5-fbbe-fe4b-be4d-b03087bca1af.png)

https://powerplatformconf.connpass.com/event/245996/presentation/

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/367026/a6b337ab-0d17-2889-facf-30f74406d409.png)

以上
ABC 178 D - Redistribution を転がしながら思う 解けない問題との付き合い方

# はじめに
&emsp;問題は[**コチラ**](https://atcoder.jp/contests/abc178/tasks/abc178_d)
&emsp;DP のよくある問題の階段の登り方に類似して見えた。
&emsp;"DP あるある" かもしれないが、何を Dynamic に programming しようか非常に悩む。
&emsp;とりあえず **S 段の階段への到達の組み合わせに置き換えて考えた**

# コード & 解説
&emsp;dp はコードをベースに考えた方が早い気がする
&emsp;ただ、その前に整理すべきポイントがあります。

&emsp;&emsp;・dp[i]における i は階段の数(今、1段？2段?3段?...S段?)
&emsp;&emsp;・dp[i]に格納する数字は、何回、その段数を通過したか(例えば 4段を 1回？2回？3回？)
&emsp;&emsp;・通過した階段はいずれも **3** 以上(<=ココ重要)。

```dp.cpp
#include <iostream>
#include <vector>
using namespace std;

int main() {
                                  // COMMENT(好き勝手に書いてみる、見にくかったらゴメン)
	int S; cin >> S;              // =>input
	vector<long long>dp(S + 1, 0);// =>start point is stair#0,so dp length is S+1;
	dp[0] = 1;                    // =>every one start at stair#0, so dp[0] = 1;

    //<-------let's start DP-------------------------------------------------
	for (int i = 3; i <= S; i++) {//Step by step, climb the stair.
       
        //If (S-i<3), rest factor would become under 3.    
        //There are no restrection of number of step to climb at once.
        //So stair#0 => stair#S is possible.this is why i==S needs.
		if(S-i>=3 || i==S){

            //Turn right, and let's look back.which stair did i through?
            //And if the total value of stairs that I through in the past,
            //the combination would be needed to transport to dp[S]. so int k's maximum is S.        
			for (int k = 0; k <= S; k++) {
                
                //If the differenct between current stair and past stair is bigger than 3,
                //let's adapt current stair.
                //Of course, I only use stairs that I have passed through in the past. 
				if (i - k >= 3 && dp[k] != 0){
					dp[i] += dp[k];
				}
			}
            //dp[i] would become too big value,so "% 1000000007" would be needed.
			dp[i] = dp[i] % 1000000007;
		}
	}
    //------------------------------DP end----------------------------------->
	cout << dp[S];

	//while (1) {}
	return 0;

}
```
&emsp;あとは紙に書いて各自イメージ作りに徹すれば行けると思う。

# 解けない時にやった事
・思い切って別のことをする[ex). 掃除、食器洗い、ご飯の準備。。しながら片隅で考える(以外に有効)]。
・レベルを下げてDP の原理を復習する
&emsp;--なんでもいい、paiza, educational dp or web で検索して有識者の見解を読み漁る
・全く別の問題を解いて、頭を柔らかくする
&emsp;--atcoder, paiza ... 色々ある、コツは解いてて楽しい問題である事がミソ。
【Golang】heredoc で CLI のヘルプ表示のコードをインデント付きで読みやすくする【ヒアドキュメントのインデント】

# 複数行にまたがる文字列のインデント

> Go 言語（以下 Golang）で、複数行の文字列を <code>`</code>（バックティック、バッククォート）で使うも、**可読性のためにインデントさせたい**。
>
> しかし、インデントすると出力も必要以上にインデントが入ってしまう、あたりまえ体操問題。
>
> ```go
> func main() {
> 	fmt.Printf("%#v", `
> 		やぁ、世界!
> 		Hello, world!
> 	`)
> }
> // Want:
> // 
> //	やぁ、世界!
> //	Hello, world!
> // Got:
> // 
> //		やぁ、世界!
> //		Hello, world!
> ```

- [オンラインで動作を見る](https://go.dev/play/p/6j0UN3X5Eq4) @ GoPlayground


[「golang ヒアドキュメント インデント」でググって](https://www.google.com/search?q=golang+%E3%83%92%E3%82%A2%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88+%E3%82%A4%E3%83%B3%E3%83%87%E3%83%B3%E3%83%88)も求める形でヒットしなかったので、自分のググラビリティとして。

## TL; DR <sub><sup>（今北産業）</sup></sub>

1. `import "github.com/MakeNowJust/heredoc/v2"`
    - https://github.com/MakeNowJust/heredoc @ GitHub
        - Package [heredoc](https://github.com/MakeNowJust/heredoc) provides the here-document with keeping indent.
        - [heredoc](https://github.com/MakeNowJust/heredoc) パッケージは、インデント関係を維持したまま、[ヒアドキュメント](https://ja.wikipedia.org/wiki/%E3%83%92%E3%82%A2%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88)を提供します。
1. [GitHub CLI（`gh` コマンド）でも利用されている](https://github.com/cli/cli/blob/a8f57676749c123effdcc1783b4ffe4a3d14fd2a/go.mod#L7)パッケージ。
1. CLI アプリなどのヘルプ表示に便利。

    ```go:利用例
    package main
    
    import (
    	"fmt"
    
    	"github.com/MakeNowJust/heredoc/v2"
    )
    
    func main() {
    	// インデントさせたい
    	fmt.Println(`やぁ、世界!
    Hello, world!`)
    
    	// インデントさせると出力がズレる
    	fmt.Println(`やぁ、世界!
    		Hello, world!`)
    
    	// インデントさせても出力はズレない
    	fmt.Println(heredoc.Doc(`
    		やぁ、世界!
    		Hello, world!`),
    	)
    }
    // Output:
    // やぁ、世界!
    // Hello, world!
    // やぁ、世界!
    // 		Hello, world!
    // やぁ、世界!
    // Hello, world!
    ```

- [オンラインで動作をみる](https://go.dev/play/p/taZwqzgC-hC) @ Go Playground

## 参考文献

- [GitHub CLI - GitHub’s official command line tool](https://github.com/cli/cli) @ GitHub
芸術は爆発だ！私の頭もだ！やり場のない怒りを芸術の域に昇華させるアプリです。「なんで忘れるかなぁ俺の格言。それならつくる！《企画編➁》」

## 「なんで忘れるかなぁ俺の格言。それならつくる！《企画編➁》」のはずが･･･
趣味の競馬で負けた時に作った勝負事の格言、これが全く活かされていないことを解決するために格言DBを構築して、スマホやPCから登録・検索、週末に向けて格言適用レースの自動配信と機能を考えたのが《企画編①》でした。
　　　　[NOTE記事：なんで忘れるかなぁ俺の格言。それならつくる！《企画編①》](https://note.com/xedge748hagi/n/n1352db87dae7)
最近は便利な開発環境やアプリがいろいろあって、組み合わせればWEBアプリが簡単にできてしまう、なんてことは全くもってございませんでした。無料サンプルコードはいろいろありますが、ちょっと直すと動かなくなるんです。原因を調べようにもいろいろ出てきてどれが正解か判断つかないんです。イライラしながらも粘り強くソースコードと格闘しているときにそれは起こりました･･･。

## 15時34分の悲劇
もう15時過ぎてるやん、はよせなアルゼンチン共和国杯（東京芝2500m、ＧⅡ）間に合わへん。東スポを開いて馬選びに入ります。･･･（時間経過）･･･よっしゃ決めた、⑦ブレークアップと⑯ヒートオンビートの2頭軸三連複で相手は④コトブキテティス、⑤テーオーロイヤル、⑪ラストドラフト、⑭アフリカンゴールド、⑰ハーツイストワールや、はよ入力せんとあと2分で締め切りや頑張れ俺！　はよ画面変われ、はよせいはよせい、最後の送信、どや、・・・は？締め切り？しゃぁないしゃぁない。少し嫌な予感はしたものの再びソースコードと格闘です。･･･（さらに時間経過）･･･もうこんな時間か、せや、結果はどうやったやろ？　JRAのホームページで結果を確認します。
　「マジかぁああああーつ、嘘やろー、やめてくれやぁああー！」
7、17、16の順で決着し、三連複7-16-17は￥14,590の万馬券でございました。立ち直れませんです、はい。

## ということで
やり場のない怒りを処理するアプリを作ることにしました。私もいい大人ですから。たまたまCODEPENでサンプルをいろいろ見ていたら面白いものがありました。

<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="DByKvO" data-user="tholman" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/tholman/pen/DByKvO">
  Drawing with text</a> by Tim Holman (<a href="https://codepen.io/tholman">@tholman</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>


オリジナル作品は純粋に綺麗なアニメーション作品です。とても短いソースコードなのですが、マウスで文字の帯を重ねていく芸術作品のような仕上がりになります。ただ、1点残念なことがあり、それも含めて以下の通り改造しました。
思います。
★表示される文章がjavascriptに固定で直書きされており、CODEPEN上ではよいがアプリにすると直せない。
　→　レイアウトを変更して画面上にテキストボックスを追加し、入力内容を描けるようにした（はずだったのですが…）。

★使い道を怒りの解消とした。罵詈雑言を入力して描いていると魂の叫びを表現した芸術作品にも見えてきて気が収まります。

【使ったもの】
・HTML、CSS、Javascript
・CODEPEN、Vue.js
・compass/css3
・Anime.js


## できあがりはこんな感じです
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2887131/93753d4e-c10b-9a84-8d2d-54c0bb45d080.png)

## ソースコード
<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="MWXjOJO" data-user="Xedge748hagi" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Xedge748hagi/pen/MWXjOJO">
  芸術は爆発だ！</a> by Xedge748hagi (<a href="https://codepen.io/Xedge748hagi">@Xedge748hagi</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

## Netlifyで公開中
https://chic-squirrel-faf487.netlify.app

## 解説
実は不具合が残っています。テキストボックスの入力値がJavascriptに伝わらず、初期値で私が登録した文章しか使えません。テキストボックスの入力値は画面上に出せましたので、不具合があるとすると、本来のJavacsriptにVue.jsで追加を加えたことが原因で、Vue.jsからJavacsriptに変数（入力値）を渡せなくなっていることかと思います。
素の docker と ecr 公式イメージで aws  lambda をlocal で動かす

## Overview

[sam local](https://docs.aws.amazon.com/ja_jp/serverless-application-model/latest/developerguide/sam-cli-command-reference-sam-local-start-api.html) とか [serverless](https://www.serverless.com/) とかまどろっこしいんじゃ！というせっかちな方向けに、
最短距離で aws lambda を　local で動かす方法をお届け。

### 注意

本物の aws lambda 環境だと `LAMBDA_TASK_ROOT` の上書きができない。
必ず `$[LAMBDA_TASK_ROOT}/` 下にコード展開する必要があるので注意。

## ソース

お好きな[公式イメージ](https://gallery.ecr.aws/lambda) 使ってください。
サンプルでは特に意図はないけど node18 でいきます。

```docker-compose.yaml
version: '3.9'

services:
  node:
    image: public.ecr.aws/lambda/nodejs:18.2022.11.03.18
    command:
      - app.handler
    ports:
      - 9000:8080
    environment:
      LAMBDA_TASK_ROOT: /mnt/
    volumes:
      - ${PWD}:/mnt/
```

```javascript:app.mjs
export async function handler(event, context) {
    console.log(JSON.stringify(event))
    console.log(JSON.stringify(context))
    console.log(123)

    return "ok";
}
```

## 起動

```bash:bash
$ docker-compose up
```

## 実行

別のターミナルから

```bash:bash
$ curl -XPOST "http://localhost:9000/2015-03-31/functions/function/invocations" -d '{"payload":"hello world!"}'
```

とかやると、 `docker-compose up` したターミナルに結果が出るはず。
あとは公式イメージをベースに Dockerfile 書いてくなり、 `docker-compose.yaml` で肉付けしてくなりすれば良いと思います。

## cf.

まぁ細かい話はこのへん見てください。
https://gallery.ecr.aws/lambda
https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/configuration-envvars.html

lambda の ric とか rie とかの詳しい仕組みはこの辺が詳しく説明してくれてるのでおすすめ。
https://goropikari.hatenablog.com/entry/aws_lambda_ric_rie
エンジニア初心者が実践していた質問の仕方

# はじめに
未経験かつ事前知識なしの状態でエンジニアに転生し、分からないことばかりだった自分が人に質問するときに意識していたことを簡単にまとめてみます。

# 実践していたこと
以下のテンプレートで文面や話し方を組み立てていました。
- やりたいこと
- 遭遇したエラー
- 試したこと
- 試すのに参考にした記事

# 良かった点
- 教える側が頭を余計に使わずに済む
- 状況を整理することで理解が深まる
- テンプレートでメモを残すことで見返しやすい

# 気をつけたい点
- やりたいことがズレているとタイムロスなので、そこは予め確認できていることが前提
- チームが慣れてくると適当に質問し合えてしまうので、自分の頭を整理するためにもテンプレートを適度に意識する

# おわりに
質問される側にとって受け答えしやすいコミュニケーション方法は他にもあると思いますが、「今自分が話している内容は相手にどのように伝わっているか」を出来るだけ意識するようにしています。
【Linux逆引き】やりたいこと・知りたいこと記事まとめ

# この記事の目的・背景
[こちら](https://qiita.com/mido_jin/items/7d9a6adbb43cdb16b90b)のPython用の記事と同様に**Linux関係（主にコマンド類）**のまとめ的なものとして、筆者が１度調べた物をどんどん追加していきます。
重複が無いようには記載しますが、細かな部分で紹介する内容が異なっているが大元の情報（〇〇の仕方、など）が同様になっている可能性はあります。

# コマンド
- find（ファイルの検索）
    - https://www.digitalocean.com/community/tutorials/how-to-use-find-and-locate-to-search-for-files-on-linux-ja
- uniq（重複行の抽出・削除）
    - https://uxmilk.jp/53546
- uniq / sort / cat（2つのファイル間での重複を削除）
    - https://www.ninton.co.jp/archives/1997
- sed / awk / grep（文字列の置換・抽出・検索）
    - https://qiita.com/shuntaro_tamura/items/e4e942e7186934fae5e7
- awk （文字列の切り取り）
    - https://hacknote.jp/archives/21690/
- grep（抽出、正規表現で抽出）
    - https://bi.biopapyrus.jp/os/linux/grep.html
- grep（grepコマンド詳細、オプション一覧）
    - http://itdoc.hitachi.co.jp/manuals/3020/30203S3530/JPAS0250.HTM
- \> / >> / 2>（標準入力と出力、リダイレクトについて）
    - https://shellscript.sunone.me/input_output.html#%E6%95%B4%E5%BD%A2%E3%81%97%E3%81%A6%E3%83%A1%E3%83%83%E3%82%BB%E3%83%BC%E3%82%B8%E3%82%92%E5%87%BA%E5%8A%9B%E3%81%99%E3%82%8B---printf-%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89
- ||（コマンド失敗時の動作について）
    - https://eng-entrance.com/linux-basic-or
request_log_urlで、StripeのAPI呼び出しエラーの詳細をStripeダッシュボードでチェックする

Stripe APIを利用したシステムでは、Stripe APIのアップグレードだけでなく、呼び出し元のアプリの仕様変更やユーザーの意図しない操作などでAPIエラーが発生することがあります。

エラーへの対応は、SentryやRollbarを使ってリクエスト・レスポンスを調査するのが一般的ですが、実はStripeダッシュボードを利用することも可能です。

## ダッシュボードからAPIログを確認する

ダッシュボードでは、[開発者]タブの[ログ]から、API呼び出しのログが確認できます。

![スクリーンショット 2022-10-25 15.56.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2366300/9e3b7fb9-dbf4-3691-9fa3-2167c01fb748.png)

APIのパスや呼び出し結果（成功・失敗など）、Connectの親アカウントか子アカウントかなどでフィルタリングできます。

![スクリーンショット 2022-10-25 15.56.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2366300/4ec7d40d-7e5a-f273-35b0-4529576a55a3.png)

ログの詳細画面では、「リクエストの本文（Body）」や「レスポンス」、「クエリパラメータ」・「呼び出し元のSDK・APIバージョン」などが確認できます。

![スクリーンショット 2022-10-25 15.57.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2366300/1e0f49c7-6692-5321-315c-42a9a39ebd29.png)

顧客情報など、個人情報を含みやすいStripeのAPIリクエストのデバッグでは、Stripeダッシュボードのログ機能を使うと安全にデバッグが可能です。

## SDK / APIレスポンスの`request_log_url`で、システムのログからダッシュボードのログにアクセスする

とはいえ、サーバーやSentryなどのトラッカーに記録されたログとは別にStripeのログまで監視するのは少し手間がかかります。

そんな場合にお勧めしているのが、「**APIエラーレスポンスに含まれる、`request_log_url`パラメータを使う**」ことです。

`request_log_url`には、「`https://dashboard.stripe.com/test/logs/req_xxxx`」のようなダッシュボードのログ詳細ページへのURLが含まれています。

このURLをエラートラッキングツールやSlack・メールの通知文に含めることで、「**Stripe APIに関するエラー対応の時だけ、Stripeダッシュボードで詳細を確認する**」ワークフローが実現できます。

## JavaScript / TypeScriptで、エラーログURLを取得する方法

JavaScriptやTypeScriptで開発している場合、`try catch`でAPIエラーを取得し、その中からデータを取り出します。

```js
try {
  await stripe.checkout.sessions.create({...})
} catch (error) {
  console.log(error.raw.request_log_url)
}
```

TypeScriptの場合、`Stripe.errors.StripeAPIError`型でも`raw`は`unknown`型が指定されていますので、TypeGuardや`as any`などを利用します。

```typescript

try {
  await stripe.checkout.sessions.create({...})
} catch (error) {
  console.log((error as any).raw.request_log_url)
}
```

### SentryにコンテキストとしてURLを共有する

Sentryに通知する場合、以下のようにContextで送ることも可能です。

```js
try {
  await stripe.checkout.sessions.create({...})
} catch (error) {
  Sentry.captureException(error, {
    contexts: {
        stripe_log_url: error.raw.request_log_url
    },
  });
}
```


## [PR] Stripe開発者向け情報をQiitaにて配信中！

- [Stripe Updates]：開発者向けStripeアップデート紹介・解説
- ユースケース別のStripe製品や実装サンプルの紹介
- Stripeと外部サービス・OSSとの連携方法やTipsの紹介
- 初心者向けのチュートリアル(予定)

など、Stripeを利用してオンラインビジネスを始める方法について週に２〜３本ペースで更新中です。

-> [Stripe Organizationsをフォローして最新情報をQiitaで受け取る](https://qiita.com/organizations/stripe)
顧客行動を日毎に要約し基礎統計をとる(SPSS Modeler データ加工逆引き4-18)

# 顧客行動を日毎に要約し基礎統計をとる

![スクリーンショット 2022-10-28 22.52.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/4c9d1b85-dd81-1a9b-b440-799ceb149dc4.png)

## 1.想定される利用目的

・ 顧客のランク移動や休眠予測のための特徴量作成

## 2.サンプルストリームのダウンロード

https://github.com/yoichiro0903n/blue/blob/main/perday.str?raw=true

## 3.サンプルストリームの説明

![スクリーンショット 2022-10-28 23.02.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/5a3642c4-2006-2791-0640-79f9e137c220.png)

a.入力するデータは以下の通りです。IDが同じに日に複数回登場するトランザクションです。
![スクリーンショット 2022-10-28 22.52.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/10fa37dc-4a35-eec1-ca85-d8511256d069.png)

b.[レコード]ノードを編集します。IDと日付で要約します。
![スクリーンショット 2022-10-28 22.54.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/e6dea70b-b352-5199-6cb7-f22fa603c4d6.png)

[プレビュー]します。
![スクリーンショット 2022-10-28 22.54.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/aebc28b2-d078-0842-aab9-c23aa44d83d7.png)

c.[フィールド作成]ノードを編集します。[派生]モードを[条件付き]にしてIDが１レコード上と一致したら日付の差を求めます。[@&#xFFF0;OFFSET(フィールド,1)]でフィールドの値の1行上を参照します。[undef]は欠損値を意図的に作成する関数です。
![スクリーンショット 2022-10-28 22.55.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/1aca3ce7-22e5-3873-75a2-dcd51a583342.png)

[プレビュー]します。
![スクリーンショット 2022-10-28 22.55.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/3de302dc-d05a-efe4-e235-e6d233ec3451.png)

d.[レコード]ノードを編集します。IDで要約します。
![スクリーンショット 2022-10-28 22.56.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/6a94a3fc-6627-aa9a-bf66-ec0b36de20ea.png)

[プレビュー]します。完成しました。
![スクリーンショット 2022-10-28 22.56.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286322/5e1832cd-42ab-e1af-2c15-94c31c3bd112.png)

#### 注意点

ビジネスの業態や目的によって日毎に要約するべきかを検討します。

## 4.参考情報

#### オフセット関数を解説した記事

https://qiita.com/kawada2017/items/41e8847b280f35fa9aa4

https://qiita.com/kawada2017/items/1385a5d4a83154792c12

#### SPSS Modeler ノードリファレンス目次

https://qiita.com/416nishimaki/private/503037195081d3323eee

#### SPSS Modeler 逆引きストリーム集（データ加工）

https://qiita.com/416nishimaki/private/4bf813e6cba84b2a1008
Azure Fundamentals(AZ-900)：Azure の基礎: Azureの管理とガバナンスについて説明する「リソースロック」

Microsoft Learnを用いたMicrosoft Azure Fundamentals(AZ-900)の試験内容をまとめる投稿です。
この投稿ではMicrosoft Learnで学ぶ内容をできるだけ簡潔にまとめております。
Azureの勉強を一から始める方の参考になれば幸いです。

## 今回の学習内容
**◆「リソースロック」**
◇対応するMicrosoft Learn ラーニングパス
[Azure の基礎: Azureの管理とガバナンスについて説明する](https://learn.microsoft.com/ja-jp/training/paths/describe-azure-management-governance/)
◇対応するモジュール
[リソース ロックの目的について説明する](https://learn.microsoft.com/ja-jp/training/modules/describe-features-tools-azure-for-governance-compliance/4-describe-purpose-of-resource-locks)

※前回の投稿は下記から確認できます。
[Azure Fundamentals(AZ-900)：Azure の基礎: Azureの管理とガバナンスについて説明する「Azure Policy」](https://qiita.com/fsd-jume/items/789a3d341866eb58a90c)

## リソースロック
**適切なレベルのアクセス権を持つユーザがリソースを誤って削除/変更するのを防ぐ**
・個々のリソース、リソースグループ、サブスクリプションに適用可能
・親スコープに適用したロックは子スコープにも継承
※継承されるロックの中で最も制限の厳しいロックが優先
・Azure Portal、Power Shell、Azure CLI、ARMテンプレートから管理可能
・ロックされたリソースを変更/削除する場合は、最初にロックを解除する必要がある

**◆リソースロックの種類**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2851723/5e54f8f6-d251-3581-f826-d9168a2ebbea.png)

## 次の学習内容
**◆Service Trust Portal**

https://qiita.com/fsd-jume/items/9794137391d96190b27d

## 学習内容をまとめたページの一覧

https://qiita.com/fsd-jume/items/e4ec76959adb547ac5e8
エンジニア初心者がプランニングを経験したお話

# はじめに
エンジニアなりたての頃に経験したプランニングについて簡単にまとめてみます

# 前提
スクラムで開発を進めることになっていたので、スクラムイベントの1つであるプランニングで作業見積を行っていました。
プランニングではプロダクトバックログを作業可能なレベルに分解し、作業量を数字やサイズで見積もります。
当時はこの、「①作業可能なレベルに分解」「②作業量を見積もる」が上手くできませんでした。

# 改善方法

①については以下のようなテンプレートで考えるようにしました

- やりたいこと(ゴール)を理解する
   例) 画面にUserレコードの一覧が表示されること

- やることを大まかに把握する
   例) hogeファイルにUserテーブルから全レコードを取得する処理を追加する

- 作業箇所(スタート)を特定する
   例) hogeファイルをいじる

その後②のタイミングで自分なりに作業量を見積もり、他メンバーとその理由について話し合います。
この話し合いで「やることがこれくらいならこの作業量」といった感覚を身に付けていく練習をしていました。

所謂プランニングポーカーというやり方で、
メンバーがそれぞれ作業量を数字(1,2,3,5,8,..)やサイズ(XS,S,M,...)で見積りを掲示し、全員揃わなかったら話し合って最終的な作業量を決めます。メンバーのスキルレベルに差があると毎回話し合うことになると思います。


# おわりに
初めて経験したスクラムで一番印象に残ったイベントです。
作業について理解できないと自分が一番困るので、頑張っていました。
プランニングで曖昧な点を解消していくことがこの後の作業や今後の成長に繋がると思いますので、これからもしっかり取り組んでいきます。
エンジニア初心者がリモートでペアプロ・モブプロを経験したお話

# はじめに
ペアプロ・モブプロはコロナ対策でリモートワークになってから経験しました。
始めは様々な問題や不慣れな点がありましたが、現在は上手くやっています。
今回はチームでどのような環境で、どのような点に気をつけてペアプロ・モブプロしていたかを簡単にまとめてみます。

# 現在の環境
- zoom(画面共有)
- VSCode LiveShare
- LiveShare MobTimer or Mobster

開発を始めるまでの準備は以下の通りです
①開発環境を立てる
②LiveShareのURL発行
③zoomで画面共有

開発環境は基本的に同じ人のを使いますが、お休みが続く予定があったり、一定期間は別の作業で時間がとれないなどの状況に応じて別の人の環境を使うこともあります。


# 気をつけている点
- 説明を丁寧にする
指示を受けてタイプする人は頭がいっぱいになっていて、端折った指示を真に受けてしまうことが多いのではないでしょうか。「そこのif文～」というより「○行目のif文」のような明確な伝え方をするとスムーズにコミュニケーションできると思います。

- 開発環境は出来るだけ同じ人のを使う
始めの頃は各自慣れるために日替わりで準備していましたが、個々の環境に依存したエラーが出てしまい準備に時間がかかっていたので、基本的にはモブプロのやり方に合わせて同じ人の環境を使い続ける方が良いと思います。

# おわりに
リモートでしか開発業務の経験がないので対面のときと比較ができないですが、上手くチームで開発できていると思います。
始めは準備とエラー解決で30分~1時間ほどかかっていましたが、現在は数分で準備できています。
これからリモートで開発することになった、良いやり方を探していたという方の参考になればと思います。
エンジニア初心者がモブプロ勉強会をしたお話

# はじめに
モブプログラミングを始めて数か月後にメンバーから勉強会を開こうと提案がありました。
当時モブプロを実施しているチームは社内で私達しかいなく、モブの良さをチーム外にも広めたいというということでした。
特に経験の浅い私にとってモブはとても有難く、モブの良さを知ってもらうため勉強会を行うことに賛同しました。
この記事ではモブプロについて教えた際に経験したことや気づいたことを簡単にまとめています。

# 勉強会概要
- 勉強会は1時間(前半30分でメンバーがモブプロについて説明、後半30分でモブ体験)
- 参加者4,5名からなるチームに対してメンバー1人が担当して教える(参加チームは5つでした)
- 各チームは簡単なプログラミング課題を制限時間(30分)以内にモブで解く
- タイピスト交代時間は5分(かなり短いですが、時間内に全員がタイピストを経験できるようにするため)
- 担当者はモブプロが上手く進行するように支援したり質問に対応する

# 良かった点
- モブプロを教える経験ができた
    - これまではモブプロを実施しているだけでしたが、今後教えることを見通して事前に経験を積めたのは良かったです。
- モブプロの良さを知ってもらうことができた
    - 参加者からのフィードバックでは新人やチームの教育に良いと思ったのでこれからモブを導入していきたいという意見をもらうことができました。実際にいくつかのチームではモブプロが導入されました。

# 気づいた点
- 初学者にとって5分でタイピスト交代は早かった
    勉強会実施前の想像を超えて早かったです。今回は簡単な課題だったため何とか全員タイピストを経験して解き終わることができましたが、10分交代くらいの時間が丁度良さそうでした。

- 開発経験が浅い人はタイピストを優先的にやった方が良いと思いがち…？
勉強会中に参加者から質問がありました。「タイピストは経験の浅い人が優先的にやった方が良いですか？」
これは経験の浅い人はモブの役目である「タイピストに指示を出すこと」が難しいからだと思っての質問でした。
モブプロは開発経験がある/ないに関わらず、全員がタイピストとモブを繰り返しやっていきます。始めは指示を出すことが難しいかもしれませんが、「○○をしたいので○○のファイルを開いてください」「○○の原因を知りたいので○○してください」といった簡単な内容でも指示なので難しく考えずにトライしてみると良いと思います。困ったら経験のあるメンバーがサポートしてくれるはずです！


# おわりに
エンジニア初心者に転生してから初めて人に教えた経験でした。また、自分が普段取り組んでいるモブプロに対する理解度や教え方について意識するようになった良い機会になりました。また、プログラミングに関わらず新しいことを大人数に教える際にもモブプロの考えは利用できると感じました。
Box SDKでBox APIを使ってみる

# 概要
Boxに対して別のシステムからファイルのアップロード、削除やコラボレータの追加、削除などの操作をしたい場合に、BoxのAPIを利用しやすい形で提供しているBox SDKの使い方について記載したいと思います。

# Box SDKの準備
Box SDKは公式に各種言語向けに提供されています。今回はJavaSDKを使用しましたので、記事中のコードもJavaで記載しています。基本的には各操作に関して考え方は同じになると思います。
[SDKとツール \- Box開発者向けドキュメントポータル](https://ja.developer.box.com/sdks-and-tools/)

## インストール
SDKはMavenやGradleから入手することができます。[Box Java SDK](http://opensource.box.com/box-java-sdk/)
以下はMavenの例。
```XML
<dependency>
    <groupId>com.box</groupId>
    <artifactId>box-java-sdk</artifactId>
    <version>3.7.1</version>
</dependency>
```

# 認証用のアプリケーションの作成
Box SDKからBoxの操作をするためには認証用アプリケーションを使って認証が必要です。
今回はBox SDKをJava上で認証させるので、JWT認証がふさわしいと思います。認証用アプリ―ケーションの作り方は公式に記載があります。
[JWTを使用した設定 \- Box開発者向けドキュメントポータル](https://ja.developer.box.com/guides/authorization/custom-app-approval/)
公開/秘密キーペアを作成をするとjsonがダウンロードされるので保存しておきます。
作成後、管理者によるアプリの承認が必要なので注意してください。

# APIへの接続
SDKと認証用アプリのjsonをJavaのクラスパスに保存したら以下のコードで接続できます。
```BoxTest.java
Reader reader = new FileReader("jsonのパス");
BoxConfig config = BoxConfig.readFrom(reader);
BoxDeveloperEditionAPIConnection api = BoxDeveloperEditionAPIConnection.getAppEnterpriseConnection(config);
```

# ファイルアップロード
任意のフォルダにファイルをアップロードしてみます。
```BoxTest.java
BoxFolder folder = new BoxFolder(api, "フォルダID");
File file = new File("test.txt");
FileInputStream stream = new FileInputStream(file);
BoxFile.Info newFileInfo = folder.uploadFile(stream, "アップロードファイル名");
```
* フォルダIDはBoxをブラウザで開いて目的のフォルダを開いたときのURLで`https://app.box.com/folder/XXXXXXXXXXX`の`XXXXXXXXXXX`の部分です。
僕は知らなかった,キーボードでウィンドウ切り替えができることを.......

## はじめに
皆さんはこのような状況に遭遇したことはないでしょうか？

私は普段からwebブラウザ(Chrome)を使う際、用途ごとにウィンドウを分けて使っています
(ドキュメント・github・書籍を参照する用、技術記事やその他もろもろ調べる用、etc....)

このように複数のウィンドウを分けて使用していると、問題点が生じてきます

それは、**ウィンドウを切り替える際に毎回マウスを使わなきゃいけないということです**

### 動作の確認

![画面収録-2022-11-07-1.44.48.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2305872/3ccea25b-b0e0-c39f-29ae-670a6bdf8aa1.gif)

特に複数ウィンドウを使うと背面にあるウィンドウを見たい時に、マウスを使って移動しなければ見えない

**「いちいちマウス使うのめんどくさくない？」** ということでキーボード操作で完結させるにはどうすればよいでしょうか？

## こうすればマウスを使う必要がなくなる！

システム設定→キーボード→キーボードショートカット→次のウィンドウを対象にする のショートカットを設定

私の場合は、option + tab を設定しています

![スクリーンショット 2022-11-07 2.06.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2305872/b00d577f-cdbb-c7ae-7d87-a97f8915df9b.png)

### 動作の確認

![画面収録-2022-11-07-2.14.48.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2305872/50393ae9-fb6a-3cdb-7105-d54c1fa2fd05.gif)

**あら不思議！**

キーボードだけで切り替えをすることができました！！

ですが、こう思う方もいるのではないでしょうか？

> - 調べたり、スクロールしたり、urlコピーしたりするのに結局マウス必要じゃない？？
> - 意味なくないですか？？


キーボードのみでブラウザ操作もキーボードで完結させるにはどうすればよいでしょうか?


## ブラウザ操作をキーボードで完結させるには
Vimnumを用いると、ブラウザをキーボード操作で完結できます

https://chrome.google.com/webstore/detail/vimium/dbepggeogbaibhgnhhndojpepiihcmeb?hl=ja

### 動作の確認

![画面収録-2022-11-07-8.20.52.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2305872/d2a26348-c386-75d3-5f8e-8b6c97213c25.gif)

Vimnum快適すぎだろ！！！！！

## 最後に

Vimnumが便利だと思った方へ

Vimの世界へようこそ.....