OmniAICreator/Qiita-1.07M huggingface dataset:
p5.jsでアート作成するための準備

# はじめに
p5.jsを使ってwebページでアニメーションを表示するために、準備することから実際に表示するところまでを解説しています。

# 用意するもの
・htmlファイル
・javascriptファイル
・webブラウザ

# プログラム
### ファイル準備
まずプログラムファイルの準備をしていきましょう。
p5という名前のフォルダを作成して、その中にファイルを作成します。
```
p5
├test.html
└test.js
```
この記事を参考に試してみたい人は同じように名前をつけてください。

### htmlファイル
htmlファイルに以下のコードを書いて、p5.jsとjQueryのスクリプトを読み込みます。
ひとまず試したい人は以下のコードをコピペするだけで大丈夫です。
```html: test.html
">">https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js">">https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js">">">https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js">
">">https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">">https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">">">https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
<script src="test.js"></script>
```
最後の行でjavascriptのファイルを読み込んでいます。
```
<script src="test.js"></script>
```
上記のsrc=　の後に、読み込むjavascriptのファイル名を書き込みます。
上の例では、同じ階層にあるtest.jsを読み込んでいます。

### javascriptファイル
javascriptファイルに書くコードで色々な表現ができます。
ひとまず試したい人は以下のコードをコピペするだけで大丈夫です。
以下のコードはchatGPTで生成しました。
```test.js
let waves = []; // 波紋の配列

function setup() {
  createCanvas(1920, 1080); // キャンバスサイズを設定
  background(0); // キャンバスの背景色を黒に設定
}

function draw() {
  if (random(1) < 0.05) { // any%の確率で新しい波紋を生成
    waves.push(new Wave(random(width), random(height))); // 波紋を生成し、配列に追加
  }
  background(0); // キャンバスの背景を再描画

  // すべての波紋を更新して描画
  for (let i = waves.length - 1; i >= 0; i--) {
    waves[i].update();
    waves[i].draw();
    if (waves[i].isDone()) { // 波紋が消えたら配列から削除
      waves.splice(i, 1);
    }
  }
}

class Wave {
  constructor(x, y) {
    this.pos = createVector(x, y); // 波紋の中心座標
    this.radius = 0; // 波紋の初期半径
    this.speed = random(0.01, 0.75); // 波紋の広がる速度
    this.alpha = 255; // 波紋の透明度
    this.a =random(0, 0)//R
    this.b =random(0, 255)//G
    this.c =random(255, 255)//B
    this.d=random(0.25, 0.75)//波紋の透明度下がる速度
  }

  update() {
    this.radius += this.speed; // 波紋の半径を更新
    this.alpha -= this.d; // 波紋の透明度を減らす
  }

  draw() {
    noFill();
    stroke(this.a, this.b, this.c, this.alpha); // 波紋の色と透明度を設定
    strokeWeight(0.5); // 線の太さを設定
    ellipse(this.pos.x, this.pos.y, this.radius * 2); // 波紋を描画
  }

  isDone() {
    return this.alpha <= 0; // 波紋の透明度が0以下になったらtrueを返す
  }
}
```
これでランダムに波紋が広がるアニメーションが表示できます。

ここまでがプログラムの準備になります。

# 実行
実行はwebブラウザを使用します。
htmlファイルをダブルクリックするか、ブラウザにhtmlファイルをドラック＆ドロップすることで表示されます。

以下のようなものが表示されればOKです。（ランダムのため完全一致しません）
<iframe width="560" height="500" src="https://www.youtube.com/embed/H9VjSJLlDAg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

# おわりに
jsを書き換えるといろいろな表示が可能です。これから記事でchatGPTを使って作成した作品を紹介していくので見てみてください！

以下作品例です！

https://qiita.com/keigo1110/items/3a16cd76845ea37e1f80

https://qiita.com/keigo1110/items/cbe1f9c9f390e45511fe
PhotonFusionを使ったPlayfabのMultiPlayerサーバーの内部構造 Linuxの場合

ローカルでDockerでイメージを作成
docker push

そのあと、buildから対象のイメージを選択
OSは、Linux

でデプロイ

デプロイしたあとは、

All buildsの一覧からクリック
詳細にいき、タブから、Serversを押して、connectを押すとSSHの情報がでてくる

これでSSHで内部に入れる。

てっきりこの段階ですでにactiveな状態かと思ったらそうではなく
内部では、Linux 740ece41272643c99b3be56f4f8fde6d000000 5.4.0-1106-azure みたいのが
立ち上がっていて、

その中にdockerが動いている

sudo suでrootになり、

docker ps  でプロセスを確認すると、

docker でつくったイメージのOSをもとにしたコンテナがたちあがっている。

docker container exec -it コンテナ名 bash

で、中にはいり、ps axでプロセスを確認、dockerfileで指定したシェルが実行されている。

playfabの管理画面にある、Request Serverって何をしてるんだ？？の疑問に到達

これはおそらくネットワークのポートの接続、解放だけをやっているのかなと。
たしかにそのほうがもろもろのレスポンスを考えると最小限な気もするし。

すこしづつ、頭の中がクリアになっていく。

PhotonFusionとPlayfabを同時に覚えていくのは、なかなか脳に新しい刺激だなw
Unityでクイズに正解したときに画像を表示した

# 使用環境
Unity 2020.3.17f1
Windows 10

# 目標
InputFieldに入力した文字列が指定した文字列と一致したときに特定の画像を表示する。
そして数秒後にシーンをアンロードする。

# 困った点
1. 画像が表示できない
1. 画像を表示しようとするとInputFieldの画像の操作がなされてしまう
2. 正解した瞬間に画面が切り替えるのを防ぐため、コルーチンで数秒待機させようとするも0秒で終了してしまう
3. 他のオブジェクトのスクリプトの関数を呼び出せない

# 1の解決法
SpriteRenderer型を使用して、`enabled`で表示非表示を切り替えた。

# 2の解決法
初めは画像をInputFieldにアタッチしていたのを、1つのオブジェクトとしてヒエラルキーのルートに設置した。その流れで画像表示に関するコードを新しいファイルに書き直した。

# 3の解決法
`Invoke`関数を使用した。

# 4の解決法
オブジェクトをアタッチして、`GetComponent`関数でスクリプトのデータを取得した。

# コード例
以下はこの記事に関係のある部分だけ抜粋したものである。
コメントの(n)が関連した問題を示している。
``` C#:正誤判定
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.SceneManagement;

public class Judge : MonoBehaviour
{
    private InputField _inputField;

    // 答え
    string answerStr = "トマト";

    // 画像表示関数呼び出し用 (4)
    CurrectSprite _current;
    public GameObject _obj;

    // 画像を表示してからシーンが遷移するまでの待機時間 (3)
    float waitTime = 1.5f;

    private void Start()
    {
        _inputField = GetComponent<InputField>();
        _inputField.Select();

        // (4)
        _current = _obj.GetComponent<CurrectSprite>();
    }

    /// <summary>
    /// テキスト取得
    /// </summary>
    public void GetText()
    {
        // 正解していたら
        if (isCorrect())
        {
            // 正解画像を表示 (1)
            _current.PrintCorrectImage();

            // このシーンを閉じる (3)
            Invoke("UnloadThisScene", waitTime);
        }
    }

    /// <summary>
    /// 正誤判定
    /// </summary>
    bool isCorrect()
    {
        if (answerStr == _inputField.text || answerStringKana == _inputField.text)
            return true;
        else
            return false;
    }

    // (3)
    void UnloadThisScene()
    {
        SceneManager.UnloadSceneAsync(1);
    }
}
```
```C#:画像表示
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class CurrectSprite : MonoBehaviour
{
    SpriteRenderer _renderer;

    private void Start()
    {
        if (!TryGetComponent(out _renderer)) return;
        _renderer.enabled = false;
    }

    public void PrintCorrectImage()
    {
        _renderer.enabled = true;
    }
}
```
# 感想
これらの問題を解決するためにAI(phindや Chat GPT)を使用したらスムーズに解決することができた。AIをうまく使いこなせるようになると成長も早いだろうなと改めて思った。
flutterのAndroidリリースビルドで"font-subset” can’t be opened because Apple cannot check it for malicious softwareが出た場合の対処メモ

これでビルドできました。
```
flutter build appbundle --no-tree-shake-icons
```

まあエラーメッセージにも


:::note alert
Target aot_android_asset_bundle failed: IconTreeShakerException: Font subsetting failed with exit code -9.

To disable icon tree shaking, pass --no-tree-shake-icons to the requested flutter build command
:::

て出てるのでちゃんと読めば大丈夫系の話ではありますが、取り急ぎの対処メモです！
AWS cloud9とVS CodeをSSHするのに参考にした記事メモ

ほぼこれを参考に行けた。

https://qiita.com/hayate_h/items/93273285cdc7372ae569#%E3%81%AF%E3%81%98%E3%82%81%E3%81%ABvs-code-%E3%81%A8-cloud9-%E3%81%AE%E4%BD%B5%E7%94%A8%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6


ユーザー名だけ、「ec2-user」ではなく「ubuntu」だった。
下記が参考。

https://qiita.com/R4iw3r103/items/1be02beb63bea34af362



SSH接続時にcloud9を動かしているEC2インスタンスが停止しないように下記を参考に修正。
コードを取ってきた後に「ec2-user > ubuntu」に変換している

