OmniAICreator/Qiita-1.07M huggingface dataset:
【Unity初歩】~当たり判定~

# はじめに
前回オブジェクトを矢印キーを使って動かすところまでできました。
今回は敵オブジェクトを配置して、プレイヤーと衝突したときの当たり判定を追加していきます。

前回の記事

https://qiita.com/usomaru/items/4912175f84670f450297

# 敵のオブジェクトとスクリプトを追加

マ◯オでいうク◯ボーを追加します。
ここでは🦐を敵として追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/201826/4c742504-b47d-131c-719d-ef4fb939ea85.png)

敵のスクリプトも追加します。
名前は「EnemyController」です。

※以前作ったゲームは🦀が敵だったため、オブジェクト名がややこしいことになったので、オブジェクト名を「kani_enemy」から「Kani」に変更しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/201826/a156d674-af94-d78d-7c3f-e087d8e93ebc.png)


# 当たり判定のスクリプト
敵オブジェクトに以下のスクリプトをかいてみます。

```c#
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class EnemyController: MonoBehaviour
{
    GameObject player;

    void Start()
    {
        // アクティブなオブジェクトを探す
        this.player = GameObject.Find("Kani");
    }

    void Update()
    {
        // 左に0.1づつ進むことで🦀に近づいていく
        transform.Translate((float)-0.1, 0, 0);
      
        // 当たり判定
        Vector2 p1 = transform.position;  // 🦐中心座標
        Vector2 p2 = this.player.transform.position;  // 🦀中心座標
        float d = (p1 - p2).magnitude;
        float r1 = 0.5f;  // 🦐の半径
        float r2 = 1.0f;  // 🦀の半径

        if (d < r1 + r2)
        {
            Destroy(gameObject);
        }
    }
}

```

`magnitude`…ベクトルの長さを返す変数

下の図の矢印の距離がベクトル
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/201826/a2b2af30-7c4b-39e4-e514-77ab7aa0b802.png)


今回はひとまず、🦀が🦐に当たると🦐が消えます。
🦐の移動距離を1にしていたのですが、すごい速さで駆け抜けていったので0.1にしました。

スクリプトをアタッチしました。
動かしてみます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/201826/a8fc7076-73c2-2b7e-af42-686a779e3f77.png)


突進してきて消えました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/201826/041f86b5-40f2-7b3e-478b-ee103b5c0a96.png)

もうちょっと考えて移動距離とかを決めないとだめですね。

# さいごに
なんとか当たり判定をつけるところまでわりとスムーズにできました！
javascriptでかいたときと比較して、楽にゲームを作れている気がします。
[DAX Studio] DAX クエリの書き方④

# DAX Studio ドキュメントの日本語訳

Power BI／DAX開発者必携ツールの「DAX Studio」ドキュメントを日本語訳していきます。
「非公式」なので、言い回しに疑問があれば必ず公式ドキュメントを参照してください。

公式サイト
https://daxstudio.org/

公式ドキュメント
https://daxstudio.org/docs/intro/


## 複数の結果セット

DAXクエリーでは、指定したバッチ内で複数のレコードセットを返すこともできます。

つまり、以下のように実行できます。

```
EVALUATE
Customer
EVALUATE
'Product'
```

![evaluate-2-recordsets-2d36bd864113220bd2636a99f73be28a.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/a9be9ca8-9166-0632-e4ed-dcab4f6ecb29.png)

1つは**Customer**テーブルの内容、もう1つは**Product**テーブルの内容です。

しかし、1つのバッチ内で複数の`EVALUATE`ステートメントを持つことはできますが、`DEFINE`ステートメントは1つしか持つことができないことに注意してください。そのため、1つのブロックの中ですべての計算を宣言する必要があります。

```
DEFINE
    MEASURE Sales[Total Sales] =
        SUM ( Sales[Sales Amount] )
    MEASURE Sales[Total Cost] =
        SUMX ( Sales, Sales[Unit Price] * Sales[Order Quantity] )
EVALUATE
{ [Total Sales] }
EVALUATE
{ [Total Cost] }
```

![evaluate-2-recordsets-with-measures-1d0c4c52e0042829e6b6f95b9b6d16f9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/f9eae3f0-4f09-ab91-0c7c-d9bb4ccf3795.png)

## DAXクエリでパラメータを使用する

