OmniAICreator/Qiita-1.07M huggingface dataset:
開発環境とデプロイ環境の違いから学んだことについてメモ

# はじめに
　独学でプログラミングを勉強して、デプロイまで成功はしましたが開発環境では正常に動いていたアプリケーションが、本番環境でエラーを起こして動かないということがありました。
　エラーの原因を調べる中で、解決策としてDockerやGitHub Actionsがあることを知りました。これらのツールは、開発環境と本番環境の違いの問題を解決するために有効だと考え、学習を始めました。
 　もし内容に誤りや改善点があれば、ご指摘いただけると幸いです。:pray:

 # Docker
　Dockerでは、コンテナという仕組みを使って、開発環境を本番環境と同じ状態に保つことができると知り、具体的な使い方を学んでいます。例えば、Dockerfileを作成して、アプリケーションの依存関係や設定を一括管理する方法を学び始めました。

 # Github Actions
　GitHub Actionsは、テストの自動化やデプロイ作業の効率化を目指して学習中です。特に、コードをプッシュした際に自動でテストを実行し、結果を確認できる仕組みや、本番環境へのデプロイをシンプルな設定で実現できることを知りました。公式ドキュメントやChat GPTを参考に、シンプルなワークフローの書き方を学び始めたところです。

 # 最後に
 　まだ実際のプロジェクトにはこれらを導入できていない状況で、自分が正確に学習しているか不安もあります。記事やChat GPTを使いながら少しずつ進んでいます。勉強するとこがまだまだ多いですが、次回のデプロイではこれらのツールを活用し、開発環境と本番環境の差によるエラーをなくしていきたいと考えています。:cry::cry::cry:
【PHP】配列操作とSQLの処理の違いを検証してみた

自分が現場で学んだ事の一つに
**データを一括取得した後に関数などでソートするより、取得の段階でSQLにて条件で絞った方がいい**
という事があります。

まあ、普通に考えて100万件データを取得してソートして結果10万になるのと、SQLの段階で絞って10万件取得するのとでは後者の方が「処理速度」や「メモリの消費」の観点で効率がいいのはなんとなくわかりますよね。

でも、実際に比較したわけではないので、試しに検証してみましょう！という事で検証してみたいと思います。興味がある人は自分で実施してみてはいかがでしょうか。

## 実行環境

- macOS (Sequoia 15.1.1)
- PHP 8.3.12
- MySQL 9.0.1

## ①検証用データを格納するテーブルの作成

とりあえずカラム数が少ないと検証として難しいので、一旦６つほどカラムを持ったテーブルを作成します。

```sql
CREATE TABLE test (
    id INT AUTO_INCREMENT PRIMARY KEY,
    value INT NOT NULL,
    name VARCHAR(255) NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
    status ENUM('active', 'inactive') DEFAULT 'active'
);
```

## ②適当なテストデータを挿入

10万件ほどテストデータを挿入してみます。

```sql
SET @n := 0;

INSERT INTO test (value, name, status) 
SELECT FLOOR(RAND() * 1000), CONCAT('Name', @n := @n + 1), IF(@n % 2 = 0, 'active', 'inactive')
FROM (SELECT 1 FROM information_schema.tables LIMIT 100000) AS numbers;
```

## ③検証用のPHPファイルを２つ作成  

今回の条件は以下のようにします。
◯valueが500以上のものを取得する。

これを元に、
(1)配列関数を使用して取得
(2)SQLで最初から絞り込んで取得
のパターンに分けてソースコードを作成します。

※今回はmysqliを使用します。DB情報は自身のローカルの情報に合わせてください。

(1)配列関数を使用して取得
test1.php
```php
<?php
$start_time = microtime(true);

// データベース接続
$conn = new mysqli("localhost", "root", "password", "db_name");
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

// 全データを取得
$result = $conn->query("SELECT * FROM test");

// 配列にデータを格納
$data = [];
while ($row = $result->fetch_assoc()) {
    $data[] = $row;
}

// 配列関数で条件を絞り込み
$data = array_filter($data, function($row) {
    return $row['value'] > 500;
});

// 絞り込んだ結果をインデックス付き配列に戻す
$data = array_values($data);

$conn->close();

// 処理時間の計測
$end_time = microtime(true);
echo "配列関数を使用して取得";
echo "取得件数： ".count($data)."件\n";
echo "PHPで条件を絞る場合の処理時間: " . ($end_time - $start_time) . "秒\n";
echo "メモリ使用量: " . memory_get_peak_usage(true) . "バイト\n";
?>
```

(2)SQLで最初から絞り込んで取得
test2.php
```php
<?php
$start_time = microtime(true);

// データベース接続
$conn = new mysqli("localhost", "root", "password", "db_name");
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

// SQLで条件を絞る
$result = $conn->query("SELECT * FROM test WHERE value > 500");

// データを配列に格納
$data = [];
while ($row = $result->fetch_assoc()) {
    $data[] = $row;
}
$conn->close();

// 処理時間の計測
$end_time = microtime(true);
echo "取得件数： ".count($data)."件\n";
echo "SQLで条件を絞る場合の処理時間: " . ($end_time - $start_time) . "秒\n";
echo "メモリ使用量: " . memory_get_peak_usage(true) . "バイト\n";
?>
```

## ④実際に実行
test1.phpとtest2.phpを保存したパスに移動して、各スクリプトを実行します。
※自分はDesktopに保存しました。

![スクリーンショット 2024-12-27 14.57.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3762407/b3124bab-21ba-b65c-8b63-adb124ead405.png)


## 実行結果

(1)配列関数を使用して取得
処理時間：**0.2064**秒
メモリ使用量：**82.32**MB
(2)SQLで最初から絞り込んで取得
処理時間：**0.1138**秒
メモリ使用量：**39.85**MB

結論：**SQLの方が処理時間・メモリ使用量ともに約２倍ほどの効率が良い**

※データ数や構造、使用する関数によって多少前後するので、ご理解ください。
circuitjsの作法 その37

# 概要
circuitjsを調査してみた。
練習問題やってみた。

# 練習問題
リレーで、JKTフリップフロップ回路を作れ。

# 写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/0c3a8768-e7a0-e19f-417d-0df85f7f1714.png)


# ネットリスト

```
$ 1 0.000005 10.20027730826997 50 5 50 5e-11
178 448 336 448 432 6 1 0.2 0.24999999999997224 0.05 1000000 0.02 20 0.015 0.005 1
178 560 336 560 432 6 1 0.2 0 0.05 1000000 0.02 20 0.015 0.005 0
178 672 336 672 432 6 2 0.2 0.000004999899877005178 0.05 1000000 0.02 20 0.015 0.005 0
178 848 336 848 432 6 2 0.2 0.24906600249838656 0.05 1000000 0.02 20 0.015 0.005 1
R 304 96 240 96 0 0 40 5 0 0 0.5
g 416 432 416 448 0 0
g 528 432 528 448 0 0
g 640 432 640 448 0 0
g 816 432 816 448 0 0
w 304 96 320 96 0
w 320 96 320 160 0
w 320 160 352 160 0
w 320 160 320 192 0
w 320 192 352 192 0
w 432 192 432 240 0
w 432 240 416 240 0
w 416 240 416 336 0
w 528 336 528 160 0
w 432 160 528 160 0
w 448 336 448 96 0
w 320 96 448 96 0
w 560 336 560 96 0
w 448 96 560 96 0
w 672 336 672 304 0
w 640 272 640 336 0
w 816 304 816 336 0
w 848 272 848 336 0
s 352 160 432 160 0 1 false
s 352 192 432 192 0 0 false
178 176 336 176 432 6 4 0.2 0 0.05 1000000 0.02 20 0.015 0.005 0
g 144 432 144 448 0 0
w 288 192 320 192 0
w 224 192 208 192 0
x 253 155 268 158 4 24 T
x 358 133 368 136 4 24 J
x 360 226 375 229 4 24 K
w 1280 96 1280 128 0
w 1072 96 1072 128 0
w 1280 176 1280 336 0
w 1072 176 1072 336 0
162 1280 128 1280 176 2 default-led 1 0 0 0.01
162 1072 128 1072 176 2 default-led 1 0 0 0.01
g 1264 432 1264 448 0 0
g 1056 432 1056 448 0 0
w 1232 272 1232 336 0
w 1200 304 1200 336 0
w 992 272 992 336 0
w 1024 336 1024 304 0
g 1200 432 1200 448 0 0
g 992 432 992 448 0 0
178 1232 336 1232 432 6 3 0.2 0.000003333288889481658 0.05 1000000 0.02 20 0.015 0.005 0
178 1024 336 1024 432 6 3 0.2 0.24875621893638472 0.05 1000000 0.02 20 0.015 0.005 1
w 144 336 144 192 0
w 144 192 208 192 0
w 320 336 320 304 0
w 176 304 176 336 0
w 320 304 320 192 0
w 224 336 224 304 0
w 272 336 272 304 0
w 176 304 224 304 0
w 224 304 272 304 0
w 272 304 320 304 0
w 672 304 672 96 0
w 848 272 848 96 0
w 1024 304 1024 96 0
w 1232 272 1232 96 0
w 560 96 672 96 0
w 672 96 848 96 0
w 848 96 1024 96 0
w 1024 96 1072 96 0
w 1072 96 1232 96 0
w 1232 96 1280 96 0
w 720 336 720 304 0
w 896 272 896 336 0
w 1120 304 1120 336 0
w 1328 272 1328 336 0
w 640 272 896 272 0
w 720 304 816 304 0
w 992 272 1328 272 0
w 1120 304 1200 304 0
w 912 432 912 480 0
w 192 432 192 480 0
w 464 432 464 480 0
w 192 480 464 480 0
w 464 480 912 480 0
w 1248 432 1248 480 0
w 912 480 1248 480 0
w 576 432 576 512 0
w 240 432 240 512 0
w 240 512 576 512 0
w 1040 432 1040 512 0
w 736 432 736 512 0
w 576 512 736 512 0
w 736 512 1040 512 0
w 256 432 256 544 0
w 688 432 688 544 0
w 256 544 688 544 0
w 304 432 304 576 0
w 864 432 864 576 0
w 304 576 864 576 0
s 224 192 288 192 0 1 false
w 1344 432 1344 544 0
w 688 544 1344 544 0
w 1136 432 1136 560 0
w 1136 560 1136 576 0
w 864 576 1136 576 0

```

