OmniAICreator/Qiita-1.07M huggingface dataset:
trpcで型エラーが起きたときはバージョンを揃えよう

# TRPCはバージョンが異なるとエラーがたくさん発生して泣きそうになる


## どういうときにバージョンが異なってしまうのか
基本的にはフロントエンドとバックエンドを同時に作成すると思います。そのときは動きますが、バックエンドでライブラリのバージョンだけ上げてフロントエンドを上げ忘れたりとか、共通のバックエンドで新しいフロントエンドを追加したときなどによくエラーが出て泣きそうになります。
よって、バージョンは固定しましょう。
おかしくなったらlockファイルを消してnode_modulesも消して入れ直しましょう。
それで大体治ります。

困ったらバージョンをしっかり指定してインストールです。
バージョンあげるときも一気にあげましょう。

## TypeScriptのバージョンもあわせよう
trpcのバージョンは一緒でも、TypeScriptのバージョンが違ってエラーが出るときもあります。ここもちゃんと揃えましょう。また、VSCODEのTypeScriptのバージョンが違ってエラーが出るときもあります。そういうときはエディタ内蔵のTypeScriptを使ってみたり、自分のインストールしたTypeScriptのバージョンを下げてみたり試行錯誤してみましょう。

## 基本的にはモノレポでつくったほうが良い
別gitで、完全に別ディレクトリでも動きますけど、たまにわけわからんエラーになったりして泣きそうになるのでモノレポにしておいたほうが良いです。またべつでtrpcのモノレポ最小構成について記事を書きますが、こんな感じのpackage.jsonにしておくとよろしいかと思います。

```json:package.json
{
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "main": "src/index.ts",
  "types": "src/index.ts",
}
```

```ts:index.ts
...etc
export * from "./appRouter";
```
バックエンド側はこんな感じでappRouterをmainに露出します。

フロントエンド側のpackage.jsonにdependenciesで足してあげます。

```json:package.json
...etc,
 "dependencies": {
    "server": "workspace:*",
```

こうするとモノレポで良い感じに型がつきます。

## superjsonのバージョンもあわせよう

いままでは上記3つでなんとかなっていたのですが、先日、transformerにsuperjsonを入れたとき、superjsonのバージョンが違うせいでなかなかエラーが解消されませんでした。ライブラリのバージョンもしっかりあわせておきましょう。

なにはともあれバージョンをあわせることが大事です。困ったらバージョンをあわせてみよう。それでもダメなら関数の返り値がおかしかったりするので、しっかり関数の型を明記してみたりしましょう。あとは普通にzodSchemaが間違ってたとか。

そんな感じ。
初投稿、はじめまして。

<h1>デザイナーから転向しました。</h１>

アカウント作ってから
５年ほど放置してましたが
技術の備忘録をと、舞い戻ってきました。
どうぞよろしくです！



自治体でインハウス的にグラフィック制作やチェックやら
企業のコンテンツ企画やらディレクションやらで
育児と並行して10年以上グラフィックデザイナーの看板で走ってきました。

コロナでの引っ越しや
子供の小学校卒業やらをきっかけに
前から興味があった、Webの世界に飛び込む決意を固め、現在に至ります。

<h1>フロントエンドかっこいい！</h1>

そもそも年齢も40代後半で結構いってるので
キャリアパスどうしよう。。。って感じでした。
この頃はまだWebの制作と開発の違いすら理解できてなくて
必要とされるスキルが何かを特定したくても、用語すらわからないので
調べても聞いても理解が追いつかないような状況が
２ヶ月くらいあった気がします。

🟡制作　＝　ビジュアルを設計する（XDやFigma、Photoshopなどのツールを使用）
一般的に、Webデザイナーという職種、コーダーだとマークアップ言語の習得は必須

🔵開発　＝　制作物を元にWeb上に実現させる（エディタやプログラミング言語を使用）
一般的に、Webエンジニアという職種、言語や技術は制作よりも高いものが要求される

グラフィックデザインや企画や交渉の経験を活かせそうだなと思ったのが
フロントエンドエンジニアという職種でした。
コードもさわれて、デザインの知識も必要とされ、コミュニケーション力も必要とされる。
めっちゃカッコいいし、目指したいと思いました。
お給料も良いのも決め手。

技術の学びが終わることがないのが大変だと思う人もいるかもだけど
私は結構ずっと課題と向き合って模索することが好きなので
すごく魅力的に感じました。


<h1>着飾るより、技術武装が好き。</h1>

初投稿で名言。
フロントエンドに必要なスキルを日本だけでなく海外の情報もチェック。
あとは主婦でも投資できる金額のスクールを選び、言語習得をはじめました。
下記金額は現在価格をおよそです（うる覚え、調べるんめんどい）

おかげさまで、マニキュアも買わず毎年同じ服。
美容院も「原始人ぽくなってきたら行く」という頻度で
清潔さを保ちながら武装する日々。

<h6>投資したスクール一覧</h6>
<ul>
    <li>Progate_____ ¥0</li>
    <li>侍テラコヤ___¥2,000/月(もうすぐ1年)</li>
    <li>Udemy______¥2,000x6教材</li>
    <li>職業訓練校___¥7,000(別途交通費)</li>
    <li>Youtube_____¥0</li>
</ul>


<h6>使用ツール一覧</h6>
<ul>
    <li>XD__________¥2,000/月</li>
    <li>Photoshop___¥2,000/月</li>
    <li>Figma_______¥0</li>
    <li>Github_______¥0</li>
    <li>Vercel_______¥0</li>
    <li>Xserver______¥0</li>
    <li>VSCode______¥0</li>
</ul>

<h6>投資した書籍一覧</h6>
<ul>
    <li>HTML,CSS系__________3冊</li>
    <li>WordPress系__________1冊</li>
    <li>IT,Web周り系__________4冊</li>
    <li>JavaScript系__________2冊</li>
    <li>React系______________2冊</li>
    <li>CSS系_______________2冊</li>
    <li>ADOBE系_____________4冊</li>
</ul>

<h6>投資した時間</h6>
<ul>
    <li>平日４~1２時間</li>
    <li>休日6~12時間</li>
    <li>週1日はパソコン触らないデー（本や動画で結局キャッチアップ）</li>
</ul>

※書籍やスクールについてはまた別途投稿したいと思います。

<h1>習得してきている言語（現在）</h1>
<ul>
    <li>HTML, CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    <li>React</li>
    <li>Next.js</li>
</ul>

<h1>これから</h1>
1年でここまできました。
勉強できる環境については家族のバックアップあってこそだと思います。
本当に感謝しつつ、私の勉強したい気持ちをアピールする説得力のおかげもある。
キャリアを真剣に考えているからこそ、私はこの仕事以外できない人間なので、この機会に私はエンジニアに成り上がる！やっと女神の前髪つかんだので、この機会以外もう後はない。そんな気迫で日々向き合ってます。
言語が難しくて挫折とか言ってられない、そんな状況が前向きにさせてくれてるんだと思います。

Qiitaは素敵なコミニティであると聞きました。
恥ずかしいコードをさらけ出したりすると思いますが
笑ってやってもらえれば幸いです！　
また次の投稿で！
[備忘録] shopify cli を使ってオリジナルテーマに挑戦 #1

# 背景
- 知り合いからshopifyを使用したECサイトを作ってほしいとのことで依頼を受けた
- WordPressは何回も制作実績があるので、shopifyも同じような感じなのかと思ったので軽く返事したのがいけなかった:scream:
- せっかくのいい機会なのでshopifyを学びつつ備忘録として作成まで残していく

# shopifyって何？
- 以前からshopifyは知っていたものの全く触ったことがなかったので改めてお勉強:writing_hand:
- とりあえずwiki読みます
    - https://ja.wikipedia.org/wiki/Shopify

# アカウントを作ろう
- ここで注意
- アカウント作成方法が2通りあるみたい
    - 1つは、普通のshopify アカウント
        - こちらは無料アカウントがあって3日間無料
        - その後、3ヶ月は$1で使用
        - 3ヶ月後からはプランで異なるが最低$30ぐらいから
        - https://www.shopify.com/jp


    - もう一つは、shopify パートーナーアカウント
        - 違いがわかりませんが、事業者としてshopifyでECサイトを作成するのはこちらから
        - https://www.shopify.com/jp/partners

# 最後に
- 今回のところはここまで
- Qiitaを触ったことがないので徐々に覚えていこう
[ TypeScript ] オブジェクトの値でリテラル型のユニオンを作る

次のようなJavaScriptのオブジェクトがあったとします

```js
const test = {
  a: "hello",
  b: "world",
  c: 0
}
```

このオブジェクトの値、つまり`"hello"、 "world"、 0`を使って、次のようなリテラル型のユニオンを作りたいとします。

```ts
type TestValues = "hello" | "world" | 0
```

答えは次のとおりです。

```ts
const test = {
  a: "hello",
  b: "world",
  c: 0
} as const // <== !!!

type TestValues =  (typeof test)[keyof typeof test]
// type TestValues = 0 | "hello" | "world"
```