https://dev.classmethod.jp/articles/how-to-use-aws-cloud-9-with-vscode-remote-ssh/
Pythonで各桁の和を求める

# 結論
※shiracamus様からのご指摘より、こちらのコードが簡潔でした。ありがとうございます。

```python:sumOfDigits.py
ans = sum(map(int, str(n))
```

自分が考えたコード
```python:sumOfDigits1.py
ans = sum(list(map(int, list(str(n)))))
```

# 説明
### list関数

Pythonのリスト関数は、他のデータ型をリストに変換する。特に文字列を渡したとき、文字列を分割して1文字ごとの文字列リストに変換する。

注意：リスト関数の引数は、イテラブルオブジェクトをとる。例えば range, リスト, タプル, 集合, 辞書, 文字列である。

```python:list.py
list('444')
list('exe')

#実行結果
['4', '4', '4']
['e', 'x', 'e']
```

これは、各桁を分離するのに使用する。

### map関数
[公式ドキュメント](https://docs.python.org/ja/3/library/functions.html#map)より
map(function, iterable)
function を iterable の全ての要素に適用して結果を生成 (yield) するイテレータを返します。

要はiterableなobjectに対し、functionで操作したものを返すということ。

注意：map関数の返り値は、map関数で操作されたものではなく、mapオブジェクトである。ここでは、list化しておく。

```python:map.py
a = [0,1,2]
list(map(str, a))

#実行結果
['0', '1', '2']
```

これにより、先の操作で分離した各桁をint型に変換できる。

## まとめ
```python:sumOfDigits1.py
n = str(n)
a = list(map(int,list(n)))
ans = sum(a)
```
- str関数でnを文字列化
- list関数で各桁が文字列で分離したリストを、整数型に変換
- sum関数でリストの合計値を計算
Djangoスタートアップ(サーバーエラー(500)編)

# Sever error 500の対処方法

## エラー内容
`models.py`や`templateファイル`を編集して本番環境にデプロイしたら`Server error 500`が表示されてしまう。

## 仕様技術
- サーバー
    - AWS
        - EC2(ubuntu)
            - Postgresql
            - gunicorn
            - nginx
        - ROUTE53

## 試したこと
管理者サイトにはアクセスできるが、管理者サイトのデータベースに関するページにアクセスするとServer error 500が表示される

1. nginx, gunicorn, postgresqlの再起動
→治らず

2. Djangoプロジェクトディレクトリ/アプリケーションディレクトリ/migrations/__init__.py以外の削除
→`python manage.py makemigrations & python manage.py migrate`で`Postgresql`のテーブルと整合性が取れない旨のエラー

3. Postgresqlのテーブルごと削除＆`python manage.py makemigrations & python manage.py migrate`を実行
→DBが新たに作成されてSever error 500が消えた

## 今後の対策
開発環境の`migrations`ディレクトリと本番環境の`migrations`ディレクトリは非同期にして、`models.py`のみ同期させる。migrationは各サーバーで行う。
Powershellでのvenvの操作方法

PowerShellでのvenvの操作方法は以下の通りです。

1. 仮想環境を作成する

```powershell
python -m venv <venvの名前>
```

例えば、仮想環境を `myenv` という名前で作成する場合は以下のようになります。

```powershell
python -m venv myenv
```

2. 仮想環境を有効化する

```powershell
<venvの名前>\Scripts\Activate.ps1
```

例えば、 `myenv` という名前の仮想環境を有効化する場合は以下のようになります。

```powershell
.\myenv\Scripts\Activate.ps1
```

3. 仮想環境を無効化する

```powershell
deactivate
```

4. 仮想環境を削除する

```powershell
Remove-Item <venvの名前> -Recurse -Force
```

例えば、 `myenv` という名前の仮想環境を削除する場合は以下のようになります。

```powershell
Remove-Item myenv -Recurse -Force
```
[Ruby][Gem] install nokogiri failed, Solved 解決法



## 概要

CentOS 7で Railsのプロジェクト
(いつもの通り) bundle installすると
nokogiriのinstallに失敗する

( なぜか通らないという場合..

## 状況

大体nokogiri に必要なnativeライブラリはinstall済み
https://gist.github.com/trivektor/2415356
https://nokogiri.org/tutorials/installing_nokogiri.html


そして
`gem install nokogiri -v '1.10.4'`

とかすると一応成功して
`nokogiri` コマンドも使える

-> ただ、`bundle install`とかだと、失敗する..



## 問題

こういった場合、bundle install時のみ nativeライブラリのpathが上手く渡っておらず
buildに失敗している..
= optionで渡せばよいが..

https://bundler.io/v1.12/man/bundle-config.1.html



## 解決法

今回の場合は、
普段 `bundle install --path vendor/bundle`していたため
path指定の設定が残ったまま(~/.bundle/config) だったため
ずっと失敗していた..

= つまり、path指定を外すと bundle installが通る..

- bundle config 設定を見直す 
( いろいろ試していると増えて意図しない挙動になる


```
$ bundle config
Settings are listed in order of priority. The top value will be used.
build.nio4r
Set for the current user (/home/vagrant/.bundle/config): "--with-cflags=-std=c99"

build.mysql2
Set for the current user (/home/vagrant/.bundle/config): "--with-ldflags=-L/usr/lib64/"

build.puma
Set for the current user (/home/vagrant/.bundle/config): "--with-cflags=-Wno-error=implicit-function-declaration"

build.nokogiri
Set for the current user (/home/vagrant/.bundle/config): "--use-system-libraries"
```
( 不要な指定があれば除く


- `--path` 指定を外す = bundle configから削除

普段path指定して bundle installしている場合だと思うが
`--path`指定付き(./vendor/bundle など..) だとうまくnative extensionのpathを見つけれられないようで
`./.bundle/config`ファイルから削除 or optionで指定する必要がある


## TLTD

path指定なしでbundle installすれば通る可能性

( 念のため bundle configで意図しない設定値がないか確認
不要なものあれば 該当部分削除



## 追記


その他に
エラーが出る場合がある

`conflicting types for ‘canonicalize’`
https://github.com/sparklemotion/nokogiri/issues/2105

->
どうやら最近のnokogiriのversion だと解決しているようだが、
Gemfile.lock に指定されてるのは 1.10.0 と古め
なので、
versionを上げるとよさそう..

```ruby
Gemfile
# 最新を指定する
gem "nokogiri", "1.15.3"
```

```
# update nokogiri on Gemfile.lock
$ bundle update nokogiri
```
->
これで通った..
(個人開発/LINE/ChatGPT)あと1品が欲しいけど・・・副菜提案botをつくった。

# はじめに
LINEbotとChatGPTを組み合わせて「副菜提案bot」をつくりました。


<img width="300" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/c597dd0b-b3ab-788e-501a-6877192a15d8.png">

# QRコード
![S_gainfriends_2dbarcodes_BW.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/74f520ea-e9e6-bac1-2b9c-f6559e95abe5.png)

# 目的
私は料理担当をすることが多く、「メイン料理は決まっているけど、もう1品欲しいな」と思うことが多々あります。
しかし、アイディアが少なくいつも同じ副菜に偏っていることが多いです。
また、レシピサイトを見て決めるのも「どれがいいかな〜」と時間がもったいなく考えるもの面倒。

買い物の時点から献立が決まっていれば、それを買って調理するだけという流れが理想と思い作りました。

# 概要
副菜に特化した献立を提案してくれます。
提案された献立はやり直しが可能で、献立が確定すると材料と作り方の概要が書き出すことが可能です。
また、このアプリに関係しない文言は受付ないようにブロックしています。
(似たようなbotで問題があったようです)

## やりとり画面
<img width="400" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/c8fd5b81-6fa4-d3db-6eee-e81e3a2f4cc0.png">

### 献立をリクエスト
献立が提案されます。入れ替えたいものがあればクイックリプライで選択することができます。
<img width="400" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/704ad06b-3f2c-199b-b030-e08e15bfa451.png">

### 提案された献立をやり直す
<img width="400" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/04d35fb4-3de9-6a15-4fa3-255c22b2f513.png">

### 材料を書き出す

最終的には献立の材料とレシピの概要を書き出すことができます。

<img width="400" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/9969c9b4-ba1b-645d-d7a7-f6cf79e2be2e.png">

```
レンジで簡単！豆腐とほうれん草のお浸し
材料：
豆腐 1丁
ほうれん草 1袋
しょうゆ 大さじ1
だし汁（顆粒の場合は水で代用可） 80ml
作り方：
豆腐を一口大に切り、湯を沸かしたボウルに入れてレンジで約2分加熱する。
ほうれん草を塩少々を加えた熱湯で30秒ほど茹で、ざるにあける。
豆腐、ほうれん草を器に盛り、しょうゆ、だし汁を混ぜたものをかける。
サッと作れる！きのこのバター醤油炒め
材料：
しめじ 1袋
えのきだけ 1袋
しょうが 1かけ
バター 20g
醤油 大さじ1
作り方：
しめじ、えのきだけを手で分けて小房にし、しょうがをすりおろしておく。
フライパンを熱し、バターを溶かす。
しめじ、えのきだけ、しょうがを加えて炒める。
全体に火が通ったら、醤油を加えて全体に絡める。
玉ねぎとツナのサラダ
材料：
玉ねぎ 1個
ツナ缶（水煮） 1缶
キュウリ 1/2本
レタス 1/2玉
マヨネーズ 大さじ2
塩コショウ 少々
作り方：
玉ねぎはみじん切りにし、塩少々を加えて揉む。
ツナは缶汁を切っておく。
キュウリは1cm厚さに切り、レタスは食べやすい大きさにちぎる。
玉ねぎ、ツナ、キュウリ、レタスをボウルに入れ、マヨネーズ、塩コショウを加えて混ぜる。
```

# 問題点
現在の課題です。
* やり直しを実行しても同じような献立を提案してくる
* 材料とレシピの書き出しを行うと2分程度レスポンス待ちが発生する(まったく返信がない)
* アボカドやズッキーニなどをやたら多用してくる


# 開発ポイント
LINE botは簡単に作れますが、いくつか注意点があります。

### OpenAI APIの料金に注意

GPT3.5のAPI料金は1トークン＝＄0.002程度と記載があります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342722/d77dd5a8-f5ff-0640-8bc4-a86f15e31557.png)

しかし、安価ではありますが注意が必要です。
* 日本語はトークン数が英語より多くなる
* 会話履歴を利用してAPIを利用し続けるとトークンも肥大する

ですので、私が行った対策として
* 献立が確定するまでは材料やレシピを書き出さない
* 献立は3品まで提案として、「料理名だけ書き出して」などの文言をインプットしている
* OpenAIの料金の上限設定を行う
* bot側にも1日にリクエストできる数を制限している

参考記事
https://auto-worker.com/blog/?p=7005#


### 1日のリクエスト制限を行う
bot側の機能として、1ユーザーに大量に使われないために制限を行うことが必須になると思います。
OpenAIにはそのような制限はないため、bot側に機能の実装が必要になります。
簡易的な対策としてDBにユーザーIDを格納して1日の使用数をカウントしています。

:::note warn
警告
ユーザIDをDBなどに格納する場合は暗号化するなど、取り扱いに注意してください
:::

# おわりに
LINE Bot×ChatGPTを利用してbotを作成しました。
まだまだ改善点がありますが、それ以上に様々な可能性があると感じています。
LINEは日本のインフラですので、それを利用して日常生活が楽になるようなサービスが増えるとより良いのではないでしょうか。
個人開発としてモチベーションが続く限りメンテナンスしていきたいと思います。
プリザンターでサーバスクリプトを利用し項目に入力した値からレコードを絞り込む

# はじめに
項目に入力した値からテーブル内のレコードを絞り込み件数を取得するというサーバスクリプトを記載いたします。項目の入力値と重複するレコードが何件存在するか調べたいときに使うことが可能です。

# ソース
```JavaScript
try {
    // サーバスクリプトを設定したサイトのサイトIDを設定
    let siteId = context.SiteId;
    // 法人名称項目の値を設定
    let description = model.DescriptionB;
    // 法人名称項目をJSON形式で絞り込み設定
    let data = {
        View: {
            ColumnFilterHash: {
                DescriptionB: '' + description + ''
            }
        }
    };
    // dataの絞り込み条件でレコード情報を取得
    let results = items.Get(siteId, JSON.stringify(data));
    // 取得したレコードの件数を出力
    context.Log(results.Length)
} catch (e) {
    context.Log(e.stack);
};
```

# さいごに
おそらく、このような実装は今までにブログとしてアップしていたかと思います。入社当初はサイトIDはリテラル値を設定していたと思いますが、「context.SiteId」を使っているところが以前までの実装との違いです。少し成長したという点から今回のブログを記載させていただきました。
pyenvの使い方

pyenvは、複数のバージョンのPythonを管理し、必要に応じて切り替えることができるツールです。ここでは、pyenvの基本的な使い方について説明します。

# 目次
### 1.pyenvで必要なpythonのバージョンをインストール
### 2.virtualenvで1で用意したpythonで仮想環境を作成
### 3.activateして作業する

--- 

1. pyenvのインストール

まず、pyenvをインストールする必要があります。以下のコマンドを使用して、pyenvをインストールできます。

```
curl https://pyenv.run | bash
```

または、Homebrewを使用してインストールすることもできます。

```
brew install pyenv
```

2. Pythonのバージョンのインストール

pyenvを使用してPythonをインストールするには、以下のようにコマンドを入力します。

```
pyenv install <バージョン>
```

たとえば、Python 3.8.2をインストールする場合は、以下のように入力します。

```
pyenv install 3.8.2
```

インストール可能なPythonのバージョンを確認するには、以下のコマンドを使用して、リストを表示できます。

```
pyenv install --list
```

3. 利用可能なPythonのバージョンを確認する

pyenvを使用してインストールされたPythonのバージョンを確認するには、以下のコマンドを使用します。

```
pyenv versions
```

4. 使用するPythonのバージョンを切り替える

pyenvを使用して、現在のシェルまたはグローバルに使用するPythonのバージョンを切り替えるには、以下のコマンドを使用します。

```
pyenv local <バージョン>
```

または、

```
pyenv global <バージョン>
```

5. 現在のPythonのバージョンを確認する

現在のPythonのバージョンを確認するには、以下のコマンドを使用します。

```
python --version
```

以上が、pyenvの基本的な使い方についての説明です。詳細な使い方やオプションについては、pyenvの公式ドキュメントを参照してください。

### pyenvを使用して仮想環境を作成する場合、以下の手順を実行します。

1. pyenv-virtualenvのインストール

まず、pyenv-virtualenvプラグインをインストールする必要があります。以下のコマンドを使用して、pyenv-virtualenvをインストールできます。

```
git clone https://github.com/pyenv/pyenv-virtualenv.git $(pyenv root)/plugins/pyenv-virtualenv
```

2. 仮想環境の作成

仮想環境を作成するには、以下のようにコマンドを入力します。

```
pyenv virtualenv <バージョン> <仮想環境名>
```

たとえば、Python 3.8.2の仮想環境を作成する場合は、以下のように入力します。

```
pyenv virtualenv 3.8.2 myenv
```

3. 仮想環境のアクティブ化

仮想環境をアクティブ化するには、以下のコマンドを使用します。

```
pyenv activate <仮想環境名>
```

たとえば、上記で作成した仮想環境をアクティブ化する場合は、以下のように入力します。

```
pyenv activate myenv
```

4. 仮想環境での作業

仮想環境で作業を行います。Pythonのバージョン、モジュールのインストールなど、必要な操作を行います。

5. 仮想環境の非アクティブ化

作業が終わったら、仮想環境を非アクティブ化するには、以下のコマンドを使用します。

```
pyenv deactivate
```

以上が、pyenvでの仮想環境の作成方法です。詳細な使い方やオプションについては、pyenvの公式ドキュメントを参照してください。

### pyenvでインストールしたPythonを削除するには、以下の手順を実行します。

1. pyenvでインストールしたPythonのバージョンを確認します。

   ```
   pyenv versions
   ```

2. 削除したいPythonのバージョンを指定して、pyenv uninstallコマンドを実行します。

   ```
   pyenv uninstall 3.10.0
   ```

   この場合、Pythonのバージョンが3.10.0のものが削除されます。

3. 削除が完了したら、pyenvでインストールされているPythonのバージョンを再度確認します。

   ```
   pyenv versions
   ```

   削除したバージョンがリストから消えていれば、削除が正常に完了しています。
一部出願人の出願を避けて出願番号を自動生成する例(easy_patents 応用例6)

# 概要
　数年前にベストライセンス株式会社や上田育弘氏による商標の大量出願が話題となった。
　ベストライセンス株式会社や上田育弘氏の大量出願行為自体に是非を述べるつもりはないが、データの収集をする場合、ベストライセンス株式会社や上田育弘氏の出願は、他の出願とは目的や性質、出願経過なども異なっているため、ベストライセンス株式会社や上田育弘氏の出願と他の出願とを区別する必要がある。
　このようなことに鑑みて、データ収集にあたり、特定の出願人（筆頭出願人のみ）にかかる出願を避けた出願番号を生成するツールを作成した。

# コード
大体の出願人が複数の出願をする場合一度に大量の出願を行う点（※）に注目して、対象の出願人を発見した場合、一定の数だけスキップするようにした。
※事務処理の都合上、同時に大量に出願を行うものと推察される。

```py
from easy_patents.get_info import app_number

def gene_app_number(year, start, max_count,
        law="trademark", reget_date=1, skip=50,
        max_no_document_error=30, excludes={'714011053','302041154'},
        haifun=True):
    '''
    機械的アクセスを行う場合の出願番号を自動生成する関数
    大量出願を行う出願人を除外した出願番号を生成する

    Parameters
    ----------
    year: int
        対象の年の出願
    start: int
        下6桁の開始番号
    max_count: int
        生成する出願番号の最大数
    law: str
        法域
    reget_date: int
        app_progressの再取得日
    skip: int
        excludeの出願人が発見された場合にスキップする件数
    max_no_document_error: int
        連続してNoDocumentErrorになった場合の最大数
    exclude: set
        生成対象外とする出願人のコード
    haifun: boolean
        生成する出願番号にハイフンを含めるかどうか

    Returns
    -------
    str
        出願番号(10桁の数字の文字列)をyieldする

    Examples
    --------
    >>> for app_number in gene_app_number(year=2020, start=5, max_count=10):
    ...     print(app_number)
    2020-000005
    2020-000006
    2020-000007
    2020-000008
    2020-000209
    2020-000210
    2020-000211
    2020-000212
    2020-000213
    2020-000214
    '''
    count = 0
    num = start
    no_document_error = 0
    while count < max_count:
        if haifun:
            app_number = "%s-%06d" % (year, num)
        else:
            app_number = "%s%06d" % (year, num)
        try:
            progress_info = app_progress(app_number, law, reget_date=reget_date)
            applicant_code = progress_info['result']['data']['applicantAttorney'][0]['applicantAttorneyCd']
            no_document_error = 0
            if applicant_code in excludes:
                num += skip
                continue
            else:
                num += 1
                count += 1
                yield app_number
        except NoDocumentError:
            num += 1
            no_document_error += 1
            if no_document_error > max_no_document_error:
                return
        except TooManyAccessError:
            return
    else:
        return


if __name__ == "__main__":
    import doctest
    doctest.testmod()
```

# 使い方
以下のような感じで使うことが可能である。
```py
>>> for app_number in gene_app_number(year=2020, start=5, max_count=10):
...     print(app_number)
```

gene_app_numberの引数のexcludeに除外対象の出願人の出願人コードを設定することで、対象の出願人を除外した出願番号を生成できる。(自社の出願を除外したい場合などにも使用可能)
細かい引数については上記コードのコメントを参照のこと。

# 出力結果
```
2020-000005
2020-000006
2020-000007
2020-000008
2020-000209
2020-000210
2020-000211
2020-000212
2020-000213
2020-000214
```

大雑把にベストライセンス社および上田氏の出願を避けた出願番号を生成することが可能となった。
今後は、逆に、特定の出願人の出願のみにフォーカスして出願番号を生成する関数も作る予定。
python maya minmize rotation curve

```python
import maya.cmds as cmds
def MinimizeRotationCurves(obj):
    '''
    Sets rotation animation to the value closest to zero.
    '''

    rotateCurves = cmds.keyframe(obj, attribute=('rotateX','rotateY', 'rotateZ'), query=True, name=True)

    if not rotateCurves or len(rotateCurves) < 3:
        return

    keyTimes = cmds.keyframe(rotateCurves, query=True, timeChange=True)
    tempFrame = sorted(keyTimes)[0] - 1

    #set a temp frame
    cmds.setKeyframe(rotateCurves, time=(tempFrame,), value=0)

    #euler filter
    cmds.filterCurve(rotateCurves)

    #delete temp key
    cmds.cutKey(rotateCurves, time=(tempFrame,))
```
Salesforceフロー項目更新で入力規則を回避する方法

こんにちは
本橋孝昭です

今回はSalesforceフロー項目更新で入力規則を回避する方法をご紹介します

今回の内容は動画でも公開しています

https://www.youtube.com/watch?v=375UkqCYZiQ

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




参考記事は英語で分かりにくかったので日本語で分かりやすく解説しようと思います

https://admin.salesforce.com/blog/2022/how-i-solved-it-bypass-validation-rules-in-flows


※今回の紹介事例

例として
・商談の特定のフェーズ「Qualification」がある
・この商談フェーズに進むには手動での項目更新で進ませないようにしたい（入力規則作成）
・しかし、もしも商談項目で金額「Amount」項目が空欄でなくなった場合（項目更新が発生し金額が入力された）に、商談フェーズが自動的に「Qualification」に更新されたい（フロー作成）

という状況があったとします

要は特定の項目更新を手動では出来なくするが自動化で行いたい　というものです


この場合、入力規則は単純に考えれば

AND(
ISCHANGED(StageName),
ISPICKVAL(StageName,"Qualification"))

のような数式になります


フローはこのような形になるかと思います
![フロー01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/e31bd079-9da1-f1cb-4530-9800a306e542.png)


![開始01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/80926c55-8dbd-445a-fb5f-2bc040191809.png)

![開始02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/66baec87-0cf1-b6f6-ea7f-6db48c153d42.png)


しかしながら、このような入力規則とフローでは
・手動更新でも商談フェーズが「Qualification」にはならない
のですが
・フローの自動更新でも商談フェーズが「Qualification」にならない
（フローも入力規則が働いてエラー発生）

となります


では、どうすればいいでしょうか

ここでは回避方法として以下のステップを行います


## ステップ１　カスタム項目（日付時間）を商談オブジェクトに作成

カスタム項目（日付）を作成します
名前やAPI名は任意で設定してください

例として
項目名ValidationBypassDateTime
API名ValidationBypassDateTime__c
とします

そして大事なことはデフォルト値の設定です
デフォルト値は
$System.OriginDateTime
とします

![設定01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/d1515620-2881-ff88-f55b-f68e7fffb7ab.png)

※このカスタム日付項目は裏でフローの項目更新で使用するためのものですので、ページレイアウト上に表示させることはおすすめしませんが、今回はわかりやすくするためあえてページレイアウト上に表示させます


## ステップ２　カスタム数式項目（チェックボックス）を商談オブジェクトに作成

次にカスタム数式項目（チェックボックス）を作成します

名前やAPI名は任意で設定してください

例として
項目名はIsVRBypassed
API名はIsVRBypassed__c
とします

数式は以下となります
BLANKVALUE(ValidationBypassDateTime__c, $System.OriginDateTime) > NOW() - 0.00005787037 /*Five Seconds*/

※ここのValidationBypassDateTime__cはさきほどステップ１で作成した項目のAPI参照名です

![項目001.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/efec8eda-e4a7-9682-5f88-8cc5a350a825.png)



## ステップ3 入力規則の修正

さきほどステップ２で作成した項目を入力規則に組み込みます

変更前入力規則

AND(
ISCHANGED(StageName),
ISPICKVAL(StageName,"Qualification"))

変更後入力規則

AND(
ISCHANGED(StageName),
ISPICKVAL(StageName,"Qualification"),
NOT(IsVRBypassed__c))

要は最後の部分に
NOT(IsVRBypassed__c)
を追加します

※IsVRBypassed__cはステップ２で作成した項目のAPI参照名です

## ステップ4 フローの修正

ここではフローの修正を行います

具体的にいえば項目更新時のアクションに

ValidationBypassDateTime__c（ステップ１で作成した項目のAPI参照名）

値
{!$Flow.CurrentDateTime}
※現在の日時

を追加します

画像で示すとこのようになります

![追加02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531631/488aa14c-85c6-8361-e53b-b155a20a1b7b.png)


これで設定は完了です
（ステップ３の入力規則の有効化やステップ４のフローの有効化はお忘れなく！）


この設定を行えば
・この商談フェーズに進むには手動での項目更新で進ませないように設定（入力規則）
・もしも商談項目で金額「Amount」項目が空欄でなくなった場合（項目更新が発生し金額が入力された）に、商談フェーズが自動的に「Qualification」に更新される（フロー作成）

という、フローの自動更新も可能だし入力規則で手動更新を防ぐことが可能です

ぜひお試ししてみてください！

（分かりにくい部分などあれば修正しますのでご連絡ください！）
【JavasScript】例外処理について

# はじめに
この記事はJS初級者が中級者を目指して学習した内容のメモであることをご承知おき下さい
## 例外処理とは
例外処理とはプログラム実行中にエラーや予期しない事態が発生した場合にプログラムが適切に対応できるようにする仕組みのこと。
JSでは、try、catch、finallyブロックを使って例外処理を行う。
```js
function divide(a, b) {
  if (b === 0) {
    throw new Error('0で割ることはできません。');
  }
  return a / b;
}

try {
  // エラーが発生する可能性のあるコード
  const result = divide(10, 0);
  console.log(result);
} catch (error) {
  // エラーが発生したときに実行されるコード
  console.error('エラーが発生しました:', error.message);
} finally {
  console.log('例外処理が完了しました');
}
```
上記では"引数a / 引数b"の除算を行う関数divideを定義している。
tryブロックで```divide(10, 0)```を実行しようとすると"10/ 0"となりエラーが発生してしまう。
そこであらかじめ関数divide内にif文でエラーが発生する場合の条件を設定しておき、その中の```throw new Error()```でエラー内容をcatchブロックに投げることでtryブロックで処理が中断せずにcatchブロックへと処理が移行する。
catchブロックでは、```throw new Error()```で返されたエラー内容（Errorオブジェクト）が引数に渡されエラー発生時の処理を設定することができる。
そしてfinallyブロックでは、tryブロックでのエラー発生の有無に関わらず、finallyブロック内の処理が実行され例外処理完了となる。
システムオブシステムズにおけるデータの整合性

# 背景
SoS(システムオブシステムズ)において、
他の同じ粒度のSoSと境界をまたいでデータの連携をするという場面がある。
<img width="400" alt="スクリーンショット (92).png (53.2 kB)" src="https://img.esa.io/uploads/production/attachments/5827/2023/04/27/135213/c2a9f6bc-1a0b-4562-bedd-14c15cfb2221.png">

その際にデータの不整合があっては決していけない。データの安全性が非常に求められる。
そこでオブジェクト指向の【不変オブジェクト】の設計スタイルを抽象化して
システムのスケールにまでその設計思想を盛り込んだ独自アイデアを記載する。

# 不変オブジェクトについて
通常のシステム内のオブジェクトの設計は、【値の不整合を避けたい】というリスク回避動機が伴う。
これに対して特に何も施策を打っていない状況下で、
下図のオブジェクトAが、クラスBやCから呼び出される前の属性aの値が10であったとする。
仮にこのAの持つ処理が、属性aに5を足して呼び出し元へ戻すというロジックであったとする。

BはAの処理を呼び出し、aの値を10→15へ変更しその値を戻してもらったとする。
このあとCがAを呼び出すが、Cは呼び出す前にaが10のつもりで呼び出しているので、
なぜか20が値として返ってきてしまい困惑する。

このように何もデータの不整合リスクに対する処置をしていないと思わぬバグを発生させる。
そこで値が不用意に変更されないようにイミュータブルに設計しておくことが求められる。
<img width="300" alt="不変オブジェクト.png (12.1 kB)" src="https://img.esa.io/uploads/production/attachments/5827/2023/04/27/135213/03cceaa4-0e43-4df8-b27a-3f4cdbe2a5d6.png">

また下図のように呼び出される側に不変オブジェクト(赤)や可変オブジェクト(緑)が混在していると、
呼び出し元のClientは自分が呼び出す相手が、不変に設計されているのか？
それとも可変に設計されているのか？わからず、安心して呼び出すことができない。
<img width="500" alt="可変.jpg (35.7 kB)" src="https://img.esa.io/uploads/production/attachments/5827/2023/04/18/135213/8337561f-0cee-4d51-b0c2-4bc6cf51a92e.jpg">

そのため仮に可変オブジェクトを用いるなら、
そのクラスが存在するコンポーネント内の物はすべて可変にするなどのわかりやすい設計が求められるであろう。(下図)
<img width="500" alt="不変.png (21.6 kB)" src="https://img.esa.io/uploads/production/attachments/5827/2023/04/18/135213/32507628-be0c-4b95-afdd-76f345eb082e.png">
しかも可変パッケージに存在するGやHは、状態変化が容易なものである場合に限り、
リスク低減のため不変にしてしまうことが良いと考えられる。
ここでもちろんインスタンスが大量に生成されるリスクから、パフォーマンスの低下が考えられるが、
近年の優秀なハードの性能がそのリスクを大幅に低減してくれるため、
不変にすることのメリットの方が上回るといえる。

この考え方をシステムオブシステムズのスケールでの設計にも取り入れようと考えた。
その考察を以下で行う。
上記でのクラスを１つのシステムに見立てて考察した。

# システムオブシステムズでの不変設計
簡単のためにシステムA、B、Cのみで、かつAにはクラスS、Tだけ存在することにする。
※図は模式図のためシステムBから直接オブジェクトSやTが参照されるわけではない。
必ずシステムAのバウンダリなどを介してS、Tに行きつくが、この図ではそこは本質的に重要部分でないので省略した。

このときSoSでの情報の連携をする際には、上記の不変オブジェクトの考察から
【必ずオブジェクトは不変オブジェクト設計】にすることがマストである。
<img width="500" alt="クラス図1_0.png (18.6 kB)" src="https://img.esa.io/uploads/production/attachments/5827/2023/04/27/135213/ec1b7465-acc2-4d3b-aab3-99a1c0fdc030.png">


でないと、システムBを呼び出すようなシステムDがいた場合に、
値の不整合がなぜだか起きていて、その発生源を探すのに
システムB内のオブジェクトの設計を解析して、さらにシステムA内のオブジェクトの設計を解析して～～
とめちゃくちゃ苦労することが容易に想像がつく。
仮にシステムA内のオブジェクトを不変オブジェクトになるように設計していたとしても、
システムB側で可変になるような設計をしてしまっていた場合には、
やはりデータの不整合リスクを回避することは困難になる。

以上のことから、SoSでシステム間を連携させる場合には、
必ず連携をする予定のシステム側でデータの不整合が起きないように、
すべてのオブジェクトに対して不変オブジェクト設計がされていることが保証されたうえで
SoSとして連携させるという手段を取るのが安全性を担保できるといえる。

また、SoSの１つのリソースとしてそのシステムが使用されている場合、
そのシステムに新しいクラスを追加する場合にもやはり不変に設計しなくてはならない。

最近のシステムは不変に設計されているものが多いと聞きますが、
いずれにしても古いシステムなどをSoSの１つのリソースとして使用する際には、
あらかじめ不変に設計されているかの要チェックが必要であり、
この不変に設計するっていうのをアーキテクチャガイドラインに必ず載せることを個人的に推奨したい。
初心者がお伝えするBizRobo!のその機能もっと早く知りたかった ～DAのOpenステップ編～

# 自己紹介
私は「プログラミング＝黒い背景にいっぱい文字が書いてるやつ」というくらいの認識で、IT企業に入社した社会人２年目のRPAエンジニアです。
そんな私が約1年間BizRobo!（RPAツール）を触ってみて感じたこと、もっと早く知りたかったことなどを、書き留めていきます。
これから「BizRobo!始めます！」という方のお役に立てればと思います。

※私がメインで使用しているBizRobo!のバージョンが10.7のため、基本的にはver10.7に存在する機能が主になります。ご了承ください。

# DAでファイルやウェブサイトを開く
＜初期＞
**・ファイルを開く場合**
エクスプローラーアイコンをクリック　→　フォルダをクリック　→　該当ファイルクリック
**・ウェブサイトを開く場合**
アプリをクリック　→　検索欄にURLを転記　→　検索結果クリック

といった感じで実際に人が行う手順と全く同じように開いていました。
しかしこれだと「該当ファイルが画面外に隠れてしまった」「アプリの場所が移動してしまった」などの場合に都度修正が必要となってしまいます。

こんな感じで大丈夫なのか、と悩んでいたところ出会ったのが「Openステップ」です。

# Openステップ
OpenステップにファイルパスやURLを記入するだけで、３ステップ以上かかっていたウェブサイトを開くという行為を、１ステップで行うことができます。

しかし、ここで注意していただきことが１点あります。
ファイルパスを変数でDAに受け渡した場合、**replaceAll関数で「\」を「/」に置き換える**必要があります。

![Qiita_画像1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3346701/0b2938ee-93ac-c6df-4719-f7b6ab8ad181.png)
![Qiita_画像2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3346701/eced4323-2419-b966-ea5c-d82c3375cc57.png)


これを行わないと、エラーは出ないけど指定したファイルが開かないという状況に陥ってしまうのでお気を付けください！



誰かのお役に立てれば嬉しいです。
最後までお読みいただきありがとうございました。
MuleSoft Anypoint Platform の無料トライアルアカウントの取得方法について

[こちら](https://qiita.com/hairyhg99/items/925cf50b61d8a32d43db)の記事にて
- MuleSoft って何もの？
- MuleSoft を学ぶコンテンツって何がある？
という要旨の記事を書かせていただきました。

学ぶのは良いが、ライセンスはどう調達する？という疑問にお答えすべく今回は 30 日間**無料で利用可能**な Trial License のサインアップの方法を紹介します。

1. https://anypoint.mulesoft.com/　へアクセス
2. **Sign up** ボタンを押下![スクリーンショット 2023-04-27 10.00.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180295/cd06b21f-706b-6c13-3503-2410ac261baa.png)

3. 必要事項を入力の上、**Accept and create accoun** ボタンを押下(※ 過去にトライアルアカウントを作っていて、30 日の期限が切れたという方は、こちらの **username** 欄に別名を指定して新規のトライアルアカウントを取得します。)![スクリーンショット_2023-04-27_10_03_07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180295/60f1f85c-f068-a51a-8407-17135a26c7c9.png)


4. Email による確認認証が求められましたらメッセージに従い **Verify** ボタンを押下![スクリーンショット_2023-04-27_10_09_56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180295/c9c38b3a-6b7f-35a4-018c-ae5e0021f0d6.png)

5. Email に送られてくる認証コードを入力し、**confirm** ボタンを押下![スクリーンショット_2023-04-27_10_10_45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180295/3e70b688-5d79-ee35-eb9c-bc1477e218c8.png)

これでセットアップは完了です。
トライアルアカウントには 1 vCore 分のライセンスが付与されているので、最大 10 個まで学習用に作った API を同時稼働できます。
"究極の初心者"　文系大学生プログラミング勉強の道のり - 1 - 

私は文系の4年制大学に通う大学生です。
私が、3年生の4月から開始したプログラミングの勉強の道のりを書いていこうと思います。

この記事を書こうと思った理由は以下の3点です。
1. 自分のプログラミング学習の経験を、今後に生かすために、これまでを振り返ってみようと思ったから
1. その頃の自分がどんな状況でどんなことを考えていたのかの記録をつけたかったから
1. 他の人はどんな風にプログラミングを学んできたかを知りたく、とりあえず自分の過程をみんなと共有したかったから

それでは書いていきます。


勉強を始めた当初の状態
-

- Notionを使い始め、Webサービス便利だなー。こういうの作りたいなぁと思ってる
- Progateのパイソンコースを合計2時間くらいして、その状態で放置
- プログラミングスクールに通っていない。情報系の専門学生でもない

端的に言うと、「エンジニアにあこがれ、プログラミング勉強っぽいことしてみた。」
という状態でした。

この状態から自分なりの方法でプログラミングを学んでいきます。
まずは大学の授業でPythonを学ぶ講義が開かれていたので、それを受講するところから始まりました。


1-0. 大学の授業でPythonの勉強をする
-

大学3年生の4月から、自身の通っている大学でPythonの基礎文法を学べる講義を履修し始めました。

具体的に授業では
1. Anacondaというソフトを自分のノートパソコンに入れ
1. Anacondaを起動し、そこからさらにJupyter Notebookというソフトを開き
1. 教授の授業を聞きながらPythonでコードを書いていき基礎文法を勉強する

という感じで学びました。


学んだ内容は大体以下の通りです
1. "Print()" を学ぶ
1. int,str,float,boolなどの型を学ぶ
1. 変数を学ぶ
1. リスト、辞書型を学ぶ
1. if文を学ぶ
1. for文、while文を学ぶ

（授業では関数とクラスまでは学べませんでした...）

1-1. 苦労した点
-
これだけの内容ですが、プログラミング究極の初心者であった私にとってはいろいろと苦労する点がございました。特に苦労した点は以下の二点

1. WindowsにAnacondaをインストールするのがうまくいかない
1. Pythonの基礎文法とはいえ、初心者には覚えることが多く、内容を整理しきらない


まず1 について。ソフトのダウンロードなど、プログラミングを始めるまでの準備は、「iPhone」でパズドラやツムツムをダウンロードするときのようにスムーズにいきませんでした。

その当時はすんなりできるものだと思っていたので、インストールで躓くということの意味が分からず、イライラしましたね。（のちに環境構築は現役のエンジニアさんでも難しいということを知る）

2 について。正直プログラミングはそこまで難しくないと思ってました。
プログラミングに興味をもったころは、インターネットで目にする
「プログラミングで○○できるようになった。」
「プログラミング勉強していてよかった。」
「プログラミングで人生が変わった」
みたいな、甘い文言に脳内を支配されていました。

しかし実際に勉強を始めてみると、覚えることは思っていた何十倍もあるし、
機械は人のようになんとなくでは動いてくれず、ちょっとした誤字一つエラー。1時間くらいうんうん悩む。
Progateなどとは異なり、授業では課題があり、単位もかかってました。それで初めて真剣にプログラミングに取り組んで、プログラミング学習の難しさも知りました。

このころの自分にアドバイスをできるなら、「プログラミングは難しいし、根気がいるよー。」このことを伝えたいです。

1-2. 学んだこと
-
-精神面 -
1. 「プログラミングは難しいし、根気がいる。」ということを学んだ
1. プログラミングを書き始めるための準備はものすごく大変ということを学んだ
------------------------

-技術面-
1. Pythonの基礎文法（関数とクラス、ファイルの操作以外の内容）
-------------------------
-今後に生かしたいこと -

プログラミングは難しいから躓くのは当たり前。だから学習のスピードが思ってるより遅くても大丈夫。それでも一歩一歩でいいから進めていくことが大切。これを意識して頑張る

1-3. 次回予告
-
次回は半年間の大学の講義が終わり、地元のIT企業のインターンシップに参加させていただいた話と、そのころの勉強の様子についてを書いていこうと思っております。
よろしければ次の記事も読んでいただけると幸いです。

この記事を最後まで読んでいただきありがとうございました。また次回。

[次の記事はこちら](https://qiita.com/Oden3/items/78af79ba79bf26b64529)
Unity VFXGraphで回復エフェクト作った

# 回復エフェクトを作りました
https://www.youtube.com/watch?v=Etq2SrqVIFs

作り方は動画の左側を見て作ってみてください。

色の部分やConform to SphereやGPUEvent後のTurbulenceのIntensityの部分をパラ出ししておくと使い勝手がよくなると思います。

水色にすれば螺旋丸エフェクトになりそう。
ChatGPT APIを活用した旅行提案型LINEボット！


# ChatGPT APIを活用した旅行提案型LINEボットを作成しました！

LINEのトーク画面でユーザーがいくつかの質問に答えていくと、ユーザー回答した条件に合った旅行の目的地やプランをAIが提案してくれるLINEチャットボット **「GPT旅行アドバイザー」** 


## 内容紹介 
下記３つのメニューから選択可能！
各メニュー５問程度の質問に答えるとAIが回答生成！
![travel.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2784430/880f9a6e-60d3-9fc9-6e15-16500143e1c1.gif)

**GAS**で  **LINE Messaging API** と **ChatGPT API** を連携させています！


**◆「GPT旅行アドバイザー」簡易版の作成方法はAmazon Kindle本にしてまとめています。（全ソースコード記載）**:point_down:


https://www.amazon.co.jp/dp/B0C7P78GTT/

簡易版デモ
![GPTTravelAdvisor.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2784430/9dd8ff9d-56a2-1498-354c-e264dec71baf.gif)




:end:
az findコマンドを活用しよう

### はじめに
Azureリソースを構築・管理する方法としてAzure CLIがあります。1つのリソースを作成するとかであればAzure Portalでいいですが、重複する作業を自動化する場合はやはりコマンドが便利です。今回はAz findコマンドを紹介します。

### Az findは何ができる？

AzureのドキュメントとAzure CLI、Azure Resouce Managerのユーザーの使用パターンに基づいたコマンドの使用例を提示してくれます。

### 実際に使ってみる

百聞は一見にしかず、やってみましょう。例えばAzure backup Valutを削除する方法をAzure CLIに聞いてみます。

![azfind.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322105/df2dadde-c0ed-5536-99a9-72861a68414d.png)

何がよいかというとただコマンドを教えてくれるだけでなく、他に使えそうなコマンドも例示してくれる点が便利です。さらにAI・機械学習を活用しているそうなので、CLIを使えば使うだけさらに便利になる優れものです。現状は単純な機械学習に見えますがこの辺も大規模言語モデルでより高度化されるのかというのも楽しみなところですね。

### 参考

[Microsoftドキュメント](https://learn.microsoft.com/en-us/cli/azure/reference-index?WT.mc_id=itopstalk-blog-thmaure&view=azure-cli-latest#az-find)
[Azure CLI Tip - Use AI to find az commands](https://techcommunity.microsoft.com/t5/itops-talk-blog/azure-cli-tip-use-ai-to-find-az-commands/ba-p/1170564?WT.mc_id=thomasmaurer-blog-thmaure)
angularでchart.jsを使ったときに、typeを指定してもにエラーになりハマった

## 環境
・angular/cli v11.2.19  
・Node        v12.16.3  
・OS          windows  
・chart.js    v3.9.1  

## 具体的なエラー
```typescript 
re.js:6210 ERROR Error: "pie" is not a registered controller.
```
## 結論
```typescript
import { registerables } from 'chart.js';
```
で ***registerables***を***import***して、
```typescript
Chart.register(...registerables);
```
をグラフ作成前に追加する。  
※私の場合は  
```typescript
// ファイルの一番上で
import { registerables } from 'chart.js';
~


ngAfterViewInit() {
	Chart.register(...registerables);
	~ //以降グラフ作成コード
}
```
という形。
※実際のimportは***Chart***も必要な為以下の形になる。
```typescript
import { Chart, registerables } from 'chart.js';
```

## 原因
いまいちわからないけれど、多分TypeScriptの型問題的なのが原因だと思う。  
Chart.jsの **Chart**クラスの**type**プロパティはstring型じゃない！！と怒られる、みたいな。  
間違っていたらすいません、、、


## 経緯
プロジェクトでAngularで円グラフを書く必要があったため**Chart.js**を使用してグラフを書こうと思ったら、画面に表示されなくて困った。  
他ライブラリの**ng2-charts**や**ngx-charts**を使おうとしたけど、Angularのバージョン的に使えなさそうだったので、Chart.jsを使うしかなかった。  

## 感想
問題を解決するのに非常に時間がかかった。多分1日半くらいかかった。非常に無駄な時間だった。  
でも生のCSSでグラフ書く方がめんどそうだったから必死だった。  
Angularの文献が少なすぎる(英語ばっかり)だから正直Angular使うのはいやだ。  
あと、バージョンが変わる頻度が高すぎて、バージョンによってはできる、できないが多すぎるから、自分に適した記事を見つけるのが大変。  
もうちょっとバージョン変更頻度低くてもええんやで、、、  

この記事が誰かの役に立てば幸いです。  

コメント等ご気軽に優しくどうぞ。
【JavasScript】mapについて

# はじめに
この記事はJS初級者が中級者を目指して学習した内容のメモであることをご承知おき下さい
## 2つのmap
JSにはひと口にmapといってもMapオブジェクトとmapメソッドの2つあり、異なる目的で使用される
## Mapオブジェクト
Mapオブジェクトは、キーと値のペアを保持するためのコレクションこと。
オブジェクトと似ているがMapオブジェクトは任意のデータ型（オブジェクトを含む）をキーとして使用できる。
```js
const myMap = new Map();
const key1 = 'key1';
const key2 = 0; // 任意のデータ型をキーとして使用できる
const key3 = {}; // 任意のデータ型をキーとして使用できる

myMap.set('key1', 'value1');
myMap.set('key2', 'value2');
myMap.set('key3', 'value3');
```
また、Mapオブジェクトは要素の挿入順を保持し、繰り返し処理が可能。
```js
// Mapオブジェクトはfor..ofで繰り返し処理が可能
const myMap = new Map([
  ['key1', 'value1'],
  ['key2', 'value2'],
  ['key3', 'value3'],
]);

for(const map of myMap){
  console.log(map); // ['key1', 'value1'] ['key2', 'value2'] ['key3', 'value3']
}
```
## mapメソッド
mapメソッドは配列メソッドの一種で、配列の各要素に対して指定された関数を実行し、その結果を新しい配列として生成することができる。
元の配列を変更せずに、新しい配列を返すことができるのが特徴。
```js
const array = [1, 2, 3, 4, 5];
const newArray = array.map(element => element * 2);
console.log(newArray); // [2, 4, 6, 8, 10]
```
タスクスケジューラの情報

    TaskName: スケジュールされたタスクの名前
    Next Run Time: 次回の実行時刻
    Status: タスクのステータス (実行中、正常に完了、失敗など)
    Logon Mode: タスクの実行時に使用されるログオンモード
    Last Run Time: 前回の実行時刻
    Last Result: 前回の実行結果
    Author: タスクを作成したユーザー
    Task To Run: 実行するコマンドやプログラム
    Start In: 実行するコマンドやプログラムの作業ディレクトリ
    Comment: タスクに関するコメント
    Scheduled Task State: タスクの状態 (有効、無効、実行中止など)
    Idle Time: タスクを実行する前に必要なアイドル時間
    Power Management: 電源管理設定
    Run As User: タスクを実行するユーザー
    Delete Task If Not Rescheduled: スケジュールされたタスクを再スケジュールしない場合にタスクを削除するかどうか
    Stop Task If Runs X Hours and X Mins: タスクをX時間X分で停止する設定
    Schedule Type: スケジュールの種類 (毎日、毎週、毎月など)
    Start Time: スケジュールの開始時刻
    Start Date: スケジュールの開始日
    End Date: スケジュールの終了日
    Days: スケジュールされた日 (毎週、毎月の場合に指定)
    Months: スケジュールされた月 (毎年の場合に指定)
    Repeat: Every: スケジュールの間隔
    Repeat: Until: Time: スケジュールの終了時間
    Repeat: Until: Duration: スケジュールの継続期間
[CentOS][Yum][DNF] Could not resolve host: packages.endpoint.com; Unknown error, Solved





# 概要

CentOS 7 でyum install/update が失敗する

```
https://packages.endpoint.com/rhel/7/os/x86_64/repodata/ab0718619a18383c3b6d84d5bcf13eeb3780ad3324782f5507a263857bc57b42-filelists.sqlite.bz2: [Errno 14] curl#6 - "Could not resolve host: packages.endpoint.com; Unknown error"
Trying other mirror.
...
```

# 問題

`https://packages.endpoint.com` などを開いても400なので

そもそもdomainが変わっているよう

# 解決法

以下に変わったようなので置換


```/etc/yum.repos.d/endpoint.repo
https://packages.endpoint.com
->
https://packages.endpointdev.com
```


https://github.com/telegramdesktop/tdesktop/issues/23980
Route53 位置によるルーティングポリシーの違い

## 初めに
AWSのRoute53を勉強してる際に、地理的近接性ルーティング、位置情報ルーティングという似たようなルーティングポリシーが出てきたのでまとめました。


## 地理的近接性ルーティングと位置情報ルーティングの違い

例えば日本とアメリカにサーバーが存在するとしましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/880800/c240f045-b3df-426e-9ef3-cc86a5ae2a87.png)

その場合、それぞれのルーティング方法では以下のような違いがあります。

### 位置情報ルーティング

ユーザーの地域によってルーティング先を設定します。

下の図でいうと
- 日本のユーザー(日本語圏)は日本のサーバーへ
- アメリカ、オーストラリア、南アメリカなどのユーザー(英語圏)はアメリカのサーバーへ

というようなルーティングを設定することができます。

オーストラリアはアメリカより日本の方が近いですが、地理的近接性ルーティングを使うことで英語のサーバーへ接続させることが可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/880800/3dbf27c5-f1ba-1230-080c-6f8f9bf947ad.png)

### 地理的近接性ルーティング

簡単にいうと、ユーザーの「地域」に一番近いルーティング先にルーティングします。

具体的には、「地域」の範囲をバイアスという値を用いて制御します。
どういうことかというと、極端な例ですが

バイアスが1:1では
赤の範囲(サーバーAへルーティングされる範囲)
青の範囲(サーバーBへルーティングされる範囲)
ユーザーはAのサーバーへルーティングされます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/880800/f02db943-ff2f-0ae5-5425-6949016e9582.png)

次に、バイアスを1:5にすると
Bへの青いルーティング範囲が広がり、ユーザーはBのサーバーへルーティングされるようになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/880800/4c4e8cf7-9111-ee13-1263-451966195280.png)


### ユースケース
では結局どのようなユースケースが考えられるのか

- 位置情報ルーティング
    -言語によって表示するページを切り替える時
    - 特定の国からのみアクセスさせたい時
- 地理的近接性ルーティング
    - ユーザーのルーティング先を地理的に振り分けたい時


## まとめ
正直なところ、地理的近接性ルーティングを使うタイミングというのがよく分かりません。
AWSの公式ドキュメントを見ている限り、バイアスの値で変更される地理的距離の計算などかなり複雑そうです。
バイアスの値で変更される地理的距離の計算などが面倒であれば、レイテンシーポリシーを用いればよいのではないか？とも思いました。
体系的に学ぶ/教えるってどういうこと？

# よくある依頼
「XXについて体系的に学ばせたい」
「体系的に学ぶ必要がある」
「体系だった情報で学びたい」
etc...
こういう表現よく聞きませんか？私はよく聞きます。
…のですが、ふと「そもそも体系的に学ぶってどういうことだろう？」と疑問がわいてきました。
体系だった学習が有効だというのは感覚的にはわかるのですが
そもそも体系的ってなんだよ、と深く考えたことはありませんでした。
なので今日はちょっと考えてみたいとおもいます。

# 辞書の定義
[weblio](https://www.weblio.jp)さんによると定義は以下のようです。

たい‐けい【体系】
読み方：たいけい
１ 個々別々の認識を一定の原理に従って論理的に組織した知識の全体。
２ 個々の部分が相互に連関して全体としてまとまった機能を果たす組織体。

体系的
読み方：たいけいてき
個々の物事が一つの理論的な秩序・まとまりの中に組み込まれているさま、統一的な原理のもとにある様子などを意味する表現。

# 具体的に考えてみよう
例えば一言で「テスト自動化について勉強する」と言っても、その中身には多くのものを含みます。
 * 自動テストの原理/原則
 * テストツールの種類や用法
 * テストコードの書き方
 * アサーションの入れ方
 * CIへの組み込み方
 * 結果の計測方法
 * などなど
 
こういった多岐にわたる「個々別々の認識」を、「一定の原理に従って論理的に組織した知識」にしたうえで学ぶのが
体系的に学ぶ、ということなのでしょう。
ここで、一定の原理に従って・・・というのが大事そうです。

例えばテストの進め方とか開発パイプラインの組み方なんかは色々な考え方があります。
派閥や思想といってもいいかもしれません。
「個々別々の認識」がそれらの考え方・思想の何かについて統一されていなければ、個別の知識がシナジーを発揮しないわけですね。
なので体系的に学ぶということが重要なわけです。

# 振り返って考えてみる
こう振り返ると人に何かを教えるときに、果たしてちゃんと「一定の原理に従って論理的に組織」して教えられていたかな？というと怪しい気がしました。
また、何の原理に従って教えているのか？ということを明示していなかった気がします。
学習を受ける人からすれば、その後関連した技術を学ぶときに、以前学んだ技術がどこの流派の考え方だったのか？ということがわかっていないと継続した学習にならないわけで、つらいですね。
ちょっと反省しようと思ったっていう自分用memoでした。
DatabricksのMachine Learning系資格を取得したのでまとめてみる

Databricksの機械学習系資格は2つあり、両方に合格したのでまとめてみる。その2つの資格とは
- [Machine Learning Associate](https://www.databricks.com/learn/certification/machine-learning-associate)
- [Machine Learning Professional](https://www.databricks.com/learn/certification/machine-learning-professional)

だが、ProfessionalはAssociateの上位資格になる。ぶっちゃけ先人の方の記事で事足りる感はある。

- [Databricks Certified Machine Learning Associate 合格体験記](https://qiita.com/nttd-yuan/items/2dba37360161dfbcbe4a)
- [Databricks Certified Machine Learning Professional 合格体験記](https://qiita.com/shotkotani/items/d76d216a4c610003d99f)

## 共通
どちらも教材のnotebook(python)とpdfがgithub上で公開されているので、試験対策は無料で事足りる。
- Associateの対策は「[Scalable Machine Learning with Apache Spark](https://github.com/databricks-academy/scalable-machine-learning-with-apache-spark-japanese/releases/tag/v3.8.6-JA)」
- Professionalの対策は「[Machine Learning in Production](https://github.com/databricks-academy/ml-in-production-japanese/releases/tag/v3.4.5-JA)]」

dbcファイルはDatabricksのアーカイブファイルなので、自分のワークスペース上でインポートすればリポジトリの中身が展開される。
https://learn.microsoft.com/ja-jp/azure/databricks/notebooks/notebook-export-import?source=recommendations

なおDatabricksの資格全般に言えることだが、教材はgithubに公開されており、関連講義も[Databricks Academy](https://www.databricks.com/learn/training/login)で無料で視聴できる。ただしAatabricks Academyの動画講義は全て英語かつ字幕無しなので注意。
notebookとpdfオンリーでも合格水準に達することは可能だが、notebookのコードのみを追っていると恐らく合格できない。notebook上のmarkdownで書かれている解説内容やUI画面についても出題される。従って
- なぜこのコードでなければいけないか
- この方法にすると何が嬉しいか
についても理解しておく必要がある。

## Machine Learning Associate
SparkMLを使用した機械学習モデル構築に関する内容が大半を占める印象。MLflowについてはトラッキングとモデルレジストリについてそれなり出題される。「mlflowに記録された実験の元notebookにアクセスする方法」みたいなGUI操作の問題が出たりして少し面食らった。
「pyspark pandas APIがpysparkに比べて遅くなる時の原因」みたいな問題は動画講義中でさらっと解説されてたりするので、講義内容について結構深い理解が必要。notebook上でも解説されているので、コードを追うだけでなく熟読する必要がある。
前提知識として機械学習モデル構築の基本的な知識がある方が無難。
- 手法の知識
    - 線形回帰
    - 決定木
    - ランダムフォレスト
- モデル構築の方法
    - ホールド・アウト
    - クロスバリデーション
    - リーク
    - ハイパーパラメータ
このあたりを知っておくとnotebookや講義の内容が頭に入りやすい。

## Machine Learning Professional
Associateと重複したトピックが多いものの、出題内容としてはより狭く深くといった印象。特にmlflowについてはかなり深掘りした内容が出題される。ぶっちゃけ試験の大半の内容はmlflowとFeature Store。mlflowを深く理解するにあたってはflavorの理解は必須だが、このflavorが非常に抽象的でわかりにくい。試験対策と割り切るのも手だが、どうしても理解しないと気が済まない人は以下のブログ記事が参考になる。
- https://ktksq.hatenablog.com/entry/mlflow-models
- https://blog.hoxo-m.com/entry/mlflow_xgb_flavor

webhookを使用したモデルの自動テストについては、webhookがサポートするイベント・アクションを確認しておく方がいい。
https://docs.databricks.com/mlflow/model-registry-webhooks.html

ドリフト検知については統計の知識が問われるが、深くは突っ込まれない。ただ内容は資格抜きにしても参考になる無いようなので、しっかり理解しておいて損はない。

## 試験
現状、試験は英語なのでちょっとハードルが高い。
試験は在宅で、事前に専用のブラウザをインストールと、PCのカメラを使って自分の写真をキャプチャしてアップロードする必要がある。このブラウザは管理者権限がないとインストールできないので、注意が必要。
キャプチャ撮影・アップロードは試験サイトのガイダンスに従って操作するだけなので、特に負担はなかった。
試験中はこのブラウザで試験を受けるのだが、他のアプリケーションにアクセスできなくなる。またカメラとマイクへのアクセス許可が必要で、カメラ映像とマイクでモニタリングされる。なお私は英文を読む際には声に出す癖があるのだが、マイクで音声を拾われて音読しないよう注意する画面が出てしまった。。。

資格試験自体は英語で敷居が高いと思われるが、その分資格取得者が少なく、自習かつ無料で試験対策ができるためコスパは悪くないと思う。実践的な内容も多く、既にdatabricksを利用している人は受験してみて損はない資格。
一応Professionalが上位資格という扱いだが、Professional単体の知識だけではSparkMLを使った機械学習モデル構築の知識が身につかない。2つの資格の知識を兼ね備えてこそ真価を発揮するものだと思われる。
IBM Cloud: App IDのログイン画面にロゴをアップロードする方法

# 1. はじめに

App IDのログイン画面のカスタマイズのために、ロゴをアップロードしたかった。しかし、100kB以内の透過型jpg,pngであれば良さそうだが、以下のように実際に試してみるとほとんどのファイルのアップロードに失敗する。原因はUIのバグのようだ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/62127/c0237c34-e7c5-67ba-42e3-edd0b95ed166.png)

# 2. 対応方法

IBM Cloud docsにて、App IDのAPIを参照すると、[こちら](https://us-south.appid.cloud.ibm.com/swagger-ui/#/)のページに転送される。どうやらSwaggerでAPIを呼び出す方式のようだ。アップロードには、`/management/v4/{tenantId}/config/ui/media`を使えば良い。
https://us-south.appid.cloud.ibm.com/swagger-ui/#/Management%20API%20-%20Config/mgmt.postMedia
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/62127/2c045ab0-255e-b6ea-9c82-76e69f1e54cf.png)


IBM CloudのAPIサイトなので、まぁそれを使えばいいのだが、ささっとCLIでやってしまいたいので以下のようにしてアップロードしてみた。


## 2-1. Service Credentialの作成
APIを利用するためには、tenant IDを指定する必要があるため、まず最初にService Credentialを作成する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/62127/b998c9f5-677d-1a7c-7052-45cba8441de8.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/62127/cb8b64f0-5a88-dd2b-2f9a-1a3c6e9c03ff.png)

## 2-2. APIの実行

上記のService Credentialの情報から得られたAPIKEYやtenantIDやURL情報を使って、以下のようにアップロードする。
IAM tokenの取得については[こちら](https://qiita.com/testnin2/items/3a4ca8a1a2b79b713c48)を参考。

```
syasuda@MacBook Downloads % APIKEY=xxxxxx
syasuda@MacBook Downloads % tenantId=xxxxx
syasuda@MacBook Downloads % uploadfile=ninja-logo.png

syasuda@MacBook Downloads % iam_token=`curl -sX POST \
   -H "Content-Type: application/x-www-form-urlencoded" \
   -d "grant_type=urn:ibm:params:oauth:grant-type:apikey&apikey=${APIKEY}" \
   https://iam.cloud.ibm.com/identity/token | jq -r '.access_token' `

syasuda@MacBook Downloads % curl -X POST \
  https://jp-tok.appid.cloud.ibm.com/management/v4/${tenantId}/config/ui/'media?mediaType=logo' \
  -H 'accept: application/json' \
  -H "Authorization: Bearer ${iam_token}" \
  -H 'Content-Type: multipart/form-data' \
  -F "file=@${uploadfile};type=image/png"
```
# 3. 結果の確認

無事変更された。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/62127/4a4c980d-7b7b-1b6b-9a85-a915ca721913.png)
.NET MAUIのXAML忘備録その１ 

### デバイス種類ごとに違う値（サイズ等）を指定するにはOnIdiom

#### 単行
```xml
<Frame 
    RowHeight="{OnIdiom,Desktop=100,Phone=70,Tablet=80,Default=90}"
/>
```


#### MarginやPaddingなどは','(カンマ)が邪魔するので👇のように
```xml
<Frame>
    <Frame.Margin>
        <OnIdiom x:TypeArguments="Thickness" 
                         Default="15,0,0,0"
                         Tablet="0,15,0,3"
                         Desktop="0"
                         Phone="15,0,0,5">
        </OnIdiom>
    </Frame.Margin>
</Frame>        
```



### OS/プラットフォームごとならOnPlatform
#
#### 単行
```xml
<Frame 
    WidthRequest="{OnPlatform Android=350,iOS=400,Default=600}"
/>
```


#### MarginとPadding等👇
```xml
<Frame>
    <Frame.Margin>
        <OnPlatform x:TypeArguments="Thickness">
            <On Platform="iOS" Value="0" />
            <On Platform="Android" Value="15,0,25,0" />
            <On Platform="WinUI" Value="55,0,0,10" />
            <On Platform="Default" Value="15,0,0,10" />
        </OnPlatform>
    </Frame.Margin>
</Frame>
        
```
:::note info
MicrosoftのドキュメントでMAUI向けを見つけられませんでした。
Windows向けをどう記述すべきかわかるかた教えてほしいです。
👇はxamarinのドキュメントでOn Platform="UWP"としていますがMAUではうまく動作しないようです（？）
~~わかりましたら追記します。~~
:::
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/essential-xaml-syntax#platform-differences-with-onplatform

追記
コメントいただきました。
WinUIとするそうです（~~私は検証できていません~~検証しました）。

* * *
追追記
### 合わせ技
### OnPlatformとOnIdiom を入れ子する（Android且つスマホ・タブレット等分ける）

#
#### 単行
```xml
<Frame 
    WidthRequest="{OnIdiom Phone={OnPlatform iOS=400, Android=375},Tablet=650, Default=650}"   
/>
```
#### MarginとPadding等👇
```xml
<Frame>
    <Frame.Margin>
        <OnPlatform x:TypeArguments="Thickness">
            <On Platform="iOS" Value="0,0,0,95" />
            <On Platform="Android" >
                <OnIdiom x:TypeArguments="Thickness" 
                     Tablet="20,0,20,22"
                     Phone="0,0,0,22">
                </OnIdiom>
            </On>
            <On Platform="WinUI" Value="0,0,0,50" />
            <On Platform="Default" Value="0" />
        </OnPlatform>
    </Frame.Margin>
</Frame>
```