DAX Studioのユニークな機能の1つに、[パラメータ化されたクエリのサポートが](https://daxstudio.org/docs/features/parameter-support/)あります。

DAXクエリにパラメータを追加するには、次のようなフィルタを含むクエリから始めることができます：

```
EVALUATE
FILTER ( 'Product', 'Product'[Color] = "Red" )
```

そして、`"Red"`への参照を`@Color`というパラメータに置き換えます。

```
EVALUATE
FILTER ( 'Product', 'Product'[Color] = @Color )
```

パラメータを指定してクエリを実行すると、DAX Studioは使用するパラメータの入力を求めるプロンプトを表示します。

![evaluate-parameter-87695ba16a33454db1700d49ea2b72e3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/11e8c512-321d-a0fb-5606-e4863be15adb.png)
[DAX Studio] DAX クエリの書き方③

# DAX Studio ドキュメントの日本語訳

Power BI／DAX開発者必携ツールの「DAX Studio」ドキュメントを日本語訳していきます。
「非公式」なので、言い回しに疑問があれば必ず公式ドキュメントを参照してください。

公式サイト
https://daxstudio.org/

公式ドキュメント
https://daxstudio.org/docs/intro/


## 単一値の返り値

メジャーの結果を返したいだけの場合もあります。しかし、メジャーはテーブルではなく単一のスカラ値を返すので、以下のように記述しようとすると構文エラーが発生します。

```
EVALUATE
SUM ( Sales[Sales Amount] )
```

テーブル・コンストラクタの構文を使い、中括弧 `{ }` でメジャーを囲むことで、この問題を解決することができます。

```
EVALUATE
{ SUM ( Sales[Sales Amount] ) }
```

テーブル・コンストラクタ構文をサポートしていない古いバージョンの表形式エンジンでは、[ROW](https://dax.guide/row) 関数を使用することができます。

```
EVALUATE
ROW ( "Sales Amount", [Sales Amount] )
```

これを `DEFINE` 節と組み合わせてメジャー式を作成し、単一の値を返すこともできます。

```
DEFINE
    MEASURE Sales[Total Sales] =
        SUM ( Sales[Sales Amount] )
EVALUATE
{ [Total Sales] }
```

## 複数のテーブルからカラムを選択する

複数のテーブルから列を使用してクエリを生成する最も簡単な方法は、[SUMMARIZECOLUMNS](https://dax.guide/summarizecolumns) 関数を使用することです。この関数は、列のリストを取り、フィルタとして使用するテーブル式のリスト (オプション) を取り、メジャー/式のリスト (オプション) を取ります。

:::note
SUMMARIZECOLUMNS`関数では、常に何らかのメジャーまたは式を使用することを強く推奨します。
:::

```
EVALUATE
SUMMARIZECOLUMNS (
    Product[Color],
    Reseller[Business Type],
    FILTER ( ALL ( 'Product'[List Price] ), 'Product'[List Price] > 150.00 ),
    TREATAS ( { "Accessories", "Bikes" }, 'Product'[Category] ),
    "Total Sales", SUM ( Sales[Sales Amount] )
)
```
[DAX Studio] DAX クエリの書き方②

# DAX Studio ドキュメントの日本語訳

Power BI／DAX開発者必携ツールの「DAX Studio」ドキュメントを日本語訳していきます。
「非公式」なので、言い回しに疑問があれば必ず公式ドキュメントを参照してください。

公式サイト
https://daxstudio.org/

公式ドキュメント
https://daxstudio.org/docs/intro/

## 結果の並べ替え

先ほどの例を続けると、結果がランダムな順番で返ってくることがわかります。結果を並べ替えたい場合は、クエリの最後にオプションで `ORDER BY` 節を追加します。つまり、都市名で結果を並べ替えたい場合は次のようになります。

```
EVALUATE
CALCULATETABLE (
    VALUES ( Customer[City] ), 
    LEFT ( Customer[City], 1 ) = "R"
)
ORDER BY
Customer[City]
```

:::note
一部のクライアントツール（Power BI Desktopなど）は、データモデルに設定されたプロパティに基づいて`ORDER BY`句を生成します。
:::

## 計算の追加

メジャーや変数のようにクエリに計算を追加するには、クエリの最初にオプションの `DEFINE` キーワードを使用します。

既存の `Sales[Sales Amount]` 列の値を合計する新しいメジャーをクエリに定義するには、以下のように記述します。

```
DEFINE
    MEASURE Sales[My Sales Amount] =
        SUM ( Sales[Sales Amount] )
EVALUATE
ADDCOLUMNS ( VALUES ( 'Date'[Month] ), "My Sales Amount", [My Sales Amount] )
```

複数のメジャーを定義するには、`MEASURE <table>[<measure name>] = <expression>` の複数のブロックを追加します。

```
DEFINE
    MEASURE Sales[My Sales Amount] =
        SUM ( Sales[Sales Amount] )
    MEASURE Sales[My Double Sales Amount] =
        SUM ( Sales[Sales Amount] ) * 2
EVALUATE
ADDCOLUMNS (
    VALUES ( 'Date'[Month] ),
    "My Sales Amount", [My Sales Amount],
    "My Double Sales Amount", [My Double Sales Amount]
)
```

![evaluate-define-measures-9adf45b3ddd382db8272b26eaa4a3550.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/50e61365-275b-d98e-e831-b40f373bf42e.png)
【Visual Studio Code】基礎知識

## ショートカット
## 基礎系
| キー(Win/Mac) | 動作 |
|:-:|:-:|
| Ctrl/cmd + Z | 動作を元に戻す |
| Ctrl/cmd + Y | 動作をやり直す |
| Ctrl/cmd + S | 上書き保存 |
| Ctrl/cmd + Shift + S | 名前を付けて保存 |
| Ctrl/cmd + C | コピー |
| Ctrl/cmd + X | カット |
| Ctrl/cmd + V | ペースト |
| Ctrl/cmd + B | サイドバーの開閉 |
| Ctrl/cmd + J | ターミナルの開閉 |
| Ctrl/cmd + F | ファイル内検索 |
| Ctrl/cmd + G | 次の検索結果 |
| Ctrl/cmd + Shift + G | 前の検索結果 |
| Ctrl/cmd + N | 新しいファイルを開く |
| Ctrl/cmd + W | ファイルを閉じる |
| Ctrl/cmd + K + W | 全てのファイルを閉じる |
| Ctrl/cmd + shift + N | 新しいウィンドウを開く |
| Ctrl/cmd + shift + W | ウィンドウを閉じる |


## 移動系
| キー(Win/Mac) | 動作 |
|:-:|:-:|
| Ctrl/cmd + Home |ファイルの先頭に移動 |
| Ctrl/cmd + End | ファイルの末尾に移動 |
| Home ×1 | インデント含まない文字の先頭に移動 |
| Home ×2 | 行頭に移動 |
| End | 行末に移動 |
| Ctrl/cmd + Shift + [ | 一つ左のタブへ移動 |
| Ctrl/cmd + Shift + ] | 一つ右のタブへ移動 |


## 編集系
| キー(Win/Mac) | 動作 |
|:-:|:-:|
| Ctrl/cmd + / | コメントアウト |
| Ctrl/cmd + ] | インデントのレベルを下げる |
| Ctrl/cmd + [ | インデントのレベルを上げる |
| Alt/Option + 矢印 | 選択行の移動 |
| Ctrl/cmd + Shift + K | 選択行の削除 |
| Alt/Option + Shift + 矢印 | 選択行のコピー |
| Ctrl/cmd + Enter | カーソル行の下に空行を挿入 |
| Ctrl/cmd + Shift + Enter | カーソル行の上に空行を挿入 |
| Alt/Option + カーソル | マルチカーソル |
[DAX Studio] DAX クエリの書き方①

# DAX Studio ドキュメントの日本語訳

Power BI／DAX開発者必携ツールの「DAX Studio」ドキュメントを日本語訳していきます。
「非公式」なので、言い回しに疑問があれば必ず公式ドキュメントを参照してください。

公式サイト
https://daxstudio.org/

公式ドキュメント
https://daxstudio.org/docs/intro/

# DAXクエリの作成

DAXクエリは非常にシンプルな構造をしています。[Microsoftのドキュメント](https://docs.microsoft.com/en-us/dax/dax-queries)では、クエリの構文について説明しています。しかし、このガイドでは、非常に実践的な、例に基づいたアプローチを取ります。

これらのクエリーを自分で試してみたいなら、必要なのはこれだけです。

-   DAXスタジオ
-   Power BIデスクトップ
-   [Adventure Works 2020](https://aka.ms/dax-docs-sample-file)サンプルファイル

DAX StudioとPower BI Desktopの両方をインストールした後に始める最も簡単な方法は、**Adventure Works 2020.pbix**ファイルを開き、External Toolsをクリックして、そこからDAX Studioを起動することです。

## ベーシッククエリ

DAXクエリの最も単純な形式は、`EVALUATE <テーブル式>`である。

そこで、`EVALUATE Customerを`実行して、customerテーブルのすべての行を出力することができる。

![evaluate-customer-deabbc4433258f76548dc2405db162cd.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/05ea45f0-eb3a-b953-9f45-adda3a87c5c9.png)

しかし、テーブル名だけでなく、テーブルを返す関数なら何でも使えます。あるカラムのすべての値のリストを取得するには、[VALUES](https://dax.guide/values)関数を使用します。この関数は、指定されたカラムのすべての一意な値を持つ単一の行を持つテーブルを返します。

```
EVALUATE
VALUES ( Customer[City] )
```

![evaluate-customer-city-1484eb060755d9d8bb25076f699babed.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/659b7140-6da1-47e4-9614-dc5325422ce9.png)


また、テーブル内のすべての行を必要としない場合は、[CALCULATABLE](https://dax.guide/calculatetable) 関数を使用して、指定した条件を満たす行のみを返すこともできます。

```
EVALUATE
CALCULATETABLE ( Customer, Customer[City] = "Redmond" )
```

[VALUES](https://dax.guide/values)関数と[CALCULATETABLE](https://dax.guide/calculatetable)関数を組み合わせて、最初の文字が "R "であるすべての都市のリストを取得することもできます。

```
EVALUATE
CALCULATETABLE ( VALUES ( Customer[City] ), LEFT ( Customer[City], 1 ) = "R" )
```
Pythonで「Pythonにおける変数とは」の動作を確認してみた

# 概要

Pythonで「Pythonにおける変数とは」の動作を確認してみました。以下のページを参考にしました。

https://www.javadrive.jp/python/var/index7.html

# 実装

以下のファイルを作成しました。
```sample.py
tax = 1.08
print("オレンジの値段は" + str(120 * tax))
print("リンゴの値段は" + str(90 * tax))
print("バナナの値段は" + str(100 * tax))
tax = 1.1 # 税率が変更された場合に変更するのはこの1か所
print("オレンジの値段は" + str(120 * tax))
print("リンゴの値段は" + str(90 * tax))
print("バナナの値段は" + str(100 * tax))
sum = 80 + 72 + 84
print("テストの成績の合計は" + str(sum))
print("テストの成績の平均は" + str(sum/3))
```

以下のコマンドを実行しました。
```
$ python3 sample.py 
オレンジの値段は129.60000000000002
リンゴの値段は97.2
バナナの値段は108.0
オレンジの値段は132.0
リンゴの値段は99.00000000000001
バナナの値段は110.00000000000001
テストの成績の合計は236
テストの成績の平均は78.66666666666667
```

# まとめ

何かの役に立てばと。
GitHubにあげる際に.gitignoreを使用してAPIキーを非表示にしよう！

# .gitignoreとは
Gitにアップロードする際に、除外したいファイルを記載するファイルのこと。差分に出てきて欲しくないファイルを、.gitignoreに記述することで除外することができます！
# .gitignoreファイルの作り方
①ターミナルで、.gitignoreファイルを作成したいプロジェクトに移動。
```
cd プロジェクトのパス
```
②.gitignoreファイルを作成
```
touch .gitignore
```
③.gitignoreファイルを開く
```
open .gitignore
```
④.gitignoreに記載
このファイルにこのようにパスを記載すると、Gitのアップロード対象から除外できます。![a9abea3b110e1d93c4df46221f588858.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090887/cd559c2f-2c7a-b6b1-1337-241607b39f3f.png)

例：このような[APIKey]を記載したファイルを作成し、.gitignoreに記載して隠しました。
```
struct Constants {
    static let apiKey = [APIKey]
}
```
呼び出し元でもAPIKeyを隠すことができます！

```
let urlString = "https://api.openweathermap.org/data/2.5/weather?lat=\(latitude)&lon=\(longitude)&appid=\(Constants.apiKey)"
```

実際にGitHubに上げてクローンしてみると、Constants.swiftファイルが赤になっており、アップロード対象から除外できます。
![46482c7adab81ba9489cda85f5a816ef.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090887/fb64dbeb-cb4f-01bb-4b32-1587fd307d95.png)

# 検討
以前書いた下記の記事のように環境変数でAPIキーを非表示にする方法をあげました。

https://qiita.com/hinakko/items/d7faffe75121f1f36d11

環境変数を使用する問題点：GitHub上でPublicで公開した場合、クローンしても同じAPIKeyが使用できてしまう！Edit SchemeからAPIKeyが見えてしまうという問題があります。
そのため、PublicでGitHubに公開するには、今回紹介した.gitignoreを使用してAPIキーを非表示にする方法の方が有効です！
環境変数を使用するメリット：環境変数でAPIキーを非表示にする方法は、チームでGitHub上で開発する際や、開発用APIのURLと本番用APIのURLを分けて使用したい際に有効です！

# 参考文献

https://ios-docs.dev/xcode-gitignore/

https://qiita.com/takehilo/items/2d222748abd4db3da5e1
SpringMVCの大きな流れ

# SpringMVCの大きな流れ
- 最も一般的な例として、@Controller + Forward の場合の流れは以下の通りである。
 
![스크린샷 2023-11-25 15.21.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3567846/7637da54-83c8-cb9a-9c75-612fda3c357e.png)

1. Browerからurlリクエストを送る。
2. **DispatcherServlet**がRequestを受け、**HandlerMappingに転送**する。
3. **HandlerMapping**で**urlが一致するメソッドを見つけてDispatcherServletに返却**する。
    - MapでUrl(Key)とメソッド(Value)をmappingさせておいて保存している。
4. **DispatcherServlet**でどのような種類のHandlerAdapterが呼び出すことができるかを確認し、該当**HandlerAdapterにリクエストを伝達**する。
5. 該当**HandlerAdapter**でどのControllerが処理できるかを見て該当**Controllerにリクエストを伝達**する。
6. **Controller**はRequestに対して実際に処理するメソッドを呼び出し、**Clientに送るデータをModelオブジェクトに入れ、View名前(文字列)をDispatcherServletに返却**する。
    - ex. return “registerForm”;
7. **DispatcherServletでView名前(文字列)をViewResolverに伝達する。**
8. **ViewResolver**では、View名前(文字列)に接頭辞接尾辞を付け、実際にどのようなViewファイルなのかを教えてくれる。
    - ex. registerForm → /WEB-INF/views/registerForm.html
    - **servlet-context.xml**で設定の確認及び修正が可能である。
9. どのTemplateを使用するかによって、Viewを多様に渡す。
    - **ex。 タイムリーフの場合はThymeleafView、jspの場合はJstlViewに渡すが、その他にも様々なviewがある。**
10. 実際のファイルがModelを持って最終応答を作ってClientに応答する。

# すぐにControllerを呼び出さずに、途中で**ゆるい接続**をしておいた理由？

- 変更に有利だから。
- 直接接続だったら、コントロールラーではない他の種類のオブジェクトを呼び出したりすると、直接DispatcherServletの内容を修正しなければならなかった。 
- しかし、HandlerAdapterを通じてControllerを呼び出すことができるようにしておけば、他の種類のオブジェクト(ex.Servlet)を呼び出すことに変わっても、他のHandlerAdapterを使うことでDispacherServletを変更しなくても良い。
[DAX Studio] 各種データソースへの接続方法

# DAX Studio ドキュメントの日本語訳

Power BI／DAX開発者必携ツールの「DAX Studio」ドキュメントを日本語訳していきます。
「非公式」なので、言い回しに疑問があれば必ず公式ドキュメントを参照してください。

公式サイト
https://daxstudio.org/

公式ドキュメント
https://daxstudio.org/docs/intro/

# 接続方法

DAX Studioにはさまざまな接続オプションがあります。以下のガイドでは、接続可能なすべてのデータソースについて説明します。

- PowerPivot
- Power BI Desktop
- SSDT
- Analysis Services
- Azure Analysis Services
- Power BI XMLA endpoint

# Excel の PowerPivot への接続

これは、DAX Studio の起動方法に要件がある唯一のデータ ソースです。Excel で PowerPivot データ モデルに接続するには、DAX Studio Excel Addin をインストールし、Excel の Addin リボンから DAX Studio を起動する必要があります。

ExcelアドインからDAX Studioを起動し、アクティブなワークブックにPowerPivotモデルが含まれている場合、デフォルトで以下のオプションが有効になっており、選択されています。

![connect-powerpivot-60e1321511b6958b10333f61639f5510.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/6bbcacff-33a8-6a55-fa24-0f869a6c890f.png)

その他の方法でDAX Studioを起動すると、PowerPivotオプションは無効になります。

# Power BI Desktop への接続

Power BI Desktopへの接続にはいくつかの方法があります。

デフォルトの［All Users］オプションでDAX Studioをインストールした場合、インストーラーがDAX StudioをPower BI Desktopに外部ツールとして登録し、Power BI Desktopの［外部ツール］リボンにDAX Studioアイコンが表示されます。そこからDAX Studioを起動すると、Power BI Desktopのデータモデルへの接続がすでに確立された状態で開きます。

または、Power BI Desktop の実行中に DAX Studio を起動すると、PBI / SSDT オプションで開いている pbix ファイルのリストが表示され、そのファイルに接続できます。

:::note
オプション 2 を使用する場合、ライブ接続を使用してレポートに接続することはできません。オプション 1 を使用すると、外部ツール オプションはライブ接続を認識し、基礎となるライブ接続の接続詳細を送信します。
:::

![connect-powerbi-877562f4ad55efb1afa2abf52c9279d2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/e6bcf48e-6ff4-49d6-8c6c-43857b4095e7.png)

# SSDT（SQL Server Developer Tools）への接続

SSDT オプションは、内部ワークスペース オプションを使用している場合に機能します。このシナリオでは、SSDT は Power BI Desktop に似ており、バックグラウンドで表形式エンジンのプライベート バージョンを起動し、そこに接続することができます。SSDT と Power BI Desktop の唯一の主な違いは、プロジェクト名ではなくソリューション名しか「表示」できないことです。そのため、1 つのソリューションに複数の表形式モデルがある場合、ソリューション内の各プロジェクトに 1 つずつ、同じ名前の複数のエントリが表示されます。

# Analysis Servicesへの接続

Analysis Services インスタンスに接続するには、接続ダイアログのサーバーオプションにインスタンス名を入力するだけです。

![connect-server-de5fb2fe71004d0a9d23ae4a1291fdb3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/3c11f9b3-0aa6-a103-c021-4a80123badb5.png)

# Azure Analysis Services への接続

Azure Analysis Services に接続するには、接続ダイアログのサーバーオプションにインスタンス名を入力します。これは通常、asazure:// で始まる文字列です。

![connect-azureas-c926f90267615294f2ac371c09cf5800.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/0d92d8fa-aa73-4c40-0d8c-1a0816aeb409.png)

# Power BI Premium XMLA エンドポイントへの接続

Power BI Premium XMLA エンドポイントに接続するには、接続ダイアログのサーバー オプションにインスタンス名を入力します。これは通常、powerbi:// で始まる文字列で、通常、ワークスペース設定のプレミアム タブからこの文字列をコピーできます。または、指定したデータセットの設定からコピーすることもできます。

![connect-powerbi-xmla-9ff7f2f463d57931c0c108743c16e609.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80467/65b4072b-fb53-d620-d401-e9ad75f9ebed.png)
Android開発じゃなくても使いやすいKotlin

# Kotlinとは
kotlinとはAndroidアプリの開発を簡単に行うために作られたプログラム言語です。

kotlinという言語はJavaと似てオブジェクト指向言語のなっているため、Javaについて知識があれば比較的取り入れやすい言語となっています。



# kotlinのメリット・デメリット

### デメリット
* Javaに比べてシンプルな記述
Javaに比べてシンプルな記述をするため、コード量が少なくなり、可読性が向上します

</br>

* nullを許容しない
Javaだと想定外のnullが参照された場合に発生するエラーNull PointerExceptionが発生してしまうことがあるかと思います。
kotlinにはNull Safetyという仕様があるため、基本的にはNullが入らないようなコーディングを行わないとコンパイルされません。
</br>

* KotlinはJavaと相互利用ができる
簡単にいうとJavaで作成したプログラムに対してkotlinの機能を追加することができます。
そのため、JavaからKotlinを呼び出したりKotlinからJavaを呼び出したりすることもできます。


### デメリット
* kotlinの日本語ドキュメントが少ない
kotlinについて不明点があった際に日本語で記載されているドキュメントが多くないため、調査が大変になります。


# kotlinの使い方

### 変数の定義

変数を定義する際は`val`や`var`を使用します。
また、Javaと違って型を定義しなくても、コンパイラが型を推論してくれるため、型定義をしなくてもよいです。

``` kotlin:val
// valはJavaでいうfinalと同等
val index1 = "1"

// valで定義した変数に対して再代入するとエラーが発生
index1 = "9"

// 明示的に型を指定することも可能
index1: String = "9"

// 変数宣言と初期化を一緒にしない場合は、型定義をしておく必要がある
val num: Int
num = 1
```


``` kotlin:var
// varは値の再代入が可能
var index2 = "2"

// varで定義した変数に対して再代入してもエラーが発生しない
index2 = "9"
```

### kotlinの関数

戻り値の型定義がメソッド名の後になります。

``` kotlin
public fun methodName(): String {
    val text: String = "text"
    return text
}
```

### kotlinのswitch文
kotlinではwhen() を使用することでJavaでいうswitch文を記載できます。

``` kotlin
public fun methodName(num: Int = 3) {
    val text: String
    when (num) {
        1 -> text = "1"
        3 -> text = "3"
        else -> "9999"
    }
}
```

### Null許容
最初にkotlinはnullを許容しないと記述していたのですが、nullを設定したい場合は型の後ろに`?`をつけることでnull許容になります。

``` kotlin
val text: String? = null
```

### セーフコール演算子
変数の値がnullの場合に処理を行わないといったコードも書けます。
変数の後ろに`?`をつけることでnullの場合に処理をスキップすることができます。

``` kotlin
public fun methodName(): Boolean {
    val text: String? = null

    // textがnullの場合はreturn trueの処理が行われない
    text?.let{
        return true
    }
    return false
}
```
アラートを適切に作成する方法に関するチュートリアル

## アラートを適切に作成する方法に関するチュートリアル
アラートのコーディングは非常に簡単なコーディング方法です。 「alert("")」を使用するだけです。
### でもどうやって作るの？
#
#### これは非常に簡単な方法です
:::note alert
このようなコーディングはしないでください 
`alert()`
:::
:::note
代わりにこれをしてくだ
`alert("");
:::


Qiitaで作ったヘルプ。
もうすぐnoteのチュートリアルができるよ！
あるDIRしたの、複数の特定ファイルを編集して、別DIRに書き出す

ファイル名が特定条件に合致するものだけをファイル編集したかったので。

## 使い方
### 起動方法（引数）
```bash
$ fileeditm.sh fedit1.conf INDIR OUTDIR
```
- fileeditm.sh : 固定的な処理、さわらない。
- fedit1.conf : ファイル名のフィルタ、編集処理を書く。
- INDIR : 編集元ファイル（１階層したのみ処理）
- OUTDIE : 編集後ファイル

## ソース
### 編集モジュール

```bash:fedit1.conf
FNAMEFILTER="^.{5}[dh]"
do_edit() {
  local INF="$1"
  local OTF="$2"

  cat $INF | awk '
  {
    if( /^#/ ) next;
    if( /^\s*$/ ) next;
    print $0;
  } ' > $OTF
}
```
- 編集なしでコピーだけなら、``` cp $INF $OTF```
- 置換なら、``` cat $INF | sed s/FROM/TO/ > $OTF ```

### 処理本体
```bash:fileeditm.sh
#!/bin/bash
# -----------------------------------------------
# WARN undef vals & Definition
# -----------------------------------------------
set -u
YN=""
BASENAME=${0##*/}           # basename
DIRNAME=${0%/*}             # dirname
BASENAME2=${BASENAME%.*}    # 拡張子なし
ARGN=$#                     # 引数の個数
FNAMEFILTER=""              # ファイル名のフィルタ（正規表現）

# -----------------------------------------------
# Functions
# -----------------------------------------------
do_YN() {
  local PROMPT=${1:-""}         # "", in UNDEF or NULL
  YN=""
  while [ "$YN" != "Y" ] && [ "$YN" != "N" ]
  do
    echo -n "$PROMPT"
    read YN
    case $YN in
      [yY] )
        YN="Y"
        ;;
      [nN] )
        YN="N"
        ;;
      * ) ;;
    esac
  done
}

do_usage() {
  local EXITCODE=${1:-254}      # 254, if UNDEF or NULL

  echo "usage: $BASENAME"
  echo "$BASENAME CONF-FILE DIRIN DIROUT"
  echo "  CONF  : edit module"
  echo "  DIRIN : Input files"
  echo "  DIROUT: Output files"
  exit $EXITCODE
}
do_errmsg() {
  local ERRLOCATION="$1"        # cause ERROR, in UNDEF
  local ERRMSG="$2"
  echo "!!ERR:$BASENAME($ERRLOCATION)$ERRMSG"
}

# -----------------------------------------------
# Main
# -----------------------------------------------
#
# ARG-Check
#
  [ "$ARGN" != "3" ] && do_errmsg 10 "ARGN not 3" && do_usage
  CONF="$1"
  IND="$2"
  OTD="$3"
# Check CONF and import
  [ ! -f $CONF ] && do_errmsg 10 "CONF-FILE not file" && do_usage
  source $CONF
# Check if IND,OTD is DIRECTORY
  [ ! -d $IND ] && do_errmsg 11 "not DIR $IND" && exit 1
  [ ! -d $OTD ] && do_errmsg 11 "not DIR $OTD" && exit 1
#
# MAIN
#
  echo "Input  DIR : $1"
  echo "Output DIR : $2"
  echo "Fn FILTER  : $FNAMEFILTER"
  do_YN "=== Y/N : "

  LSTEMP=`mktemp $0.XXXXXX`
  ls "$IND" > $LSTEMP
  FNAME=""
  while read FNAME
  do
    if [[ $FNAME =~ $FNAMEFILTER ]] ; then      # ファイル名の正規表現マッチ
      if [ ! -f "$IND/$FNAME" ] ; then          # not FILE, DIR etc
        do_errmsg 101 "not FILE $IND/$FNAME"
      else
        if [ -f "$OTD/$FNAME" ] ; then
          echo "OVWRT $IND/$FNAME > $OTD/$FNAME"
        else
          echo "MATCH $IND/$FNAME > $OTD/$FNAME"
        fi
        do_edit "$IND/$FNAME" "$OTD/$FNAME"
      fi
    else
      echo "NOT   $IND/$FNAME"
    fi
  done < "$LSTEMP"
#
# TERM
#
  rm $LSTEMP
  exit 0
```
vscode を apt でアップデートする ubuntu22.04

# vscode を apt でアップデートする

microsoft の公開鍵をインポートする  
```
curl -fsSL https://packages.microsoft.com/keys/microsoft.asc | sudo gpg --dearmor -o /usr/share/keyrings/vscode.gpg
```

vscode のリポジトリを登録する  
その際に signed-by でリポジトリと公開鍵を紐付ける  
```
sudo echo deb [arch=amd64 signed-by=/usr/share/keyrings/vscode.gpg] https://packages.microsoft.com/repos/vscode stable main | sudo tee /etc/apt/sources.list.d/vscode.list
```

vscode を apt コマンドでインストール（or 更新）する  
```
sudo apt update
sudo apt upgrade
```

以上
ReactのSuspenceで表示処理を遅らせる

## はじめに
非同期処理や重たい処理の場合、特定の部分は送らせて表示する。こんな事がよくあります。例えば、写真の表示やAPI通信の結果に基づいて表示する場合、処理が重たい箇所は先に表示して、重たい処理は完了してから実装するって事を実施したいです。今回、Suspenceを利用するとできるので、紹介します。

## 成果物
最初から表示済みコンポーネント、2秒後に表示されるコンポーネントに分けて処理。

![スクリーンショット 2023-11-25 14.08.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599049/51a79a02-238f-d5eb-91e9-4ef875844f53.png)

2秒後
![スクリーンショット 2023-11-25 14.08.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599049/dccc9337-1469-edbc-5dc8-8591069ee7a2.png)

## ソースコード
```tsx:src/App.tsx
import React, { lazy, Suspense } from 'react';
const MyLazyComponent = lazy(() => import('./MyLazyComponent'));

function App() {
  return (
    <div>
      <Suspense fallback={<div>Loading...</div>}>
        <MyLazyComponent />
        <div>ロードに関わらず、表示します。</div>
      </Suspense>
    </div>
  );
}

export default App;

```


```tsx:src/MyLazyComponent.tsx(重たい処理のコンポーネント)
import React, { useState, useEffect } from 'react';

function MyLazyComponent() {
  const [showComponent, setShowComponent] = useState(false);

  useEffect(() => {
    // 2秒後にコンポーネントを表示する
    const timer = setTimeout(() => {
      setShowComponent(true);
    }, 2000);

    // コンポーネントがアンマウントされた場合、タイマーをクリアする
    return () => clearTimeout(timer);
  }, []);

  if (!showComponent) {
    return (
      <div>
        <p>Loading...</p>
      </div>
    );
  }

  return (
    <div>
      <h2>My Lazy Component</h2>
      <p>This is a lazy-loaded component.</p>
    </div>
  );
}

export default MyLazyComponent;
```
【JavaScript】「...array」ってなんだ？？

## はじめに

ES2015で追加された、配列の前に出てくる`...`について整理してまとめます。

**`...`は実は2種類あります**。これが混乱の元です。
- Spread構文：配列を展開する
- Rest parameters： 配列をまとめる

## Spread構文

Spread（広げる）という名の通り、**配列を展開します**。

たとえば、配列`array1 = [1, 2, 3]`を`1, 2, 3`に展開できます。

```javascript
const array1 = [1, 2, 3];

// そのまま
console.log(array1) // (3) [1, 2, 3]

// Spread構文で展開
console.log(...array1) // 1, 2, 3
```

### 例1

Spread構文で配列を渡せば展開してくれます。

```javascript
const add = (num1, num2, num3) => {
  console.log(num1 + num2 + num3);
};

// Spread構文なら配列ごと渡せる！
add(...array1);
```

要素を一つずつ渡す手間が省けます。

```javascript
// 一つずつ渡す
add(array1[0], array1[1], array1[2]);
```

### 例2

Spread構文で配列を渡して、配列同士を結合することもできます。

```javascript
const array2 = [1, 2, 3]
const array3 = [4, 5]

// array4, array5の要素をまとめて渡す
const array4 = [...array2, ...array3]; 

console.log(array4); // (5) [1, 2, 3, 4, 5]
```

### 例3

配列の途中に展開して結合することもできます。

```javascript 
const array5 = ["C", "D"];
const array6 = ["A", "B", ...array5, "E"];

console.log(array6); // (5) ['A', 'B', 'C', 'D', 'E']
```

###  補足

配列同士の結合は`concat`でもできます。

```javascript
const array2 = [1, 2, 3];
const array3 = [4, 5];
console.log(array2.concat(array3));
```

:::note warn
ただし、**`concat`はspread構文とは違って、配列の途中には展開できません**。
:::

## Rest parameters

Spread構文とは逆に、**配列の要素をまとめます**。

### 例

**仮引数として渡された値を配列にまとめる**時に使われます。

```javascript
function sum(...args) {
  // 配列にまとまっている！
  console.log(args); // (3) [1, 2, 3]
  
  let total = 0;
  for (const num of args) {
    total += num;
  }
  
  console.log(total); // 6
}

sum(1, 2, 3);
```

もしRest parametersがなかったら、引数の数だけ仮引数を設定することになってしまいます。

```javascript
function sum(num1, num2, num3) {
    // 処理
}
```

上の例では3つだけですが増えれば増えるほど手間ですし、引数の数が変わるたびに仮引数も変更しなくてはいけません。

### 例2

普通の引数とRest Parametersを組み合わせて使用できます。

```javascript
function sum(num1, num2, ...args) {
  console.log(num1); // 1
  console.log(num2); // 2
  console.log(args); // (3) [3, 4, 5]

  let total = 0;
  for (const num of args) {
    total += num;
  }

  console.log(total); // 12
}

sum(1, 2, 3, 4, 5);
```

:::note warn
**Rest** Parameters（**残余**引数）という名の通り、**必ず仮引数の最後に配置します**。
:::

#### 誤った例 ❌

```javascript
function sum(num1, ...args, num2) {
  // 処理
}
```

## 参考

- [JavaScript Primer](https://jsprimer.net/)
- [MDN 残余引数](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/rest_parameters)
Windowsのリモートディスクトップを使用してRocky Linux 9に接続する方法

Rocky Linux 9（または他のLinuxディストリビューション）にWindowsのリモートディスクトップを使用してリモート接続するには、いくつかのオプションがあります。Windowsのリモートディスクトッププロトコル（RDP）に対応したサービスやソフトウェアをLinux側に設定する必要があります。一般的な方法は以下の通りです：

1. **xrdpのインストール**:
   - `xrdp` はWindowsのリモートディスクトッププロトコル（RDP）をサポートするオープンソースのリモートデスクトップサーバーです。
   - Rocky Linux に `xrdp` をインストールするには、ターミナルを開き以下のコマンドを実行します：
     ```
     sudo dnf install xrdp
     ```
   - インストール後、`xrdp` サービスを開始し、自動起動を設定します：
     ```
     sudo systemctl start xrdp
     sudo systemctl enable xrdp
     ```
   - ファイアウォール設定を調整してRDPポート（通常は3389）を開放します：
     ```
     sudo firewall-cmd --add-port=3389/tcp --permanent
     sudo firewall-cmd --reload
     ```

2. **デスクトップ環境の確認**:
   - `xrdp` は様々なデスクトップ環境をサポートしていますが、特定の環境では追加の設定が必要な場合があります。例えば、GNOMEの場合は、`gnome-session` が必要になることがあります。

3. **接続のテスト**:
   - Windowsマシンからリモートデスクトップクライアントを起動し、Rocky LinuxサーバーのIPアドレスまたはホスト名を使用して接続を試みます。

4. **セキュリティの考慮**:
   - RDPはネットワーク経由でセキュアな接続を確立するためのプロトコルですが、公開ネットワーク上で使用する場合は、VPNやSSHトンネルなどの追加のセキュリティ措置を検討することが重要です。

これらのステップを実行することで、WindowsマシンからRocky Linuxサーバーへのリモートデスクトップ接続が可能になります。ただし、サーバーの設定やネットワーク環境によっては、追加の設定が必要な場合があります。
Next.jsで実現するオニオンアーキテクチャ (4) - Infrastructure

:::note warn
記事におけるNext.jsは、v13以降のApp Router （Server Components）を用いる前提での説明となります。
Pages Routerを用いている場合は、適宜Pages Routerでの書き方として読み替えてください。
:::

## この記事は何
最近Next.jsでウェブアプリケーションを作ることが多いのですが、
その時にオニオンアーキテクチャを採用してアプリケーションを作ることが多く、型も固まってきたので数回の記事にわたり紹介をしていきたいと思っています。

前回は

https://qiita.com/getty104/items/9ded98cd10d3956c4a9f

でApplication Serviceについて紹介しました。

今回は`infrastructures`ディレクトリや`utils`ディレクトリに実装していくInfrastructureについて説明をしていきます。

## Infrastructureとは
Infrastructureとは、アプリケーションを構築する上で必要になる外部システムへのアクセスを行う処理を実装するレイヤーです。
Infrastructuresには、以下のようなものを実装していきます。

- データベースアクセスを伴う処理
- ファイルシステムへのアクセス
- APIコール
- etc

基本的にディレクトリの分け方は自由ですが、僕は`infrastructures`には、いわゆる`Repository`や`Factory`など、主にDomain Objectの永続化に関わる処理を実装していき、それ以外の処理は`utils`に実装していることが多いです。

Infrastructureレイヤーで実装したコードは、依存性の注入　(DI) を用いてApplication Serviceに依存するように実装します。

結果Infrastructureレイヤーは最も外側のレイヤーになります。

依存については以前↓の記事で説明しています。

https://qiita.com/getty104/items/dc0ba5a3b10c4f5121e4

## 実装例
今回は、

- Userの永続化を行うUserRepository
- ユーザーへの通知を行う処理

の実装を行なっていきます。

Infrastructureは性質上、外部のライブラリに強く依存することが多いので、今回は擬似的なコードで紹介できればと思います。
DBへのアクセスは実際は[Prisma](https://www.prisma.io/)などのDBクライアントを使うことが多いと思います。

```ts:infrastructures/UserRepository.ts
import { IUserRepository } from '~/models/user/IUserRepository'
import { User } from '~/models/user/User'
import { dbClient } from 'dbClient' // 擬似ライブラリ

class UserRepository implements IUserRepository {
  async save(user: User) {
    if(await this.findByUuid(user.uuid)) {
      const result = await dbClient.user.update({        
        where: {
          uuid: user.uuid,
        },
        data: {
          // 更新処理を記述する
        },
      })

      return new User({
        uuid: result.uuid,
        ... // Userオブジェクトを返す処理を実装する
      })
    } else {
      const result = await dbClient.user.create({        
        data: {
          // 作成処理を記述する
        },
      })

      return new User({
        uuid: result.uuid,
        ... // Userオブジェクトを返す処理を実装する
      })
    }
  }

  async findByUuid(uuid: string) {
    const reuslt = dbClient.user.find({ where: { uuid: user.uuid } });
    if(!result) return null
    return new User({
      uuid: result.uuid,
      ... // Userオブジェクトを返す処理を実装する
    })
  }
}
```

```ts:utils/sendNotification.ts
import { notificationClient } from 'notificationClient' // 擬似ライブラリ

export const sendNotification = async (userUuid: string) => {
  await notificationClient.send(userUuid);
}
```

## 最後に
今回の記事では、Infrastructureの実装を行なってきました。
次回はPresentationレイヤーについて紹介していきます。

## 今までの記事

https://qiita.com/getty104/items/afd6a557f90b130269be

https://qiita.com/getty104/items/9b67900d30f9a02c7c7c

https://qiita.com/getty104/items/9ded98cd10d3956c4a9f
UWSCRとは

UWSCというWindowsデスクトップのオートメーションに特化したソフトをご存知でしょうか？日々の反復作業やウェブブラウザ操作の自動化、開発中のウィンドウアプリケーションの自動テスト、はたまた(あまり褒められたものではありませんが)オンラインゲームのマクロ用途でお世話になった方もいらっしゃるのではないかと思います。

しかし、数年前に作者のumiumi氏が消息不明となりUWSCの開発も停止してしましました。

後続を求める声があったこと、また僕自身UWSCのヘビーユーザーであったことからじゃあもう新しいの作っちゃおっか！ということで生まれたのが**UWSCR**です。

https://github.com/stuncloud/UWSCR

目標として

- UWSCのスクリプトがほぼそのまま動く
- 構文を拡張してコードをより書きやすくする
- IE依存の脱却
    - モダンブラウザ自動操作の実装
    - WebView2によるフォーム
- これがあったらよかったのに！という機能の追加

あたりをね、目指しつつがんばって開発を続けています。そして結構実現できています。

開発言語はRustです。当時僕がRustに興味津々だったためそうなりました。見切り発車もいいとこだったのですが[windows-rs](https://github.com/microsoft/windows-rs)のおかげでWin32 APIが簡単に扱えたことと、Rust自体が素晴らしい言語でやりたいことがわりとすんなり実現するのは良かったです。
しかしまぁ、UWSCって機能がめちゃくちゃ多くて、下手すると一つの組み込み関数が軽いアプリケーションいっこぶんくらいのボリュームあるんですよ。そこを見誤ってて当初は1年で完成させるとか言ってましたが3年経っても終わってません。やべぇ。
ちなみにUWSCはDelphiで出来てて、あれCOMとの親和性が高そうなのが羨ましいですね。COMはつらい。

UWSCRはこのアドベントカレンダー執筆時点でバージョン`0.14.0`です。もしかしたら期間中に`0.15.0`がリリースできるかもしれませんが、`0.14.0`の内容でやっていきます。
UWSCから拡張された構文や組み込み関数、そして新機能についての記事を公開していく予定です。
Microsoft Entra Join の手順 (Windows 11)

# はじめに
Microsoft Entra Join を行うための手順です。
この記事では、デバイスを テナントへ "Microsoft Entra Join" させる事を "参加" と呼んでいます。

以下の記事で、Microsoft Entra Join の呼び名、機能、ライセンス、前提条件などについてまとめてありますので、まずは こちらをご覧ください。

https://qiita.com/carol0226/items/8c2bbc0f480913eaeed4

:::note info
上記の記事を参考に、利用したい機能を選んで、必要なライセンスを手配します。
なお、Microsoft Entra Join の手順のみを試したい・・・という事であれば、ライセンスは不要なので、テナント と "参加" のための インターネットに接続された Windows 11 があれば OK です。
:::

# 1. "参加" のための手順
1. "参加" させたい Windows デバイス に サインインします。
　<br>
1. 「スタートボタン」－「設定」を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/173633a9-fcbb-e78a-13af-2bbdd8faa889.png)
　<br>
1. 左ペインで「アカウント」を選び、下スクロールして「職場または学校へのアクセス」を見つけて選びます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/b6509eeb-7176-8270-e860-37739dff2d92.png)
　<br>
1. 「接続」を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/19c63f51-700c-8243-02bf-161328c6bfec.png)
　<br>
1. 赤枠の「このデバイスを Microsoft Entra ID に参加させる」を押します。<br>※緑枠は誤り（Microsoft Entra Registard用）<br>※水色枠の選択肢は、オンプレミスの AD DS へのドメイン参加用です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/4ee6bb75-11f2-73ea-d0d6-e5556c8edbb0.png)

:::note warn
この場面で、「このデバイスを Microsoft Entra ID に参加させる」の選択肢が表示されていない事があります。
以下の記事に、原因や対策などが説明されていますので、確認ください。
:::

https://jpazureid.github.io/blog/azure-active-directory/aadj-link-is-not-displayed/

6．テナント内の 任意のユーザーアカウントを入力して、「次へ」を押します。 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/5752d065-80df-c88c-eb60-7a76c261db6a.png)

7．パスワードを入力して「サインイン」を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/06954e09-7581-cbac-ac70-2b745a0af873.png)