以上。
述語メソッド

# 大体は真偽で返す、しかし真の場合は真ではなく値で返すこともある
>述語メソッド
predicate method

>`返り値を真偽値として用いるためのメソッド`。`メソッド名の末尾に ? を付ける`習慣がある。

>true/false を返すとは限らず、真である場合に、`true 以外のオブジェクトを返すことで、単なる真偽を越えた情報を与えるものも`ある。

https://docs.ruby-lang.org/ja/latest/doc/glossary.html#:~:text=%E8%BF%B0%E8%AA%9E%E3%83%A1%E3%82%BD%E3%83%83%E3%83%89,%E3%82%82%E3%81%AE%E3%82%82%E3%81%82%E3%82%8B%E3%80%82

### ?のついたメソッド
```rb
irb(main):001> array = [2, 32, 43]
=> [2, 32, 43]
irb(main):002> array.nil?
=> false
irb(main):003> array.empty?
=> false
```
Module: RSpec::Core::Formatters

# 出力形式と出力先を指定できるモジュール
概要
>### Overview
内蔵された`Formatters`
>### Built-in Formatters
`progress`（初期値）ー　合格したexampleにはドット、失敗したexampleにはF、保留中のexampleには`*`を出力する
>* progress (default) - Prints dots for passing examples, F for failures, * for pending.

`documentation` `descirbe`と`it`メソッド(およびそれらのエイリアス)に渡されたドックストリングを表示する
に渡し、
>* documentation - Prints the docstrings passed to describe and it methods (and their aliases).

>* html

json -　その後の分析のためにデータを保管するのに便利だ
>* json - Useful for archiving data for subsequent analysis.

`progress formatter`は初期値だ、しかし`--format コマンドラインオプション`などを渡すことによって一つ以上の他の`formatter`選ぶことができる
>The progress formatter is the default, but you can choose any one or more of the other formatters by passing with the --format (or -f for short) command-line option, e.g.
>```
>rspec --format documentation
>```

>```
>rspec --format documentation --format html --out results.html
>```

このexampleはドキュメントの出力を`$stdout`へそしてhtmlフォーマッターの出力をresults.htmlへ送る。
>This example sends the output of the documentation formatter to $stdout, and the output of the html formatter to results.html.

https://rspec.info/documentation/2.99/rspec-core/frames.html#!http%3A//rspec.info/documentation/2.99/rspec-core/RSpec/Core/Formatters/ProgressFormatter.html
axiosのモックについて


## はじめに

axios を用いた API 利用をしているコードに対してモックを入れてテストする方法について学習したので自分用に簡単な使い方をまとめます。

## 概要

API をモックする際の方針として

- API アクセスを関数化した上でその戻り値をモック化する
- HTTPS アクセスの関数をモック化する

の 2 通りありますが、今回は後者の方法を実施します。

具体的には`axios`で実行する Get メソッドや Post メソッドの戻り値をモックします。

## 結論

```ts
jest.mock("axios", () => ({
  get: jest.fn(() => Promise.resolve({ data: mockData })),
}));
```

テストの最初に上記のコードを追加すると Get メソッドの戻り値を`mockData`で置き換えることが可能です。`mockDat`に Get メソッドで取得するデータを設定してください。

またモックの対象範囲ですが Get メソッドの戻り値までがモックされ、それ以降の処理は実際のコードが実行されます。

```ts
// 説明用のテストメソッド
const testFunc = () => {
  axios
    .get("test") // この戻り値がモックされる
    .then((res) => {
      // then句はモックされずに実際のコードが実行される
      console.log(res.data);
    });
};
```

:::note warn
モックからは毎回同じデータが返却されます。
１回のテストの中で複数回同じ API にアクセスしてそれぞれ戻り値が変化するようなケースをテストする場合には別の方法が必要です。
:::

## おわりに

Jest で axios のメソッドをモックする基本をまとめました。実際のテストではもっと複雑なモックも必要になると思うのでそちらもしっかり理解ができたらまとめたいです。
[体験レポート] AWS Jam を受けてきました！！

2024年12月に AWS 主催の AWS Jam に参加しました。ご興味を持っている方のために体験レポートを記述します。

注：AWS Jam の体験や感想のアウトプットは問題ありませんが、具体的な内容についての言及は NG となっていますので、詳細については差し控えさせていただきます。

# AWS Jam とは

https://aws.amazon.com/jp/training/digital/aws-jam/


> AWS Jam では、個人やチームが AWS クラウドのスキルを応用し、AWS サービスを利用して現実世界のオープンエンドの問題を解決することが求められます。ゲーム型学習環境で作業します。これは、AWS マネジメントコンソールサンドボックスでシミュレートされたユースケースを通じて AWS クラウドのスキルを習得するのに役立ちます。技術ドメインや職種、および難易度別に課題を選択します。必要に応じて、課題の解決に役立つヒントが用意されています。

↑公式HPより引用

簡単に言えば、AWSエンジニアが一同に集まり、チームを編成します。
それぞれのチームが与えられた課題やヒントをもとにサンドボックス環境で課題を解決していき、スコアを稼いでいくといったものです。
ゲーム感覚で学習をしていくことができるんですね。

# 課題に挑戦してみて
様々な課題に挑戦しましたが、その中にはヒント無しでは解決が難しいものや、全員で知恵を絞らないと突破できないものもあり、なかなか歯応えのある内容でした。

**モブプログラミング形式で進めるルールがあり、一人がドライバーとして画面を操作し、他のメンバーがナビゲーターとして助言する形で進行します。**
さらに、Google や生成AIでの検索はドライバーのみが可能です。
こうすることで、答えやメソッドへのたどり着くための方法を模索し、ナビゲーターが伝授することもできます。
普段一人で作業していると気づけない視点を得られるという点で非常に新鮮でした。

特に難易度Medium以上の課題では、AWSサービスの細かな挙動を理解していないと対応できない部分もあり、改めてドキュメントの重要性を感じましたね。

# 結果発表
私たちのチームは全体で3位という結果でした！（確か8チーム中？）
何か景品がもらえるわけではありませんが、リアルタイムでスコア競争画面が確認できますので、どこからか課題を解決するモチベーションが湧き上がってきますw

# AWS Jam を終えて

AWS Jamは、技術的なスキルだけでなく、チームでのコミュニケーション能力や問題解決能力も試される素晴らしいイベントでした。自社の関わりを持ったことがないエンジニアと交流しながら取り組むことで、新たな視点やアプローチに気付かされる場面も多々ありました。

また、課題の難易度も適切で、初心者から中級者まで楽しめる内容だったと思います。AWSマネジメントコンソールを操作しながら学べるため、理論だけでなく実践的な知識を得られる点が特に良かったです。
また、このような機会あれば参加させていただきたいですね。

# P.S.
このレポートが皆さんのご参考になれば幸いです🐰👍
[Flutter] Error (Xcode): Provisioning profile "iOS Team Provisioning Profileの解決方法

# エラー

Flutterアプリを実機iPhoneでビルドしようとした際に以下のエラーが発生

