OmniAICreator/Qiita-1.07M huggingface dataset:
初心者がPythonで東京の降水量を予測してみました

気象庁から気象データ（気温、降水量、湿度）をダウンロードして東京の降水量を予測してみました。

はじめに
現在、製造業に勤めており、昔から興味のあったプログラミングに挑戦する事を決意しました。
スクールを選ぶ中で、Pythonに強いAidemy Premiumを選ぶ事にしました。
***
**実行環境**

Python
Windows
Qiita
Google Colaboratory

***
**目次**
１. テーマを選んだ理由
２. 気象データの中身
３. データ前処理
４. モデルのトレーニング
５. モデルの評価とグラフの表示
６. まとめ

***
**１. テーマを選んだ理由**
趣味がキャンプとツーリングの為、降水量が気になる事から選ばせて貰いました。

***
**２. 気象データの中身**
期間 : 2022/6/01 ~ 2022/6/30
場所 : 東京

まずデータの準備をします。
```python:
import pandas as pd

data = {
    'Day': [
        '2022/6/1', '2022/6/2', '2022/6/3', '2022/6/4', '2022/6/5', '2022/6/6',
        '2022/6/7', '2022/6/8', '2022/6/9', '2022/6/10', '2022/6/11', '2022/6/12',
        '2022/6/13', '2022/6/14', '2022/6/15', '2022/6/16', '2022/6/17', '2022/6/18',
        '2022/6/19', '2022/6/20', '2022/6/21', '2022/6/22', '2022/6/23', '2022/6/24',
        '2022/6/25', '2022/6/26', '2022/6/27', '2022/6/28', '2022/6/29', '2022/6/30'
    ],
    'rainfall': [
        0, 0, 5, 0, 0, 43.5, 3.5, 0, 0, 0, 0.5, 0.5, 0, 0.5, 3, 0, 0, 2.5, 0, 0, 0.5,
        4.5, 0, 0, 0, 0, 0, 0, 0, 0
    ],
    'humidity': [
        60, 70, 83, 68, 76, 97, 90, 82, 83, 78, 80, 72, 53, 80, 95, 87, 83, 90, 83, 81,
        80, 87, 87, 75, 67, 61, 65, 71, 71, 66
    ],
    'temperature': [
        21.8, 22.5, 20.6, 20.3, 21.5, 16.6, 16.8, 17.2, 19.1, 21.2, 21.9, 21.4, 21.2,
        17.3, 16.9, 20.3, 22.8, 22.7, 24, 25.1, 25.2, 23.8, 23.5, 27.5, 30, 29.6, 29.5,
        29.2, 29.4, 30.8
    ]
}

df = pd.DataFrame(data)
df['Day'] = pd.to_datetime(df['Day'])
```

***
**３. データの前処理**
次に、データの前処理を行います。
```python:
from sklearn.model_selection import train_test_split

X = df[['humidity', 'temperature']]
y = df['rainfall']

X_train, X_test, y_train, y_test = train_test_split(X, y, test_size=0.2, random_state=0)
```

***
**４. モデルのトレーニング**
モデルのトレーニングを行います。
```python:
from sklearn.linear_model import LinearRegression

model = LinearRegression()

model.fit(X_train, y_train)
```

***
**５. モデルの評価とグラフの表示**
評価とグラフの表示を行い可視化しやすいようにします。
```python:
import matplotlib.pyplot as plt

y_pred = model.predict(X_test)


plt.figure(figsize=(10, 5))
plt.plot(df['Day'], df['rainfall'], label='Actual Rainfall')
plt.scatter(df.loc[X_test.index, 'Day'], y_pred, color='red', label='Predicted Rainfall')
plt.xlabel('Day')
plt.ylabel('Rainfall (mm)')
plt.title('Actual vs Predicted Rainfall')
plt.legend()
plt.grid(True)
plt.show()
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3824151/c50cd1e1-277c-3c02-7c03-8711b4f84a76.png)

***
**６. まとめ**
データ分析講座を受講してから初めて予測まで作ったのでとても勉強になりました。
わからない部分は、ネットで検索したり教材を見直したりで勉強しながらだったので一部、歪な部分があると思います。
又、このブログはAidemy Premiumのカリキュラムの一環で、受講修了条件を満たすために公開しています。
gitのコミット履歴を編集したい！ (正直このコマンドだけ覚えてたらOK) => git rebase -i

# コマンド git rebase -i HEAD~○

コミット履歴を変更したい。
何はともあれまず、`git log`。

![スクリーンショット 2024-07-08 1.44.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/5369416c-4fda-3833-8c34-3c5b5400a401.png)

...これより下にはthird commit, second commit, first commit(最初)と続く。



↑にいくほど新しいコミット
↓にいくほど古いコミット

**3**つのコミット履歴を変更したければ
HEAD~○ の ○ を**4**に指定
(○ = 変更したい履歴の数 + 1)
(HEADは最新のコミットを指す)

つまり打ち込むコマンドは
`git rebase -i HEAD~4`
(HEAD~4 = HEADを含んで数えて4つのコミットを編集すると言う意味)

すると、

![スクリーンショット 2024-07-08 1.49.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/89fd8429-0673-c4ff-cca2-168bd867427b.png)

```
pick 0511...
pick 38c3...
...
pick 016d...
```

と書かれている部分が過去のコミットを表す。その下の#が説明文。

※注意
↓にいくほど新しいコミット
↑にいくほど古いコミット
(git log の時とは逆)

## ここではsquashを説明

先ほどの画像で`pick`と書かれた部分を`squash`または`s`と書き換えることで
コミット履歴を消し、コミット文を編集することができる。
(コミット履歴が消えるだけでそのコミットで行ったファイルの変更などは消えないので安心を)

キーボードの`i`を押すとinsertモードに変わるので編集
編集後`esc`ボタンを押し`:wq`を入力して`Enter`

![スクリーンショット 2024-07-08 2.09.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/05bed95d-a8ec-8338-b0ba-fcabbc844fd6.png)

#### !注意!


:::note warn
`squash`はそのコミットを1つ手前のコミット(1つ古いコミット)にマージさせるような処理なので
`squash`と記述したコミットの上に、`pick`となるコミットがなければエラーが起きる。(これがまた起きたら少々面倒なのじゃ...)
:::

※もちろんこの画像における下から2つ目の`pick`となっているコミットの部分を`squash`にしても、1番上のコミット(この中で1番古いコミット)が`pick`となっているので成功する。
すなわち、
```
pick 0511..
squash 38c3...
squash 7177...
squash 016d...
```
でも成功する。今回は画像のように`pick`と`s`交互のパターンで進める

## コミット文を編集

上記の続き:

`:wq`->`Enter`を押すと下記のようにコミット文を編集できる画面に移行

`#`はコメントアウトされている文なので無視

![スクリーンショット 2024-07-08 2.19.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/1d7f0e65-20cf-dc6a-42b3-e73afed2a5ca.png)

例によって`i`を押しinsertモードに変更して編集

↓

![スクリーンショット 2024-07-08 2.26.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/038befad-3ef1-96ee-9a38-6a66817de375.png)

例によって`esc`->`:wq`->`Enter`

すると次のコミットに関するコミット文の編集

![スクリーンショット 2024-07-08 2.29.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/fe7b972d-137f-6633-9743-5477f5884639.png)

↓

![スクリーンショット 2024-07-08 2.30.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/a902ba53-b464-c796-ef8a-7b0508805fb9.png)

### 確認

`git log`で確認してみると見事にコミット履歴が合併されている

![スクリーンショット 2024-07-08 2.31.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3829908/3e9580c0-2927-062b-fdd8-032e6687f214.png)

## 注意

`push`や`pull`など、リモートリポジトリとやり取りした以降のコミット履歴しか編集してはならない。コミット履歴はプロジェクトの仲間と共有しているから、ハッシュ値そのものが変わってしまうと迷惑をかけることになる。ローカルのみにしか存在しないコミット履歴の範囲を編集してそれを`push`はOK。

非推奨の`push`は、した時に警告がでるのでそれを要確認。
第4回 Try English LT! for engineers 発表資料まとめ

# Try English LT! for engineersとは？

エンジニア向けの英語のみのLTイベントを行なっています！
発表テーマはエンジニア向けの内容であれば自由です。
英語でLTをやるとなると、中々ハードルが高く、 参加者が海外の人ばかりだと、なおさら難しく感じると思います。
ちょっと自信はないけど、 英語のLTにチャレンジしてみたいという人にぜひ発表してもらいたいです。
英語が好きなエンジニア同士で交流できるイベント運営ができればと思っています。

第4回イベントページ

https://try-english-lt.connpass.com/event/162045/

## 発表資料
・anchor_cable さん
https://speakerdeck.com/anchorcable/tdd-supports-us-all-the-time
ぼくが SOLID 原則を理解できなかった理由 ①単一責任原則編

> 変更するための理由が、一つのクラスに対して一つ以上あってはならない