`as const`を忘れずに。

つけ忘れた場合、つぎのようにプリミティブ型のユニオンになります。

```ts
const test = {
  a: "hello",
  b: "world",
  c: 0
}

type TestValues =  (typeof test)[keyof typeof test]
// type TestValues = string | number
```

ちなみにオブジェクトの値ではなく、`キー`をもとに同様の型をつくりたい場合は次のとおりです。

```ts
const test = {
  a: "hello",
  b: "world",
  c: 0
}

type TestKeys =  keyof typeof test
// type TestKeys = "a" | "b" | "c"
```
Brain 覚書

# バッドノウハウ集

随時更新していきます。

## 使用機種
- PW-SH2 (第3世代)

## 解像度など
- index.din 有無による違い

||index.din なし|index.din あり|
|:----------|:---:|:---:|
|SM_CXSCREEN| 480 | 800 |
|SM_CYSCREEN| 320 | 480 |

## フレーム バッファ
- PocketPC の VGA モード用のアプリでは GXDraw ではなく フレームバッファを利用している
  - 具体的には下記のコードである
~~~:C++
    ExtEscape(hdc, GETRAWFRAMEBUFFER, 0, NULL, sizeof(rfbi), reinterpret_cast<char*>(&rfbi));
~~~
  - Brain ではこの方法でフレーム バッファ情報を取得できず、結果エラー終了となる
    - ExtEscape は OS の API (wingdi.dll) なので 対応策はなく、アプリ側を修正するほかない

## 言語
- Windows CE 側のコードページが 932 (日本語) ではないっぽい
  - このため、PocketPC で大丈夫だった Shift-JIS / Unicode 変換で正しく変換できない
- 日本語フォントが入っていないため、GUI 上の日本語はもれなく化ける?

## メモ
- M88P
  - 要 AYGSHELL.DLL / GX.DLL
  - 初期化にコケる (原因不明) 
- np2ppcv
  - VGA 版は フレーム バッファ アドレス取得でコケる
「強いAI」と 「弱いAI」って、何が違うんですか？

## 何を基準に「強い」と「弱い」を判別しているか？
**過去の経験から、自分で判断して行動できるか**
上記ができる場合は強いAI(汎用型AIとも呼ぶ)に、できない場合は弱いAI(特化型AIとも呼ぶ)に分類します。


## 「強いAI」と「弱いAI」を例えるなら
強いAIの代表例「ドラえもん」
のび太くんの気持ちに共感したり、どんな状況でもひみつ道具で解決するロボットは、まさに強いAIの理想像ですね。

弱いAIの代表例「Chat GPT」
依頼内容に合った回答をするので、一見強いAIに思えるかもしれません。
しかし、言語分野しか能力を発揮しないので、弱いAIに分類するんです。


## 調べてみて分かったこと
①弱いAIの「弱い」は、「処理能力の低さ」じゃなくて、「特定の分野しか能力を発揮できない」という意味だった
②特定の処理に特化したAIを、ビジネスでどう活かすかが重要になる！！

以下の記事を参考にしました。

強いAIと弱いAIの違いについて
https://ledge.ai/articles/strong-ai
AIをビジネスに活かすには
https://blog.hubspot.jp/website/ai-strong#:~:text=%E4%BA%BA%E5%B7%A5%E7%9F%A5%E8%83%BD%EF%BC%[…]82%92%E8%A1%8C%E3%81%86AI%E3%81%A7%E3%81%99%E3%80%82
Two component files resolving to the same name

# 目次
1. 背景
2. 警告内容
3. 警告の詳細調査
4. 解決方法
5. 最後に

# 1. 背景
WARN  Two component files resolving to the same name
という警告の対処方法について調べました。

```terminal
Preparing project for development
ℹ Initial build may take a while

 WARN  Two component files resolving to the same name BaseDescription:

 - /Users/yamanedaisei/Desktop/develop/~/components/base/Description.vue
 - /Users/yamanedaisei/Desktop/develop/~/components/base/BaseDescription.vue
```

# 2. 警告内容
同じ名前に解決される2つのコンポーネント・ファイルがあります。

# 3. 警告の詳細調査
実際は同じ名前ではないです。

```js:Description.vue
export default {
  name: 'Description',
```

```js:BaseDescription.vue
export default {
  name: 'BaseDescription',
```

importする際も同じ名前ではimportしてないです。
```vue
<script>
import BaseDescription from '~/components/base/BaseDescription'
```

```vue
<script>
import Description from '~/components/base/Description'
```