8．参加先のテナントが想定通りのものである事を確認して「参加する」を押します。
 ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/861cb586-95bb-6d71-b020-1739b4bedd33.png)

9．以下の画面が表示されれば "参加" が完了して "参加済み" の状態になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/886951b8-f124-c943-ca07-a7efccbf0fa3.png)

10．PC を再起動してください。

# 2. リモートデスクトップ の 許可設定
物理マシンの場合は、任意です。
仮想マシンの場合は、RDP を使って接続させるための構成が必要です。

https://qiita.com/carol0226/items/4f60443dead0a20e95f6

# 3. Microsoft Entra Join の Before / After
"参加" を行う前と "参加済み" になった際の比較画面などは、以下の記事に判りやすくまとめてあります。

https://qiita.com/carol0226/items/e0767bc61e8f27e9fe6a
go, gin, docker-composeで環境構築する方法

バックエンドにgoを使ってAPIを作る方法をまとめてみた。

●まずはディレクトリ構造
↓こんな感じ

```
myapp/
├── Dockerfile
├── docker-compose.yml
└── app/
    ├── main.go
    └── go.mod
```

<h2>Dockerfileの作成</h2>

```
FROM golang:1.18
WORKDIR /app
COPY app/go.* ./
RUN go mod download
COPY app/*.go ./
RUN go build -o /myapp
EXPOSE 8080
CMD ["/myapp"]
```