[Wikipedia: SOLID](https://ja.wikipedia.org/wiki/%E5%8D%98%E4%B8%80%E8%B2%AC%E4%BB%BB%E3%81%AE%E5%8E%9F%E5%89%87)より引用

いや、抽象的すぎて分からん:sweat_smile: って思ったことないですか？
本記事では SOLID 原則を大体理解したマンのぼくが単一責任原則を理解できなかった理由と、ぼくなりの考え方をざっくりと説明したいと思います。

詳しい説明は他の方々がしてくださっているので、SOLID　原則を勉強したもののよく分からない、何かヒントが欲しいといった人向けです。


## なんで単一責任原則を理解できないのか

### どこまで分割すれば良いのか分からない
「じゃあ、どこまで分解したらエエねん？:sweat_smile:」
って言うのが、単一責任原則のハマりポイントだと思います。

コードレビューで「単一責任原則に従い、クラスを分離してください」と指摘したものの、「具体的にどう分割したら良いですか？」という質問に答えられなかったり、クラス分割の粒度が毎回違ったり……というのは結構あるあるだと思います。

### 単一責任原則を遵守して何のメリットがあるのか分からない
「コードがあちこちに散らばってて分かりづらいとぼくは思うけどね」と上司に言われたことがあります。
2024 年の今でもテストコードを書かず、手動でテストしている企業・プロジェクトはたくさんあると思いますが、かつてのぼくのように、そういった環境が理解の妨げになっているパターンがあると思います。


## 自分なりの「単一責任原則とは」
### 全メンバ変数を使う関数しか実装されていないクラス
一部のクラスを除いて、メンバ変数と関数があって初めてクラスというものになりますが、ぼくがクラスを書くときはそこにさらに上記制約を加えるようにしています。
逆にいえば、メンバ変数全てを使っているならいくらでも関数を生やして良いと思っています。
ざっくり書くと、こんな感じのクラスです。

```CSharp
// じゃんけんの手
class JankenHand {
　　　　// 親指
  private readonly Thumb _thumb;

  // ...人差し指、中指、薬指省略

  // 小指
  private readonly LittleFinger _littleFinger;

  public JankenHand(Thumb thumb,
      IndexFinger indexFinger,
      MiddleFinger middleFinger,
      RingFinger ringFinger,
      LittleFinger littleFinger) {
      // ...代入省略
  }

  // グー
  public JankenHand Rock() {
      // 全部の指を曲げて JankenHand の新しいインスタンスを返す
      return new JankenHand(_thumb.bend(),
          _indexFinger.bend(),
          _middleFinger.bend(),
          _ringFinger.bend(),
          _littleFinger.bend()
      );
  }

  // チョキ・パーは省略
}
```

なんじゃそれって感じですが、メンバ変数 5 つと、それら全てを使用する関数を 3 つ実装したクラスを書いてみました。
イメージとしてはなんかのゲームでキャラクターの手の形を変えてグーチョキパーを表現する感じなのですが、
明日から急にグーは親指を伸ばすことになったり、
チョキは薬指も伸ばすことになったり、
逆にパーはなんか中指を曲げることになったりしてもこのクラスを修正すれば良いんです。
新しいじゃんけんの手が追加されたり、逆に突然グーがなくなることになったりしてもこのクラスを修正すれば良いですね。

「いや、それ変更するための理由が複数ですやん:sweat_smile:」

と思われた方もいると思いますが、上記 3 つはどれも「じゃんけんの手に関すること」なので単一責任なのです。

要するに「ものは言いよう」ってことです:joy:

ちなみにですが、上記のようなクラスを Facade パターンとしてぼくは認識しています。
(断言して間違ってたら恥ずかしいので認識してるだけにしておきます)


## さいごに
初めての投稿なのですが、いかがでしたか？
こんな感じで気が向いたら次はオープン・クローズド原則についての記事を書きたいと思ってます。

よかったら皆さんの「単一責任原則をここが難しい」「こうやって覚えられた」を教えてください。
励みになります。
[Android] 最初に、表示するActivityを変更する方法

app/manifestsフォルダに行く

AndroidManifest.xmlファイルを開く
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.HappyBirthday"
        tools:targetApi="31">
        <activity
            android:name=".TaskCompleted"
            android:exported="false"
            android:label="@string/title_activity_task_completed"
            android:theme="@style/Theme.HappyBirthday" />
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:label="@string/app_name"
            android:theme="@style/Theme.HappyBirthday">
        <!-- ここから下 -->
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        <!-- ここから上 -->
        </activity>
    </application>
</manifest>

上記のファイルの下記の部分を、最初に表示させたいactivityのところに、移動させる

```
<intent-filter>
    <action android:name="android.intent.action.MAIN" />
    <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
```

下記のコードのように移動すると、TaskCompleted.ktのactivityが最初に表示されるようになる
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.HappyBirthday"
        tools:targetApi="31">
        <activity
            android:name=".TaskCompleted"
            android:exported="true"
            android:label="@string/title_activity_task_completed"
            android:theme="@style/Theme.HappyBirthday">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:label="@string/app_name"
            android:theme="@style/Theme.HappyBirthday" />
    </application>
</manifest>
【2024マラソン22】子供の理想を形にするには

# 何の記事？
5歳長女がプリキュアとアイカツの影響を受けた結果、自分で衣装デザインをするようになったので、これを形にできないかなー……と思いついた手順をまとめます。

# 何を使って何を作るか
### VRoid studioから3Dモデルを作る
衣装込みで人型のモデリングをするならこれが一番簡単かなと思います。
これを使って、希望する衣装と表情や髪型などを作っていきます。
また、pixiv FactoryであればVRoid studio上でポーズ付きデータを作成・入稿したら依頼ができるので、最初はここから始めるのもいいかも知れません。
細かな装飾が多いアバターだとぼやけるかもしれませんが、子向けアバターやデフォルメアバターであれば十分かと思います。

### Blenderで3Dモデルを吐き出す
3Dプリントを依頼するのに、概ねFBXで吐き出す必要があるので、他サイトで依頼をする場合は使うことになるかと思います。

### その他の3Dプリント依頼先 
#### ポプルス 3Dプリント

https://www2.popls.co.jp/pop/3d/genko.html

https://www2.popls.co.jp/pop/3d/pw/pw.html

細かな装飾があるアバターの場合、こちらだと安価で質の良いものができそう。
また、予算次第ではありますが、2Dイラストから立体にしてもらうこともできるので、3Dモデルを作らなくてもいいのが嬉しいところ。

### 3D以外のグッズ制作候補

#### アイロン接着できる布に印刷する

https://www.yodobashi.com/product/100000001000756372/

登園グッズとかに貼るワッペンのように、自宅でプリントして使う……というのも手です。

#### イラストをアクキーにする

https://factory.pixiv.net/products/standard_acrylic_key_chain

イラストデータをアップロードでアクキーにしてくれるサイトです。


子どもが書いたものであれば勝手に形にする訳にはいきませんが、一緒にデザインを考えて「形になったらなー」……という話が出てきた時にはこういった方法も使ってみようかと思います。
【2024マラソン21】イラストを邪魔しないオシャレな透かしを求めて

# 何の記事？
自分のイラストの無断転載防止に入れる透かしサインをいくつか作ったので、作り方や、配布されている透かしサインについてまとめました。

# 誰向け？ どんな役にたつ？
- 自分のイラストのウォーターマークを作りたい人
- ウォーターマークの作り方が気になる人
- 配布されているウォーターマークを使いたい人

# あらすじ
SNSにイラストを投稿すると、無断転載をされたり、意図せずAI学習に使われてしまうと言うことがあるかと思います。
また、自分のイラストの無断転載防止に入れるサインについて、適当に書くと、どうしてもイラストの雰囲気を壊してしまったり、いかにもなサインになってしまこともあります。

そこで、おしゃれでかつわかりやすいサインを作れないだろうか？……ということで、簡単なサインが配布されているかどうかを調べたり、自分で作ってみることにしました。

# 配布されているウォーターマーク
調べると、自由に使っていいよということで配布してくれている方がたくさんいらっしゃいました。

## クリップスタジオアセット

https://assets.clip-studio.com/ja-jp/detail?id=2006917

https://assets.clip-studio.com/ja-jp/detail?id=2051064

## BOOTH

https://booth.pm/ja/items/3741728

https://booth.pm/ja/items/5425076

# クリップスタジオでウォーターマークを入れる方法
## 画像書き出し時に設定する

https://support.clip-studio.com/ja-jp/faq/articles/20230063

## 画像を読み込んで設定する

http://www.clip-studio.com/site/gd/csp/manual/userguide/csp_userguide/500_menu/500_menu_file_read_patern_pic.htm



# 自作する方法
## 使ったツール
- Figma
- ClipStudio

Figmaで文字を打ったり、シームレスにつながるように作りました。
基本的には下記画像のように、四角の画像を繰り返し配置した際に、境界に矛盾が出ないように作成すれば大丈夫です。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/964152/fe1ea526-85f8-04fd-851b-30dfc063bd44.png" width=300>


## 作ったもの
#### 1. タイリングタイプ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/964152/b4dbb231-901a-0079-5d0f-fff30345bd68.png" width=300>

一番シンプルなタイプです。
ただ、配布されているもののように、図形を混ぜてみたり、文字位置を変えてみたりと、アレンジの幅が広いように感じました。

#### 2. スタンプタイプ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/964152/ea22130e-8550-7545-1ea4-77605d6df7b5.png" width=300>

切手デザインなどとの親和性が高そうです。
少し印象が締まるのと、無断転載禁止の文言は目立つので、抑止効果は高そうです。
ただ、スタンプ自体は目立つので、オシャレなデザインにしつつ、目立たせつつ……のパランスが難しいように感じました。

#### 3. パズルタイプ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/964152/86e94ff2-a302-24c7-60b4-eefa38d6f77e.png" width=300>

透しというより、デザイン的に使い辛くしてしまえという案です。
上記画像はパズルを当てはめただけで力つきましたが、パズルのピースにサインを入れたり、転載禁止の文言を入れるのも面白いかと思います。
描き途中のものを上げるときなど、ところどころくり抜いてあげたりしても面白いかもしれません。
元絵を少し崩すので、元絵はポートフォリオで見れたりなどする場合向けです。

# 感想
実際に作ってみたり、調べたりするといくつかおしゃれなロゴも出てきたり、そういったおしゃれな透かしサインを作りますと言う依頼も見つかりました。
サインとしては、無断転載などを防止するためのものではありますが、基本的には自分のイラストを見てくれる人みんなの目に止まるものなので、またもう少し時間をかけて自分の納得のいくものを作ってみようかなと思いました。

# 応用
## タイムラプスへのウォーターマーク
応用としてクリスタはタイムラプスにもウォーターマークをつけることができます。
タイムラプスを書き出しするときに、1番下のウォーカーマークを有効にして書き出しをするとつけることができるので、こういった形でウォーターマークを事前に作っておいて、タイムラプスにも保護をかけると言うことが可能です。

## イラスト・ラフ提案時の透かし

https://booth.pm/ja/items/5717000

変わり種で、こういったものもありました。
ラフの持ち逃げ防止抑止として、こういったこともありかもですね。
ITパスポート ビジネスシステムとエンジニアリング

・ビジネスシステム
企業の業務活動を効率よく進めるために活用されるシステム

・POSシステム
バーコードを読み取って商品の販売情報をリアルタイムに収集し、売れ筋商品や死に筋商品などの販売管理や在庫管理に役立てるシステム

・ワークフローシステム
申請書類や通知書などを電子データ化し、申請・りん議・決裁までの一連の流れ（ワークフロー）をネットワーク上で行うシステム

・トレーサビリティシステム
製品や食品などの生産段階から最終消費段階、さらには廃棄段階までの全工程について、履歴の追跡ができるシステム

・GIS
要素ごとの位置情報や海岸線、行政区域などの地理的データに、様々な統計データを組み合わせて視覚化したシステム

・GPS
衛星からの情報を利用し、自分の位置情報を算出するシステム

・ETC
高速道路などの有料道路の利用時に自動で料金を精算するシステム

・マイナンバー制度
行政を効率化し、国民の利便性を高めるため、公平・公正な社会を実現する社会基盤
・署名用電子証明書
氏名・住所・生年月日・性別が含まれる
・利用者証明用電子証明書
個人情報が含まれない

・エンジニアリングシステム
生産工程における生産性を上げるための考え方や、自動化を図るためのシステム

・ジャストインタイム（JIT、かんばん方式、リーン生産方式）
必要な物を必要な時に、必要な量だけを生産する方式

・コンカレントエンジニアリング
製品開発において、各作業工程のうち同時にできる作業を並行的に行うこと

・TOC
ボトルネックになっている工程を見つけ、改善することで全体の生産性を上げる考え方

・CAD
コンピュータを利用して設計を支援すること

・FMS
工作機械や無人搬送車、産業用ロボットなどをネットワーク化してコンピュータで集中管理するシステム

・MRP
製品の生産計画に基づいて、必要となる部品の所要量と発注時期を決定する資材管理手法

・シックスシグマ
対象とする業務の品質を数値化し、そのばらつきを抑制すること
AWS SAP 合格体験記

# はじめに
AWS SAP(C02)試験に一発合格できました！
忘れないうちに学習方法等メモしていきます。

# 受験前のステータス
・AWS実務経験は1年強、ただし小規模案件ばかりであまり深く触ったことはない（マネージドなWeb3層がメイン）
・AWS SAA取得済

# 学習の概要
学習時間：30～40時間程度（平日2時間、休日5～8時間）
学習開始時期：本腰入れたのは大体10日前
学習方法：紙の参考書＋Web問題集（CloudTech）＋公式サンプル

# 学習に使用したもの
- **紙の参考書（[AWS認定資格試験テキスト&問題集 AWS認定ソリューションアーキテクト - プロフェッショナル](https://amzn.asia/d/0gGkXFM8)）**
非常に読みやすかったです。章毎の確認問題＋章末に模擬試験あり。
個人的に参考書は電子よりも紙のほうが読みやすいので紙で買いました。
- **Web問題集（[CloudTech](https://kws-cloud-tech.com/)）**
資格会員4980円/90日間です。
けして安くはないですが、後述の通り元々こちらの問題集のみで挑むつもりだったので購入しました。
問題・解説の質は普通だと思います。特に悪いとは感じませんでした。
【良かったところ】Udemyと違って一問一答で解答・解説がみられる。（※出題自体は10問区切り）
【いまいちだったところ】自回答の正誤が記録されない。ブックマーク機能はあるがいまいち使いこなせなかった。

- **公式サンプル問題**
公式サイトの試験概要のページに掲載されている[サンプル問題](https://d1.awsstatic.com/ja_JP/training-and-certification/docs-sa-pro/AWS-Certified-Solutions-Architect-Professional_Sample-Questions.pdf)。
- **公式練習問題**
SkillsBuilder内の「AWS Certified Solutions Architect – Professional Official Practice Question Set (SAP-C02 - Japanese) v2」
20問分を無料で受講できます。

# 学習の流れ
### 最初はWeb問題集から着手→失敗
合格体験記をいくつか読んだ結果、「SAAも持っているしWebの問題集だけで行けるだろう」と踏んで評判のよさそうなCloudTechに課金。
**⇒全然解けない。**
SAAとSAPでは必要な知識や深さが全然違う、と感じました。

### 早々に諦めて参考書を購入
各サービスの知識が圧倒的に足りないことがわかったため、まずは全体的に知識をつけるために紙の参考書を購入しました。
個人的にはこちらのほうが断然効率が良かったです。

本が手元に届いたのが試験の2週間前を切ったあたり。
平日5日ほどかけて参考書＋模擬試験を1周し、模擬試験で間違えた問題を中心に2週目を実施。
このあたりで出てくるサービスの知識はだいぶついてきたと感じました。
（とはいえ正答率7割程度なのでまだまだ不安）

個人的には参考書のほうが勉強しやすかったですが、BlackBelt等で学習するのも良いと思います。

### 公式サンプル問題＋練習問題を解く
これがなんと8割以上取れました。ここで少し安心してしまったのでよくなかった。
**無料で見れる範囲の問題は、実際の試験より易しいと思ったほうが良いです。**
試験会場で難易度の差に半泣きになりました。

### 残り時間でCloudTechのWeb問題をひたすら解く
私は結局ここの時間があまりとれず。せっかく課金したのにあまり生かせませんでした。
でもこちらの問題集のおかげで解けた問題もあったので、まったくの無駄ではなかったと思っています。

# 受験時の流れ
家の環境を整えるのがめんどくさかったので、テストセンターで受験。
モニタが横に長くて見づらかったです。9:16だったのかも。
こういう些細な環境差や、人の動きが気になるのはデメリットですね。

先述の通り、思ったよりも難易度が高く感じました。
1周終わった時点で残り時間25分、自信がない問題のフラグ27個。絶望的です。
できる範囲で見直しを行い、時間ギリギリまで粘って終了。
正直普通に落ちたと思いました。

結果は2時間半程度でメールが来ました。思ったより早かったです。
まさかの合格だったので正直とてもびっくりしました。

# 反省
もっとCloudTechの問題集をやるべきだった。
基礎知識をつけたあとなら、演習に勝るものはないと実感しました。

問題の選択肢見ていると、細かいところで自信が持てないんですよね。
こんな設定あったっけ？こんな接続できるんだっけ？と悩んでしまって。
それを払拭するためには数をこなして反復学習して脳に刻み付けるしかないのかなと。

# 今後に向けて
正直しばらく勉強したくないくらいには疲れたのですが、まだCloudTechの会員期間が残っているのでもう1つくらい何か受けてみようと思います。

リモートでの受験もやってみたいけれど、自宅のネット回線がごくたまに不安定になるので、悩ましいところです。
こういう表現をしたいとき、reveal.js は楽だなあ

## この記事の概要

私は登壇する機会がそれなりに多いです。
そのため、発表資料としてスライドを用意することも多いです。

Keynote にせよ Figma にせよ、基本的には便利この上ないのですがピンポイントで「これはやりづらいな」と思うタイミングもあります。

それが reveal.js だと実現しやすいときもあり、差分について記事にしました。

## 1 行ずつ表示を増やしたいようなとき

こんな感じです。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/779de444-a2ce-354f-8671-09574c5e610a.gif)

最近ではスマートアニメーションのような機能がついているので、アニメーション自体は問題ではありません。

文章の数だけ前後のスライドが増えるので、修正がする場合大変でした。

reveal.js の場合はこういったコードを 1 度書くだけで OK です。
複数ページ用意する必要はありません。

```html
Paragraph
<p class="fragment fade-up">Fade in 1</p>
<p class="fragment fade-up">Fade in 2, long text</p>
```

`fragment`を指定すれば、コードの上から順に登場します。
画面への入り方や出て行き方もつけるクラス名で調整できます。

https://revealjs.com/fragments/

---

また、色々話したあとに「実はこれ、良くない例なんです」なんていうときも楽です。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/9fd73a6a-8ca4-7b49-8239-be2ab3f7b6f3.gif)

```html
<div class="r-stack">
	<div>
		Paragraph
		<p class="fragment fade-up">Fade in 1</p>
		<p class="fragment fade-up">Fade in 2, long text</p>
	</div>
	<img src="./assets/no.png" class="fragment" />
</div>
```

`r-stack`をつけると、同じ場所に重ねて表示されます。

この例ではバツ印でしたが、これに限らず便利に使えます。

https://revealjs.com/layout/#stack

## 画面の幅いっぱいに文字を表示したいとき

こんな感じです。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/b7f8028d-aa97-d4f0-c369-2e90e2747352.png)

1 行ずつ調整すれば良いだけと言えばそうなんですが、これもまた修正が入ったときに大変です。

```html
<p class="r-fit-text">Short text</p>
<p class="r-fit-text">Slightly longer text</p>
<p class="r-fit-text">Fairly long text with lots of characters</p>
```

`r-fit-text`をつけると、文字の長さにあわせて自動で調整してくれます。

https://revealjs.com/layout/#fit-text

## 長めのコードを一部紹介したいとき

スライドは横長ですが、長いコードは縦長になります。

一部だけを紹介したいものの、ある程度は全体を見せないと雰囲気が伝わらないとき、スライド作成ツールだとレイアウト調整に難儀します。

reveal.js だとこのように、一部をハイライトしながらスクロールしながら示せます。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/46e00302-7689-0c01-f5ee-d8beb53fecf0.gif)