ちなみに以下の記事にも書いてある通りnameプロパティとコンポーネント名は関係ないです。
[【Vue】export defaultのnameとは何か？いつどこで何に使い、なぜ必要なのか？意味と役割を実例で解説（Vue.js devtoolsでのデバッグ方法）](https://prograshi.com/language/vue-js/purpose-of-name-in-export-default/)

# 4. 解決方法
どちらかのフィイル名のDescription(似ている部分)を違う名前に変更する
例）Component

警告は出なくなりました。
似たような名前の時にも警告が出るようになっているそうです。

# 5. 最後に
以下を今回の対応で勉強しました。
- nameプロパティがコンポーネント名と関係ない
- 名前解決では似たような名前でも警告を出すことがある

# 参考
- [Two component files resolving to the same nameの解消](https://qiita.com/miyawash/items/159c91fbd29e945935a4)
- [WARN [nuxt] Two component files resolving](https://stackoverflow.com/questions/77063035/warn-nuxt-two-component-files-resolving)
Gitリポジトリをローカル環境にクローンする方法

## はじめに
public公開しているリポジトリを自身のローカル環境にクローンする方法や、特定のブランチの内容をfetchする方法を都度調べることが大変だったため、備忘録も兼ねて記事にアウトプットします。


## GitとGithubの違い
- Git
バージョン管理システムの1つ。
開発工程でセーブポイントのように記録を管理することができ、時系列に記録を取ることができる。また、過去の特定の地点まで作業状態を戻したりすることも可能。

- Github
Gitを使ったホスティングサービスのこと。
Githubを管理することで、複数人で同時に開発作業ができるようになる。また、自身のポートフォリオをGithub上で管理したり、公開することが可能。


## 公開されているリポジトリからcloneをする方法
**1\. クローンしたいアプリケーションのGithubからURLを取得する。**
Githubのリポジトリのトップページ > codeのボタン > HTTPS用のクローンURLをコピーする。
```
https://github.com/Githubのユーザ名/リポジトリ名.git
```

**２\. クローンを実施する。**
1のステップでコピーしたURLを用いて、クローンを実施する。以下コマンドを実行。
```terminal
% git clone コピーしたGithubのURL
```
もしもクローンするアプリケーションの名前を変更したい場合は、以下のようにコマンドの末尾に設定したいアプリ名を追加する。
```terminal
例）クローンしたアプリをtest_appという名前に変更したい場合
% git clone コピーしたGithubのURL test_app
```

**3\. READ MEに沿って初期設定を実施する。**
多くの場合READ ME内にクローン方法が記載されているのでそちらに沿ってクローンを実施。

railsの場合は、```bundle install```コマンドや```rails db:create/rails db:migrate```コマンドを実施してローカル環境でアプリの初期設定をすることが多い。

**4\. クローン元のリポジトリとの連動を解除する。**
クローンした直後はクローン元のリポジトリと紐づいている状態なので、自身のリポジトリと紐付けをしたい場合は以下のコマンドで.gitディレクトリを削除する。
```
% rm -rf .git
```

**5\. ローカル環境でクローンしたアプリを確認する。**
railsの場合は、rails sコマンドを実行しアプリがブラウザ上で確認できるかをチェックする。


## 特定のブランチの内容をcloneする
上記の記述でクローンした場合、main(master)ブランチの内容がcloneされる。
マージ未実装の開発途中ブランチをcloneしたい場合は、以下の手順で実施。

**1\. クローンしたいアプリケーションのブランチ一覧を確認する。**
リモートリポジトリにあるブランチの一覧を表示する
```terminal
% git branch -r

■出力結果
  origin/main
  origin/ブランチA
  origin/ブランチB
  origin/ブランチC
→この中からcloneしたいブランチを選択する
```

**2\. クローンしたいブランチを指定して、クローンする。**
```
% git clone リポジトリURL -b ブランチ名
```
例えば、test_appリポジトリのブランチAをcloneしたい場合は、以下のようになる。
```
% git clone https://github.com/ユーザ名/test_app.git -b "ブランチA"
```
HTML/CSS - 概要を学習(2023/10/04)

	2023年10月4日 午前/学習内容

HTMl/CSSの概要を学習

・Visual Studio Codeインストール
・Google Chromeインストール

・htmlについて
・CSSについて
・mdn web docsの活用方法
・インラインCSS、内部参照、外部参照
・sunitize.cssについて / destyle.css / リセットCSS
・@imprtno urlの使用

・入会フォームの作成


[メモ]
index.html - 先頭のページ
inpuut type=“email” - 属性/属性の値
type/name/value/size
空要素…終了タグが必要ないタグ
・margin…外側　padding…内側
inptタグ…テキストフィールドは16px以上でないとiphoneで拡大される
・div…ブロック span…インライン

	2023年10月4日 午後/学習内容

・divタグと同類[header][section][footer][article]
エリアを分けるためのタグ。総称「区分コンテンツ」
・要素型セレクター・クラスセレクター・子孫セレクター
・「JPG」非可逆圧縮でぼやける「PNG」イラスト、図版にお薦め「SVG」ロゴ、図版に最適
・float、フレキシブルボックス
・CSSグリッド
terraformでS3バケットを作成しようとしたときに起きた変なエラー

## エラー内容
```
│ Error: creating Amazon S3 (Simple Storage) Bucket (backetname): AuthorizationHeaderMalformed: The authorization header is malformed; the region 'us-east-1' is wrong; expecting 'us-east-2'
│       status code: 400, request id: xxxxx, host id:xxxxx│
│   with module.s3.aws_s3_bucket.backetname,
│   on module\s3\main.tf line 1, in resource "aws_s3_bucket" "backet_name":
│    1: resource "aws_s3_bucket" "backet_name" {
```

## 原因
同名のバケットを消した後にterraformでデプロイしようとしたから。

## 対策
1. 別名で作る。
2. 2日ほど開けてから作り直す。
宇宙飛行士の頭蓋骨日本に到着しました！

宇宙飛行士の頭蓋骨日本に到着しました！

Linuxのサイバーセキュリティの情報
[これ](https://git.sr.ht/~alienagain/Broken-spaceship)は壊れて宇宙船のスクリプトのリポジトリやここには[LINEのリンク](https://line.me/R/ti/g/cXrELn3Yu6)です

もここに[AlienVaultOTXのリンク](https://otx.alienvault.com/user/astronaut_skull/pulses)です。

![Screenshot from 2023-10-04 13.42.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/233436/552cde6f-e220-21b8-8dfa-ed1092ad5d6b.png)

特装[COWRIEのハニーポット](https://git.sr.ht/~alienagain/honeypot_notes/)はIOCを集めるのために使えられます

英語の[Telegram](https://t.me/broken_spaceship)や英語の[Mastodon](https://ioc.exchange/@astronaut_skull)もあります。毎月の更新をあります
【Unreal Engine】Meta Quest 2でPC側の計算リソースを使う方法

## 概要
Meta Quest 2 は、Unrealの公式サイトに言わせると「モバイル VR デバイス」という扱いで、PC側リソースは使えないような事が書いてある気がする。
でも、PCのマシンパワーに余裕があるなら、そっちで描画したらいいのでは。
あと、そういう事が出来るというような情報もちらほらあって、実は出来るのではないか。

## 環境
・Unreal Engine 4.27

・Meta Quest 2
`Oculus Quest 2`から名前が変わったらしく、表現が両方混在している。

・Oculus アプリ
スマホ版アプリとの混同注意。
どうやら、スマホ版はQuest 2本体を開発者モードにして、USBデバッグ可能にするのに必要（これはこれで準備として必要）。
PCとつなぐには、PC版のOculusアプリが必要で、このアプリ内の開発者モードっぽいのとは別の話っぽい。

・Oculus Link
なんちゃってリモートデスクトップ。
このアプリがQuest上で起動して、PCと接続確立している状態だと、`「PCから見てVRデバイスが接続されている状態」`になるらしい。
(この状態は、Oculus Rift的な扱いになるっぽく、Oculus Rift向けの設定記事が参考になった。)
なお、PC側の接続待ち受け状態は「Oculus アプリで、デバイス設定でVRデバイスを認識している状態」であること。Oculusアプリが終了状態でも自動起動して、Oculus Linkの受け入れを行ってくれるっぽい。

## PC側のマシンパワーを使ってVR起動する方法
`プロジェクト設定`→`プロジェクト`→`説明`にある`設定`内の`VRで開始`(`Start in VR`)のチェックをオンし、Windows用にビルド＆実行（`起動`→`(Windowsマークの)PC名`）
`「PCから見てVRデバイスが接続されている状態」`で、アプリを起動。
なお、ビルド結果は Saved\StagedBuilds\WindowsNoEditor に生成された。
（たぶん、プロジェクト設定で選択されているのが Oculus Quest 2 ということと画質設定以外は、Oculus Rift と同じ設定。）

## VRプレビューについて
公式サイトの手順通りに行くとVRプレビューが使えなくて、`起動→Quest_2(hogehoge)`しかできず、起動に物凄い時間がかかる。
`「PCから見てVRデバイスが接続されている状態」`で、Unreal Engineを起動すると、`VRプレビュー`が使えるようになる。
なお、VRプレビューも、PC側のリソースを使って実行になるもよう。
（「起動」と違って、VRプレビューは即時起動するので、これが出来ると出来ないでは、デバッグ効率が大違い。）

## Quest本体の能力で起動するシーン
`起動→Quest_2(hogehoge)`にすると、`Save -> StagedBuilds`にAndroidのビルド結果がビルドされると共に、Quest本体内のアプリ一覧の`提供元不明`の欄に転送されます。
ここから起動するときや、アプリ一覧から起動したときは、PCのパワーを使わず、Quest本体の能力で起動することになります。
古めのWSLに pandas をオフラインインストールする

# 結論

サンプルコード

```bash
python -m pip install --no-index pandas-1.1.5-cp36-cp36m-manylinux1_x86_64.whl pytz-2023.3.post1-py2.py3-none-any.whl numpy-1.19.5-cp36-cp36m-manylinux1_x86_64.whl python_dateutil-2.8.2-py2.py3-none-any.whl six-1.16.0-py2.py3-none-any.whl
```

WSLの Ubuntu 18.04 LTS (bionic) には、上記で入りました。

# ダウンロード
PyPI (Python Package Index)は、pip する際の参照先でパッケージを配布している所らしいです。

https://pypi.org/

whl というファイルが pip でのパッケージファイルのようです。
pandas のwhlを検索してダウンロードしておきます。また、インストールしようとすると依存関係でエラーが出るので、必要なパッケージを都度DLする。
pandas-1.1.5のあたりでは pytz, numpy, python_dateutil, six が依存関係のようなので、それぞれDLしました。
大きめのライブラリはプラットフォーム依存となっていて、後述のように、選択肢が複数ある事に注意し、プラットフォームにあった物をDLする。


## エラー例１
```error.
[file name].whl is not a supported wheel on this platform.
```
このようなエラーが出た場合は、そのファイルが対応しているプラットフォーム用ではない。

```bash
$ python
>>> from pip._internal.pep425tags import get_supported
>>> get_supported()
```

上記で、対応している物がリストアップされます。
ちなみに概ねPythonバージョンと一致するようです。

- cp36: Python 3.6
- cp311: Python 3.11

あとは、マシンのプラットフォームで一致するものを選でDLする。

- musllinux: muslというライブラリが使える場合のLinux？
- manylinux1: ほとんどのLinux
- manulinux2010: 上記同様だが 1 と 2010 の違いはよく分からない。カーネルバージョンに関係？
- win_amd64: x86系 64bit CPU / OS
- win32: x86系 32bit CPU / OS
- aarch64: ARM64系
- i686: Pentium III 時代のCPU？
- x86_64: x86 / x64系 (32bit, 64bit OS共通？)
- macosx: mac OS (Mac OS X)

など。
WSLの Ubuntu 18.04 の 場合、cp36, manylinux1, x86_64 の物で行けました。
なお古いバージョンは「リリース履歴」のリンクから辿ったあと、メニューからDLページに行けました。


## エラー例２

```error.
Could not find a version that satisfies the requirement pytz>=2017.2 (from pandas==1.1.5) (from versions: )
No matching distribution found for pytz>=2017.2 (from pandas==1.1.5)
```

以下のように順次入れようとすると、2,3個目あたりからこのエラーで躓く。
一見、依存関係をクリアしているように見えるが、
`--no-index`を使ってオフラインインストールする場合、インストール済みの依存関係も見に行かなくなるようなので、ページ最初のコードのように、依存関係のあるパッケージを全て1ラインで列挙する必要がある。

```bash
# これは途中でエラーになります。
python -m pip install --no-index six-1.16.0-py2.py3-none-any.whl
python -m pip install --no-index python_dateutil-2.8.2-py2.py3-none-any.whl
python -m pip install --no-index numpy-1.19.5-cp36-cp36m-manylinux1_x86_64.whl
python -m pip install --no-index pytz-2023.3.post1-py2.py3-none-any.whl
python -m pip install --no-index pandas-1.1.5-cp36-cp36m-manylinux1_x86_64.whl
```


# 参考にさせて頂いたサイト

https://qiita.com/r-ngtm/items/f7dc53bf713d12f6be9d

https://note.com/itatte_heibon/n/nfc82442b8eaa
【JavaScript】グローバルで使用するMapなどのキーにString型ではなくSymbol型を使うべき理由

### 【概要】
グローバルで使用するMapなどのキーにString型ではなくSymbol型を使うべき理由は、意図しないデータ変更を防ぐためです。
ただし、グローバルで使用せずMapのスコープが狭い場合やキーの重複が発生しない場合は、無理にSymbol型を使う必要はないです。
具体的なコードで確認していきます。

### 【コード】

```js:Symbol型を使った方法
const symbolMap = new Map();
const hogeSymbol = Symbol('test');
const hugaSymbol = Symbol('test');
symbolMap.set(hogeSymbol, 'hoge');
symbolMap.set(hugaSymbol, 'huga');
console.log(symbolMap); // Map(2) {Symbol(test) => 'hoge', Symbol(test) => 'huga'}
```

```js:String型を使った方法
const stringMap = new Map();
const hogeString = 'test';
const hugaString = 'test';
stringMap.set(hogeString, 'hoge');
stringMap.set(hugaString, 'huga');
console.log(stringMap); // Map(1) {'test' => 'huga'}
```

### 【コード解説】

Symbol型を使っていれば同じ`test`という文字列で宣言していても、キーが別の値と認識されるためmapのデータは上書きされていないです。
それに対してString型を使うとデータが上書きされていることが確認できます。

今回は短いコードでしたが、コードが多くなり複雑になるとキーが一意であることを確認するのが困難になります。
そうした中でString型をキーにしているとバグの温床となります。例えば、チーム開発で偶然AさんとBさんが共用のmapに同じキーを定義してしまう可能性もありえます。

### 【使いどころ】

Vueの場合ですがProvide/Injectのキーとして、Symbol型の値を使うべきだと思います。
【シン・クラウド for Free】

wordpressについて学びたくて、XFREEを使ってwordpress開発をしたかったけど、『後継サービス「シン・クラウド for Free」のリリースに伴い、新規受付を終了しました。』ということだったので、【シン・クラウド for Free】を試してみた。

https://www.xfree.ne.jp/
# 申し込み手順
1.【お申込み＞】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/1993dae8-3ddf-16ad-8cfc-f14ac4cd6ea0.png)
2.【すぐにスタート！新規お申込み】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/aa4186dc-96e7-ff7b-83b6-fb7f83d623bb.png)
3.必要項目を入力して【次へ進む】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/5a0ef92e-a43a-cf58-c6f2-0d1222cf23af.png)
4.確認コードを入力して【次へ進む】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/d79b5ccf-acb1-17b2-38eb-61d434d2d694.png)
5.入力内容を確認して【この内容で登録しサーバー申し込みへ進む】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/cd2882d1-9c3e-2a8f-22ac-26291c5aab68.png)
6.電話番号を入力して【認証コードを取得する】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/e7816d43-76c0-92af-4b93-b5d85cb73ca5.png)
7.認証コードを入力して【認証する】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/e03e50e0-ce72-567b-4858-26d9c0fdf033.png)
8.【お申込み内容を確認する】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/024b52ee-9817-bbad-a474-b5e6fd5760b1.png)
9.【申し込む】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/f52a4367-fe1e-8b3a-523e-bbd7e2516a23.png)
10.完了
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/0354cd28-1f4e-2ab6-e503-db8ecd2295e1.png)