```
❯ flutter run -d {デバイスID}
Launching lib/main.dart on  MyiPhone in debug mode...
Automatically signing iOS for device deployment using specified development team in Xcode project: HOGE
Running pod install...                                             26.5s
Running Xcode build...                                                  
Xcode build done.                                           17.1s
Failed to build iOS app
Could not build the precompiled application for the device.
Error (Xcode): Provisioning profile "iOS Team Provisioning Profile: com.hoge" doesn't include the currently selected device "MyiPhone" (identifier {デバイスID}).
/path/to/Runner.xcodeproj



It appears that there was a problem signing your application prior to installation on the device.

Verify that the Bundle Identifier in your project is your signing id in Xcode
  open ios/Runner.xcworkspace

Also try selecting 'Product > Build' to fix the problem.

Error launching application on MyiPhone.
```

# 解決方法

https://developer.apple.com/account/resources/devices/ にて、接続している実機を登録することで解決しました

![スクリーンショット 2025-01-11 18.17.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3900714/8026a548-d998-1e27-cb70-8ca1405507ed.png)

## 備考：寝たら直った

上記の通り、行ったこととしてはデバイスの登録のみですが、デバイスの登録直後は引き続きエラーが発生していました。

夜に作業していたこともありその日は諦めて、翌日の朝に再度ビルドしてみたところエラーが発生せずにビルドできました。

（デバイス登録が完了〜反映までに時差があるのかな？）

「寝たら直る」は本当でした。皆さんも潔く諦めて祈って寝るのです。
Git Tips

# プッシュ後のコミットログ変更

## N個前のコミットメッセージを変更
1. 以下を実行し、変更したいメッセージのpickをeditに変更し保存
    ```bash
    $ git rebase -i HEAD^N
    ```
1. 以下を実行し、メッセージを修正し保存
    ```bash
    $ git commit --amend
    ```
1. 以下を実行し、メッセージ修正を確定
    ```bash
    $ git commit --continue
    ```
※以下手順2,3をpick→editに変更した回数繰り返す

## リモートリポジトリへの反映
```bash
git push origin main --force-with-lease
```

# チェックアウトしているコミットのID確認
```bash
$ git show -s --format=%H
or
% git log -n 1 --format=%H
```

# オプション
## git clone --depth=1
最新のコミットだけクローン。履歴がたくさんあり、手元に落としてきたくないときに有効。