こちらも、これまで同様複数回の指定は不要です。

```html
<pre>
	<code data-line-numbers="4-6|9-11|14-16">
 		<!-- 見せたいコード -->
 	</code>
</pre>
```

`data-line-numbers`に`|`区切りでハイライトしたい行を渡せば良いだけです。
【2024マラソン20】クリスタのアニメーション連番とレイヤーカンプ機能の比較

# 何の記事？
クリスタのアニメーション機能で差分を作る場合とレイヤーカンプで作る場合の差についてまとめました。

# 誰向け？ どんな役にたつ？
- 今までレイヤーカンプ機能を使ってこなかった人
- 今までアニメーション機能で似たようなことをやってきた人
- レイヤーカンプ機能を使いたいけれどバージョンがPROの人

# あらすじ
クリスタver3.0になってから、指定のレイヤ組み合わせを記憶できる機能、「レイヤーカンプ」が登場しました。
しかし、機能を使えるのはクリスタPROではなくEXまで課金している人限定で、私は今までアニメーション機能で似たようなことをやっていたため、それぞれの機能を比較してみることにしました。

# レイヤーカンプとは[EX限定]

https://tips.clip-studio.com/ja-jp/articles/8925#7e20bc30

よくある差分が簡単に作成できる機能です。
選択したレイヤーカンプを一括書き出しもできます。