# WordPress
1.[サービス管理]から【シン・Blog】を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/487e8646-53d7-3b09-deea-b7ca86d82691.png)
2.【シン・ブログを申し込む】ボタン押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/a9082f57-113a-2890-97b2-dbb9c0722f49.png)
3.必要情報を入力して【入力内容を確認する】を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/d79bee58-0914-aaaf-c747-8a0b0ae7c483.png)
4.【申し込み】押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/73475ddd-1db3-79d5-e60e-7274a00cf275.png)
5.[サービス管理]から【シン・Blog】を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/68b04688-fdb1-2302-e0c3-161f44204538.png)
6.このページを基にブログを作成できるみたいです（ここから先はまださわってないです）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/57bb18a1-a3ab-3f66-2fe6-e617d2f1be99.png)

# その他
1.【設定】を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/57bb18a1-a3ab-3f66-2fe6-e617d2f1be99.png)

2.SSL設定やセキュリティ設定ができるようです
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/eb0b3153-7aa6-da47-6c5d-9fb8137f6841.png)

3-1．SSL設定画面＿既にSSL設定は有効になっていました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/5b1da1a3-b47d-6594-6f9e-152271e811b5.png)

3-2．セキュリティ設定画面＿各セキュリティは既にONになっていました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2165178/a0c49201-d3c1-c6ed-1e81-5f24d50d8e4e.png)




以上
storage.yml の active_storage service を変更すると 500 エラーで画像が表示されなくなる問題

# storage service 名は DB に保存されている
storage service を変更すると以下のようなエラーが表示される。

```
KeyError in ActiveStorage::Blobs::RedirectController#show
config.active_storage.service
```

## service名を変更するとDBとの整合性が取れなくなる

```rb: production.rb
config.active_storage.service = :product
```

```rb: production.rb
config.active_storage.service = :user
```


## 原因は保存時に service 名がDBに保存されているから
原因としては、画像を保存する際に Rails が自動的にDBにどの storage に保存したのかを書き込んでくれているからだ。


```rb: product.rb
class Product < ApplicationRecord
  has_one_attached :main_img
  has_many_attached :sub_imgs
end
```


## 実際に保存されているデータ
`active_storage_blobs` というテーブルに保存されている

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/69647/c8bb8c08-363d-127c-0fc7-8b369cc2fa93.png)


# 解決方法

## SQLでデータを更新する
```sql: update blobs
UPDATE active_storage_blobs SET service_name = 'user' WHERE service_name = 'product';
```


## migrationを発行して修正する

```bash: create migrate
rails generate migration UpdateActiveStorageServiceName
```

```rb
def change
  ActiveStorage::Blob.where(service_name: 'product').update_all(service_name: 'user')
end
```
ChromeからAWS SkillBuilderにログインできなくなったときの対処方法

ある日突然，こんな画面になってどうにもならなくなった人へ。
![20231004_00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2059/4ef63326-de82-e734-f260-ed1a9b99dd88.png)

こうなると，通常のCookieの削除をしても状態が改善されない。
私の場合は，以下の対処方法で再びログインできるようになった。

# 対処法1:ChromeにログインしないでAWS SkillBuilderにアクセスする。
当たり前だが，ユーザ情報に何も紐づかないので，普通にログインできる。とはいえこのままでは，今まで使っていたブックマークなども使えないので不便。
# 対処法2:Chromeからログインするときに設定情報を削除する。
アカウントの「同期は有効です」を選択する。
![20231004_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2059/2b1a1097-76ac-9300-cbe9-04ce37c0e28b.png)
「同期とGoogleサービス」の「オフにする」ボタンを押す。
![20231004_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2059/3f4e86a9-5677-fd45-b089-d4c9cf47a46d.png)
「同期とカスタマイズをオフにしますか?」の下のチェックボックス「ブックマーク，履歴，パスワード，その他の設定情報をこのデバイスから削除する」をONにして，「オフにする」ボタンを押す。
![20231004_03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2059/8caa7dff-5b73-1a03-58a1-16517b9eb3ac.png)

これで，もう一度Chromeにログインして同期をすると，再びAWS SkillBuilderにログインできるようになった。

私の場合，ログインできているけれどサブスクリプション情報が表示されないという現象にも悩まされていたが，この方法で問題が解消できた。
find と sed で tree 表示

# 例

```shell-session
$ find . | sed -e 's,[^/]*/,|  ,g;s,^\(\(|  \)*\)|  ,\1|--,'
.
|--CMakeCache.txt
|--CMakeFiles
|  |--3.22.1
|  |  |--CMakeCXXCompiler.cmake
|  |  |--CMakeDetermineCompilerABI_CXX.bin
|  |  |--CMakeSystem.cmake
|  |  |--CompilerIdCXX
|  |  |  |--a.out
|  |  |  |--CMakeCXXCompilerId.cpp
|  |  |  |--tmp
|  |--a.out.dir
|  |  |--build.make
|  |  |--cmake_clean.cmake
|  |  |--compiler_depend.make
|  |  |--compiler_depend.ts
|  |  |--depend.make
|  |  |--DependInfo.cmake
|  |  |--flags.make
|  |  |--link.txt
|  |  |--progress.make
|  |--cmake.check_cache
|  |--CMakeDirectoryInformation.cmake
|  |--CMakeOutput.log
|  |--CMakeTmp
|  |--hello.dir
|  |  |--build.make
|  |  |--cmake_clean.cmake
|  |  |--compiler_depend.make
|  |  |--compiler_depend.ts
|  |  |--depend.make
|  |  |--DependInfo.cmake
|  |  |--flags.make
|  |  |--link.txt
|  |  |--progress.make
|  |--Makefile.cmake
|  |--Makefile2
|  |--progress.marks
|  |--TargetDirectories.txt
|--cmake_install.cmake
|--Makefile
```

# 解説

　find は、指定ディレクトリの階層をたどってファイル等を探すコマンド。

　検索条件を指定するコマンド引数はたくさんあるが、ここでは全てのファイルやディレクトリを表示させたいので、検索開始するディレクトリだけ指定している。