<h2>docker-compose.ymlの作成</h2>

```
version: '3.8'
services:
  web:
    build: .
    ports:
      - "8080:8080"
    volumes:
      - ./app:/app
```

<h2>Goアプリケーションの作成</h2>
myapp/app/main.goとmyapp/app/go.modを作成。
・go.modには以下の内容を記述

```
module myapp
go 1.18
require github.com/gin-gonic/gin v1.8.1
```
・main.goには以下の内容を記述
```
package main
import (
    "github.com/gin-gonic/gin"
)
func main() {
    r := gin.Default()
    r.GET("/", func(c *gin.Context) {
        c.JSON(200, gin.H{
            "message": "goの勉強開始!",
        })
    })
    r.Run()
}
```

<h2>コンテナをビルドして立ち上げる</h2>

```
docker-compose up --build
```
Spring Bootはとても便利

# Spring Bootとは

Spring BootとはJavaのフレームワークであり、主に`@`を使用したアノテーションと呼ばれるものを使用します。

アノテーションというのは注釈という意味であり、コード上に注釈として記述することでそのプログラムが何をするのかというのを伝えることが出来ます。
<span>@</span>Overrideは使われることが多いですよね。
基本的にクラスやメソッド、変数の前に定義されます。

Springの機能を用いることでアノテーションを使って様々なことができます。
細かくどういったことができるのかというのは後述します。