# アニメーション機能とは[PRO/EXともに使用可]

https://support.clip-studio.com/ja-jp/faq/articles/20210092

https://murasakiatsushi.com/difference-files-making/

フィルムアニメーションを作る機能ですが、各コマを一括で書き出せるため、ちょっとした差分作成に使えます。
こちらも一括書き出しが可能です。


# できること比較

|  | アニメーション | レイヤーカンプ |
|:-:|:-:|:-:|
| 一括書き出し  | ◎  |  ◎ |
| 書き出し時のファイル毎の名前変更  | △  |  ○ |
| レイヤービューを見る  |  ◎ | × |
| ファイルの重さ  |  △ | ○ |
| レイヤー管理が簡単か  |  × | ○ |



# 結論
契約プランがPROでEXまであげない人はアニメーション機能を使ってみると良いかと思います。差分のあるイラスト作成をするときに一度使い方に慣れるととても楽になります。
またアニメーション機能に慣れるとあえてレイヤーカンプを使う必要は無いので、差分ごとのレイヤービューを見ながら作業をしたいと言う方はアニメーション機能を使うと良いでしょう。
ただし、アニメーション機能を使って差分を増やしていくと、レイヤー数が増えるごとにどんどんファイル自身が重たくなっていきます。
ある程度増えてきて、操作をするのに重たくなってきた場合は、ファイルオブジェクトなどで1ファイルが重たくならないように調整しながら編集していくと良いかと思います。
llvm-covのカバレッジ取得方法（備忘録）- 追記