　昔、(Linux じゃない）別の UNIX 系 OS の標準 find では、コマンド引数 `-print` を指定しないと表示してくれないモノもあった（ハズ。記憶が不確かだけど）が、現在ほとんどの find は、デフォルトで表示してくれる（たぶん）。

　さらに言えば、検索開始ディレクトリの指定も、デフォルトでカレントディレクトリが使用される。したがって指定する必要無いのかもしれないが、でもそこは明示しておいたほうが、見る側としては分かりやすいので、ちゃんと指定することをお勧めする。

　sed は、ストリームエディタと呼ばれるコマンド。
　ここでは find の出力を読み込み、編集して出力するために使われている。

　エディタだけあって、編集用コマンドは多彩にある。
　ここでは s コマンドだけ使用している。

　s コマンドは以下のような書式を目にすることが多いかもしれない。

s/regexp/replacement/

　だが、必ずしも `/` である必要はない。
　特に今回のようなディレクトリパスを編集する場合は、ディレクトリの区切りの `/` とバッティングするため、別の文字を使ったほうが良いので `,` を使っている。

　使い方は `regexp` に一致する文字列を `replacement` に置き換えるというシンプルなもの。
　だが `regexp` のところは正規表現が使えるので、かなり奥の深いコマンドである。

`s,[^/]*/,|  ,g`

　「"/"でない 0 個以上の文字列と、それに続く"/"」という文字列を、「`|  `」という文字列に置き換える。

`s,^\(\(|  \)*\)|  ,\1|--,`

　「"`|  `"という 0 個以上の文字列(1)と、それに続く "`|  `"」という文字列を、(1)と「`|--`」という文字列に置き換える。

　この二つを `;` で連結させている。

# 終わりに

　正直、「車輪の再発明」だな、とは思ってる。

　でも、やっぱり自分で考えるの好きだし、考えたらメモ残しておきたいのがエンジニアという生き物の性分だし。（震え声

　というわけで、上記を少しいじって以下のような形で `~/.bashrc` にでも入れておけば、少しだけ幸せになれる……かもしれない？

```shell
lstree()
{
    test "x${1}" = x && set "."
    echo "$1"
    (cd "$1" && find . | sed -e '1d;s,[^/]*/,|  ,g;s,^\(\(|  \)*\)|  ,\1|--,')
}
```
MacでxtraFinderをインストールする

# 1. はじめに
* MacでFinderをより高機能にしたい
* Finderを左右に並べて表示できるようにしたい

# 2. 開発環境
* MacBook Pro 2022
* macOS Ventura 13.2.1
* xtraFinder version.1.8　（有償)

# 3. 事前準備
MacのSIPモードを解除しているので実施には注意が必要
## 3.1. Macを完全にシャットダウンする

## 3.2. 起動時に電源ボタンを数秒間押し続けて、「起動オプションを読み込んでいます」と表示されるまで待つ
## 3.3. オプションをクリックする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/37a342b9-ef38-2c22-6006-e1ca6522ccfc.png)

## 3.4. メニューよりターミナルを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/1a2de6c1-139d-4781-24fa-cdfa0d43b93c.png)

## 3.5. ```csrutil disable```を入力して、Macを再起動する

# 4. インストール手順
## 4.1. インストーラーをダウンロードする

https://www.trankynam.com/xtrafinder/

## 4.2. インストーラーを起動する
* ```Agree```ボタンをクリックする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/3dcd347f-7a4b-0eb0-74ea-1c0ae6551822.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/218e1265-ad8d-9add-8708-7f0064d24b74.png)

## 4.3. Terminalを起動して、下記コマンドを入力する
```
sudo defaults write /Library/Preferences/com.apple.security.libraryvalidation.plist DisableLibraryValidation -bool true
sudo nvram boot-args=-arm64e_preview_abi
```

## 4.4. Macを再起動する

## 4.5. XtraFinderInjector.osax を　ScriptingAdditions　へドラッグ&ドロップする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/c99464f1-606e-c7c4-cedc-f530fb9f2179.png)

## 4.6. XtraFinder.app を Applications へドラッグ＆ドロップする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/3a9d5258-e2f2-5829-66b6-1e3d48ac5b31.png)


# 5. 動作確認
* タブ表示で左右にFinderを表示することができた
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/b6a931fc-c6e1-736b-c9b5-8125a397a204.png)


# 6. 参考文献

https://www.trankynam.com/xtrafinder/

https://iboysoft.com/jp/mac-data-recovery/macos-recovery-mode.html
これからエクセルVBAの勉強を始めたい方へ

**エクセルVBAでマクロを作ってみましょう**
仕事等でエクセルファイルを利用している際に自動で処理を行ってくれるボタンを見る機会があるかと思います。このボタンにはエクセルVBAで作成されたマクロが登録されており、
ボタンを押すことで登録されたマクロが実行されて処理が行われます。
実はこのマクロは皆さんが思っているより簡単に作成する事ができます。これから勉強を始めたいという方は当記事で一例を紹介したいと思いますので入門編としてご覧いただけますと幸いです。
#
**準備**
■まずはリボンのユーザー設定にて「開発」タブが表示されるようにしましょう。
マクロを記載するエディタ(開発タブの中にあり)はエクセルに標準搭載されているのですが、デフォルトでは表示されていないので以下の操作にて画面上に表示されるようにします。

1\.エクセルファイルを開き、上部にある「ファイル」タブを選択します。
2\.左側に表示されている項目内にある「オプション」を選択します。
3\.メニュー項目よりリボンのユーザー設定を選択し、メインタブの項目内にある「開発」のチェックボックスにチェックを入れます。

■エディタを表示させましょう
1\.「開発」タブを選択して「Visual Basic」を選択します。
![VBA準備①.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2144537/8f030c1c-18db-7f6d-82de-51ba0fbd41e7.png)
2\.開いたウィンドウ左側にあるプロジェクトウィンドウ内で右クリックをして「挿入」→「標準モジュール」を選択します。
![VBA準備②.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2144537/61861c72-6eec-6b60-d367-9539537533dd.png)
ここまで操作いただくことでメモ帳のようなテキストを入力できる画面が表示されているかと思います。
マクロはこの画面に記載していきます。
#
**実際にマクロを書いてみましょう**
■プロシージャを作成しましょう
プロシージャとはプログラムのまとまりの事で、「ここからここまでのプログラムを実行しますという事を示すもの」というイメージを持っていただければ良いかと思います。
 プロシージャにはいくつか種類があるのですが、今回はSub(サブ)を先頭に記載するサブプロシージャを例に紹介をします。
```
Sub プロシージャ名()
    'ここにマクロプログラムを記載していく
End Sub
```
上記のようにSub プロシージャ名()と入力してEnterで改行すると自動的に末尾にEnd Subが入力されるかと思います。※プロシージャ名の部分は任意で命名できます。
これでプロシージャの作成完了です。

■マクロプログラムを記載しましょう
今回はVBAの学習が初めての方でも簡単に作れるものとしてクリアボタンを作りたいと思います。
ソースコードは以下となります。
```
Sub クリア()
    ThisWorkbook.Worksheets("任意のワークシートの名称").Range("任意の範囲").ClearContents
End Sub
```
プロシージャ名は「クリア」としてみました。
VBAでは「操作対象」を「こうする」という形式で記載します。
上記ソースコードでは、「このワークブック」の「このシート」の「この範囲」を「値削除する」というものとなっています。
※任意のワークシートの名称と任意の範囲は「"」(ダブルクォーテーション)で囲ってください
　任意の範囲はエクセル関数での範囲の示し方と同じように「A1:D5」のように記載してそれを「"」で囲みます。

■ボタンを作成してマクロを登録する
作成したマクロを実行するためのボタンを用意してみましょう。
エクセルのウィンドウにて「開発」タブを選択して「挿入」からフォームコントロール内にある「ボタン」を選択します。
![VBA準備③.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2144537/2baaa20e-f32e-71d4-cf48-f76258615bc1.png)
任意の大きさのボタンを作成してください。※大きさや登録するマクロは後で変更する事も可能です。

マクロの登録ウィンドウが表示されますので作成したプロシージャを選択してOKを押下します。
![VBA準備④.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2144537/201cfe83-c00d-3614-2a13-854235bf0608.png)
以上でボタンの作成とマクロの登録の完了です。
ボタンを右クリックして「テキストの編集」を選択すればボタンに記載されているテキストの編集が可能ですので、「クリア」等に変更すれば利用者に分かりやすいかと思います。
#
**最後に**
ここまで閲覧いただきありがとうございました。
クリアボタンはプロシージャを作成して1行のプログラムを記載するだけで作成できてしまう簡単なものという事が分かっていただけたかと思います。
これからVBAの勉強を始めたいと考えている方の参考になりましたら幸いです。
MacにTotalSpaces3をインストールする

# 1. はじめに
* Macでデスクトップを効率的に活用したい
* アプリケーションによって起動するデスクトップを指定したい
* TotalSpaces2は「Intel CPU Only」のためApple M2で動くソフトを探したい