# Spring Bootを使用するメリット・デメリット

### メリット
* コードが読みやすくなる
* コード量の減少

### デメリット
* springの知識が無いと他人が読み取れない


基本的にはコード量が減少することで見やすくなるためメリットの方が大きいです。

# SpringBootで使用出来るアノテーション

##### <span>@</span>Controller
画面遷移を行う際にコントローラーとして認識させることができる
Controllerについて詳細に知りたい方は[こちら](https://qiita.com/TEBASAKI/items/267c261db17f178e33eb)を参考にしてください

使用例
```diff_java
 @Controller
 public class クラス名 {
   
 }
```

##### <span>@</span>Service
クラスに付与することでサービスクラスにすることができる


使用例
```diff_java
 @Service
 public class クラス名 {
   
 }
```

##### <span>@</span>Data
クラスに付与することでデータクラスにすることができる
setterやgetterなど使用する際に用いる

使用例
```diff_java
 @Data
 public class クラス名 {
   
 }
```

##### <span>@</span>GetMapping()
HTTPリクエストでGETメソッドを受け付ける際にメソッドの最初に付与する  

使用例
```diff_java
 @Controller 
 public class クラス名 {
     @GetMapping("パス名")
     public void メソッド名() {

     }
 }
```

##### <span>@</span>PostMapping()
HTTPリクエストでPOSTメソッドを受け付ける際にメソッドの最初に付与する

使用例
```diff_java
 @Controller 
 public class クラス名 {
     @PostMapping("パス名")
     public void メソッド名() {

     }
 }
```

##### <span>@</span>PutMapping()
HTTPリクエストでPUTメソッドを受け付ける際にメソッドの最初に付与する

使用例
```diff_java
 @Controller 
 public class クラス名 {
     @PutMapping("パス名")
     public void メソッド名() {

     }
 }
```

##### <span>@</span>DeleteMapping()
HTTPリクエストでDELETEメソッドを受け付ける際にメソッドの最初に付与する

使用例
```diff_java
 @Controller 
 public class クラス名 {
     @DeleteMapping("パス名")
     public void メソッド名() {

     }
 }
```

##### <span>@</span>RequstMapping()
<span>@</span>Controllerを付与したクラスに付けることで、リクエスト時に指定しているURLに属性（どういった処理を行うか）を指定できる。

使用例
```diff_java
 @Controller
 public class クラス名 {
     @RequstMapping(value = "パス名", Method = RequestMethod.POST)
     public void メソッド名() {

     }        
 }
```

##### <span>@</span>Transactional
Transactionalアノテーションを付与しているクラスやメソッド内でエラーが起きた場合にDBをロールバックすることができる。
Transactionalについて詳細に知りたい方は[こちら](https://qiita.com/kenduck/items/5e20d00f3610601b2f67)を参考にしてください

使用例
```diff_java
 @Service
 @Transactional
 public class クラス名 {
 }
```

##### <span>@</span>Autowired
Autowiredアノテーションを付与することでnew クラス名()を使用せずにインスタンス化できる。DI(依存性の注入)を行います。DIについては[こちら](https://qiita.com/rebi/items/31169e5bcd64b4411f19)の記事が分かりやすいです。


使用例
```diff_java:SampleBean.java
 public interface SampleBean {
     public String getParametor();
 }
```

```diff_java:SampleBeanImpl.java
 public class SampleBeanImpl implements SampleBean {
     public String getParametor() {
     }
 }
```

```diff_java:SampleController.java
 @Controller
 public class SampleController {
     @Autowired
     SampleBean sampleBean

     public void メソッド名() {
         sampleBean.getParametor()
     }
 }
```
Prismでモックサーバー


# はじめに

マイクロサービスのプロダクトや技術的領域でチームが分割されている場合、他チームの開発を待ったりするケースがあると思います。  
例えば、フロントエンドチームがバックエンドチームのAPIを待つケースなど。一時的に、DummyデータでComponentの実装を進め、後からAPIと繋ぎ込みをしたり。  
このような場合、APIのモックサーバーを立てておくと、より効率的に開発を進めることができると思います。

今回は、tsoaとPrismを使って、モックサーバーを立てる方法をご紹介します。

# 環境
- Node.js
- TypeScript
- tsoa
- Prism

# 全体の流れ（ざっくり）

1. コントローラーとモデルを定義
2. 1の定義を元に、swagger.jsonを生成
3. swagger.jsonを元に、Prismでモックサーバーを立てる

※ 1,2は、[tsoaとOpenAPIでスキーマ駆動開発](https://qiita.com/Jiei-S/items/1f76a248ac9b1dfe0e17) をご参照ください。本記事は、主に3を扱います。

# Prismでモックサーバーを立てる

今回は、Dockerを使用して、モックサーバーを立てます。  
Dockerイメージは、[stoplight/prism](https://hub.docker.com/r/stoplight/prism) を使用します。swagger.jsonは、[全体の流れ](#全体の流れ)の2で生成したものを使用します。

## セットアップ

```yaml
# docker-compose.yml
version: "3.8"
services:
  api-mock:
    image: stoplight/prism:5
    platform: linux/amd64
    volumes:
      - ./swagger.json:/usr/src/prism/packages/cli/swagger.json
    command: ["mock", "-h", "0.0.0.0", "-p", "4000", "swagger.json"]
    ports:
      - "4000:4000"
```

docker-compose.ymlの用意ができたら、コンテナを起動します。http://localhost:4000 で、モックサーバーが立ち上がればOKです。

```bash
api-mock-1  | [2:49:37 AM] › [CLI] …  awaiting  Starting Prism…
api-mock-1  | [2:49:44 AM] › [CLI] ℹ  info      POST       http://0.0.0.0:4000/users
api-mock-1  | [2:49:44 AM] › [CLI] ℹ  info      GET        http://0.0.0.0:4000/users
api-mock-1  | [2:49:44 AM] › [CLI] ▶  start     Prism is listening on http://0.0.0.0:4000
```
レスポンスが返ってくることも確認できます。

```bash
$ curl http://localhost:4000/users/1
{"id":"string","name":"string","status":"string"}
```

デフォルトのレスポンスは、`string` などの型が返ってきます。  
値を変更したい場合は、tsoa の `@Example` を使用します。

## レスポンスの値を変更する

Getメソッドのレスポンスを変更してみます。

```typescript
export const ExampleUserResponse: UserResponse = {
  id: "52907745-7672-470e-a803-a2f8feb52944",
  name: "Example User",
  status: "active"
};
```

```typescript
// controllers/users/user-controller.ts
@Example<UserResponse>(ExampleUserResponse) // 追加
@Get("{id}")
@SuccessResponse("200", "Return a user")
public async findUser(
  @Request() _: EXRequest,
  @Path() id: string
): Promise<UserResponse> {
  .
  .
  .
}
```

修正後、swagger.jsonを再生成します。  
レスポンスが変更されたことを確認します。

```bash
$ curl http://localhost:4000/users/1
{"id":"52907745-7672-470e-a803-a2f8feb52944","name":"Example User","status":"active"}
```

以上です。

# 参考
- [tsoa](https://tsoa-community.github.io/docs/)
- [Prism](https://stoplight.io/open-source/prism)
Reactでstyled-componentsを利用する。

## 成果物
![スクリーンショット 2023-11-25 13.34.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599049/053e806a-570e-c6f4-7499-7c53d48a1f7f.png)


### ソースコード

```tsx:App.tsx
import styled from 'styled-components';

// Headerのスタイルを定義
const Header = styled.div`
  background-color: #2196F3;
  padding: 16px;
  color: white;
`;

const Main = styled.main`
  padding: 16px;
  display: flex;
  flex-direction: column;
`;

// Footerのスタイルを定義
const Footer = styled.div`
  background-color: #2196F3;
  padding: 16px;
  color: white;
  position: fixed;
  bottom: 0;
  width: 100%;
`;


// 例: Articleコンポーネント
const Article = styled.div`
  background-color: #FFFFFF;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
`;

function App() {
  return (
    <div>
      <Header>
        <h1>Header</h1>
      </Header>
      <Main>
        {/* 他のコンポーネントをここに配置 */}
        <Article>
          <h2>Article 1</h2>
          <p>This is the content of article 1.</p>
        </Article>
        <Article>
          <h2>Article 2</h2>
          <p>This is the content of article 2.</p>
        </Article>
        {/* 他のコンポーネントも同様に追加できます */}
      </Main>
      <Footer>
        <p>&copy; 2023 My App</p>
      </Footer>
    </div>
  );
}

export default App;

```
Microsoft Entra Join の 手順 (Windows 10)

# はじめに
Microsoft Entra Join を行うための手順です。
この記事では、デバイスを テナントへ "Microsoft Entra Join" させる事を "参加" と呼んでいます。

以下の記事で、Microsoft Entra Join の呼び名、機能、ライセンス、前提条件などについてまとめてありますので、まずは こちらをご覧ください。

https://qiita.com/carol0226/items/8c2bbc0f480913eaeed4

:::note info
上記の記事を参考に、利用したい機能を選んで、必要なライセンスを手配します。
なお、Microsoft Entra Join の手順のみを試したい・・・という事であれば、ライセンスは不要なので、テナント と "参加" のための インターネットに接続された Windows 10 があれば OK です。
:::

# 1. "参加" のための手順
1. "参加" させたい Windows デバイス に サインインします。
　<br>
1. 「スタートボタン」－「設定」を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/de72edd1-2a6a-9e10-a906-ff6a65e0a8d2.png)
　<br>
1. 「設定アプリ」で「アカウント」を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/c89bf3fe-0656-ee05-1705-99fd37f40402.png)
　<br>
1. 「職場または学校にアクセスする」を選択して「＋接続」を押します。
 ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/2e9475f8-51ba-46a8-70cb-eef905a5fa48.png)
　<br>
1. 赤枠の「このデバイスを Microsoft Entra ID に参加させる」を押します。<br>※緑枠は誤り（Microsoft Entra Registard用）<br>※水色枠の選択肢は、オンプレミスの AD DS へのドメイン参加用です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/4ee6bb75-11f2-73ea-d0d6-e5556c8edbb0.png)

:::note warn
この場面で、「このデバイスを Microsoft Entra ID に参加させる」の選択肢が表示されていない事があります。
以下の記事に、原因や対策などが説明されていますので、確認ください。
:::

https://jpazureid.github.io/blog/azure-active-directory/aadj-link-is-not-displayed/

6．テナント内の 任意のユーザーアカウントを入力して、「次へ」を押します。 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/5752d065-80df-c88c-eb60-7a76c261db6a.png)

7．パスワードを入力して「サインイン」を押します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/06954e09-7581-cbac-ac70-2b745a0af873.png)

8．参加先のテナントが想定通りのものである事を確認して「参加する」を押します。
 ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/861cb586-95bb-6d71-b020-1739b4bedd33.png)