[前記事](https://qiita.com/joule/items/f9de29ceb1d78c5658d8)でコードカバレッジツールを調べたのですが、この使い道が例によって分かりにくかったので追調査させてください。

#### 利用方法1: テストの分岐網羅性を確認する
一般的にカバレッジというとテストの網羅率の用語として定着しています。
ホワイトボックステストにおいてC0:命令網羅性、C1:分岐網羅性、C2:条件網羅性などの条件がありますが、これらの条件をクリアできているかはカバレッジを使うと確認できそうです。ただし、llvm-covはLLVM IRのブロック単位でのカウンタを基にした結果であり、ソースコード上の分岐と合致しないこともあるため、`llvm-cov report`などの集計値を見るときは意図したテストで使えるのか確認が必要です。

#### 利用方法2: 実行性能を解析する 
性能解析ではコードのどの部分がボトルネックであるかを知る必要がありますが、その取っ掛かりとしてコードカバレッジを利用することができます。
コード中のどの処理がどのくらい実行されているのかを把握すると、重そうな箇所を絞って詳細解析を行うことができます。
シミュレーションアプリなどでは、パラメータが多数あり分岐条件を追えないことがよくあります。そのようなアプリの分析にも利用できます。
また、ソースチューニングでも利用できます。極端な例では、パラメータ的に分岐が真または偽のどちらかにしかならないケースや、一見普通のループの回転数が実は非常に少ないケースなど。このような例外的なケースでは、性能向上目的のチューニングができそうです。
bashでfor文を使用する際、連番でループする方法（seq、ブレース展開、ワンラインでの記載方法あり）

（自身の備忘録用です）
## seqで指定の件数ループ

```
#!/bin/bash

for i in `seq 5`
do
  echo ループ${i}回目
done

---------------
(出力)
ループ1回目
ループ2回目
ループ3回目
ループ4回目
ループ5回目
```
##### 開始位置も指定時
```
for i in $(seq 3 5)
do 
  echo ループ${i}回目
done

---------------
(出力)
ループ3回目
ループ4回目
ループ5回目
```
##### 一行で記載する際
```
for i in `seq 5`; do echo ループ${i}回目; done
```

## ブレース展開で指定の件数ループ
```
for i in {1..3}
do
  echo ループ${i}回目
done

---------------
(出力)
ループ1回目
ループ2回目
ループ3回目
```
##### アルファベットなども使用可
```
for i in {a..b}
do
  echo ループ${i}回目
done

---------------
(出力)
ループa回目
ループb回目
```
##### 以下のような書き方も可
```
for str in ループ{1..3}回目
do
  echo ${str}
done

---------------
(出力)
ループ1回目
ループ2回目
ループ3回目
```
AWS Summit Japan 2024 参加レポート

## はじめに
AWS Summit Japan 2024 参加レポートになります。（6/20,21開催で6/21のみ参加）
今回AWS Summitに参加できなかった方や、次回参加してみたいという方のご参考になれば幸いです。
<br>
サミットの概要、参加方法等の詳細は下記公式ページ参照。  
![PXL_20240621_023917725.MP.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/6009b863-dbca-e88b-482b-56f907b38873.jpeg)  
[AWS Summit Japan公式ページ](https://aws.amazon.com/jp/summits/japan/)
>AWS Summit は、クラウドコンピューティングコミュニティが一堂に会して、アマゾン ウェブ サービス (AWS) に関して学習し、ベストプラクティスの共有や情報交換ができる、全てのクラウドでイノベーションを起こすことに興味がある皆様のためのイベントです。　　

<br>

## 講演

![PXL_20240621_034129867.MP.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/4ceb9f1d-a56e-153c-1cf0-8e438d2f12cd.jpeg)  
<br>

###### 基調講演 「ビルダーとテクノロジーが加速する次のイノベーション」
金融・自動車・通信・運輸（航空）業界等のAWS活用事例とともに、AWS上で保管されているデータを用いたAI利活用の重要性が強調されていました。
講演の中では生成AI活用を３つのスタックに整理していました。

<br>
<ins>１．LLMと基盤モデルの学習と推論のためのインフラストラクチャ（AWS Trainium、SageMaker etc..）</ins>

高いパフォーマンスを発揮するNVIDIA製GPU・AWS製GPU（AWS Gravitonプロセッサ）の紹介。
AWS製GPUは比較的低コストかつ環境負荷を低減しながら利用できるとのこと。

<br>
<ins>２．LLMや基盤モデルを活用しアプリケーションを開発するためのツール（Amazon Bedrock　#昨年リリース）</ins>  

Amazon,meta等のサードパーティ製を含む様々な生成AIモデルを提供するAPI型サービス「Bedrock」の紹介。
自社データを活用した基盤モデルをセキュアかつプライベート環境下で利用可能。また有害コンテンツのフィルタや機密情報のマスキング・各種コンプライアンス基準の準拠といった、安全性が強調されていました。

<br>
<ins>３．LLMや基盤モデルを活用するアプリケーション（Amazon Q）</ins>

「Amazon Q」（生成AIアシスタント）を活用した、開発ライフサイクル（設計～テスト～実装）支援、モデル選択・利用における開発支援について紹介されていました。AWS版ChatGPTのようなイメージですね！
<br>


###### その他講演
他に個別セッションとしては下記に参加しました。  

* NoSQLコスト削減大全
* AIアプリ開発プロジェクトの始め方
* 生成AIの発展的な活用 - 数クリックで基盤モデルを自社業務専用モデルにファインチューニング -
* 北海道ガスにおけるデータ活用の機動性向上への取り組み～Amazon RedshiftとMotionBoardによるデータ分析基盤～

個人的には、北海道ガスさんのような個別事例セッションに参加すると具体的な活用イメージがつきやすく理解が深まるなと感じました。
セッション参加には事前予約が必要で人数が制限されているため、気になる講演があれば早めにチェックするとよいかもしれません。

<br>

## 展示ブース

AWSに関連する250以上のブース展示がされており、個別にお話を伺うことができます。
普段なかなか見ることができないSnowballデバイスやサーバ筐体が見られるのも、こうしたイベントの醍醐味なのかもしれません。

### Snowball edgeデバイス
![PXL_20240621_054247489.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/d149cac3-00b8-13ae-93d7-84fa207cc4ac.jpeg)

### Outpostsサーバ(筐体)
![PXL_20240621_054341208.MP.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/7fd2447f-73b5-af09-3a99-4c18f9e85e9b.jpeg)


<br>

## おまけ
AWS資格を取得していれば認定者ラウンジを利用することが出来ます。
実際に足を運んでみました。

![PXL_20240621_053229081.MP.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/7208f560-2639-097b-9cc5-65cc2be38453.jpeg)

ラウンジを利用するとステッカーが貰えるのですが、残念ながら在庫切れ、、クッキーだけ頂きました。
AWS資格保有している方はグッツが先着順のため、早めにラウンジへ訪れることをお勧めします！

<br>

他には、基調講演入場前にクッション、newrelicさんのブースで白Tシャツをいただきました。
※クッションも先着順で無くなり次第配布終了とのこと
![PXL_20240622_122916370.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3784483/47bf41fa-be53-e79b-ea98-a11c1184b0af.jpeg)

イベント参加記念として大切にしたいと思います。

<br>

## まとめ
目玉はやはり生成AI。BedrockやSageMakerの紹介が多かった印象でした！
AWS SummitはAWSに関する最新トレンド・知見を深めたい方にはもちろん、学習モチベーションを上げたい方にとっても、とても良い機会だと思いました。
※平日開催のため現地参加するには仕事の調整をしないといけないところがつらいですね..

また来年も可能であれば足を運びたいと思います！

<br>
<br>
<br>
CSSでHTML要素を左右にスライドするアニメーション作ってみた

# はじめに
今回はブラウザ画面の中央から左右にUIがスライドするアニメーションを作成します。
本記事ではHTML要素の作成にReactを使用しますが、通常のHTMLでも同じように作成可能です。
CSSのkeyframesを活用して、アニメーションを実装していきます。


# ゴール
次のようなアニメーションを作ることを本記事のゴールとします。

![sample_loading.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1247619/4bf4413b-a3b0-d6b3-361c-c6ac686a33e1.gif)



# 環境

- react：18.3.1
- vite：5.3.1


# ソース

アニメーションを当てるHTML要素を`div` タグで作成します。

```tsx:App.tsx
import './App.css';

const App: React.FC = () => {
  return (
    <>
      {/* 右へ移動するアニメーション */}
      <div className={'slide-animation slide-animation-right'} />
      {/* 左で移動するアニメーション */}
      <div className={'slide-animation slide-animation-left'} />
    </>
  );
};

export default App;
```


`keyframes` アニメーションによって、背景色を黒から白に変えながら要素を左右にスライドします。
横スクロールバーは表示させたくないので、`overflow-x: hidden`で非表示に設定。
詳細はコメントの通りです。

```css:App.css
/* 中央から右へスライドするアニメーション */
@keyframes slideOutFromCenterRight {
  0% {
    transform: translateX(0%);
    background-color: black;
  }
  100% {
    transform: translateX(100%);
    background-color: white;
  }
}

/* 中央から左へスライドするアニメーション */
@keyframes slideOutFromCenterLeft {
  0% {
    transform: translateX(0%);
    background-color: black;
  }
  100% {
    transform: translateX(-100%);
    background-color: white;
  }
}

/* アニメーション用の基本クラス */
.slide-animation {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}

/* 中央から右へスライドするアニメーションを適用 */
.slide-animation-left {
  animation: slideOutFromCenterRight 2s forwards;
}

/* 中央から左へスライドするアニメーションを適用 */
.slide-animation-right {
  animation: slideOutFromCenterLeft 2s forwards;
}

/* 横方向のスクロールバーを表示しない */
body {
  overflow-x: hidden;
}
```


# 動作確認

サーバを立ち上げアニメーションの挙動を確認します。

```
npm run dev
```

左右にドアが開くようなアニメーションを付与したUIを作成できている事が確認できました。

![sample_loading.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1247619/4bf4413b-a3b0-d6b3-361c-c6ac686a33e1.gif)


# 終わりに
今回作成した左右へスライドするUIに `img` タグでドアや障子、下記の襖ような画像を持たせてスライドするようにしても面白そうだと思ってます。 


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1247619/b5df1223-d771-22bd-c4a3-3d3ede4e0349.png)
リアルタイムコード編集を劇的に効率化する新手法：Positional Integrity Encoding（PIE）

# LET THE CODE LLM EDIT ITSELF WHEN YOU EDIT THE CODE

今回は、最新の研究成果である「LET THE CODE LLM EDIT ITSELF WHEN YOU EDIT THE CODE」という論文をご紹介します。この研究は、コード生成シナリオにおける大規模言語モデル（LLM）の効率性を改善するための新しいアプローチを提案しています。

### 論文情報
- **タイトル**: LET THE CODE LLM EDIT ITSELF WHEN YOU EDIT THE CODE
- **リンク**: [arXiv:2407.03234](https://arxiv.org/abs/2407.03234)
- **発表日**: 2024年7月3日
- **著者**: Zhenyu He, Jun Zhang, Shengjie Luo, Jingjing Xu, Zhi Zhang, Di He
- **DOI**: [10.48550/arXiv.2407.03234](https://doi.org/10.48550/arXiv.2407.03234)

## 背景と目的
この研究は、リアルタイムでコードを編集しながら次のトークンや行を予測するコードアシスタントにおいて、計算効率と精度のトレードオフを解決することを目的としています。従来の方法では、シーケンスが長くなるとKVキャッシュの再エンコードが計算負荷となり、特にコード生成シナリオでのリアルタイム応答が困難でした。

## 研究の焦点
研究の焦点は、回転位置エンコーディング（RoPE）に基づいた「Positional Integrity Encoding（PIE）」を提案し、KVキャッシュの時間的な混乱を防ぎつつ、計算効率を大幅に向上させることにあります。

## 実験の概要と結果
この研究では、DeepSeek-Coderモデルを用いてRepoBench-C-8kデータセット上での実験を行い、コード挿入、コード削除、および複数箇所のコード編集という三つの現実的なコーディングタスクを通じてPIEの効果を検証しました。PIEは、全モデルサイズおよびタスクにおいて、従来の完全再計算アプローチと比較して計算負荷を85%以上削減しながら、性能をほぼ同等に保つことが示されました。

### 賛否両論
**賛成意見**
- PIEは、リアルタイムのコード編集シナリオにおいて、計算効率を大幅に向上させると同時に、高い予測精度を維持する点が評価されています。
- 具体的な実験結果として、PIEが全てのモデルサイズ（1.3B、6.7B、33B）において、従来の方法と同等の精度を達成しながら計算時間を大幅に短縮していることが示されています。

**反対意見**
- 本手法の適用範囲がコード生成に限定されているため、他の自然言語処理タスクへの汎用性についてはさらなる検証が必要です。
- PIEの実装がRoPEに依存しているため、他の位置エンコーディング手法との比較や併用の可能性についても検討の余地があります。

## まとめ
Positional Integrity Encoding（PIE）は、リアルタイムのコード編集におけるLLMの計算効率と精度のバランスを改善する革新的な手法です。PIEの導入により、開発者はより効率的で応答性の高いAIコーディングアシスタントを利用できるようになります。今後の研究では、PIEを他の最適化手法と統合し、コード生成以外のタスクへの適用可能性を探ることが期待されます。

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

## 0. 前置き

タイトルの「変数は一度だけ書き込む」というのは、リーダブルコードの9.3章のタイトルから抜粋してます。この内容から、自分なりのまとめや解釈を書いていこうと思います。

最近、Flutterメインなので、サンプルなどはdart言語を用いて書いてますので、ご了承ください。

## 1. 一度だけ書き込める変数

一度だけ書き込める変数にどんなものがあるか。大きく2つあるかなと思います。

### 1.1. 定数（const）

わかりやすいのが**定数**ですね。プログラム内にデータを埋め込んじゃいます。

```dart: サンプルコード（const）
void main() {
  const int maxCount = 10;
  maxCount = 20; // Error: Can't assign to the const variable 'maxCount'.
}
```

上記のサンプルは、 `maxCount` という定数を定義しています。その後に、定数に対して書き込む処理を書いてますが、コンパイル時にエラーが返されてますね。

ひとまず、 **一度しか書き込めない変数** の出来上がりです。


### 1.2. 再代入不可（final）

再代入不可といったら、定数もそうなんですが、ここではプログラム内で作成したデータを持つ変数について書きます。

```dart: サンプルコード（final）
import 'dart:math';

void main() {
  final int count = Random().nextInt(10);
  count = 20; // Error: Can't assign to the final variable 'count'.
}
```

上記のサンプルでは、ランダムな数字（0〜9）をプログラム内で作成し、変数に格納しています。その変数に `final` をつけることで再代入が不可となります。再代入しようとすると、コンパイル時にサンプルのようなエラーメッセージがしっかりと表示されます。

こちらでも、 **一度しか書き込めない変数** が出来上がりました。

### 1.3. まとめ

:::note info
一度しか書き込めない変数には、下記の２つがある。
・定数（const）
・再代入不可（final）
:::

## 2. 実例

**一度しか書き込めない変数** はわかったけど、実際どう便利なの？ってところを書きます。

### 2.1. 再代入し放題パターン

```dart: NG: 合計金額を出すプログラム（再代入し放題パターン）
void main() {
  //・・・①: 必要な変数を定義
  double price = 1000;   // 単価
  double discount = 0.8; // 割引率
  int count = 3;         // 購入数
  double tax = 1.1;      // 税率

  price = price * discount; //・・・②: 単価に対して、割引をかける
  
  // なんか、いろんな処理

  price = price * count; //・・・③: 購入数をかける

  // さらに、いろんな処理
  
  price = price * tax; //・・・④: 税率をかける

  // ついでに、いろんな処理
  
  print(price); //・・・⑤: 合計金額を表示
}
```

上記は、ざっくりとした合計金額を計算するプログラムですね。（細かい指摘はご容赦ください・・・）

一見、問題のない簡単なプログラムに見えます。
実際のプログラムは、 **// いろんな処理** のところに何十行、何百行といった処理が入ってくることがあります。（~~もともと、そんなプログラムはクソだというのは置いといて~~ ）

**もし、「⑤: 合計金額を表示」で合計金額に誤りがあることがわかったらどうでしょう。**

おそらく、 `price` に関わっている処理を全て見直すことになると思います。 `price` は再代入可能な変数なので、もしかしたら **// いろんな処理** のところで、全く想定していなかった値が代入されているかもしれません。さらに、これは他の変数（ `discount` 、 `count` 、 `tax` ）にも同様のことが言えます。

そうなると、プログラムのどこに問題があるのか、それを探すのがとてつもなくく大変な作業だと思えるじゃないでしょうか。


### 2.2. 再代入不可パターン


```dart: OK: 合計金額を出すプログラム（再代入不可パターン）
void main() {
  //・・・①: 必要な変数を定義
  const double price = 1000;   // 単価
  const double discount = 0.8; // 割引率
  const int count = 3;         // 購入数
  const double tax = 1.1;      // 税率
  
  final discountedPrice = price * discount; //・・・②
  
  // なんか、いろんな処理

  final totalPrice = discountedPrice * count; //・・・③

  // さらに、いろんな処理
  
  final taxedTotalPrice = totalPrice * tax; //・・・④

  // ついでに、いろんな処理
  
  print(taxedTotalPrice); //・・・⑤
}
```

定義した変数の全てに **const** と **final** をつけました。
こうすると、「変数が変なところで変更されているかもしれない」という心配をしなくてよくなります。例え、⑤でバグが発覚したとしても、とても追いやすくなりました。

### 2.3. まとめ

:::note info
変数の思わぬ変更から守るために、変数を再代入不可にする（const, finalをつける）
:::

## 3. 最後に

実例では処理をメインに書きましたが、本当の実例は Price クラスを作ったりして、対応することが多いでしょう。その場合も同じで、Priceクラスのインスタンス化された変数が容易に変更されないよう注意が必要です。

さらに踏み込んだ**完全コンストラクタ**という手法もありますが、ここでは省きます。ぜひ、調べてみてください。
大規模言語モデルの驚愕の脆弱性：単一スペースで破れる安全性

# Single Character Perturbations Break LLM Alignment

今回は、最新の研究成果である「Single Character Perturbations Break LLM Alignment」という論文をご紹介します。この研究は、大規模言語モデル（LLMs）の整合性を単一文字の追加によって破ることができるという驚くべき発見を報告しています。

### 論文情報
- **タイトル**: Single Character Perturbations Break LLM Alignment
- **リンク**: [arXiv:2407.03234](https://arxiv.org/abs/2407.03234)
- **発表日**: 2024年7月3日
- **著者**: Leon Lin, Hannah Brown, Kenji Kawaguchi, Michael Shieh
- **DOI**: 10.48550/arXiv.2407.03234

## 背景と目的
LLMsは、感度の高い人間向けの設定で展開される際に、安全でバイアスがなく、プライバシーを侵害しない出力を提供することが求められます。これに対応するため、モデルは危険なプロンプトに対する応答を拒否するように訓練され、指示されています。しかし、本研究では、モデルの入力の末尾にスペースを追加するだけで、この防御策を破ることが可能であることが示されています。

## 研究の焦点
本研究は、8つのオープンソースモデルを対象に、入力末尾にスペースを追加することで有害な出力を生成する攻撃がどれほど成功するかを調査しています。この攻撃が成功する理由を探り、トークン化された訓練データの中でスペースが出現する文脈がモデルにリスト生成を促し、安全な要求を拒否する信号を上書きすることを発見しました。

## 実験の概要と結果
8つのオープンソースモデル（Vicuna、Falcon、Llama-3、ChatGLM、Mistral、Llama-2、MPT-7B）に対して、スペースを追加する攻撃を行いました。その結果、モデルの大多数が非常に高い成功率で有害な出力を生成することが確認されました。特にVicuna 7BとGuanaco 7Bは100%の攻撃成功率を示しました。

具体的な実験結果は以下の通りです：
- **Vicuna-7B**: 100.0%
- **Guanaco-7B**: 100.0%
- **Falcon-7B**: 84.0%
- **Mistral-7B**: 58.0%
- **ChatGLM-6B**: 62.0%
- **MPT-7B**: 21.0%
- **Llama-3-8B**: 3.0%
- **Llama2-7B**: 0.0%

### 賛否両論
**賛成意見**
- この研究は、現在のモデル整合性の脆弱さを明らかにし、より強固な整合性方法の開発の重要性を示唆しています。
- 単一のスペース追加がこれほど強力な攻撃手法となることは、モデルのトレーニングとトークン化の文脈に対する新たな洞察を提供します。

**反対意見**
- この攻撃手法が現実のシナリオでどれほど実用的であるかについては疑問が残ります。
- この研究は主にオープンソースモデルに焦点を当てており、商用モデルに対する影響はまだ明らかにされていません。

## まとめ
本研究は、LLMsの整合性の脆弱性を明らかにし、トークン化とトレーニングデータの文脈がモデルの応答に与える影響についての重要な洞察を提供します。今後の研究は、このような攻撃に対する防御策の開発と、モデルの整合性を強化するための方法を探ることが求められます。

この記事が皆さんの研究や実務に役立つことを願っています。ご質問やフィードバックがありましたら、コメント欄にお寄せください。
p5.toio で複数台の toio を制御するときに時間差で動作させる

## はじめに
[p5.toio](https://tetunori.github.io/p5.toio/) を使った toio　の制御を行う際に、複数台の処理を時間差で実行するという話です。

### 試した内容の動作確認中の様子
先に、今回試した内容の結果を掲載します。

以下では、ボタンを押下すると 250ミリ秒の時間差で、8台の toio が順番に動き出します（一定時間、回転する動作を行います）。

<iframe width="560" height="315" src="https://www.youtube.com/embed/csXJbubqXGw?si=9O57hUvIjagkHqvb" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

### 時間差での動作
時間差で動作させる部分では、以下の記事などで書かれている方法を活用します。

●ES2017 async/await で sleep 処理を書く - Qiita
　ttps://qiita.com/asa-taka/items/888bc5a1d7f30ee7eda2

記事内で出てくる以下の内容です。

```javascript
const sleep = msec => new Promise(resolve => setTimeout(resolve, msec));

(async () => {
  await sleep(1000);
})();
```

## p5.toio の処理をまじえた実装
具体的な実装内容は以下のとおりです。

```javascript
const gCubes = [];

let angle;

function setup() {
  createCanvas(400, 400);
  background(220);
}

function mouseClicked() {
  P5tCube.connectNewP5tCube().then((cube) => {
    gCubes.push(cube);
    cube.turnLightOnRGB(random(255), random(255), random(255), 0);
  });
}

function keyPressed() {
  rotateCubes();
}

const sleep = (msec) => new Promise((resolve) => setTimeout(resolve, msec));

function rotateCubes() {
  if (gCubes.length > 0) {
    (async () => {
      for (const cube of gCubes) {
        cube.rotate(50, 50);
        await sleep(250);
      }
    })();
  }
}
```

上で少し書いていた `sleep` を利用している部分は以下です。
その実装部分では、[即時実行関数式](https://developer.mozilla.org/ja/docs/Glossary/IIFE)を使いました。

```javascript
function rotateCubes() {
  if (gCubes.length > 0) {
    (async () => {
      for (const cube of gCubes) {
        cube.rotate(50, 50);
        await sleep(250);
      }
    })();
  }
}
```

これで、意図通りの動作をさせられました。
メモリ不足で？AWS EC2 linux2+MATE環境のchromiumでwebサイトが見られなかった件

# まず結論
t2.nanoではなく、t2.microを使用すると解決した。

# はじめに
EC2 linux2にMATEでデスクトップ環境を構築しましたが、そのインスタンスにRDP接続しChromiumでwebページを表示しようとしたところ、`Error code 5`となって目的のページは表示されませんでした。


# 問題
EC2のアウトバウンドルールで全てのプロトコルを、IPを`0.0.0.0/0`を許可しています。EC2検索候補の表示はされるので、webとの通信は問題なさそうです。

問題は、chromiumでwebページを表示させようとした場合に`Error code 5`が出力され、目的のページが表示されません。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/222220/837db785-9ddc-6a57-3eb1-e2adcf3b2c0e.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/222220/e132c0ce-caac-585d-97d6-01f8099e3e73.png)

また、ssh経由でchrome headlessモードで特定のページのスクリーンショットを撮ろうとしても、`Failed to reserve virtual memeory for CodeRange`となりました。（そのままですが。）
```
[ec2-user@ip-xxx-xxx-xxx-xxx ~]$ google-chrome --headless --screenshot --window-size=1280,1000 https://qiita.com/
[0707/013044.311024:WARNING:sandbox_linux.cc(430)] InitializeSandbox() called with multiple threads in process gpu-process.
[0707/013045.023361:WARNING:bluez_dbus_manager.cc(248)] Floss manager not present, cannot set Floss enable/disable.
[0707/013045.111257:ERROR:v8_initializer.cc(809)] V8 process OOM (Failed to reserve virtual memory for CodeRange).
[0707/013045.164549:ERROR:file_io_posix.cc(145)] open /sys/devices/system/cpu/cpu0/cpufreq/scaling_cur_freq: No such file or directory (2)
[0707/013045.164702:ERROR:file_io_posix.cc(145)] open /sys/devices/system/cpu/cpu0/cpufreq/scaling_max_freq: No such file or directory (2)
[0707/013045.167388:ERROR:directory_reader_posix.cc(43)] opendir /tmp/Crashpad/attachments/1825df44-52da-44ea-a1f9-132f48cdb934: No such file or directory (2)
[0707/013045.924564:ERROR:http_transport_libcurl.cc(485)] HTTP status 429
```

# 原因と解決
headlessモードのエラー原因は、Error出力そのまま、メモリ不足。
t2.nanoで起動していたインスタンスを一度停止し、t2.microに変更し起動したところ、googleページを無事見ることができました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/222220/8d31e8e7-f561-a552-11a0-96f235028980.png)

また、ssh接続からheadlessモードで実施したスクリーンショットも無事取得することができました。

```
[ec2-user@ip-XXX-XXX-XXX-XXX ~]$ google-chrome --headless --screenshot --window-size=1280,1000 https://qiita.com/
[0707/150010.610467:WARNING:bluez_dbus_manager.cc(248)] Floss manager not present, cannot set Floss enable/disable.
[0707/150010.776913:WARNING:sandbox_linux.cc(430)] InitializeSandbox() called with multiple threads in process gpu-process.
337029 bytes written to file screenshot.png
```


# まとめ
グラフィック処理となった場合は、t2.nanoでは厳しいようです。

ちなみに、t2.microでも、RDP接続したままでssh接続からheadlessモードでスクリーンショットを撮ろうとするとメモリ不足でダメでした。
[Dify]ナレッジに15MB以上のファイルを入れたい


## はじめに

みなさんDifyのナレッジにはどんなPDFを入れますか？
レビュー論文やオライリーのPDFなど、15MB以上になるファイルを入れたいと思ったことはありませんか？
今回は15MB以上のファイルをナレッジに入れることができるようになる方法を忘れないように書いておきます。

## ナレッジのファイルサイズ制限を変更方法
Difyでは`docker/.env`の`UPLOAD_FILE_SIZE_LIMIT`でファイルサイズを制限しています。
なので以下のように変更しちゃいましょう。
```
UPLOAD_FILE_SIZE_LIMIT=30

```

ただこれだけではnginxの制約に引っかかってしまうので以下も設定しておきましょう。

```
NGINX_CLIENT_MAX_BODY_SIZE=30M
```

これで30MBのファイルをナレッジに入れることができます。
試して見ましょう。
![スクリーンショット 2024-07-08 0.00.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/376115/0b8899fe-ced3-b5e5-11d3-4fbbf919a355.png)

これでオライリーのPDFとかもナレッジにできる。勉強が捗りそうです。

## 最後に


Xをやっているので気になる方はフォローお願いします。
https://x.com/hudebakonosoto
GPT-4しか知らないあなたの知識はもう古いらしい

# はじめに
おはようございます、しなもんです。

2023年にOpenAIがGPT-4を公開して以来、大規模言語モデルは急速な進化を遂げました。

リリース当初はそれはもう大注目され世間を変え業界を変え...
ですが、主人公であったGPT-4には**次々にライバルが立ちはだかっています**

正直、もしChatGPTだけを使っているのならば、あなたは最新のAI技術動向から取り残されている可能性があります。

ということで、この記事では現在の大規模言語モデルの動向を、なんとか取り残されないように、しっぽつかむくらいの感覚で追えればと思います。

:::note warn
この記事は、あくまで言語モデル自体の話をしており、
FigmaAIやNotionAI、DuolingoのようなAIサービスの話ではありません。
また、DALL-Eのような画像生成についても言及しません。
:::

# 1年でこれだけのことが変わっている

### トークン数の増加
生成AIが一度に処理できる情報量を指す**コンテキストウィンドウ**という言葉があります。
簡単に言うと、入力できるプロンプトの長さです。

`GPT-3.5`のような従来の生成AIは、コンテキストウィンドウが短く、限られた情報しか処理できませんでした。
そのため、長い文章を理解したり、複雑なタスクを実行したりすることが困難でした。

ですが、現在では長いコンテキストウィンドウを持つ生成AIが開発されていて、その進化具合は一目瞭然です。
```
ChatGPT: 4,096トークン（GPT-3.5）→ 32,768トークン（GPT-4）
Claude: 100,000トークン以上（Claude 3 Opus）
```
**桁が全く違います。びっくり。**

このように膨大なトークンを入力できるようになると、数千ページに及ぶ文書や小説を要約したり、膨大で複雑なコードを理解できるようになる等、可能性が大きく広がるのです。

### マルチモーダル化
マルチモーダルとは、生成AIが処理できる情報の種類を指します。
従来の生成AIでは主にテキスト情報を処理していましたが、現在のAIは画像、音声、動画を処理できることが当たり前になってきています。

- 画像の説明
- 音声認識
- 動画の理解
- 画像の生成

このようなメディアが組み合わされることで、より豊かな情報を理解し、より視覚的なアウトプットが出来るようになっています。

### 専門性の向上
ChatGPTはその汎用性に全振りした設計から、しばしば「ChatGPTは専門性に欠ける」といわれることがありましたが、それはその通りです。

現在のAIモデルは、基本的には「素体」であることが重視されています。
ノーカスタムのAviutlが動画の継ぎ接ぎしかできないのと同じです。（？）

その代わり、業界全体で「AIのカスタム性」「専門的機能の追加」が大きく流行っている気がします。
GPTsは正にその流れを汲んでいるもので、バニラのChatGPTに様々な機能を追加できるようになっています。
画像生成やブラウザ機能はもちろん、作曲や自分だけの家庭教師、漫才をしてくれるGPTなど、たくさんあります。

### 省エネ化への取り組み
大規模なAIモデルは膨大な計算量を必要とし、環境負荷が懸念されていました。
しかし、新しいアルゴリズムやハードウェアの開発により、処理効率が向上し、省エネ化が進んでいます。
NVIDIAが専用のハードウェアを出したことは記憶に新しいと思います。

# 強力な生成AIモデルはChatGPTだけでは無くなった

## Claude
最近話題の、元OpenAIのメンバーが立ち上げたAnthropic社開発の生成AIです。
安全で信頼できるAIの実現に重きを置き開発されていますが、基本的にはChatGPTと似たシステムです。

「Artifacts」機能がめちゃくちゃヤバいっぽいです。

https://x.com/alumican_net/status/1807742304410910879

## Gemini(Bard)
Googleが開発しているAIです。
BardというAIサービスの一部で、Gemini単体ではChatGPTと同じ分野です。
発表当時はBardというAIでしたが、Geminiへ進化する過程で能力が向上しています。
ChatGPTとの技術的な違いはあまりないですが、会社が違うということは運営思想が異なるということです。選択肢が増える。

## LLaMA
**一週間でリークされて話題になったアレ。**
Meta AIが開発したAIです。
こちらは今まで紹介したAIとは異なり、カスタム性に全振りしたAIといえます。
モデルのサイズは70億から1370億パラメータまで選べ、かつモデルがオープンソースであるため
様々な分野で研究が進んでいるようです。

# 最後に
1年たっただけで、LLMは大きく進化していてできることが非常に増えました。
プロンプトエンジニアリングとかもそろそろ勉強すべきなのかも...
LLMの新たな防御手法：自己評価による敵対的攻撃対策

# Self-Evaluation as a Defense Against Adversarial Attacks on LLMs

今回は、最新の研究成果である「Self-Evaluation as a Defense Against Adversarial Attacks on LLMs」という論文をご紹介します。この研究は、自己評価を活用したLLM（大規模言語モデル）への敵対的攻撃に対する防御手法を提案しています。

### 論文情報
- **タイトル**: Self-Evaluation as a Defense Against Adversarial Attacks on LLMs
- **リンク**: [arXiv:2407.03234](https://arxiv.org/abs/2407.03234)
- **発表日**: 2024年7月3日
- **著者**: Hannah Brown, Leon Lin, Kenji Kawaguchi, Michael Shieh
- **DOI**: 10.48550/arXiv.2407.03234

## 背景と目的

LLMの出力の安全性確保は、ますます重要な課題となっています。従来の手法では、強化学習を用いた人間のフィードバック（RLHF）や推論時のガードレールが提案されてきましたが（Team, 2024; Rebedea et al., 2023）、これらの防御を突破する攻撃が増加しています（Zou et al., 2023; Zhu et al., 2023）。既存の防御策には高コストなアルゴリズムやモデルの微調整が必要であり（Kumar et al., 2023; Robey et al., 2023）、一部は専有APIに依存しています（例：OpenAIコンテンツモデレーションAPI）

## 研究の焦点

本研究は、モデルの微調整を行わずに、事前訓練されたモデルを使用して生成モデルの入力および出力の安全性を評価する手法を提案しています。この方法により、コストを大幅に削減しながら、オープンソースおよびクローズドソースのLLMに対する攻撃成功率（ASR）を劇的に低減させることができます

## 実験の概要と結果

### 方法
本研究では、評価モデル（E）を使用して、生成モデル（G）の入力（X）および出力（Y）を分類します。これにより、安全でないと判断された入力や出力は生成モデルに渡されず、逆に安全と判断された場合のみ生成モデルに入力が渡され、出力が生成されます。このプロセスは以下の三つの設定で行われます：
1. **Input-Only Defense**: ユーザー入力（X）のみを評価
2. **Output-Only Defense**: 生成された出力（Y）のみを評価
3. **Input-Output Defense**: ユーザー入力（X）と生成された出力（Y）の両方を評価

### 結果
実験では、Vicuna-7B、Llama-2、Llama-3、GPT-4を評価者モデルとして使用し、以下のような結果が得られました。
- **Input-Only Defense**では、攻撃成功率（ASR）がほぼ0に低減されました。例えば、Vicuna-7Bに対するASRは95.0%から0.0%に低減されました
- **Output-Only Defense**および**Input-Output Defense**でも同様の結果が得られ、評価者と生成モデルの組み合わせにおけるASRが大幅に低減されました

### 賛否両論
**賛成意見**
- **コスト削減**: モデルの微調整を行わずに既存の事前訓練モデルを活用するため、実装コストが低い
- **高い効果**: 多様なモデルに対して効果的であり、ASRをほぼ0に低減できる
- **耐性**: APIやLlama-Guard2と比較して、攻撃に対する耐性が高い

**反対意見**
- **攻撃の可能性**: 評価者モデルに対する攻撃も可能であり、完全な防御ではない
- **性能への影響**: 一部の評価設定では、生成モデルの性能が低下する可能性がある

## まとめ

本研究は、自己評価を用いたLLMへの敵対的攻撃に対する防御手法を提案し、その有効性を示しました。この方法は、モデルの微調整を必要とせず、事前訓練されたモデルを使用することで、コストを削減しながらも高い防御性能を発揮します。攻撃に対する耐性も高く、実用的な防御手法として有望です。

この記事が皆さんの研究や実務に役立つことを願っています。ご質問やフィードバックがありましたら、コメント欄にお寄せください。
GitHubActionsでdial tcp ***:***: i/o timeoutが起きてデプロイに失敗する場合

GitHub Actionsでデプロイする際に、SSHの鍵にパスフレーズを設定している場合にパスフレーズもレポジトリの設定に登録しないとタイムアウトしてしまうようです。

```
name: CI

on:
  push:
    branches:
      - main

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Deploy
        uses: appleboy/ssh-action@master
        with:
          host: ${{ secrets.SERVER_HOST }}
          username: ${{ secrets.SERVER_USERNAME }}
          port: ${{ secrets.SSH_PORT }}
          key: ${{ secrets.SSH_PRIVATE_KEY }}
          passphrase: ${{ secrets.SSH_PASSPHRASE }} ← これを追加
          script: |
            cd ${{ secrets.SERVER_DEPLOY_DIR }}
            git pull origin main
```

ある時までエラーなくデプロイ出来ていたので、まさかパスフレーズが原因とは思いませんでした。(サーバ移行のタイミングでパスフレーズ付きの鍵にしていたのかな)
【Rails】erbをVSCodeでフォーマットする方法

## 拡張機能をインストール

ERB Formatter/Beautifyという拡張機能をインストールします。

https://marketplace.visualstudio.com/items?itemName=aliariff.vscode-erb-beautify&ssr=false#overview

## Gemをインストール

上記の拡張機能を使用するためにはHTML Beautifierが必要なのでインストールします。

```Gemfile:Gemfile
group :development do
  gem 'htmlbeautifier'
end
```

で`bundle install`。
または、ターミナルで以下のコマンドを実行します。

```terminal:ターミナル
gem install htmlbeautifier
```

https://github.com/threedaymonk/htmlbeautifier?tab=readme-ov-file#installation

## 設定を記述する

`settings.json`に以下の記述を追記します。

```jsonc:settings.json
"[erb]": {
  "editor.defaultFormatter": "aliariff.vscode-erb-beautify",
  "editor.formatOnSave": true
},
"files.associations": {
  "*.html.erb": "erb"
}

// invalid byte sequence in US-ASCII エラーが発生する場合
"vscode-erb-beautify.customEnvVar": {
  "LC_ALL": "en_US.UTF-8"
}
```

上記の設定を記述するとファイル保存時にフォーマットされるようになります。
Sequence Makerは完全オフラインのパソコンでも使えるのか！？

## はじめに
Sequence MakerはExcelから測定器を制御可能にするアドインです。最近のパソコンのソフトは、インターネット接続前提のものが多く、オフラインでは使用できないケースが多くなってきています。しかし、測定器を繋ぐようなパソコンは、ともすると中古のパソコンだったり、お古のパソコンだったり、OSも古かったりと、インターネット接続されていないようなものもたびたび見かけます。この記事ではSequence Makerが完全オフラインのパソコンでも使えるのか検証していきます。Sequence Makerについての詳細は以下の記事を参照ください。

https://qiita.com/sequencemaker/items/8e6a370ab0a793a06a3b

:::note warn
***お断り***
本記事の内容はSequence Maker開発元の公式見解ではなく、あくまでも個人が趣味の範囲内で執筆しているものです。記事の内容について開発元へ問い合わせることはお控えください。ご質問・要望などは各記事のコメント欄へお願いいたします。
:::

## 結論
記事を書き始めて気づいたのですが、公式サイトに書いてありました。せっかくなのでもう少し詳しく見ていきます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/ca9c6b04-d1e9-c377-eae8-019aba1cf7bd.png)

（https://sequencemaker.hioki.com/ja/#faq より引用）


## オフラインのパソコンにSequence Makerをインストール
Sequence Makerのインストールに必要なファイルは全てインストーラーに含まれているので、インストーラーをインターネット接続されているパソコンでダウンロードし、USBメモリーなどでコピーすればOKです。ファイルサイズが3MB程度しか無いため、一瞬「もしかしてインストール時にファイルをダウンロードするパターンなのでは…」と不安になる方もいるかもしれませんが、安心してください！全部入りです。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/7b94679c-e54a-add7-db6d-a18aa5c52e1f.png)

## オフラインでの動作
オフライン状態でも、測定器の制御をする分には、特に問題ありません。
また、マニュアルについてもオフラインで閲覧可能です。以下のフォルダにあります。

```
C:\ProgramData\HIOKI\Sequence Maker\Manual
```

## 制約事項
### 最新版のチェックは使えない
FAQにも書かれていた通り、「最新版のチェック」機能はインターネット経由なので動作しません。以下のエラーが出ます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/c09eb61b-a0b5-b293-393b-05143033b8e9.png)


### LINEへのメッセージ送信はできない
インターネットに接続されていると#LINE(メッセージ)で送信できますが、オフラインだとErrorになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/be34a8ce-000b-7bdf-7ffe-aa5dd4493e24.png)

制約事項はそれくらいでしょうか。。。特に問題ナシ！


## その他注意
Sequence Makerのインストールから実行までオフラインで大丈夫なのですが、ちょっと注意事項があります。

- Excelをインストールする際にインターネット接続が必要な場合がある
- 測定器と通信するためのUSBドライバーをインストールする際にインターネット接続が必要な場合がある
- 測定値のやりとりがUSBメモリーとかだとめんどう。

## まとめ
Sequence Makerはオフラインでも問題なく使えることが確認できました。でもやっぱり今時オフラインだといろいろと不便すぎるので、できるだけオンラインなパソコンを用意したほうが良いと思います。
ざっくりGitのコマンド一覧

# Gitコマンドのチートシート

## はじめに
Gitは、分散型バージョン管理システムであり、ソースコードの管理や共同作業に広く使用されています。この記事では、Gitの基本的なコマンドをチートシート形式で紹介します。これにより、日常的なGit操作を効率的に行うための参考になります。

## 目次
1. [リポジトリの操作](#リポジトリの操作)
2. [ファイルの操作](#ファイルの操作)
3. [コミットの操作](#コミットの操作)
4. [ブランチの操作](#ブランチの操作)
5. [リモートリポジトリの操作](#リモートリポジトリの操作)
6. [その他の便利なコマンド](#その他の便利なコマンド)

## リポジトリの操作
### 新しいリポジトリの作成
``` Git
git init
```

新しいGitリポジトリを作成します。

### 既存のリポジトリをクローン
``` Git
git clone <リポジトリURL>
```

リモートリポジトリをクローンしてローカルにコピーします。

## ファイルの操作
### ファイルのステージング
``` Git
git add <ファイル名>
```

指定したファイルをステージングエリアに追加します。

### すべてのファイルをステージング
``` Git
git add .
```

カレントディレクトリ以下のすべての変更をステージングエリアに追加します。

### ファイルのステージング解除
``` Git
git reset <ファイル名>
```

ステージングエリアから指定したファイルを削除します。

## コミットの操作
### コミットの作成
``` Git
git commit -m "コミットメッセージ"
```

ステージングエリアの変更をコミットします。

### ステージングとコミットを同時に行う
``` Git
git commit -a -m "コミットメッセージ"
```

変更されたすべてのファイルをステージングしてコミットします。

### 最後のコミットメッセージを修正
``` Git
git commit --amend -m "新しいコミットメッセージ"
```

最後のコミットメッセージを修正します。

## ブランチの操作
### 新しいブランチの作成
``` Git
git branch <ブランチ名>
```

新しいブランチを作成します。

### ブランチの一覧表示
``` Git
git branch
```

ローカルブランチの一覧を表示します。

### ブランチの切り替え
``` Git
git checkout <ブランチ名>
```

指定したブランチに切り替えます。

### ブランチの作成と切り替えを同時に行う
``` Git
git checkout -b <ブランチ名>
```

新しいブランチを作成し、そのブランチに切り替えます。

### ブランチの削除
``` Git
git branch -d <ブランチ名>
```

指定したブランチを削除します。

## リモートリポジトリの操作
### リモートリポジトリの追加
``` Git
git remote add origin <リポジトリURL>
```

リモートリポジトリを追加します。

### リモートリポジトリの一覧表示
``` Git
git remote -v
```

リモートリポジトリの一覧を表示します。

### リモートリポジトリからのフェッチ
``` Git
git fetch
```

リモートリポジトリから最新の変更を取得します。

### リモートリポジトリからのプル
``` Git
git pull
```

リモートリポジトリから最新の変更を取得してマージします。

### リモートリポジトリへのプッシュ
``` Git
git push origin <ブランチ名>
```

指定したブランチをリモートリポジトリにプッシュします。

## その他の便利なコマンド
### コミット履歴の表示
``` Git
git log
```

コミット履歴を表示します。

### 簡潔なコミット履歴の表示
``` Git
git log --oneline
```

簡潔な形式でコミット履歴を表示します。

### ファイルの変更内容を表示
``` Git
git diff
```

ワーキングディレクトリとステージングエリアの変更内容を表示します。

### ステージングエリアの変更内容を表示
``` Git
git diff --staged
```

ステージングエリアの変更内容を表示します。

### ファイルの状態を表示
``` Git
git status
```

ワーキングディレクトリとステージングエリアのファイルの状態を表示します。

### タグの作成
``` Git
git tag <タグ名>
```

新しいタグを作成します。

### タグの一覧表示
``` Git
git tag
```

タグの一覧を表示します。

### タグの削除
``` Git
git tag -d <タグ名>
```

指定したタグを削除します。

## まとめ
このチートシートでは、Gitの基本的なコマンドを紹介しました。これらのコマンドを活用することで、Gitを効率的に操作し、バージョン管理をスムーズに行うことができます