# 2. 開発環境
* MacBook Pro 2022
* macOS Ventura 13.2.1
* TotalSpacs3 （有償)

# 3. 事前準備
MacのSIPモードを解除しているので実施には注意が必要
## 3.1. Macを完全にシャットダウンする

## 3.2. 起動時に電源ボタンを数秒間押し続けて、「起動オプションを読み込んでいます」と表示されるまで待つ
## 3.3. オプションをクリックする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/37a342b9-ef38-2c22-6006-e1ca6522ccfc.png)

## 3.4. メニューよりターミナルを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/1a2de6c1-139d-4781-24fa-cdfa0d43b93c.png)

## 3.5. ```csrutil disable```を入力して、Macを再起動する



# 4. インストール手順
## 4.1. インストーラーをダウンロードする

https://downloads.binaryage.com/TotalSpaces3-0.9.125.dmg


## 4.2. TotalSpaces3.app を Applicationsフォルダへドラッグ＆ドロップする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/e7a82d0b-7176-69b3-ffa8-9cbd14cf7e25.png)

## 4.3. TotalSpaces3を起動する
* 以下、環境設定で設定をする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/5ac201ac-2002-554c-a3e5-fb047026aa6c.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/6151033a-1e9c-5d34-2e28-91e74ad97e57.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/cf61ffaa-12e7-26ae-4cf5-34d056a40158.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/b290a4fd-03b2-9d22-b4cb-4ccd53dd7e51.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/acc9cf36-2d0a-c25d-55dc-14c3982164b5.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/a4755a91-98b2-35d0-7622-2af40d1d9b61.png)


# 5. 動作確認
* デスクトップに名前をつけて、起動するアプリケーションを指定することができた

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/00968421-bad0-f52f-2bfc-b0b94dcff7f1.png)

# 6. 参考文献

https://discuss.binaryage.com/t/total-spaces-3-on-macos-13-ventura/8457

https://totalspaces.binaryage.com/installing-mojave

https://iboysoft.com/jp/mac-data-recovery/macos-recovery-mode.html
【SQL】期間指定&複数テーブルのレコード数をテーブルごとに単一の結果で算出するクエリ

# SQLクエリ
MySQLデータベースにて、とある期間に絞って、複数のテーブルのレコード数をテーブルごとに単一の結果で算出するSQLクエリを作成しました。
（`Sample01`から`Sample05`はすべてテーブル名）

```sql
SELECT 'Sample01' AS TableName, COUNT(1) AS RecordCount
FROM sample-db.Sample01
WHERE DATE(create_date) BETWEEN '2023-09-01' AND '2023-09-30'
UNION ALL
SELECT 'Sample02' AS TableName, COUNT(1) AS RecordCount
FROM sample-db.Sample02
WHERE DATE(create_date) BETWEEN '2023-09-01' AND '2023-09-30'
UNION ALL
SELECT 'Sample03' AS TableName, COUNT(1) AS RecordCount
FROM sample-db.Sample03
WHERE DATE(create_date) BETWEEN '2023-09-01' AND '2023-09-30'
UNION ALL
SELECT 'Sample04' AS TableName, COUNT(1) AS RecordCount
FROM sample-db.Sample04
WHERE DATE(create_date) BETWEEN '2023-09-01' AND '2023-09-30'
UNION ALL
SELECT 'Sample05' AS TableName, COUNT(1) AS RecordCount
FROM sample-db.Sample05
WHERE DATE(create_date) BETWEEN '2023-09-01' AND '2023-09-30'
ORDER BY RecordCount DESC;
```

上記のクエリでは、`sample-db`データベース内の`SampleXX`テーブルから、指定された日付範囲内のレコード数を取得し、結果セットに`"TableName"`と`"RecordCount"`の2つの列を持つ仮想のテーブルを生成します。

`UNION ALL`は、SQLクエリ内で複数の`SELECT`ステートメントの結果セットを結合するためのSQL演算子。普通の実施すると結果がいくつも分かれてしまいますが、`UNION ALL`を使うと複数のクエリの結果を単一の結果セットとして結合できるので便利です。
テスト103

```vb
Private FSO As Variant

Sub 再帰処理1()

'指定のフォルダパスから最下層のファイルを全て処理する...〆(･ω･ )ﾒﾓﾒﾓ

Dim Fol_Path As Variant
Dim sh As Worksheet
Dim i As Long

Fol_Path = "C:\Users\User\Desktop\VBA関連\VBA練習\Sample"

Set FSO = CreateObject("Scripting.FileSystemObject")

Set sh = ThisWorkbook.Sheets("再帰テスト")
i = 4

With sh

    Do Until Trim(.Cells(i, "B").Value) = ""
    
        Call 再帰処理2(Fol_Path, Trim(.Cells(i, "B").Value))

        i = i + 1

    Loop
    
End With

End Sub

Sub 再帰処理2(ByVal Fol_Pah As Variant, ByVal Fol_Name As String)

Dim File As Variant
Dim Fol As Variant
Dim wb As Workbook

'フォルダ内のファイルをループ
For Each File In FSO.GetFolder(Fol_Pah).Files

    If InStr(Fol_Pah, Fol_Name) > 0 Then
        '指定のフォルダがあってその中にファイルが存在した場合、そのファイルを開く
        DoEvents
        Set wb = Workbooks.Open(File)
    
        'いろいろ処理
        
        'ファイルを閉じる
        wb.Close savechanges:=False
        DoEvents
        
    End If
    
Next

'フォルダ内のサブフォルダをループ
For Each Fol In FSO.GetFolder(Fol_Pah).SubFolders
    '再帰する
    Call 再帰処理2(Fol, Fol_Name)
    
Next

End Sub
【CSS Tips】リンクにフォーカスできないと思ったら、display: contents が原因だった

## はじめに

偶然フォーカスできないリンクを見つけて原因を調べたところ、aタグに`display: contents`が指定されていたのが原因だったのでその備忘録です。

## なぜ`display: contents`を指定するとフォーカスができなくなるのか

そもそも、`display: contents`とは、ボックスツリーを生成するかどうかを指定するプロパティです。

`display: contents`が指定された要素は、表示はされるけどボックスツリー上では無視されるようになります。

この`display: contents`にはアクセシビリティ上のバグが複数報告されており、この挙動もその1つと思われます。

報告されているバグは、`display: contents`が指定されている要素のroleがアクセシビリティツリー上で無視されるようになるというものです。

実際に`display: contents`を指定したリンクと何も指定していないリンクを並べてみました。

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

Tabキーを押すと、`display: contents`の方は飛ばして何も指定していないリンクの方にフォーカスが当たります。

また、`display: contents`が指定された方のリンクはtext-decorationも消えています。

## 解決方法：`display: contents`の使用を避ける

`display: contents`はCSSのツリー上で無視されるので、gridレイアウト内で使うとテーブルレイアウトのような見た目を実現することができます。

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

Ref [【CSS Tips】tableタグを使わずにテーブルレイアウトを作る - Qiita](https://qiita.com/kabechiyo13/items/f888f6f1a7e31df14395#%E6%96%B9%E6%B3%95-2-grid%E3%81%A8display-contents%E3%82%92%E4%BD%BF%E3%81%86)

ただ、現在は`subgrid`がサポートされて、代用が効くようになったので`display: contents`が必要になるシーンは少ないと思います。

そのため、基本的には`display: contents`の使用は避けるのが良いと思います。

## 参考文献

- [CSS Display Module Level 3](https://www.w3.org/TR/css-display-3/#the-display-properties)
- [display - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/display#%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3%E3%81%AE%E8%80%83%E6%85%AE)
- [サブグリッド - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/CSS_grid_layout/Subgrid)
(小ネタ) 複数AWSアカウントのマネジメントコンソールをブラウザで同時に開く方法


業務でAWSを使用していると、用途別に複数のAWSアカウントを使用することがあると思います。

各アカウントのマネジメントコンソールにアクセスする際、
同時に複数アカウントのセッションを維持できなくて各アカウントのマネジメントコンソールを行ったり来たりする作業が困難だと思います。

そんなときの対処法として、ブラウザのセッションを分ける方法を紹介したいと思います。


*マネジメントコンソール
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/b7f40ef6-95ea-2ba6-6714-08bb1789afc6.png)




## Google Chromeの場合

ブラウザ右上をクリックしプロファイルを追加

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/f0890948-56b1-2541-56a6-fabdd3f8ad31.png)

以下のような画面が出ますのでアカウントなしで続行をクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/19aa2e5b-7ebc-879a-c646-c6984d44d808.png)

以下のようにセッションを分けてブラウザを開けるため、プロファイルごとに各AWSのマネジメントコンソールを同時に開くことが可能に
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/194cd07b-58dc-b46f-e398-856a64195212.png)



## Microsoft Edgeの場合

ブラウザの左上をクリックし、プロファイルを追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/f4e747be-ae34-fb8a-f107-bc5d66f80552.png)

ユーザーデータを使用せずに開始をクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/e86375b3-d8f0-eb8d-9d24-528e925b2f15.png)


以下のようにセッションを分けてブラウザを開くことが可能に
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/7329a8a0-eafe-a259-e043-b53ad1d844b3.png)



## Firefoxの場合

ブラウザ上で`about:profiles`と入力しプロファイルを追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/d36841d0-bd55-9c3c-ffa6-7d212e4e000f.png)

以下のようにプロファイルが追加されるので、(プロファイル名：User1)
「プロファイルを別のプロセスで起動」をクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/c99a70f8-1c7a-522c-87c0-c3dc3cafdf2c.png)

以下のようにセッションを分けてブラウザを開くことが可能に
(見にくいですが2つのアカウントのマネジメントコンソールを同時に開いています)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/896507/dc395244-75e6-afde-b7e9-7ed8a2be23fc.png)
【３分でできる】Vitestで始めるテスト入門

## はじめに

Vitestを使用して環境構築からテストの実行までやってみます。今までテストを試したこと無い方を対象として解説します。

## Vitestとは

Jestの互換性があり、実行速度が速いのが特徴のテストフレームワークです。

https://vitest.dev/

## 環境構築

筆者の`node`のバージョンは以下を使用します。公式では`v14.18`以上を必須としています。

https://vitest.dev/guide/#adding-vitest-to-your-project

```shell
$ node -v
v18.17.1
```

始めにviteのプロジェクトを作成します。選択項目は以下を選択してください。

```shell
$ npm init vite@latest