9．以下の画面が表示されれば "参加" が完了して "参加済み" の状態になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1619637/886951b8-f124-c943-ca07-a7efccbf0fa3.png)

10．PC を再起動してください。

# 2. リモートデスクトップ の 許可設定
物理マシンの場合は、任意です。
仮想マシンの場合は、RDP を使って接続させるための構成が必要です。

https://qiita.com/carol0226/items/e419554ef53b2bcbf581

# 3. Microsoft Entra Join の Before / After
"参加" を行う前と "参加済み" になった際の比較画面などは、以下の記事に判りやすくまとめてあります。

https://qiita.com/carol0226/items/e0767bc61e8f27e9fe6a
文は短く書く

文はわかりやすく加工

[文章の出典](https://www.nta.go.jp/taxes/tetsuzuki/shinsei/annai/gensen/pdf/2023bun_06_input.pdf)
———————————————————————— ◆給与所得者の基礎控除申告書◆ —————————————————————————————————————————
１－１ 申告についてのご注意

## 元の文章
>⑴ この申告書は、年末調整において基礎控除の適用を受けようとする場合に、令和５年の最後に給与の支払を受ける日の前日までに、給与の支払者（２以上の給与の支払者から給与の支払を受ける場合には、主たる給与の支払者（「扶養控除等申告書」を提出した給与の支払者））に提出してください。

---------------
## 改変案
>(1)令和５年の最後に給与の支払を受ける日の前日までに、給与の支払者に提出してください。
提出先の給与の支払者は、２以上の給与の支払者から給与の支払を受ける場合には、主たる給与の支払者（「扶養控除等申告書」を提出した給与の支払者）です。

## 改変の案の理由
- 同じ内容が伝わるならば、文章は短いほうが良い。
- 自明なことは書かない。
    - 基礎控除申請用の書類なのだから、「年末調整において基礎控除の適用を受けようとする場合に、」は何も追加の情報を与えていない。
- 補足用の説明は、文の中に埋め込まない。
- 場合分け(if文やcase文に相当)ある記述は、どこまでが該当する記述なのか、どこまでが自分にとって無視していい記述なのかがわかるように書く。
- 

## もっと改変できる。
改変前
-２以上の給与の支払者から給与の支払を受ける場合には、
改変前
-２以上の支払者から給与の支払を受ける場合には、

## もっと気づいたことなど
否定文より肯定文で書こう。
否定文は理解が難しくなる。
それが何を述べる文なのかが、早めにわかるようにしよう。
この文を読む人の目的は、自分がこの書類を提出する資格があるのかどうか確信を持てることである。

元の文面
>⑵ あなたの本年中の合計所得金額の見積額が1,000万円を超える場合又はあなたの配偶者の本年中の合計所得金額の見積額が133万円（給与所得だけの場合は、給与の収入金額が2,015,999円）を超える場合には、配偶者控除又は配偶者特別控除の適用を受けることができません。

改変案
> 以下の方が配偶者控除又は配偶者特別控除の適用の対象になります。
あなたの本年中の合計所得金額の見積額が1,000万円を未満でかつ、
あなたの配偶者の本年中の合計所得金額の見積額が133万円（給与所得だけの場合は、給与の収入金額が2,015,999円）未満の場合です。
【React Native】Jotaiによってグローバルステートを永続化する


## 事象

ニュースアプリ開発において、ユーザーがクリップした記事をアプリを閉じたあとも保持する必要がありました。この記事では、Jotaiを使用してグローバルステートを永続化する方法を共有させていただきます。

## 対処法

以下のコードは、`Jotai` の `atomWithStorage` を使用して、クリップした記事の状態を永続化します。`createJSONStorage` は、`AsyncStorage` と連携してデータをJSON形式で保存・取得します。`Jotai` のGitHubディスカッションによると `createJSONStorage` は型安全ではないため、回避策として、いったん `any` を指定しております。以下によって生成する `clipAtom` を必要な箇所にて `useAtom` によって呼び出します。

```clip.ts
import AsyncStorage from '@react-native-async-storage/async-storage';
import { atomWithStorage, createJSONStorage } from 'jotai/utils';

import { Clip } from '../types/clip';

const storage = createJSONStorage<any>(() => AsyncStorage);

export const clipAtom = atomWithStorage<Clip>('clip', [], storage);
```

`npx expo start`によって`Expo`プロジェクトを起動し、XcodeによってiOSを動作確認する際に`command + R`によって再起動できます。再起動によってアプリの状態がリセットされ、永続化されたデータが正しく読み込まれているかを確認することができます。それによってアプリを閉じたあともクリップした記事が保持されてるかどうか確認できます。

## 参照

https://jotai.org/docs/utilities/storage#atomwithstorage

https://github.com/pmndrs/jotai/discussions/1324

自らの備忘録のために投稿してますが、なにかお役に立てましたら幸いです！:clap:
また、なにか間違ってましたらご指摘いただけますと幸いです！:pray:
エラトステネスの篩で素数を出力するRubyスクリプト

エラトステネスの篩で素数を出力するRubyスクリプトです。

`chmod +x sieve.ruby`して、
`./sieve.ruby 1000` として実行して下さい。

```sieve.ruby
#!/usr/bin/ruby

def sieve(n)
  tab=(2..n).to_a
  l=[]
  while l.push(tab.shift).last do
    tab.reject!{ |x| x%l.last==0 }
  end
  l[0..-2]
end

primes=sieve(ARGV[0].to_i)
p primes, primes.length
```

実行結果

```
$ ./sieve.ruby 1000
[2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31, 37, 41, 43, 47, 53, 59, 61, 67, 71, 73, 79, 83, 89, 97, 101, 103, 107, 109, 113, 127, 131, 137, 139, 149, 151, 157, 163, 167, 173, 179, 181, 191, 193, 197, 199, 211, 223, 227, 229, 233, 239, 241, 251, 257, 263, 269, 271, 277, 281, 283, 293, 307, 311, 313, 317, 331, 337, 347, 349, 353, 359, 367, 373, 379, 383, 389, 397, 401, 409, 419, 421, 431, 433, 439, 443, 449, 457, 461, 463, 467, 479, 487, 491, 499, 503, 509, 521, 523, 541, 547, 557, 563, 569, 571, 577, 587, 593, 599, 601, 607, 613, 617, 619, 631, 641, 643, 647, 653, 659, 661, 673, 677, 683, 691, 701, 709, 719, 727, 733, 739, 743, 751, 757, 761, 769, 773, 787, 797, 809, 811, 821, 823, 827, 829, 839, 853, 857, 859, 863, 877, 881, 883, 887, 907, 911, 919, 929, 937, 941, 947, 953, 967, 971, 977, 983, 991, 997]
168
```
【SwiftUI】特定の角だけ丸角にする（iOS16）

# はじめに
iOS15以下を対応する場合は以下の記事の方法が良さそうです。

https://qiita.com/chocoyama/items/1cb7040f0e717406a6f4

# 完成サンプル
![Simulator Screenshot - iPhone 15 - 2023-11-25 at 12.58.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745371/f81c4469-ce53-c5d6-e530-d6343add1c45.png)

# 実装
```diff_swift
import SwiftUI

struct ContentView: View {
    var body: some View {
        Image(.sample)
            .resizable()
            .scaledToFit()
+           .clipShape(.rect(
+               topLeadingRadius: 0,
+               bottomLeadingRadius: 50,
+               bottomTrailingRadius: 0,
+               topTrailingRadius: 50
+           ))
            .padding(20)
    }
}
```

# おわり
iOS16からめっちゃ簡単に書けるようになりましたね

# 公式ドキュメント
https://developer.apple.com/documentation/swiftui/view/clipshape(_:style:)