# 参考
* [Git で現在チェックアウトしているコミットのID](https://blog.eiel.info/blog/2014/09/04/git-revision/)
Reactの機能をざっくりまとめてみる



Reactは効率的なUIの構築に特化したライブラリです。
以下にReactの主要な機能や概念を簡単にまとめました。


## JSX記法
JavaScriptでHTMLライクにUIを記述できる構文。
- {}でJavaScriptの値を埋め込める
- 親タグで要素を囲む必要がある
  ```javascript
  const name = "Kiko";
  const element = (
  <div>
    <h1>こんにちは、{name}さん！</h1>
  </div>
  );


## コンポーネントの使い方
Reactではコンポーネントを使ってUIを部品化し再利用可能にする
- コンポーネントは関数（もしくはクラス）として定義する
- 必要に応じて呼び出すだけで使える
- Propsで親からデータを渡して動的に表示を変える
- 先に子を定義し、あとで親と組み合わせるのが基本的なルール

  ```javascript
    // コンポーネントの定義
    function Greeting(props) {
      return <h1>こんにちは、{props.name}さん！</h1>;
    }
    
    // コンポーネントの使用
    function App() {
      return (
        <div>
          <Greeting name="Kiko" />
          <Greeting name="Taro" />
        </div>
      );
    }

## Propsとは
- 親コンポーネントから子コンポーネントへデータを渡す仕組み
- コンポーネント間で値を受け渡してUIを動的に変化させる時に使う
- 読み取り専用

  ```javascript
    // 子コンポーネント: データを受け取る
    function Greeting(props) {
      return <h1>こんにちは、{props.name}さん！</h1>;
    }
    
    // 親コンポーネント: データを渡す
    function App() {
      return (
        <div>
          <Greeting name="Kiko" /> {/* name="Kiko" を渡す */}
          <Greeting name="Taro" /> {/* name="Taro" を渡す */}
        </div>
      );
    }

## stateとは
- コンポーネント内で管理する動的なデータ（状態）
    - useStateで状態を定義
- 状態が変わると自動的にUIが更新される

  ```javascript
    import React, { useState } from 'react';
    
    function Counter() {
      const [count, setCount] = useState(0); // 数字を管理する「箱」を作る
    
      return (
        <div>
          <p>{count}</p> {/* 箱の中身を表示 */}
          <button onClick={() => setCount(count + 1)}>増やす</button> {/* 箱の中身を増やす */}
        </div>
      );
    }

### useState
初期値は0。最初の数字をここで決める。

### count
「今の数字」を覚えておく場所。

### setCount
数字を更新するための関数。

## 再レンダリングとは
StateやPropsの変化でReactが自動的に画面を描き直すこと
### useEffect
再レンダリング後に動く処理のこと
```javascript
    import React, { useState, useEffect } from 'react';
    
    function Counter() {
      const [count, setCount] = useState(0);
    
      useEffect(() => {
        console.log('再レンダリングされました');
      });
    
      return <button onClick={() => setCount(count + 1)}>+1</button>;
    }
やはり、初めてのトライでは手こずりました。(ダイナミックimport)

# はじめに
どんなトライでもそうですが、最初からうまく行った試しがありません。今回も、ダイナミックimportを試してみましたが、うまく動作しませんでした。
何度テストとしても駄目でした。
あきらめかけましたが、もう少しやってみようと続けました。
すこしづつ、動き始めました。これは、何んとかなるかなと思うところまできました。
そして、ネットで取得したサンプルですが、やっと動作しました。
今回は、この顛末記です。
# ネットで取得したサンプルです。
以下のサイトのサンプルをベースにしています。
[Dynamic imports(ダイナミックインポート)](https://ja.javascript.info/modules-dynamic-imports)
``` sub.js
/******************************************************
*ダイナミックexportテスト
*  
*******************************************************/
export function hi() {
  alert(`Hello`);
}
//これはエラーになる。
function aaa(){
    alert("aaa関数");
}

export function bye() {
  alert(`Bye`);
}
export default function() {
  alert("Module loaded (export default)!");
}

```

``` stampTube.js
//一部抜粋
/***********************************************************
*ダイナミックimportのテスト
*このstampTube.jsと同じフォルダー内のsub.jsをimportしているサンプル。
*モジュールパスは、./sub.js
*exportされている関数しか、importしないので、say.aaa()はエラーになる。
*
*  
************************************************************/
 async function saysay() {
    let say = await import('./sub.js');     //ダイナミックimportの形式
                           //ここで、exportしている関数をロード?? 
    say.hi(); // Hello!
    say.bye(); // Bye!
    say.default(); // Module loaded (export default)!
    say.aaa();
  }
/************************************************************
* 
*************************************************************/
saysay().then(()=>{alert("完了");});

```
一見、わかりやすいサンプルですが、はじめは動作しませんでした。importのモジュールパスを間違えていたとか、サンプルでは、ボタンでload()関数を呼び出していましたが、テストした環境では、モジュールのstampTube.jsでダイナミックimport()をしていました。そこでは、load()関数だけを追加して、load()関数を呼び出すボタンがありませんでした。
そこで、saysay()という関数にして、then()メソッドで、完了のalert()文を表示するようにしました。こうすることで、サンプルベースのダイナミックimport()が成功しました。

# 教訓
教訓と呼べるような高尚なことはなにもありませんが、過去の教訓を忘れていることもよくありません。同じ轍を踏まずとも言いますが、これは失敗を繰り返すという故事の様です。しかし、まったく新しいことに挑戦する場合は、過去の経験、教訓もないので、仕方がないかもしれません。ただ、その挑戦する勇気は、褒めてあげてもいいかもしれません。安全を求めて、いつも同じ方法を使っていては、進歩がありません。また、時代に乗り遅れてしまいます。そこで、今回は、これからはESモジュール化の時代といわれてますので、取り組んでみました。

# あとがき
いくら慎重に考えても、初めてのトライは失敗します。まるで宇宙ロケットの打ち上げの様です。いつも覚悟はしていますが、やはり、そうなるかとがっかりします。
プログラミングの開発でもこの繰り返しです。
何回テストしたら、成功するのか。失敗から学ぶとはこのことですね。失敗しても学べないこともありますが。
paizaラーニングレベルアップ問題集の「3つのデータの入力」をやってみた。

paizaラーニングレベルアップ問題集の[3つのデータの入力](https://paiza.jp/works/mondai/stdin/stdin_3)をやってみました。
- - -
###### 問題
https://paiza.jp/works/mondai/stdin/stdin_3
- - -
###### 方針
言語により異なります。
- [1つのデータの入力](https://qiita.com/anonymously115/items/50ed25f7748f1cb1b426)を3回繰り返す
- 難しい場合は、1行受け取って半角空白で区切る
- - -
###### C
```c
#include <stdio.h>

int main() {
	for (int i = 0; i < 3; i++) {
		char s[101];
		scanf("%s", s);
		printf("%s\n", s);
	}
	return 0;
}
```
- - -
###### C++
```cpp
#include <iostream>
using namespace std;

int main() {
	for (int i = 0; i < 3; i++) {
		string s;
		cin >> s;
		cout << s << endl;
	}
	return 0;
}
```
- - -
###### C#
```cs
using System;

class Program
{
	public static void Main()
	{
		foreach (string s in Console.ReadLine().Split()) Console.WriteLine(s);
	}
}
```
- - -
###### Go
```go
package main
import "fmt"

func main() {
	for i := 0; i < 3; i++ {
		var s string
		fmt.Scan(&s)
		fmt.Println(s)
	}
}
```
- - -
###### Java
```java
import java.util.*;

public class Main {
	public static void main(String[] args) {
		Scanner sc = new Scanner(System.in);
		for (int i = 0; i < 3; i++)
			System.out.println(sc.next());
		sc.close();
	}
}
```
- - -
###### JavaScript
```js
require("fs").readFileSync("/dev/stdin", "utf8").trim().split(' ').forEach(function (s) { console.log(s) });
```
- - -
###### Kotlin
```kotlin
import java.util.*

fun main() {
	val sc = Scanner(System.`in`)
	for (i in 0 until 3)
		println(sc.next())
	sc.close()
}
```
- - -
###### PHP
```php
<?php
	foreach (explode(" ", trim(fgets(STDIN))) as $s)
		echo "$s\n";
?>
```
- - -
###### Perl
```pl
chomp(my $S = <STDIN>);
foreach my $s (split(" ", $S)) {
	print "$s\n";
}
```
- - -
###### Python3
```py
for s in input().split():
	print(s)
```
- - -
###### Ruby
```rb
gets.split.each do |s|
	puts s
end
```
- - -
###### Scala
```scala
import scala.io.StdIn._

object Main extends App{
	readLine().split(" ").foreach(println)
}
```
- - -
###### Swift
```swift
for s in readLine()!.split(separator: " ") {
	print(s)
}
```
STM32H743、フィボナッチ数列で遊ぶ(UNO3比240倍程度)(ベンチマークテスト)(理系フリマで買う)



参考


https://ichiken-engineering.com/arduino-uno-r4-minima_keisan/


https://qiita.com/caa45040/items/820293c0ec02c9502ea8


https://qiita.com/caa45040/items/59fde4177afce46ab844


https://qiita.com/caa45040/items/a0521ec72a0d4e57a78f


https://qiita.com/caa45040/items/a548dad6999d678ebeca


x 引用しました。
x 過去ログを見よ!!!



目的
整数のベンチマークする

いろいろ
Arduino UNO R3は、約17542msで
H743は、約72msで約240倍、速い
理由は、不明

Arduino UNO 3 約17542ms(18秒)
M5NanoC6 約336ms(0.3秒)
M5StampS3 約328ms(0.3秒)
STM32H743 約72ms(0.072秒)



結果

![Screenshot from 2025-01-12 07-05-12_original.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/df344982-ae69-6a36-2657-7c62a5ea84ea.jpeg)

![image_original (28).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/a177b93a-1e8c-6ba0-7a45-e0616bfc4a19.jpeg)


プログラム



```c++


//値が100,000を超えるまでのフィボナッチ数列を生成する作業を500,000回繰り返すのに要した時間を計測する。
#define DEBUG 0
void setup() {
  Serial.begin(9600);
  Serial.println();
  Serial.print("START");
  for(int i = 0;i < 9;i++){
    Serial.print('.');
    delay(500);
  }
  Serial.println();
}
void loop() {
  unsigned long x;
  unsigned long prevx;
  unsigned long temp;
  unsigned long start_time, end_time;
  unsigned long time;
  start_time = millis();
  for (unsigned long a = 0; a < 500000; a++) {
    x = 1;
    prevx = 0;
    while (x < 100000) {
      temp = x;
      x = prevx + x;
      prevx = temp;
#if DEBUG
      Serial.println(x);
#endif
    }
  }
  end_time = millis();
  time = end_time - start_time;
  Serial.print("END Value:");
  Serial.println(x); //最後の値の出力
  Serial.print("StartTime:");
  Serial.print(start_time);
  Serial.print(" EndTime:");
  Serial.print(end_time);
  Serial.print(" Time:");
  Serial.println(time);
  delay(1000);  //1秒待機
}


```
API開発を加速！無料で試せるAPIが集まるサイトを活用しよう

# はじめに

エンジニアのみなさま、日々の学習お疲れ様です。
また本記事まで足を運んでいただき本当に感謝です。

今回は無料のパブリックAPIを集めているサイトのご紹介をします。
APIを実装したいが探すのが面倒と思っている方、必見です！


# Sport APIs

https://www.freepublicapis.com/tags/sport

サイトの中身はこんな感じ。現在は361個の無料APIが存在します。

![www.freepublicapis.com_.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3744730/76044fd1-d6ab-c234-0dd4-509d29c74dea.png)

このサイトの特徴としては、各APIエンドポイントが24時間に1回自動テストされ、正常に機能しているかどうかがチェックされるとの事です。そのため、削除されたり有料コンテンツに移動されたりして機能しなくなったAPIを見つけると、そのAPIのランキングは下がり、最終的にはサイトから削除されます。

APIのパフォーマンスは **『APIヘルス』** なるもので指標化されており、数値が100に近いほどパフォーマンスの高いAPIとの事です。以下、3つの組み合わせみたいですね。

**1. 信頼性（エンドポイントは確実に同じJSON構造を返しているか？）**
**2. エラー率（エンドポイントはエラーを返しているか？）**
**3. 応答時間（エンドポイントの速度は速いか？）**


# IPジオロケーションAPIを見てみる

![www.freepublicapis.com_ip-geolocation-api-3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3744730/7990b27e-4287-4c1e-3104-b72c047cd343.png)

APIヘルスが100%のAPIになります。
実際にAPIを利用するときはドキュメントも存在しており、IPジオロケーションAPIに関してはサンプルコードも掲載されているため、気軽に試すことができそうです。

尚、このサイトの作成者からは **『あなたの街、国、または会社の優れたAPIをご存知の場合は、ぜひここに追加してください』** とのメッセージが書かれています。
日本のAPIはまだ少ない印象ですが、今後追加されていけば面白いサイトになりそうですね！


# さいごに

いかがだったでしょうか？
『APIまとめ記事』みたいなものはたくさん出ている印象ですが、今回ご紹介した様なまとめサイトには初めて出会った感じがしたため、この様な形でご紹介させていただきました。世界各国の無料APIを眺めていただき、開発のヒントになれば幸いです...！


# おまけ

弊社のご紹介もさせてください！

### 「日本で一番エンジニアが成長できる会社を創る」

https://prum.jp/

### エンジニアリングの募集

https://www.wantedly.com/projects/1808638

### PM・Webディレクションの募集

https://www.wantedly.com/projects/1355235

### セールス・事業開発の募集

https://www.wantedly.com/projects/1792065

### コーポレート系の募集

https://www.wantedly.com/projects/1752874

### コンサルティングの募集

https://www.wantedly.com/projects/1794481

弊社メンバーは日々学習した内容をアウトプットしております！
少しでもご興味を持たれた方は求人を見てみてください！
ご応募もお待ちしております！

### 最後までご覧いただき、ありがとうございました！
Javaで「ラベルに表示される文字列のフォントを設定する」の動作を確認してみた。

# 概要

Javaで「ラベルに表示される文字列のフォントを設定する」の動作を確認してみました。
以下のページを参考にしました。

https://www.javadrive.jp/tutorial/jlabel/index3.html

# 実装

以下のファイルを作成しました。

```Sample.java
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JLabel;
import java.awt.Font;
import java.awt.BorderLayout;

class Sample extends JFrame{
  public static void main(String args[]){
    Sample frame = new Sample("MyTitle");
    frame.setVisible(true);
  }

  Sample(String title){
    setTitle(title);
    setBounds(100, 100, 728, 400);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    JLabel label1 = new JLabel("Hello!");
    label1.setFont(new Font(Font.DIALOG_INPUT, Font.BOLD, 24));

    JLabel label2 = new JLabel("Bye!");
    label2.setFont(new Font("Century", Font.ITALIC, 40));

    JPanel p = new JPanel();
    p.add(label1);
    p.add(label2);

    add(p, BorderLayout.CENTER);
  }
}
```

以下のコマンドを実行しました。

```
$ javac Sample.java 
$ java Sample
```

実行結果は以下の通りでした。フォントがもとのやつとちょっと違うかも。

![Screenshot from 2025-01-12 07-00-02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3192024/18155a1e-abe1-94b0-ce37-84d9c74999b0.png)

# まとめ

何かの役に立てばと。
CLIでAWSにS3バケットを作成・削除する

CLIでAWSにS3バケットを作成したい時に初期設定から作成までを手順としてまとめたものです。

# 実行環境

macOS Sonoma 14.6.1

# 準備

1. [Homebrew](https://brew.sh/)のインストール
2. awscliのインストールする
    ```terminal
    brew install awscli
    ```
3. AWS S3を作成するためのクレデンシャルを用意
    以下の6種類がありますが、1の短期クレデンシャルが[公式](https://docs.aws.amazon.com/cli/latest/userguide/getting-started-quickstart.html)には推奨されています
    1. IAM Identity Centerユーザーの短期クレデンシャル(推奨)
    2. IAMユーザーの短期クレデンシャル
    3. EC2インスタンス上のIAMもしくはIAM Identity Centerユーザー
    4. 権限のあるロールへの切り替え
    5. IAMユーザーの長期クレデンシャル(非推奨)
    6. 外部ストレージに保存したIAMもしくはIAM Identityユーザーのクレデンシャル(非推奨)
    
    今回は 1 の方法を使用しますので、事前に[SSOログイン](https://qiita.com/hapoon/items/ed48a99e2d6c8946756e)してください

# S3バケットを作成

```terminal
% aws s3 mb s3://sample.hapoon.com --region ap-northeast-1
make_bucket: sample.hapoon.com
```
作成先のリージョンがus-east-1以外、かつリージョンの指定がprofileもしくは環境変数にない場合は `--region` でリージョンを指定してください

# S3バケットの確認

```terminal
% aws s3 ls
2025-01-12 06:22:19 sample.hapoon.com
```

# S3バケットの削除

```terminal
% aws s3 rb s3://sample.hapoon.com --region ap-northeast-1
remove_bucket: sample.hapoon.com
```
stliteを使って社内向けデータ分析アプリを配布する際の検証

## はじめに
社内向けのデータ分析アプリを配布する方法として、stliteを検証しました。stliteはStreamlitアプリをブラウザで動作させることができるツールです。

## stliteのメリット
- Streamlitの書き方でそのままWebアプリが作れる
- Python環境のインストールが不要
- 静的ファイルとして配布可能

## サンプルコード
### stliteバージョン
```python
import streamlit as st
import pandas as pd

st.title("データ分析アプリ")

uploaded_file = st.file_uploader("CSVファイルを選択", type=['csv'])

if uploaded_file is not None:
    try:
        df = pd.read_csv(uploaded_file)
        st.write("データプレビュー")
        st.dataframe(df.head())
        
        numeric_cols = df.select_dtypes(include=['float64', 'int64']).columns
        if len(numeric_cols) > 0:
            selected_col = st.selectbox("分析する列を選択:", numeric_cols)
            if not df[selected_col].empty:
                st.line_chart(df[selected_col])
    except Exception as e:
        st.error(f"エラーが発生しました: {str(e)}")
```

### HTMLファイル（stlite用）
```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>データ分析アプリ</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@stlite/mountable@0.39.0/build/stlite.css">
</head>
<body>
    <div id="root"></div>
    <script src="https://cdn.jsdelivr.net/npm/@stlite/mountable@0.39.0/build/stlite.js"></script>
    <script>
        // Pythonコードを文字列として埋め込み
        const pythonCode = `...` // 上記のPythonコード

        stlite.mount({
            requirements: ['streamlit', 'pandas'],
            entrypoint: "app.py",
            files: {
                "app.py": pythonCode
            }
        }, document.getElementById("root"));
    </script>
</body>
</html>
```

## 検証で見つかった課題

### 1. 起動時間の問題
実際に計測したところ、以下のような結果となりました：
- stliteバージョン: 10.03秒
- 同等機能のJavaScriptバージョン: 0.01秒

この差は以下の要因によるものです：
- stliteはブラウザ内でPython環境（Pyodide）を初期化
- 必要なPythonパッケージのロード時間
- Streamlitアプリケーションの初期化時間

### 2. ローカルファイルの扱い
- 基本的にはhtmlファイルに書き込む
- モジュール化したコードの管理が難しい
- Chromeの設定でローカルファイルの読み込みを許可すれば、読み込めなくはない
  (ただし、ユーザーの手間が増える)
      ```bash
      --allow-file-access-from-files
      ```

### 3. 代替案としてのJavaScript実装
純粋なJavaScriptで実装した場合のメリット：
- 高速な起動時間
- ローカルファイルの取り扱いが容易
- ブラウザのネイティブ機能を活用可能

## 結論
stliteは以下のような場合に適しています：
- Streamlitの知識を活かしたい場合
- 起動時間が重要でない場合
- シンプルな構成で完結する場合

一方で、以下の場合は純粋なJavaScript実装を検討すべきです：
- 高速な起動が必要な場合
- ローカルファイルを多用する場合
- 複雑なモジュール構成が必要な場合
【Snipping Tool】キャプチャした画像の比率がおかしい→モニタの表示倍率をいじったら解消した

## 概要
WindowsのSnipping Toolでスクリーンショットを撮ったら、下図の左が欲しいのに右の比率おかしいのが撮れたり、指定箇所と全然違うところがキャプチャされてしまったりしたときの対処法。結論から言うと、マルチモニタ環境のうち特定のモニタを特定の解像度に変更すると治った（あいまいでごめんなさい）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3906608/2616ae58-7524-c4d4-bc56-1297ed009617.png)

## 解消法
おま環な雰囲気がたいへん強めに出ているんだけど、以下のモニタ構成で、モニタ2の表示倍率を100%にすると解消した。同モニタの推奨倍率は300%なので、推奨に合わせれば治るとかでもない様子。これができていないと、モニタ3側でもキャプチャ倍率がおかしくなるし、設定反映以降はモニタ3側でも解消する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3906608/6c0dc72b-4855-8541-4bc9-926cf32e07ae.png)

人によってモニタ構成も違うだろうし、たぶん倍率変更が「効く」モニタも違うだろうし、現象が解消する比率も違うと思う。がんばって手探りしましょう。調べてた過程ではどっかで「すべてのモニタ表示倍率を揃えたら治った」と記載があったけど、手元の環境では全モニタを200%で揃えても解消しなかった。
【AWS SAP】パブリックVIFとは？

# 学習前
よく出てくるがわからない。そもそも何のサービス？

## パブリックVIF（Public Virtual Interface）とは？
- Direct Connectで使用する仮想インターフェースの一種
- AWSとオンプレミスのネットワークを直接接続する際に使用される
- **AWSの全リージョンへパブリックIPを介した接続**

```mermaid
graph TD
    A[オンプレミスネットワーク] -->|専用線| B[Direct Connect]
    B -->|パブリックVIF| C[AWSパブリックサービス]
    C --> D[S3]
    C --> E[DynamoDB]
    C --> F[CloudFront]
    C --> G[Route 53]
```

### プライベートVIFもある？
ある。プライベートVIFはVPCへプライベートIPを介した接続ができる。
```mermaid
graph TD
    A[オンプレミスネットワーク] -->|専用線| B[Direct Connect]
    B -->|プライベートVIF| C[VPC]
    C --> F[EC2インスタンス]
    C --> G[RDS]
```

## トランジットVIFもある
Transit Gateway用のDirect Connectゲートウェイへ接続ができる。

```mermaid
graph TD
    A[オンプレミスネットワーク] -->|専用線| B[Direct Connect]
    B -->|トランジットVIF| C[Direct Connect Gateway]
    C --> D[トランジットゲートウェイ]
    D --> E[VPC 1]
    D --> F[VPC 2]
    D --> G[VPC 3]
```

## 参考
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2746730/471b7b6c-61a4-a087-b0af-f10aecc7f2d4.png)
https://www.slideshare.net/slideshow/20210209-aws-black-belt-online-seminar-aws-direct-connect/242464398

## まとめ
パブリックVIFはDirect Connectのサービス。S3やCloudFrontなどのリージョンサービスに対してインターネットを介さずに接続ができる。
CUDA+ml-agentsの環境構築メモ

## 動機

- ml-agentsでVisualObservationを行うとき、GPUで行うと計算速度の向上が見込めそう。
- →なので、CUDAを導入することにした

## 環境

- Windows 11（GPU対応のPC）
- [ml-agents release22](https://github.com/Unity-Technologies/ml-agents/tree/release_22)
- python3.10

## 手順

### 1. CUDA Toolkitのインストール
- [こちら](https://developer.nvidia.com/cuda-toolkit-archive)からCUDA Toolkitをダウンロード。
- **バージョン**: CUDA 12.1

### 2. インストール確認
1. **環境変数の確認**
   - インストール後、以下のパスが通っていることを確認。
     `C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v12.1\bin`
2. コマンドプロンプトで`nvcc -V` と打ち込んで、以下のようなログが出れば成功
    ```bash
    Copyright (c) 2005-2023 NVIDIA Corporation
    Built on Wed_Feb__8_05:53:42_Coordinated_Universal_Time_2023
    Cuda compilation tools, release 12.1, V12.1.66
    Build cuda_12.1.r12.1/compiler.32415258_0
    ```

### 3. cuDNNのインストール
1. [こちら](https://developer.nvidia.com/rdp/cudnn-archive)からCUDA 12.1に対応したバージョン（8.9.0など）をダウンロード。
2. **下記フォルダを作成**（管理者権限が必要かも）:
   - `C:\Program Files\NVIDIA GPU Computing Toolkit\cuDNN`
3. ダウンロードしたファイルを解凍し、以下2.で作成したcuDNNフォルダ配下にコピー：
   - `bin`, `include`, `lib` フォルダと `LICENSE` ファイル。

### 4. 環境変数の登録
- システム環境変数に以下を追加：
  - **変数名**: `CUDNN_PATH`
    **値**: `C:\Program Files\NVIDIA GPU Computing Toolkit\cuDNN`
  - **Path**に以下を追加：
    `C:\Program Files\NVIDIA GPU Computing Toolkit\cuDNN\bin`

### 5. 仮想環境(venv)の作成と有効化
```bash
python -m venv venv
.\venv\Scripts\activate
```

### 6. PyTorchのインストール
- [公式サイト](https://pytorch.org/get-started/locally/)でstable → windows → Pip → Python → CUDA12.1　と選択
- おそらく下記と同じコマンドが表示されるので、コマンドプロンプトに打ち込んでインストール
```bash
pip3 install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/cu121
```

### 7. ml-agentsのインストール([参考](https://github.com/Unity-Technologies/ml-agents/blob/release_22/docs/Installation.md#advanced-local-installation-for-development-2))
以下のコマンドを実行：
   ```bash
   pip3 install -e ./ml-agents-envs
   pip3 install -e ./ml-agents
   ```

### 8. インストール確認
以下のPythonスクリプトを実行し、どちらも `True` なら成功：
```python
import torch

print(torch.cuda.is_available())  # CUDAが有効
print(torch.backends.cudnn.enabled)  # cuDNNが有効
```

---

## 強化学習実行方法

1. **学習コマンドにオプションを追加**:
   - `mlagents-learn`コマンドに`--torch-device=cuda`オプションを付与。

2. **GPU使用確認**:
   - タスクマネージャーのGPUのCuda使用率または`nvidia-smi`コマンドでGPUが正しく使用されている事を確認。
   - `nvidia-smi`でGPU情報が見れるのに、タスクマネージャーでCudaの使用率が見れない場合、以下の手順を踏むと治る。（[参考](https://stealthinu.hatenadiary.jp/entry/2022/07/30/183632)）
       - システム > ディスプレイ > グラフィック > 既定のグラフィック設定 >「ハードウェア　アクセラレータによる GPU スケジューリング」を「オフ」にする


## 参考資料
- [【Unity】ML-AgentsでGPUを使おうと頑張った話【強化学習】](https://note.com/nxino/n/ne5e82506a2ec)
- [【Windows】UnityのMLAgentsを利用するための環境構築](https://note.com/kohei_karita/n/n1a1d0d84c64e)
- [PyTorch-CUDA+cuDNN環境構築 on Windows 11](https://qiita.com/d83yk/items/f4e5019d3f4bbeaf36dc)
Obsidian Web ClipperとGemini連携による効率的な情報収集設定

# Obsidian Web ClipperとGemini連携による効率的な情報収集設定

このドキュメントでは、Obsidian Web Clipper を使用してWebページをクリップし、Google AI (Gemini 1.5 Flash) を活用してMarkdown形式に変換、さらにMicrosoft Visual Studio CodeのMarkmap拡張機能でマインドマップ風に表示する方法を説明します。

## 1. Chrome拡張機能のインストール

![スクリーンショット 2025-01-12 015324.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235474/880b2f41-2b3a-44bb-c081-6368d037f9c4.png)

1.  **Chrome ウェブストア**を開きます。
2.  **Obsidian Web Clipper** を検索します。
3.  **Chromeに追加** をクリックして拡張機能をインストールします。

## 2. Obsidianの保管庫設定

1.  Obsidian Web Clipper のアイコンをクリックします
2.  **一般設定** を選択します
3.  **保管庫** 欄に、Obsidianで使用する保管庫名を入力します（例: `2025`）
    * 既存の保管庫を使用する場合は、正確な名前を入力してください
    * 新しい保管庫を使用する場合は、ここで名前を設定できます
4.  **Enter** キーを押して保管庫を追加します

## 3. Google APIキーの取得

1.  **Google Cloud Platform** にアクセスし、APIキーを取得します
    * 詳細は以下の「Google Gemini APIキーの取得」を参照してください
2.  取得したAPIキーをメモします

### Google Gemini APIキーの取得手順

1.  **Google AI Studio** にアクセスします
2.  Googleアカウントでログインします
3.  左側のナビゲーションパネルから **Get API key** をクリックします
4.  **Create API key in new project** をクリックします
5.  生成されたAPIキーをコピーします

![スクリーンショット 2025-01-12 014802_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235474/f1233587-5403-b132-15ed-8f209e1d2bab.png)

## 4. インタプリタの設定

1.  Obsidian Web Clipper の設定画面を開き、**インタプリタ** タブを選択します
2.  **プロバイダー** セクションで、**+プロバイダーを追加** をクリックします
3.  **プロバイダーを編集** ポップアップで、以下の情報を入力します
    * **プロバイダー**: **Google Gemini** を選択
    * **ベースURL**: `https://generativelanguage.googleapis.com/v1beta/chat/completions`
    * **APIキー**: 取得したGoogle Gemini APIキーを入力
4.  **保存** をクリックします
5.  次に、**モデル** セクションで、**+モデルを追加** をクリックします
6.  **モデルを編集** ポップアップで、以下の情報を入力します
    * **プロバイダー**: **Google Gemini** を選択
    * **モデル名**: `gemini 15f` (任意の名前)
    * **モデルID**: `gemini-1.5-flash`
7.  **保存** をクリックします
8.  **gemini 15f** モデルの右側にあるトグルスイッチをオンにします

![スクリーンショット 2025-01-12 014854.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235474/88dae3f6-bbe7-82b9-8499-e6a32bfc15ee.png)

## 5. テンプレートの設定

1.  Obsidian Web Clipper の設定画面を開き、**テンプレート** タブを選択します
2.  **複製：デフォルト2** をクリックして、既存のテンプレートを複製します
3.  **動作** セクションで、**新規ノートを作成** が選択されていることを確認します
4.  **ノート名** 欄に `{{date}}-{{title}}` を入力します
5.  **ノートの場所** 欄に `80_clips` を入力します
6.  **保管庫** 欄は **最後に使用** を選択します
7.  **ノートの内容** 欄に以下を入力します
    ```
    {{ページの内容をメタ認知した上で、Markdown記法の見出し2/見出し3、本文を2レベルの箇条書き、文末にハッシュタグを付与}}
    ```
8.  **保存** をクリックします

![スクリーンショット 2025-01-12 015018_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235474/bfe23406-6984-10c5-1dac-28b8b9650f1c.png)

## 設定完了

上記の手順で Obsidian Web Clipper の設定は完了です。Webページから情報をクリップする際、設定したテンプレートが適用され、指定した場所にノートが保存されます。

この設定により、Obsidian Web Clipper を Google Gemini を活用した効率的な情報収集ツールとして利用できます。
GPS/GNSS測位計算

こんにちは。
GPS/GNSS測位計算について説明します。

### 基本前提
以下に基づき、方程式を立て、解（＝GPS/GNSS受信機の信号受信時刻および受信機座標）を求める。
* 受信機はGPS/GNSS衛星（複数）から発信された信号を受信する。受信時刻は全ての衛星に対し同一。
* 各々の衛星の発信時刻および座標は、受信機内の測定から求められ、方程式の中で既知値として扱われる。ただし各種誤差を被る。
* 受信時刻および受信機座標は未知数（合計個数は４つ）。
* 慣性系を仮定し、方程式の形は、真空中の光の伝播時間（＝受信時刻ー発信時刻）に光速度を掛けて距離を表す。

### 図示例
光（電磁波）の伝播は時空間内の[光円錐](https://ja.wikipedia.org/wiki/%E5%85%89%E5%86%86%E9%8C%90)として表現でき、衛星の発信時刻および座標は光円錐の頂点に位置します（緑点）。解である受信機の受信時刻および座標は光円錐[^1]の交点に位置します（橙点）。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/54617/a9bfe932-9187-edc1-d53a-8840bfa9b411.jpeg" width=50%>

[^1]: 光円錐の頂角は90度。

### 4次元時空間における式
4つの光円錐の交点の解 $\boldsymbol{w} = \left(x, y, z, t\right)^\textrm{T}$ は下記の方程式を満たします。$\left(x_i , y_i , z_i , t_i\right)^\textrm{T}$ は円錐の頂点座標です。なお $c = 1$ とします。

```math
\sqrt{(x - x_i)^2 + (y - y_i)^2 + (z - z_i)^2} - (t - t_i) = 0, \quad (i = 1,2,3,4)
```

これを展開した形は、
```math
\begin{align}
&s -2 A_i \boldsymbol{w} + s_i = 0, \quad (i = 1,2,3,4),\\
s &\triangleq x^2 + y^2 + z^2 - t^2, \\
s_i &\triangleq x_i^2 + y_i^2 + z_i^2 - t_i^2, \\
A &\triangleq \begin{pmatrix}
x_1 & y_1 & z_1 & -t_1 \\
x_2 & y_2 & z_2 & -t_2 \\
x_3 & y_3 & z_3 & -t_3 \\
x_4 & y_4 & z_4 & -t_4 
\end{pmatrix}
\end{align}
```

### 解 ###
解 $\boldsymbol{w}$ は下記の関係式から計算できます。

```math
\begin{align}
2 \boldsymbol{w} &= s \boldsymbol{u} + \boldsymbol{v}, \\
\boldsymbol{u} &\triangleq A^{-1} \left(1, 1, 1, 1\right)^\textrm{T}, \\
\boldsymbol{v} &\triangleq A^{-1} \left(s_1, s_2, s_3, s_4\right)^\textrm{T}, \\
\langle\boldsymbol{u},\boldsymbol{v}\rangle &\triangleq u_1 v_1 + u_2 v_2 + u_3 v_3 - u_4 v_4, \\
0 &= \langle\boldsymbol{u},\boldsymbol{u}\rangle\, s^2 + 2\left(\langle\boldsymbol{u},\boldsymbol{v}\rangle - 2\right) s + \langle\boldsymbol{v},\boldsymbol{v}\rangle
\end{align}
```

$s$ は二次方程式（最終行）を解いて求めます[^2]。また実際に計算する際には $x , y , z , t$ の絶対値が大きくなりすぎないように、適切に原点を移動してください（特に $t$）。

### 注意点（実用精度）
地球大気中では伝播遅延が生じますので、実用精度の点では無視できないです。

### 詳細
詳細については、下記が良いようです。
* https://en.wikipedia.org/wiki/Satellite_navigation_solution

[^2]: Bancroft, S. (1985). An algebraic solution of the GPS equations, IEEE Trans. Aero. Electron. Syst. AES-21, 56–59.
【AWS SAP】AWS Identity and Access Management Access Analyzerとは

# 学習前イメージ
IAMのサービス？権限？

## AWS Identity and Access Management Access Analyzer（アクセスアナライザー）とは
- AWSリソースへの**外部からのアクセス**を分析
- 不適切な公開や不要な権限設定を**検出**
- 意図しない外部アクセスを**通知**
- **自動**で監視が続くため、セキュリティリスクを早期に特定・修正が可能

## AWS Configでも出来たような？
AWS Configでもリソースを監視し、通知することができます。

### AWS Configとの違い
表のとおり、アクセスアナライザーは**外部からのアクセスを検出**するのに対して、AWS Configは単純に設定値を評価するだけ。
| **特徴**                     | **AWS IAM Access Analyzer**                                                                 | **AWS Config**                                                                                   |
|------------------------------|--------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------------------|
| **対象**                     | 外部からのアクセス可能性の検出（例: S3バケットがパブリックか）                                    | リソース設定全般の評価（例: 暗号化の有無、特定のタグ付け）                                            |
| **使い方の焦点**              | IAMポリシーやリソースポリシーの解析を特化                                                      | AWSリソースの設定がベストプラクティスやカスタムルールに準拠しているかを評価                          |
| **通知内容**                  | 外部アクセスの可能性（例: インターネットや他AWSアカウントへの公開を検出）                          | 設定違反の検出（例: ルールに違反した未暗号化のS3バケットやEBSボリュームなど）                         |
| **モニタリング方法**          | 外部アクセス可能性に焦点を当てた分析                                                         | 事前に定義したルールに基づく監視（AWS管理ルールやカスタムルールを作成可能）                          |
| **運用フロー**                | 設定変更に応じて「Finding」として検出結果を作成                                               | リソース設定がコンプライアンスに合っているかを定期的またはリアルタイムで評価                          |


## どちらを選ぶべきか
### **IAM Access Analyzer:** 
- 外部からのアクセスを把握・検知させたい場合
### **AWS Config:**
- AWS全体のリソース構成やコンプライアンスを評価・通知したい場合

## 学習後イメージ
アクセスアナライザーは外部からのアクセスを評価、AWS Configは設定値を評価！
M2 Mac で asdf による Python インストールが失敗する場合の解決方法

# 問題の概要
M2 Mac環境でasdfを使用してPythonをインストールしようとした際、以下のようなエラーが発生する場合があります：

```bash
ld: archive member '/' not a mach-o file in '(...)/Modules/_hacl/libHacl_Hash_SHA2.a'
clang: error: linker command failed with exit code 1 (use -v to see invocation)
make: *** [Modules/_sha2.cpython-312-darwin.so] Error 1
```

# 原因
この問題は、Homebrewでインストールされた GNU ツールチェーン（make, coreutils, binutils）が、macOSのネイティブツールチェーンと競合することで発生します。特に、HACL ライブラリのビルド時にこの問題が顕著になります。

# 解決方法
以下のディレクトリをPATHから削除することで問題が解決します：

```bash
/opt/homebrew/opt/make/libexec/gnubin/
/opt/homebrew/opt/coreutils/libexec/gnubin/
/opt/homebrew/opt/binutils/bin/
```

# この解決方法を試すべき状況

以下の条件に該当する場合、この解決方法を試してみることをお勧めします：

1. M1/M2 Macを使用している
2. asdfでPythonのインストールを試みている
3. 特にHACLライブラリ関連のビルドエラーが発生している
4. `make`や`coreutils`などのGNUツールをHomebrewでインストールしている

# 注意点
- この方法は、GNU ツールチェーンを使用する他のビルドプロセスに影響を与える可能性があります
- 必要に応じて、特定のプロジェクトでのみPATHを一時的に変更することも検討してください

# その他の解決方法が必要な場合
この方法で解決しない場合は、以下の代替案も検討してください：

1. pyenvの使用
2. Homebrewで直接Pythonをインストール（`brew install python@<バージョン>`）
3. miniforge3の使用

# まとめ
この問題は、macOSとGNUツールチェーンの競合によって引き起こされます。PATHから特定のGNUツール関連のディレクトリを削除することで、asdfを使用したPythonのインストールが正常に完了するようになります。
【AWS SAP】AWS Data Exchangeとは

# AWS Data Exchangeとは
AWS Data Exchangeは、<INS>様々なデータ</INS>を簡単に共有できるサービスです。


```mermaid
graph TD
    A(👤 データプロバイダー) --> B[AWS Data Exchange]
    B --> C(👤 データサブスクライバー)
```

## 様々なデータとは
下記の通り、ファイルやS3、API Gateway APIなどの共有が可能です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2746730/8aa0e3a7-6b06-f5e7-9db6-4ae2953df54c.png)

| データセットタイプ                  | 説明                                                                                   |
|-----------------------------------|--------------------------------------------------------------------------------------|
| ファイル                          | Amazon S3オブジェクトまたはローカルファイルをインポートします。                            |
| Amazon API Gateway API           | Amazon API Gateway APIにアクセス権を付与します。                                           |
| Amazon Redshift データ共有         | Amazon Redshiftデータウェアハウスから直接データのライセンスを付与します。                     |
| Amazon S3 データアクセス           | Amazon S3バケットでホストされているデータへの直接アクセスのライセンスを付与します。            |
| Lake Formation データの許可| AWS Lake Formation経由のAWS Glueテーブルに対するライセンスアクセス。                        |
【AWS SAP】S3マルチリージョンアクセスポイントとは

# 学習前
複数の異なるリージョンを1つのアクセスポイントで管理？

## S3マルチリージョンアクセスポイントとは
S3マルチリージョンアクセスポイントは、AWSの複数リージョンに分散配置されたS3バケットへの統一的なアクセスポイントを提供する機能です。アプリケーションがリクエストごとに最適なルートを自動的に選択することで、レイテンシを削減し、可用性を向上させます。

この機能は、グローバルに分散したユーザーやシステムが簡単かつ効率的にデータへアクセスできるように設計されており、複雑な設定なしでスケーラブルなデータ管理を実現します。多地域展開が必要なアプリケーションやワークロードに最適なソリューションです。

```mermaid
graph TD
    A[アプリケーションやクライアント] -->|リクエスト送信| B[S3マルチリージョンアクセスポイント]
    B -->|最適なルートを選択| C[S3バケット リージョンA]
    B -->|最適なルートを選択| D[S3バケット リージョンB]
    B -->|最適なルートを選択| E[S3バケット リージョンC]
    
    C -->|データの保存や取得| F[ストレージ リージョンA]
    D -->|データの保存や取得| G[ストレージ リージョンB]
    E -->|データの保存や取得| H[ストレージ リージョンC]
```

## 何が便利？
- アプリケーションが単一のアクセスポイントを使って複数のリージョンに分散したバケットにアクセスできる
    - 開発者は個別リージョンの設定やルーティングを気にする必要なし
- リクエストごとに最適なルートを自動的に選択
    - レイテンシが低減する
- 障害時には他のリージョンへのフェイルオーバーが可能
    - 可用性が向上する

| 設定項目                   | 説明                                                                 |
| -------------------------- | -------------------------------------------------------------------- |
| **マルチリージョンアクセスポイント名** | ・アクセスポイントの一意の名前を指定                                                         |
| **バケットの選択**            | ・各リージョンで関連付ける S3 バケットを選択<br>・各リージョンにつき 1 つのバケットを指定                  |
| **パブリックアクセスブロック設定**   | ・マルチリージョンアクセスポイントに適用<br>・パブリックアクセスブロックの設定を選択<br>※デフォルトではすべてのブロックパブリックアクセス設定が有効 |
| **アクセスポリシー**          | ・マルチリージョンアクセスポイントの使用を制限するリソースベースのポリシーを設定                           |
| **クロスリージョンレプリケーション (CRR) ルール** | ・バケット間でデータを同期するためのレプリケーションルールを設定                                     |

## まとめ
LaTeXでpng画像が出力されない(diagbox使用)

## 状況
画像のchaptionは出力されており，おそらく画像が位置しているのだろうと確認できるが白抜けしている．
またコンパイルは通る．

コンパイルがそもそもエラーになる方は画像のパスなどを確認してください．
## 考えられる原因
#### 1. graphicx, colorをインポートしていない
一般的な原因はこれらしいです．
なのでtexファイルの上部に
```
\usepackage[dvipdfmx]{color}
\usepackage[dvipdfmx]{graphicx}
```
を追加しましょう．一般的にはこれで解決するみたいです．
(https://qiita.com/ganyariya/items/2dcb900bb04069408e14)
を参考にしました．
#### 2. diagboxを使用しているから
私は1番については元々できていたのに画像が出力されませんでした．色々試したらdiagboxをインポートする順番が悪かったみたいです．diagboxはLaTeX内で表を作成する際に利用していました．diagboxがgraphicxの上に来ていれば画像が出力されるみたいです．
```
\usepackage{diagbox}
\usepackage[dvipdfmx]{color}
\usepackage[dvipdfmx]{graphicx}
```
以上のような順番でインポートすれば画像が出力されるはずです．

## ぼやき
インポートの順番が影響するのは結構衝撃です．他にもエラーが発生したら，こういう細かいところを確認した方がいいかもですね．皆さん卒論・修論の時期だと思ったので簡単に共有しました．
COVID-19パンデミック初期における中国ソーシャルメディア感情分析：WeiboとLLMの活用

# Using LLMs to Infer Non-Binary COVID-19 Sentiments of Chinese Micro-bloggers

今回は、最新の研究成果である「Using LLMs to Infer Non-Binary COVID-19 Sentiments of Chinese Micro-bloggers」という論文をご紹介します。この研究は、中国のソーシャルメディアWeiboを対象に、COVID-19パンデミック初期の投稿を分析し、感情変化を追跡したものです。本研究は、大規模言語モデル（LLM）を活用し、従来の感情分析では捉えきれなかった「皮肉」などのニュアンスを分析することで、社会的・政治的影響を明らかにしています。

---

## 論文情報

- **タイトル**: Using LLMs to Infer Non-Binary COVID-19 Sentiments of Chinese Micro-bloggers
- **リンク**: [arXiv:2501.05423](https://arxiv.org/abs/2501.05423)
- **発表日**: 2025年1月9日
- **著者**: Jerry Chongyi Hu, Mohammed Shahid Modi, Boleslaw K. Szymanski
- **DOI**: なし

---

## 背景と目的

### COVID-19とソーシャルメディア
COVID-19パンデミックは、公衆の健康だけでなく、情報拡散や社会的分断の観点からも世界に大きな影響を与えました。特にソーシャルメディアでは、次のような現象が観察されました：

1. **デマやフェイクニュースの拡散**  
   不確かな情報が瞬時に広がり、混乱を引き起こしました。

2. **検閲と自己検閲**  
   Weiboなど中国のプラットフォームでは、政府主導の検閲だけでなく、ユーザー自身が「危険」とみなされる内容を避ける傾向が強まりました。

Weiboは中国で最も利用者数の多いソーシャルメディアの1つであり、COVID-19の初期段階で投稿された膨大なデータは、パンデミックが社会や個人に与えた影響を理解するための重要な手がかりとなります。

---

## 研究の焦点

本研究では、次の3つの焦点に取り組んでいます：

1. **LLMを用いた感情分析**  
   従来のポジティブ、ネガティブ、中立の分類に加え、「皮肉」という新しい感情カテゴリを導入しました。この新しいカテゴリは、中国特有の文脈や言語的ニュアンスを捉えるために重要です。

2. **データセットのクリーニングと分類**  
   Weibo COVID-19データセットに含まれる400万件以上の投稿をデータクリーニングし、投稿の種類（重複投稿、リポストなど）を精査した上で分類しました。

3. **パンデミック初期の感情ダイナミクスの解析**  
   時系列データを基に、感情の変化や社会的イベントが感情に与える影響を分析しました。

---

## 実験の概要と結果

### データセットの詳細
Weibo COVID-19データセットは次のように構成されています：

- **総投稿数**: 4,049,407件
- **ユニーク投稿数**: 2,226,667件
- **重複投稿数**: 877,031件（プロパガンダやスパムが含まれる可能性）
- **リポスト数**: 945,709件

データは以下のフィールドを含むJSON形式で整理されました：

- 投稿内容（本文）
- タイムスタンプ
- ユーザーID
- 使用デバイス情報

**クリーニング手法**:  
重複投稿やスパムを特定するため、以下の手法を用いました：

- 文字列比較による完全一致検出
- スペースや特殊文字の挿入による変化を含む類似投稿の識別

---

### モデルの詳細と少数ショット学習
**使用モデル**: Llama 3 8B  
少数ショット学習法を採用し、5つのラベル付き例をモデルに提示しました。プロンプト設計の例を以下に示します：

"You are a bot designed to judge Chinese sentences as having positive, negative, sarcastic, or neutral sentiment."


モデルの性能は次の通りです：

- **全体F1スコア**: 78.39%
- **皮肉カテゴリのF1スコア**: 42.86%

皮肉感情の精度が低い理由として、以下が挙げられます：

- サンプル数が少ない。
- 言語的に高度な表現が含まれるため分類が困難。

---

### 主な結果

#### 1. 感情の分布
- **ポジティブおよび中立の感情**: 全投稿の80%を占める。
- **ネガティブおよび皮肉感情**: 重複投稿を除外すると増加。

#### 2. パンデミック初期の感情変化
COVID-19の発生に伴い、ポジティブな投稿が急増しました。この現象は次の要因によるものです：

1. **政府による情報発信**: 感染対策の有効性を強調する投稿。
2. **市民の連帯感**: 「共に困難を乗り越えよう」というメッセージが多く見られました。

#### 3. エントロピー分析
$$
\text{Entropy} = -\sum_{i} p_i \log(p_i)
$$

- **ポジティブ/中立のエントロピー**: 政府投稿由来で類似性が高いため低い。
- **ネガティブ/皮肉のエントロピー**: 個人投稿が多く多様性が高いため高い。

---

## 応用可能性と限界

### 応用可能性
- **危機管理**: 政府や企業が公衆の感情動向を把握し、適切な対応を計画するために有用。
- **マーケティング**: ソーシャルメディアの感情分析を活用した消費者インサイトの獲得。

### 研究の限界
- 皮肉感情の分類精度が低い。
- 検閲や自己検閲の影響を完全に排除できない。

### 将来の課題
- LLMを用いた多言語対応。
- 皮肉やアイロニーを精度高く分類する新手法の開発。

---

この記事が、皆さんの研究や実務に役立つことを願っています。ご質問やフィードバックがありましたら、コメント欄にお寄せください。