✔ Project name: … vite-project
✔ Select a framework: › Vanilla
✔ Select a variant: › TypeScript
```

プロジェクトファイルに移動して、パッケージをインストールします。

```shell
$ cd vite-project
$ npm install
```

vitestをインストールします。

```shell
$ npm install -D vitest
```

`package.json`に`"test": "vitest"`を追加します。この追加により、ターミナルで`npm run test`と入力することでテストができるようになります。

```json
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "vitest"
   },
   "devDependencies": {
     "typescript": "^5.0.2",
```

Vitestでは`src/**/*.test.{ts,js}`のような設定をしなくても、デフォルトで`*.test.ts`や`*.spec.ts`のファイルをテスト対象とします。


以上で環境構築は完成です。


## テストしてみる

足し算のテストをしてみます。`src/sample.test.ts`ファイルを作成して以下のコードを入力します。`expect`の内容と`toBe`の内容を比較して、イコールであれば成功とするテストです。

```typescript:/src/sample.test.ts
import { test, expect } from 'vitest'

const add = (a: number, b: number) => {
  return a + b
}

test('1 + 2 = 3', () => {
  expect(add(1, 2)).toBe(3)
})
```

ターミナルでテストを実行してみます。以下のように` PASS  Waiting for file changes...`と表示されていればテスト成功です。

```shell
$ npm run test

 RERUN  src/sample.test.ts x7

 ✓ src/sample.test.ts (1)
   ✓ 1 + 2 = 3

 Test Files  1 passed (1)
      Tests  1 passed (1)
   Start at  22:24:05
   Duration  8ms


 PASS  Waiting for file changes...
       press h to show help, press q to quit
```

試しにテスト失敗の表示を確認してみます。以下のコードを追加して保存してください。

```typescript:/src/sample.test.ts
test('1 + 2 = 4', () => {
  expect(add(1, 2)).toBe(4)
})
```

ターミナルを確認すると`FAIL  Tests failed. Watching for file changes...`と表示され、テストが失敗していることが分かります。

```shell
 ❯ src/sample.test.ts (2)
   ✓ 1 + 2 = 3
   × 1 + 2 = 4

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Tests 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

 FAIL  src/sample.test.ts > 1 + 2 = 4
AssertionError: expected 3 to be 4 // Object.is equality

- Expected
+ Received

- 4
+ 3

 ❯ src/sample.test.ts:12:21
     10|
     11| test('1 + 2 = 4', () => {
     12|   expect(add(1, 2)).toBe(4)
       |                     ^
     13| })
     14|

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯

 Test Files  1 failed (1)
      Tests  1 failed | 1 passed (2)
   Start at  22:57:37
   Duration  10ms


 FAIL  Tests failed. Watching for file changes...
       press h to show help, press q to quit

```

## まとめ

Vitestで環境構築からテストの実行までやってみました。テストを導入することで不具合の早期発見や予防につながり品質向上が期待できるので、Viteのプロジェクトでテストを導入してない方はVitestの導入をおすすめします。

## 最後に

### GoQSystemでは一緒に働いてくれる仲間を募集中です！

ご興味がある方は以下リンクよりご確認ください。

https://goqsystem.recruit.site?qiita=4122f49f68760a2fcf8b
Laravelのトランザクション内でreturnするとWithでつけたセッション情報が消える

ただの自分のエラーの解消法の共有です。
起こったエラーは以下のような場合におきました。

```php:TestService
～～～いろんな処理～～～
try {
    DB::beginTransaction();

    // 何らかの処理

    // この場合だけエラーとしてコントローラにリターンする
    if {~~~
    retrun ['message' => 'test'];
    }
    DB::commit();
} catch (Throwable $e) {
    DB::rollBack();
}
```

```php:TestController
    $errors = サービスの関数呼び出し()
    if (count($errors) {
    return redirect()->with(['error'=>$errors]);
}

```

`dd($errors)`などでコントローラにエラーが渡っていることや`dd(redirect()->with(['error'=>$errors]);)`とするとセッションにエラー配列が渡されていることも確認できていたため、どこでなくなっているんだろうと思っていました。

## 解決策
解決策としては以下のようなコードにすると正しく処理がおこなわれました。
```php:TestService
try {
    DB::beginTransaction();

    // 何らかの処理

    // この場合だけエラーとしてコントローラにリターンする
    if {~~~
    DB::rollBack();
    retrun ['message' => 'test'];
    }
    DB::commit();
} catch (Throwable $e) {
    DB::rollBack();
}
```

トランザクションを張っているにもかかわらずこのエラーでリターンした時に、トランザクションを終えていないのでBladeに値を飛ばすときに何らかの差戻処理が行われ、セッション情報が消えているのかなとおもいました。詳しく調べていないのでわからないですが。。。
hotstring を利用して、今日の日付を年月日の 8 桁の数字で素早く入力する - AutoHotkey v2

# はじめに

この記事では、AutoHotkey v2 で hotstring を利用して、今日の日付を年月日の 8 桁の数字で素早く入力するプログラムを学習します。
エクスプローラーを使ってファイル名変更で日付を追加入力したり、メモに日付を挿入するときに使います。

## AutoHotkey v1.1 利用者が詰まる要所

v2 では後方互換性は犠牲となっており、v1.1 のために書かれたスクリプトは基本的に動作せず、改修の必要があります。

# 必要な前提知識

AutoHotkey v2 は Windows で動作する、自動化に役立つツールです。

## インストール

### AutoHotkey

[AutoHotkey](https://www.autohotkey.com/) をダウンロードします。このプログラムは v2.0 で書かれているので、ダウンロードページで「Download v2.0」の方をダウンロードし、動作させる Windows 機にインストールします。

### AutoHotkey Plus Plus

VSCode をご利用の方は、「[AutoHotkey Plus Plus](https://marketplace.visualstudio.com/items?itemName=mark-wiemer.vscode-autohotkey-plus-plus)」をインストールしましょう。コーディングが快適になります。

#### コマンド

AHK++を使用すると、キーボードショートカットを使用してスクリプトをコンパイル、デバッグ、および実行できます。選択範囲をスタンドアロン スクリプトとして実行することもできます。

- デバッグ：Ctrl + Alt + F9
- ヘルプを開く:Ctrl + F1
- 実行：Ctrl + F9
- 選択範囲の実行:Ctrl + F8

# 手順

## 実装する内容

「q[[」と順番に入力すると、例として「20231004」(2023 年 10 月 4 日)と入力されるようにします。

## コード

```:info-v2.ahk
::q[[::
{
    TimeString := FormatTime(,"yyyyMMdd")
    Send TimeString
}
```

```
::q[[::
{コード}
```

- Hotstring は、連続して入力する文字を、「::」で囲います。実行する内容が複数行にわたる場合、中括弧{} で囲います。これがないと、「Error: Hotkey or hotstring is missing its opening brace.」が表示されます。

`TimeString := FormatTime(,"yyyyMMdd")`

- 変数「TimeString」に、今日の日付を"yyyyMMdd"の形式で代入します

`Send TimeString`

- Send を使って 変数「TimeString」 のキー入力を実行します。

# 結論

- この Hotstring を使えば、今日の年月日を知らなくても、「q[[」と入力することで今日を指す年月日の 8 桁の数列を入力することができます。
- AutoHotkey をインストールした後に付属する「Ahk2Exe」を使えば、AutoHotkey のプログラムを.exe 化できます。それを利用すれば、AutoHotkey をインストールしていない Windows 機でも hotstring が使えるようになります。
- また、作成した.exe ファイルを「Windows 10 の起動時に自動的に実行するアプリ」として登録しておけば、起動時に自動的に立ち上がり、hotstring が利用可能になります。
Javaで「指定範囲の部分文字列を取得する」の動作を確認してみた

# 概要

Javaで「指定範囲の部分文字列を取得する」の動作を確認してみました。以下のページを参考にしました。

https://www.javadrive.jp/start/stringbuilder/index8.html

# 実装

以下のファイルを作成しました。
```JSample8_1.java
class JSample8_1{
  public static void main(String[] args){
    StringBuilder sb = new StringBuilder();

    sb.append("ABCDEFGHI");
    System.out.println(sb.toString());
    System.out.println(sb.substring(3, 6));
    System.out.println(sb.substring(3));
  }
}
```

以下のコマンドを実行しました。
```
$ javac JSample8_1.java 
$ java JSample8_1 
ABCDEFGHI
DEF
DEFGHI
```

# まとめ

何かの役に立てばと。
不眠対策として、自動で投光器をオンにして顔を照らす

・今回やりたいこと

投光器を使って、朝に物凄い量の光を顔に当て、無理やりおきたい。

・今回解決したい課題

筆者は長年にわたる不眠症を患っており、ベッドに入ってから寝るまで2，3時間かかることもざらである。
そんなだから当然朝は辛いし、起きれなくてめっちゃ怒られることもある。
不眠症のことを話しても「そんなのは精神が弱いだけ」「心の問題」と言われる。
よって、無理やり起きる手段が必要である。
根本原因たる不眠症を治せばいいと思われるだろうが、そんなことができれば苦労はしていないのである。

・これまでに試した解決策

①めっちゃ音でかい目覚まし

https://www.amazon.co.jp/gp/product/B01B12S0MK/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1

3つ用意したけど起きれん。
音では人類は目覚められない。

②心療内科への通院
何一つ助けにならなかった。

③switchBot
部屋のスイッチが特殊な形をしており、どう頑張ってもスイッチがオンにできず挫折した。

よって、音とは異なる「強烈な光」というアプローチを試すこととする。

・技術的なポイント
ざっくり検索した程度ではBluetoothなどで投光器をコントロールする方法は見つからなかった。
（検索の仕方が悪いのかもしれん）
今回は目が覚めるほどの強烈な光が必要なので、Raspberry Piから給電できるLEDライトでは当然お話にならない。
また、賃貸であるため天井に傷や穴をつけて固定するわけにもいかない。
従って、スタンド付きで電力はコンセントから給電できる投光器を遠隔（Wifi経由もしくはBluetooth接続）でコントロールする方針で進める。

**って思ったけどWi-FiやBluetoothでコントロールできる投光器なんて見つからないし、そもそも投光器をスマートコンセントにつけてオンオフをコントロールしたら秒で解決するやんけ**

というわけでスマートコンセントと投光器を購入。

https://www.amazon.co.jp/gp/product/B08G1G1DVT/ref=ppx_yo_dt_b_asin_title_o01_s00?ie=UTF8&psc=1

https://www.amazon.co.jp/gp/product/B08LZTBJB9/ref=ppx_yo_dt_b_asin_title_o00_s00?ie=UTF8&th=1

数日で届いた。
何の苦労もなく楽々「平日7時30分につけて8時に消灯する」設定ができた。
ラズパイとか必要なかった。

・教訓
ラズパイやPythonを勉強しているからと言って全てをそれで解決しようとするのは賢くない。
視野を広くしておけば、よりスマートなやり方が見つかることもある。
PHP勉強記録(1日目) - DB接続を共通化 / 見出し部分を一部だけ表示

# 1.はじめに

今日から記録として、その日自分がした勉強の記録を残していこうと思います。
途中から始めようと思ったので、初歩からのスタートではないのですが...
現在Udemyの教材などで勉強中！

# 2.PHPでのDB接続を共通化

```dbconnect.php
<?php
    $db = new mysqli('Host','Post','Username','Pass');
?>
```
```index.php
<?php
    require('dbconnect.php');
?>
```
毎回DBの接続の情報を記載するの手間かかるなぁと思っていた時にちょうど教材で解説してくれて助かった。
間違えそうな箇所はなさそうなので、一番最後に付ける;を忘れないように気を付ける。

# 3.見出し部分を一部だけ表示させる。

```index.php
<?php
    <h2><a href="sample01.php?id=<?php echo $hoge; ?>">
        <?php echo htmlspecialchars(mb_substr($hogehoge,0,50));?></a></h2>
?>
```

現在は一言投稿のようなものが出来る掲示板の作成しているが
長文が投稿された際に、一部分だけ表示させるのに使用する。
【Xcode】ReleaseとDebugでBundleIDを分ける

# はじめに
ReleaseとDebugでBundleIDを分けることで端末に2つのアプリを共存させることができます。
Release環境とDebug環境で分けている場合、1つのアプリだと環境がごっちゃになってデータベースが壊れてしまう可能性も考えられます。

ですので、BundleIDで別アプリにして環境のごちゃごちゃを避けます

# やりかた
① プロジェクトを選択します
② ターゲットを選択します
③ 「Build Settings」を選択します
![スクリーンショット 2023-10-04 18.54.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745371/d9c8d87d-d1f7-f253-f141-b15cdd889ab7.png)

④ `Product Bundle Identifier`と検索します
![スクリーンショット 2023-10-04 18.56.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745371/ecd65a8e-fe2f-48c1-e2a2-f5c27d7834ca.png)

⑤ 矢印をタップして下向きに変更します
![スクリーンショット 2023-10-04 18.58.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745371/5f60e97d-82b2-3742-9bf9-47178306baf7.png)

⑥ DebugとReleaseに別の文字列を渡します
![スクリーンショット 2023-10-04 18.59.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745371/01f84c6a-e92f-5e4f-53c0-f7e28a5eb396.png)

# おわり
意外と簡単でした
リクエストスコープとリクエストパラメータは違うもの

# まとめ
・`リクエストパラメータ`のデータを取得するコード
　request.getParameter("名前")
・`リクエストスコープ`のデータを取得するコード
　request.getAttribute("名前")

`リクエストパラメータ`とはHTMLのformタグでGET又はPOSTで送られるデータの事。
`リクエストスコープ`とはインスタンスを保存する場所のことで
request.setAttribute("名前",データ)で保存されたデータの事。

## 経緯
JSP、サーブレットではリクエストスコープとリクエストパラメータが使われる。
どちらもデータの取得は暗黙オブジェクトのrequestを使用するため
同じものと思っていたが、取得方法がgetAttributeとgetParameterの2種類があり
混乱したため確認を行った。

### 補足
スコープのデータを取得するクラスはスコープ毎に違うが、メソッドは全てgetAttribute()が用意されている。全てのクラスで戻り値はObject型のため、使用時にキャストが必要。
リクエストパラメータの取得は上記の通りrequest.getParameterだが戻り値はStringである。
PowerVC 環境チェッカーのバージョン不整合メッセージの対応

#### はじめに

PowerVC の環境チェックで”失敗"(fail)が出力されたので対応した記録です。

tzdata というパッケージのバージョンがPowerVC推奨バージョンと異なるというメッセージです。

> packages are mismatching with powervc version -recommended versions - {'tzdata': '2022.4'} It is recommended to have the packages equal to the powervc versions	

![図1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517421/b368ddf3-2b5e-846b-a831-619408dd50cf.png)


---

#### 環境

PowerVC 2.1.1 (on RHEL8.6 ppc64le)

---

#### 対応内容


① 実機の tzdata のバージョンを確認

② /opt/ibm/powervc/ttv-validation/conf/upper_constrains.txt で指定されているバージョンを実機に合わせる


③ ttv-valication-api.service を再起動する				
　(systemctl restart ttv-validation-api.service)

④ 再度環境チェックを実行し、fail とならないことを確認する。


---

#### 実行

##### ① 実機の tzdata のバージョンを確認

```
# rpm -qa | grep tzdata
tzdata-java-2022a-1.el8.noarch
tzdata-2022a-1.el8.noarch
```




##### ② /opt/ibm/powervc/ttv-validation/conf/upper_constrains.txt の修正


変更前

```
# cat /opt/ibm/powervc/ttv-validation/conf/upper_constrains.txt  | grep tzdata
tzdata===2022.4
```

2022.4 を 2022a-1 に修正

```
# cat /opt/ibm/powervc/ttv-validation/conf/upper_constrains.txt  | grep tzdata
tzdata===2022a-1
```


##### ③ ttv-valication-api.service を再起動する

```
# systemctl restart ttv-validation-api.service
# echo $?
0
```


##### ④ 再度環境チェックを実行

![図2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517421/f2fd749e-e7b3-667b-66e5-10e3483b1ded.png)


修正後、失敗(fail)のメッセージは出力されませんでした。


---


#### おわりに


他での例を見て実施しましたが変更による保証は不明です。
(実機の tzdata のバージョンに合わせただけで、PowerVCも稼働しているので問題ないとは思っていますが...)

影響の確認などは製品サポートにご確認ください。