OmniAICreator/Qiita-1.07M huggingface dataset:
Clojure で Welcome to AtCoder を解いてみた

[Qiita Engineer Festa 2024（キータ・エンジニア・フェスタ 2024） - Qiita](https://qiita.com/official-campaigns/engineer-festa/2024)
において、約1ヶ月で38記事という大量の記事の投稿を要求されることがわかった。
そこで、あまりコストをかけずに記事数を稼ぐ方法を考えた結果、「Welcome to AtCoder を様々な言語で解く」ことを思いついた。
単に解くだけでなく、使用する言語仕様の解説を入れれば、記事として一応成立するだろう。

# Welcome to AtCoder

[PracticeA - Welcome to AtCoder](https://atcoder.jp/contests/abs/tasks/practice_1)

Welcome to AtCoder では、以下の形式で整数 $a$, $b$, $c$ および文字列 $s$ が入力として与えられる。

```text
a
b c
s
```

この入力をもとに、与えられた整数の和 $sum = a + b + c$ および文字列 $s$ を、以下の形式で出力することが求められる。

```text
sum s
```

# 今回用いる Clojure の機能

## 関数呼び出しと加算

[Structure vs Semantics](https://clojure.org/guides/learn/syntax#_structure_vs_semantics)

```clojure
(+ 3 4)
```

のように `()` で囲んだ空白区切りのリストを書くことで、関数を呼び出すことができる。
リストの最初の要素 (この例では `+`) が呼び出す関数で、残りの要素 (この例では `3` と `4`) が関数に渡す引数である。

[Exploring at the REPL](https://clojure.org/guides/learn/syntax#_exploring_at_the_repl)

`doc` 関数の使用例として `+` 関数の説明が掲載されており、この関数が

* 渡された数の和を返すこと
* 0個、1個、2個、3個以上の引数をとりうること

がわかる。

## 定数と関数の定義

[def](https://clojure.org/guides/learn/syntax#_def)

```clojure
(def 名前 値)
```

と書くことで、定数を定義できる。(値に名前をつけることができる)

[Creating Functions](https://clojure.org/guides/learn/functions#_creating_functions)

```clojure
(defn 名前 [引数リスト] 処理内容)
```

と書くことで、関数を定義できる。

## 出力

[Printing](https://clojure.org/guides/learn/syntax#_printing)

```clojure
(println 値)
```

のように `println` 関数を用いることで、「値」を出力し、さらに改行を出力できる。
「値」は複数指定でき、複数指定した場合はそれぞれの値の間に1個の空白を挟んで出力する。

## 入力 (Java のクラスの使用)

[Clojure 入門](https://zenn.dev/konkon2022/articles/0b45ec271dcbd4)
[Invoking Java code](https://clojure.org/guides/learn/functions#_invoking_java_code)
[Scanner (Java Platform SE 8 )](https://docs.oracle.com/javase/8/docs/api/java/util/Scanner.html)

```clojure
(import 'java.util.Scanner)
```

のように書くことで、Java のパッケージをインポートできる。

```clojure
System/in
```

のように書くことで、Java の静的変数を使用できる。これは

```java
System.in
```

に相当する。

```clojure
(Scanner. System/in)
```

のように書くことで、Java のオブジェクトを生成できる。これは

```java
new Scanner(System.in)
```

に相当する。

```clojure
(.nextInt scanner)
```

のように書くことで、Java のオブジェクトのインスタンス関数を呼び出すことができる。これは

```java
scanner.nextInt()
```

に相当する。

`Scanner` クラスの [`nextInt()`](https://docs.oracle.com/javase/8/docs/api/java/util/Scanner.html#nextInt--) を用いると、整数を1個読み込むことができる。
また、[`nextLine()`](https://docs.oracle.com/javase/8/docs/api/java/util/Scanner.html#nextLine--) を用いると、1行分の文字列を読み込むことができる。

`nextInt()` による読み込みでは、数字の後の改行はストリームに残り、続いて `nextLine()` を呼び出すとこの改行が読み込まれるようである。
その次の行を読み込むには、続いてもう一度 `nextLine()` を呼び出すとよい。

# 提出コード

```clojure
(import 'java.util.Scanner)
(def scanner (Scanner. System/in))
(defn scan-int [] (.nextInt scanner))
(defn scan-line [] (.nextLine scanner))

(def sum (+ (scan-int) (scan-int) (scan-int)))
(scan-line)
(println sum (scan-line))
```

[提出 #54887642 - AtCoder Beginners Selection](https://atcoder.jp/contests/abs/submissions/54887642)
[備忘録]　フリーランスエンジニアについて学んだこと

# はじめに
こんにちは，Umamusume22です．普段は会社勤務のエンジニアです．令和になって多様性が重視されるようになりましたね．フリーランスなど様々な働き方があります．これまでに私が参加した勉強会で普段はフリーランスとして働いている方と出会ったことがあります．フリーランスと聞くと自由なイメージがありますが実態は分かりません．そこで，今回はフリーランスエンジニアについて調べて今後のキャリア形成の参考にします

# フリーランスエンジニアについて分かったこと (備忘録)

https://qiita.com/yamamoto-j/items/a66165f927f7c9c77a4e

- フリーランスエンジニア専門のエージェント会社が存在
    - 平均レベル以上のエンジニアであれば仕事に困ることはないらしい
- 準委任契約の場合，支払いでトラブルになるケースが少ない
    - 請負契約で受注した場合は支払いトラブルが発生することも
- 正社員に戻れる
- 正社員時代の収入の2割〜3割増でフリーランスと同等
    - フリーランスの場合，技術書や接待交際費は経費として控除できる
- フリーランス対象の賠償責任保険，弁護士保険有り
    - https://www.freelance-jp.org/benefits
- 常駐は負けではない

https://qiita.com/rokumura7/items/c5af61e1784df532aa35

- 客先に常駐する場合は正社員と働き方が変わらない
- 成果報酬型の請負契約は完全に自由ではない
    - 請負だと休日という概念がない
- 複数の仕事を掛け持ちすることができる
    - 1社のみで働くことも可能
    - 残業の制限がない
- 確定申告が大変
    - 税理士に依頼することも可能
- ボーナス，有給はない
- 様々な経験を積むことができない
    - 即戦力として期待されるから

# さいごに
フリーランスエンジニアとして働いている方の記事を参考にさせていただきました．一番良いのは現役のフリーランスエンジニアの方から色々お話を聞くことだと思います．しかし，私の友達でフリーランスエンジニアの方は残念ながらいません．今回，私にとってフリーランスは未知なので色々と学ぶことができました．
robloxでassistant その111

# 概要
robloxでassistantやってみた。
練習問題やってみた。

# 練習問題
スクリプトだけで、飛ぶボタンを作れ。

# 手順
- ReplicatedFirstに、LocalScriptを追加。
- スクリプトを書く。

```

local Players = game:GetService("Players")
local character = game:GetService("Players").LocalPlayer.Character or game:GetService("Players").LocalPlayer.CharacterAdded:Wait()
local Player = Players.LocalPlayer
local PlayerGui = Player:WaitForChild("PlayerGui")
local Gui = Instance.new("ScreenGui")
Gui.Parent = PlayerGui
local button = Instance.new("TextButton")
button.Name = "button"
button.BorderSizePixel = 0
button.TextSize = 20
button.TextColor3 = Color3.new(1, 0.2, 0.4)
button.AnchorPoint = Vector2.new(0.5, 0.5)
button.Size = UDim2.new(0.1, 0, 0.1, 0)
button.Position = UDim2.new(0.5, 0, 0.5, 0)
button.SizeConstraint = Enum.SizeConstraint.RelativeYY
button.Text = "fly"
button.Parent = Gui
button.Active = true
button.MouseButton1Click:Connect(function()
	if character then	
		local VF = Instance.new("VectorForce")
		VF.Force = Vector3.new(0, 1900, 0)
		VF.ApplyAtCenterOfMass = true
		VF.Attachment0 = character.HumanoidRootPart.RootRigAttachment
		VF.Enabled = true
		VF.Parent = workspace
	end
end)



```

# 写真


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/4da0fb0f-d8fe-cea4-7014-daa70a5a3728.png)


以上。
シェルスクリプトにおける変数定義

## シェルスクリプトにおける変数定義

シェルスクリプトでは、変数を定義して値を格納し、それらの値を操作することができます。以下に、シェルスクリプトにおける変数定義の基本と応用について説明します。

### 1. 変数の基本

#### 変数の定義と代入

変数を定義するには、変数名と等号 `=` を使います。等号の前後にはスペースを入れません。

```sh
#!/bin/bash

# 変数の定義
変数名=値

# 例
name="John"
age=25
```

#### 変数の使用

定義した変数を使用するには、変数名の前に `$` を付けます。

```sh
#!/bin/bash

name="John"
age=25

echo "Name: $name"
echo "Age: $age"
```

### 2. 変数の種類

#### ローカル変数

通常の変数は、スクリプト内または現在のシェルセッション内でのみ有効です。

```sh
#!/bin/bash

greeting="Hello"
echo $greeting  # "Hello" と表示される
```

#### 環境変数

環境変数は、エクスポートすることで子プロセスにも引き継がれます。

```sh
#!/bin/bash

export PATH="/usr/local/bin:$PATH"
export name="John"
```

### 3. 変数の値の変更

変数の値は再代入することで変更できます。

```sh
#!/bin/bash

number=5
echo $number  # 5 と表示される

number=10
echo $number  # 10 と表示される
```

### 4. 変数の削除

`unset` コマンドを使って変数を削除できます。

```sh
#!/bin/bash

name="John"
unset name
echo $name  # 何も表示されない
```

### 5. 変数のスコープ

#### ローカルスコープ

関数内で定義された変数は、その関数内でのみ有効です。

```sh
#!/bin/bash

function greet {
    local greeting="Hello"
    echo $greeting
}

greet  # "Hello" と表示される
echo $greeting  # 何も表示されない
```

#### グローバルスコープ

関数外で定義された変数は、スクリプト全体で有効です。

```sh
#!/bin/bash

greeting="Hello"

function greet {
    echo $greeting
}

greet  # "Hello" と表示される
```

### 6. 変数の値の操作

#### 文字列の結合

文字列を結合するには、変数を直接連結します。

```sh
#!/bin/bash

first="Hello"
second="World"

greeting="$first, $second!"
echo $greeting  # "Hello, World!" と表示される
```

#### 算術演算

整数の算術演算には、`$(( ... ))` を使用します。

```sh
#!/bin/bash

num1=5
num2=3

sum=$((num1 + num2))
echo $sum  # 8 と表示される

product=$((num1 * num2))
echo $product  # 15 と表示される
```

### 7. 特殊変数

#### 位置パラメータ

スクリプトに渡された引数を表します。

```sh
#!/bin/bash

echo "Script name: $0"
echo "First argument: $1"
echo "Second argument: $2"
```

#### システム変数

シェルやシステムの情報を提供します。

```sh
#!/bin/bash

echo "Bash version: $BASH_VERSION"
echo "Home directory: $HOME"
echo "Current directory: $PWD"
```

### まとめ

シェルスクリプトにおける変数の定義と操作は、スクリプトの柔軟性と機能性を高めるために重要です。変数を適切に使用することで、スクリプトの再利用性が向上し、より複雑なタスクを効率的に処理することができます。
シェルスクリプトにおける引数の受け取り方

## シェルスクリプトにおける引数の受け取り方

シェルスクリプトでは、スクリプトに渡された引数を利用することができます。以下に、基本的な引数の受け取り方について説明します。

### 引数の基本

1. **`$0`**:
   - スクリプトの名前を表します。

2. **`$1`, `$2`, ..., `$N`**:
   - スクリプトに渡されたそれぞれの引数を表します。`$1` は最初の引数、`$2` は二番目の引数、... `$N` は N 番目の引数です。

3. **`$#`**:
   - スクリプトに渡された引数の数を表します。

4. **`$*`**:
   - すべての引数をひとつの文字列として表します。

5. **`$@`**:
   - すべての引数を個別の文字列として表します。

### 使用例

次の例は、シェルスクリプトに渡された引数を表示する簡単なスクリプトです。

```sh
#!/bin/bash

echo "スクリプト名: $0"
echo "最初の引数: $1"
echo "二番目の引数: $2"
echo "引数の数: $#"
echo "すべての引数（\$* を使用）: $*"
echo "すべての引数（\$@ を使用）: $@"
```

### 実行例

上記のスクリプトを `args.sh` という名前で保存し、以下のように実行します。

```sh
$ ./args.sh arg1 arg2 arg3
```

### 実行結果

```sh
スクリプト名: ./args.sh
最初の引数: arg1
二番目の引数: arg2
引数の数: 3
すべての引数（$* を使用）: arg1 arg2 arg3
すべての引数（$@ を使用）: arg1 arg2 arg3
```

### ループを使った引数の処理

すべての引数をループで処理する例を示します。

```sh
#!/bin/bash

for arg in "$@"
do
    echo "引数: $arg"
done
```

### 実行例

```sh
$ ./args.sh arg1 arg2 arg3
```

### 実行結果

```sh
引数: arg1
引数: arg2
引数: arg3
```

### 引数のシフト

`shift` コマンドを使うと、引数を左にシフトし、`$1` の値を削除できます。

```sh
#!/bin/bash

while [ "$#" -gt 0 ]; do
    echo "引数: $1"
    shift
done
```

### 実行例

```sh
$ ./shift_args.sh arg1 arg2 arg3
```

### 実行結果

```sh
引数: arg1
引数: arg2
引数: arg3
```

### まとめ

シェルスクリプトでは、引数を使ってスクリプトに様々な入力を渡すことができます。これにより、スクリプトの柔軟性と再利用性が向上します。引数をうまく利用することで、より汎用的で強力なスクリプトを作成することができます。
`/usr/bin/bash` と `/bin/bash` の違い

## `/usr/bin/bash` と `/bin/bash` の違い

### 1. 位置の違い

- **/bin/bash**:
  - `/bin` ディレクトリは、基本的なシステムの実行可能ファイルが格納される場所です。
  - システムのブートプロセス中に必要な基本的なコマンドが `/bin` にあります。
  - そのため、`/bin/bash` は多くのシステムで標準的な Bash シェルの場所とされています。

- **/usr/bin/bash**:
  - `/usr/bin` ディレクトリは、ユーザーが使用する多くのプログラムやスクリプトが格納される場所です。
  - これは、追加のソフトウェアパッケージやユーザー向けのプログラムが多く配置される場所です。

### 2. シンボリックリンクの違い

多くのシステムでは、`/bin/bash` と `/usr/bin/bash` は同じ実行ファイルを指すシンボリックリンクになっている場合があります。この場合、両方のパスは同じ Bash シェルを指しています。

```sh
$ ls -l /bin/bash
lrwxrwxrwx 1 root root 12 Jan  1 12:34 /bin/bash -> /usr/bin/bash
```

### 3. システム依存の違い

システムによっては、`/bin` と `/usr/bin` の構造が異なる場合があります。以下は一般的な違いです：

- **伝統的な Unix システム**:
  - `/bin` はシステムの最小限の実行環境を提供するための場所として使用されます。
  - `/usr/bin` は追加のユーザー向けプログラムが格納される場所です。

- **Linux ディストリビューション**:
  - 多くの Linux ディストリビューションでは、`/bin` と `/usr/bin` の統合が進んでおり、`/bin` が `/usr/bin` へのシンボリックリンクになっている場合があります。
  - これは、ディスクスペースの節約やシステムの単純化を目的としています。

### まとめ

- **実行可能ファイルの配置場所の違い**: `/bin/bash` は基本的なシステムツールとしての Bash シェルを指し、`/usr/bin/bash` は追加のユーザー向けプログラムとしての Bash シェルを指すことが一般的です。
- **シンボリックリンクの可能性**: 多くのシステムでは、`/bin/bash` と `/usr/bin/bash` は同じファイルを指すシンボリックリンクになっています。
- **システム依存の違い**: システムやディストリビューションによっては、これらのディレクトリの使い分けや構造が異なることがあります。

システムごとの詳細な設定を確認するためには、実際にそれらのパスを調べてみることが推奨されます。
シバン（shebang, #!）の有無と挙動

# シバン（shebang, #!）の有無と挙動

シェルスクリプトにおいて、シバン（shebang, `#!`）が無いときの挙動について説明します。

シバンはスクリプトの冒頭に記載される特殊な文字列で、スクリプトを実行する際にどのインタプリタを使用するかを指定します。例えば、以下のように記載します：

```sh
#!/bin/bash
```

これは、スクリプトを `/bin/bash` というバッシュシェルで実行するよう指示しています。

シバンが無い場合の挙動は以下のようになります：

1. **明示的なインタプリタ指定**：シェルスクリプトを実行する際に、明示的にインタプリタを指定して実行した場合、指定されたインタプリタが使用されます。

    ```sh
    bash script.sh
    ```

    この場合、`script.sh` にシバンが無くても、`bash` インタプリタが使用されます。

2. **直接実行した場合**：シバンが無く、スクリプトファイルを直接実行した場合、デフォルトのシェルが使用されます。多くのシステムでは、デフォルトのシェルは `/bin/sh` です。

    ```sh
    ./script.sh
    ```

    この場合、`/bin/sh` がデフォルトで使用されますが、システムによっては異なる場合もあります。たとえば、`/bin/sh` が `bash` にリンクされていることもあります。

3. **エラーハンドリング**：スクリプトがシェルの構文に依存している場合、意図しないインタプリタで実行されるとエラーが発生する可能性があります。たとえば、`bash` 固有の構文を含むスクリプトが `sh` で実行されると、エラーが発生することがあります。

シバンを指定することは、スクリプトがどのシェルで実行されるべきかを明確にするための良い習慣です。これにより、スクリプトの移植性が向上し、予期しない挙動を防ぐことができます。
PostgreSQLのJITが有効になっているかを確認する方法

PostgreSQLのJITがConfigで有効になっているかを確認するには、以下のように`SHOW jit`コマンドを使用します。
```shell
$ psql
psql (15.7)
Type "help" for help.

ap2=# SHOW jit;
 jit
-----
 on
(1 row)
```
jit列がonになっていればConfigで有効になっています。しかし、Configで有効にしていても、llvmjitがインストールされていない場合、JITは動作しません。llvmjitがインストールされていない状態でも、`SHOW jit`はonと表示されます。

以下は、llvmjitがインストールされていない状態でのSHOW jitコマンドの実行結果です。
```shell
 sudo dnf remove postgresql15-llvmjit
中略
$ sudo systemctl restart postgresql-15
$ psql
psql (15.7)
Type "help" for help.

ap2=#  SHOW jit;
 jit
-----
 on
(1 row)
```
JITが実際に機能しているかを確認するには、実際にJITが動作しているかを確認するしかないと思います（他に方法があれば教えていただきたいです）。具体的には、JITに関するパラメータを変更してJITが動作する閾値を下げ、クエリを実行します。
``` shell
$ psql
psql (15.7)
Type "help" for help.

ap2=# SHOW jit;
 jit
-----
 on
(1 row)

ap2=# SET jit_above_cost=10;
SET
ap2=# SET jit_inline_above_cost=10;
SET
ap2=# SET jit_optimize_above_cost=10;
SET
ap2=# select count(*) from userreview;
  count
---------
 1926960
(1 row)

ap2=# explain select count(*) from userreview;
                                          QUERY PLAN
----------------------------------------------------------------------------------------------
 Finalize Aggregate  (cost=81522.53..81522.54 rows=1 width=8)
   ->  Gather  (cost=81522.31..81522.52 rows=2 width=8)
         Workers Planned: 2
         ->  Partial Aggregate  (cost=80522.31..80522.32 rows=1 width=8)
               ->  Parallel Seq Scan on userreview  (cost=0.00..78522.25 rows=800025 width=0)
 JIT:
   Functions: 4
   Options: Inlining true, Optimization true, Expressions true, Deforming true
(8 rows)
```
QUERY PLANにJITが表示されていることを確認します。
ちなみに、llvmjitがインストールされていない環境では以下のようになります。
``` shell
$ sudo dnf remove postgresql15-llvmjit
中略
$ sudo systemctl restart postgresql-15

$ psql
psql (15.7)
Type "help" for help.

ap2=# SET jit_above_cost=10;
SET
ap2=# SET jit_inline_above_cost=10;
SET
ap2=# SET jit_optimize_above_cost=10;
SET
ap2=# select count(*) from userreview;
  count
---------
 1926960
(1 row)

ap2=# explain select count(*) from userreview;
                                          QUERY PLAN
----------------------------------------------------------------------------------------------
 Finalize Aggregate  (cost=81522.53..81522.54 rows=1 width=8)
   ->  Gather  (cost=81522.31..81522.52 rows=2 width=8)
         Workers Planned: 2
         ->  Partial Aggregate  (cost=80522.31..80522.32 rows=1 width=8)
               ->  Parallel Seq Scan on userreview  (cost=0.00..78522.25 rows=800025 width=0)
(5 rows)
```
【Chakura UI】削除確認ダイアログの実装方法

# はじめに
現在React×TypeScriptでアプリを作成中です。
Chakura UIの`AlertDialog`コンポーネントを使って削除確認ダイアログを実装してみたので、実装方法を軽くまとめます。
# 完成イメージ
ごみ箱のアイコンを押下すると、下記のようなダイアログが表示されます。
削除ボタンを押下すると記事が削除できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3675500/d36948aa-3255-5497-d5d7-8ec7c5487a53.png)

# 実装方法
Chakura UIの公式HPにてサンプルコードがあるので、こちらを使います。

https://v2.chakra-ui.com/docs/components/alert-dialog/usage

サンプルとしてコードも載せておきます。
**ダイアログ実装だけでもコード量がそこそこある＆再利用性を考えて、今回はコンポーネントを切り分けました。**
```tsx:AlertDialog.tsx
import React from "react";
import {
  Button,
  AlertDialog,
  AlertDialogBody,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogContent,
  AlertDialogOverlay,
} from "@chakra-ui/react";

interface AlertProps {
  isOpen: boolean;
  onClose: () => void;
  onDelete: () => void;
}

export const AlertDialog: React.FC<AlertProps> = ({ isOpen, onClose, onDelete }) => {
  const cancelRef = React.useRef<HTMLButtonElement>(null);
  return (
    <>
      <AlertDialog
        isOpen={isOpen}
        leastDestructiveRef={cancelRef}
        onClose={onClose}
      >
        <AlertDialogOverlay>
          <AlertDialogContent>
            <AlertDialogHeader fontSize="lg" fontWeight="bold">
              投稿を削除
            </AlertDialogHeader>

            <AlertDialogBody>
              削除した投稿は元に戻せません。削除しますか？
            </AlertDialogBody>

            <AlertDialogFooter>
              <Button ref={cancelRef} onClick={onClose}>
                キャンセル
              </Button>
              <Button
                colorScheme="blue"
                onClick={() => {
                  onDelete();
                  onClose();
                }}
                ml={3}
              >
                削除
              </Button>
            </AlertDialogFooter>
          </AlertDialogContent>
        </AlertDialogOverlay>
      </AlertDialog>
    </>
  );
};

```

### 作成したコンポーネントを削除ボタンに割り当てる方法

流れとしては下記になります。

・**コンポーネントの開閉状態を管理**するために、Chakra UIの`useDisclosure`フックを使用する。

　 `onOpen`: この関数を呼び出すとisOpenが**true**になり、関連するコンポーネントが開く。
　 `onClose`: この関数を呼び出すとisOpenが**false**になり、関連するコンポーネントが閉じる。
　 `isOpen`: **現在の開閉状態を示す**ブール値。trueならコンポーネントが開いており、falseなら閉じている。

・削除ボタンをクリックすると `onOpen` が呼び出され、AlertDialog が表示される。
・ダイアログ内の「削除」ボタンをクリックすると、`deleteItem` 関数が呼び出され、記事が削除される。
```tsx:ViewArticle.tsx
export const ViewArticle = ({ articles, loading }: ViewArticleProps) => {

  //コンポーネントの開閉状態を管理
  const { onOpen, onClose, isOpen } = useDisclosure();

  //～省略～

  return (
    <>
      <IconButton
        data-testid="delete-button"
        colorScheme="gray"
        variant="outline"
        icon={<BsFillTrashFill />}
        aria-label="Delete"
        onClick={onOpen}
      />
      {/* コンポーネント使用 */}
      <Alert
        isOpen={isOpen}
        onClose={onClose}
        onDelete={() => deleteItem(article.id)}
      />
    </>
  );
};

```
# おわりに
以上、削除方法の実装方法でした。
今回はかなりシンプルなダイアログになりましたが、色々工夫してみてください！
拡張機能でエラーチェックできなかった時の対処法

text = """
def sample_func(self):
    print("aaa")
data = []
if data:
    for i, j in enumerate(data):
        print(i, j
        print("ifでメッセージ")
else:
    for i in range(10):
        print(i)
        print("elseでメッセージ")
"""

stack = []
pair = []
for i, t in enumerate(text):
    if t == "(":
        stack.append(i)
    if t == ")":
        if stack:
            pair.append([stack.pop(), i])
        else:
            pair.append(["pair not found", i])

print(stack, "***", pair)
print("**************************")
if stack: # (が多い場合
    print(text[stack[0] - 10 : stack[0] + 10])
else: # )が多い場合
    for p in pair:
        if p[0] == "pair not found":
            print(text[p[1] - 10 : p[1] + 10])
➀添付したtxtファイルをダウンロードして拡張子を「.py」に変更する。
➁pyファイルのtextという変数の値を変える。（2～12行目）
　エラーが起きているファイルをそのまま値として変数に入れたいです。
➂pyファイルを実行します。
　vscodeだと右クリックで「pythonの実行」があるので、それで大丈夫です。
④ターミナルを確認し、どこで()がズレているか確認します。
huskyでローカルでコミットした時に静的解析をする

# はじめに

こんにちは、エンジニアのkeitaMaxです。

今回はHuskyを使用して、ローカルでコミットした時に静的解析を実行するようにしようと思います。


# Huskyってなに？
>Automatically lint your commit messages, code, and run tests upon committing or pushing.
(引用：https://typicode.github.io/husky/)

コミットやPushした時に自動でコマンドを実行してくれるライブラリです。

# インストール

以下のコマンドでインストールします。
```
npm install --save-dev husky
```

`"husky": "^9.0.11",`がインストールされました。

インストールが終わったら、以下のコマンドで初期設定をします。

```
npx husky init
```

すると、`.huskyu`というファイルができていると思います。

![スクリーンショット 2024-06-23 23.28.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/f0d9b22e-150d-aa80-547b-0943473161a1.png)

これの`pre-commit`というファイルがhuskyの設定ファイルです。
```:pre-commit
npm test

```

# コミット時に静的解析をするための設定

`pre-commit`ファイルを修正します。

今回はESLintの静的解析を行いたいので、以下のように修正しました。

```:pre-commit
npm run lint

```

簡単ですが、設定はこれで終わりです。

# 実際にコミットしてみる

実際にコミットしてみると以下のようになります。

```
next-example-app % git add .
next-example-app % git commit -m 'huskyを追加'

> next-example-app@0.1.0 lint
> next lint

✔ No ESLint warnings or errors
[feat/create_husky 53cd9ef] huskyを追加
 3 files changed, 20 insertions(+), 1 deletion(-)
 create mode 100644 .husky/pre-commit
next-example-app % 
```

しっかりと　`npm run lint`コマンドが実行されているのがわかります。

# ESLint実行してエラーを出してみる

先ほどはESLintで成功パターンをやったので失敗させてみます。

`npm run lint`コマンドが失敗するようにソースを修正します。

以下のように必要なソースをコメントアウトしてみました。

```react
// import React from "react";
```

この状態でコミットしてみます。

```
next-example-app % git add .
next-example-app % git commit -m 'lintを失敗させる'

> next-example-app@0.1.0 lint
> next lint


./src/views/CountView/index.tsx
5:31  Error: 'useCountView' is not defined.  no-undef

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
husky - pre-commit script failed (code 1)
next-example-app % 
```

このように`npm run lint`コマンドが失敗しているのがわかります。

また、エラーが起こるとコミットされないので、おかしなソースがPushされることはありません。

# おわりに

コミット時にテストができるのは、間違ったソースがGitに上がらなくなるのでとてもいいと思いました。今後プロジェクトで積極的に使っていけたらと思います。

この記事での質問や、間違っている、もっといい方法があるといったご意見などありましたらご指摘していただけると幸いです。

最後まで読んでいただきありがとうございました！

# 参考

https://typicode.github.io/husky/get-started.html

# Git

ソースが見たい方は以下のGitHubのリポジトリにあるので参考にしてください。

https://github.com/NiheiKeita/next-example-app
robloxでassistant その110

# 概要
robloxでassistantやってみた。
練習問題やってみた。

# 練習問題
スクリプトだけで、飛ぶボタンを作れ。

# 手順
- ReplicatedFirstに、LocalScriptを追加。
- スクリプトを書く。

```

local Players = game:GetService("Players")
local character = game:GetService("Players").LocalPlayer.Character or game:GetService("Players").LocalPlayer.CharacterAdded:Wait()
local Player = Players.LocalPlayer
local PlayerGui = Player:WaitForChild("PlayerGui")
local Gui = Instance.new("ScreenGui")
Gui.Parent = PlayerGui
local button = Instance.new("TextButton")
button.Name = "button"
button.BorderSizePixel = 0
button.TextSize = 20
button.TextColor3 = Color3.new(1, 0.2, 0.4)
button.AnchorPoint = Vector2.new(0.5, 0.5)
button.Size = UDim2.new(0.1, 0, 0.1, 0)
button.Position = UDim2.new(0.5, 0, 0.5, 0)
button.SizeConstraint = Enum.SizeConstraint.RelativeYY
button.Text = "fly"
button.Parent = Gui
button.Active = true
button.MouseButton1Click:Connect(function()
	if character then
		local bodyGyro = Instance.new("BodyGyro")
		bodyGyro.MaxTorque = Vector3.new(1, 1, 1) * 10^6
		bodyGyro.P = 10^6
		local bodyVel = Instance.new("BodyVelocity")
		bodyVel.MaxForce = Vector3.new(1, 1, 1) * 10^6
		bodyVel.P = 10^4
		bodyGyro.Parent = character.HumanoidRootPart
		bodyVel.Parent = character.HumanoidRootPart
		bodyGyro.CFrame = character.HumanoidRootPart.CFrame
		bodyVel.Velocity = Vector3.new(0, 1, 0)
	end
end)



```

# 写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/183cb5fd-c0d7-191b-4441-08feb6e0a315.png)



以上。
16ビット漢字全角細数字をつくって遊ぶ


https://qiita.com/caa45040/items/574231109a31cb6c55eb

x 過去ログをみよ

![o_coq184.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/a36937b3-4044-b63d-ddbf-019e20dfd253.jpeg)


```

0x0000, 0x07c0, 0x0820, 0x1010, 0x2008, 0x3008, 0x2808, 0x2608, //0
0x2108, 0x20c8, 0x2028, 0x2018, 0x1010, 0x0820, 0x07c0, 0x0000, 
0x0000, 0x0100, 0x0300, 0x0500, 0x0900, 0x0100, 0x0100, 0x0100, //1
0x0100, 0x0100, 0x0100, 0x0100, 0x0100, 0x0100, 0x0100, 0x0000, 
0x0000, 0x0fe0, 0x1010, 0x2010, 0x2008, 0x0008, 0x0010, 0x0010, //2
0x00e0, 0x0300, 0x0400, 0x0800, 0x1000, 0x2000, 0x3ff8, 0x0000, 
0x0000, 0x0fe0, 0x1010, 0x2010, 0x2008, 0x0008, 0x0010, 0x03e0, //3
0x0010, 0x0008, 0x0008, 0x2008, 0x2010, 0x1010, 0x0fe0, 0x0000, 
0x0000, 0x0030, 0x0050, 0x0090, 0x0110, 0x0210, 0x0410, 0x0810, //4
0x1010, 0x2010, 0x3ffc, 0x0010, 0x0010, 0x0010, 0x0010, 0x0000, 
0x0000, 0x3ff8, 0x2000, 0x2000, 0x2000, 0x2000, 0x3fc0, 0x0020, //5
0x0010, 0x0008, 0x0008, 0x0008, 0x2010, 0x1020, 0x0fc0, 0x0000, 
0x0000, 0x07c0, 0x0820, 0x1010, 0x2000, 0x2000, 0x27c0, 0x2820, //6
0x3010, 0x2008, 0x2008, 0x2008, 0x1010, 0x0820, 0x07c0, 0x0000, 
0x0000, 0x1ff8, 0x0008, 0x0008, 0x0010, 0x0010, 0x0020, 0x0020, //7
0x0040, 0x0040, 0x0040, 0x0080, 0x0080, 0x0100, 0x0100, 0x0000, 
0x0000, 0x07c0, 0x0820, 0x1010, 0x2008, 0x2008, 0x1010, 0x0fe0, //8
0x1010, 0x2008, 0x2008, 0x2008, 0x1010, 0x0820, 0x07c0, 0x0000, 
0x0000, 0x07c0, 0x0820, 0x1010, 0x2008, 0x2008, 0x2008, 0x1018, //9
0x0828, 0x07c8, 0x0008, 0x0008, 0x1010, 0x0820, 0x07c0, 0x0000,

```
【Excel Power Query】Power Queryのピボットテーブルが更新されない

# 問題点
## 概要
ピボットテーブルの元ネタのテーブル（元ネタテーブル）を編集後、すべて更新をしても、ピボットテーブルの内容が更新されない。
## 詳細
元ネタテーブルを編集後、下記操作を行っても、ピボットテーブルの内容が更新されない。
1. ピボットテーブルがあるシートで、ピボットテーブルを選択する。
1. 「ピボットテーブル分析」タブの「データ」より、「更新」の「下向きのアロー」ボタンを押下し、メニューを展開する。
1. メニューより、「すべて更新」を選択する。

# 確認に使った環境

Windows 10 22H2
Excel 2019

# 解決方法
## 概要
 「クエリ プロパティ」より、「バックグラウンドで更新する（G）」のチェックを外す。
## 詳細
1. 元ネタテーブルのあるシートで、元ネタテーブルを選択する。
1. 「クエリ」タブの「編集」より「プロパティ」を選択する。
1. 「クエリ プロパティ」の「コントロールの更新」より、「バックグラウンドで更新する（G）」のチェックを外す。
1. ピボットテーブルがあるシートで、ピボットテーブルを選択する。
1. 「ピボットテーブル分析」タブの「データ」より、「更新」の「下向きのアロー」ボタンを押下し、メニューを展開する。
1. メニューより、「すべて更新」を選択する。
# 余談
「バックグラウンドで更新する（G）」にチェックを入れ、「すべて更新」を行った際は、非同期処理で更新処理が実行される。
# 備考
VBAの情報が欲しい人は、[参考文献](#参考)に記載した[サイト](https://shikumika.org/entry/2023/05/12/120000)を参照すること。
# 参考文献
https://shikumika.org/entry/2023/05/12/120000

https://learn.microsoft.com/ja-jp/office/vba/api/excel.pivotcache.backgroundquery
Javaで「配列の要素を昇順・降順にソートする(sort)」の動作を確認してみた

# 概要

Javaで「配列の要素を昇順・降順にソートする(sort)」の動作を確認してみました。
以下のページを参考にしました。

https://www.javadrive.jp/start/array/index14.html

# 実装

以下のファイルを作成しました。
```JSample14_1.java
import java.util.Arrays;

class JSample14_1{
  public static void main(String[] args){
    int[] src = {12, 24, 18, 35, 21};
    System.out.println(Arrays.toString(src));

    Arrays.sort(src);
    System.out.println(Arrays.toString(src));
  }
}
```

以下のコマンドを実行しました。
```
$ javac JSample14_1.java 
$ java JSample14_1 
[12, 24, 18, 35, 21]
[12, 18, 21, 24, 35]
```

# まとめ

何かの役に立てばと。
最近 YouTube 見ながら寝落ちしてしまうので PC のオフタイマー的なやつ作ったった

## モチベーション

これは人によると思うのですが、自分の場合はラジオや YouTube を流したまま寝てしまうと、良い睡眠が取れていないせいか翌朝に体調を崩しがちです。  
なので、寝ている間に PC をシャットダウンして快眠を狙います。  
寝ている間にマウスを的確に動かしてシャットダウンするのは無理だと思うので、自動化します。

:::note alert
寝ている間に無音状態にすれば快眠になるという医学的根拠はありません。  
私がそんな気がするからやってみるというだけなので、十分ご注意ください。
:::

## 環境

- Windows 11
- Python 3.12

## 実装

こちらの記事を参考にして、os ライブラリを使います。

https://www.tutorialspoint.com/python-script-to-shutdown-computer

```python:shutdown.py
import os
import sys
import time

from string import Template


def is_windows(os_name: str) -> bool:
    return os_name == "nt"


def is_mac(os_name: str) -> bool:
    return os_name == "posix"


class OSNotSupportedError(Exception):
    pass


def get_shutdown_command(os_name: str) -> str:
    if is_windows(os_name):
        return "shutdown /s /t 0"
    if is_mac(os_name):
        return "sudo shutdown now"
    raise OSNotSupportedError("Only Windows or Mac supported")


def shutdown(*, after_seconds: int) -> None:
    command = get_shutdown_command(os.name)
    start = time.time()
    while True:
        now = time.time()
        if now - start >= after_seconds:
            break
        time.sleep(1)
    os.system(command)


def main() -> None:
    try:
        after_seconds = int(sys.argv[1])
    except IndexError:
        print("時間を指定してください。")
        raise
    except (TypeError, ValueError):
        print("時間が整数ではありません。")
        raise

    if after_seconds < 0:
        print("時間はマイナスにできません。")
        raise

    message = Template("$seconds 秒後にシャットダウンします。").safe_substitute(seconds=after_seconds)

    try:
        print(message)
        shutdown(after_seconds=after_seconds)
    except KeyboardInterrupt:
        print("処理を中断しました。")
        sys.exit(2)


if __name__ == '__main__':
    main()
```

## 実行

例えば 30 分後にシャットダウンしたい場合、以下のコマンドで実行します。

```sh
python shutdown.py 1800
```

---

ああ、PC がシャットダウンされてしまいました。  
ありがとうございました :sleeping:
git push origin main　パスワードのサポートが〜　

結論:パーソナルアクセストークンを利用する。

症状:パスワードのサポート切れのようなエラーメッセージにより、githubにpushできない

対処:
    1.githubのページの自分のアイコンから設定を開く
    2.開発者用〜(Developer〜)を選択
    3.トークンの新規発行をして、それをターミナルで利用する

注意:完全初学者のアウトプットのため、すべての場合に対応できるものではありません。
さらに、トークンはおそらく再表示できないものだと思いますので、忘れずにコピーすること。
文系SEがDocker Desktop導入してみた

# Windows11にDocker Desktopをインストールした話

Dockerの学習の一環でWindowsにDocker Desktopをインストールしていみました。
本記事は、備忘録になります。

:::note info
**共有**
使用するPCはWindows11です。
事前にWSL2のUbuntu22がインストールされている環境になります。
WSL2の導入方法は下記記事でまとめています。
[文系SEがWindowsPCにをWSLをインストールして簡単Linux環境を構築した話](https://qiita.com/tacky0127/items/a91636eb7b8188f87859)
:::

:::note warn
Dockerを使用する環境にはLinuxが必要です。
Macを使用して、Unix環境を持っている場合でもLinux環境を構築しましょう。
:::

# インストール

下記リンクにアクセスする
[公式DLサイト](https://docs.docker.com/desktop/install/windows-install/)

::: note info
使用するPCの環境として64bitであることが望ましいです
リンク先にシステム要件が記載されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/3c8ab188-5f4f-fcce-5b55-57206b318ecc.png)

:::

サイト先でインストーラをDLする
DL時間が掛かります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/32141e96-f131-bd15-8dfc-cbddfcae5f19.png)

インストーラをDLできたらダブルクリックし起動します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/4c33caa1-08aa-b332-1e0e-db7d4753b8cd.png)

:::note info
**共有**
システムに変更を加えることを許可しますか？
とポップアップが表示されたら**はい**で進みます。
:::

インストールを少し待ちます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/e83b70c4-362c-b94c-4e0b-970a254c785b.png)

終わるとsucceededと表示され再起動します。

再起動後Dockerのポリシーについてポップアップが表示されます。
acceptで進みます。

タスクトレイにクジラが表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/4397610d-01b1-bd02-3a01-871c925b6f90.png)

# Setting
ポップアップを進めていくと、Sign Upが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/2a2966d5-5533-5d90-5cb3-d81ebc3750bc.png)

アカウントを未所持の場合はアカウントを作りましょう。
私はGoogleアカウントでさっと作りました。

:::note info
**共有**
作成自体はブラウザで行います。
アカウントの作成およびサインインができたらブラウザを閉じて問題ないです。
:::

# アプリ起動
PCにインストールしたDocker Desktopを起動します。
ショートカットを生成していた場合デスクトップからアイコンをダブルクリックして起動します。

起動後、ログインがしていない場合は、Dockerのアカウントを使ってログインしてください。
ログインすると画面が表示され、アイコンが名が変更されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/9194391c-8da9-58b6-d7bc-4567c71461a1.png)

設定を確認したい場合は、画面上部の歯車を選択します。

**General**のUse the WSL2にチェックが入っていればWSL2をベースに動作する設定になっています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/596363/bec6f1c1-d1b0-8859-b7a0-9c1f27898aa7.png)

以上でアプリケーションのインストールは終了です。次回は動作周りの確認を行いたいと考えています。
お疲れ様でした。
RTX1300でのフレッツ光クロス＋OCNバーチャルコネクト 固定IP1での接続設定

「かんたん設定」で問題ない。

## 基本設定

![2024-06-24_01h45_19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/61234/5e340a4b-07c8-42fd-8a87-7c136c24f65e.png)

### ひかり電話の契約

***ひかり電話を契約していなくても、「契約している」で設定すること！***

フレッツ光クロスでは、RA方式ではなく、PD方式となる。
そして、それをNTTやNTTコミュニケーションズは教えてくれない。

「ひかり電話あり」で設定することでPD方式になる。


### IPv4 over IPv6トンネルの設定

「使用する」にする

### サービス

「OCNバーチャルコネクト」を選ぶ。

アドレス解決システムURL、認証用ID、認証用パスワードは、全部共通だけど、一応マスクしておきました。

## NATディスクリプターの設定

![2024-06-24_01h50_35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/61234/ad62f522-a1ab-727b-2f96-fcfbfb4dd088.png)

### 静的IPマスカレードの設定

内部アドレスに2つのプロトコルをマッピングする。

* UDP ... 500, 4500, 1701
* ESP

UDPの500番ポートは、主にIKE（Internet Key Exchange）プロトコルに使用される。UDPの1701番ポートは、L2TP(Layer 2 Tunneling Protocol)で使用される。RTX830と違って、これを明示的に入れないと、VPNが繋がらないので注意。
UDPの4500番ポートは、NATトラバーサル (NAT Traversal) に対応したIKE (Internet Key Exchange) およびIPsec VPNの通信に使用される。
ESP（Encapsulating Security Payload）は、IPsec（Internet Protocol Security）の一部として使用されるプロトコル。

## 固定のIPv4が降ってこない件

工事すると、当日、固定のIPv4が降ってこない件に数回遭遇しています。
NTTコミュニケーションズのサポートに電話すると、「うちはちゃんと設定している」の一点張りです。

そういう場合は、24時間経過するのを待ってみて下さい。
翌日になって、契約している固定IPがやってきます。
【Drupal】過去の hook_update_N をスキップしたい

今回はDrupalが標準で用意している`hook_update_last_removed`について紹介します。

https://api.drupal.org/api/drupal/core%21lib%21Drupal%21Core%21Extension%21module.api.php/function/hook_update_last_removed/11.x

## 対象

Drupalのモジュール開発でいっぱい`hook_update_N`を実装している方

## 使用場面例
Drupal開発をしていると、新機能開発やバグ対応等でモジュール内の`hook_update_N`がかさばることってありますよね。

1. `hook_update_10001`で始まり、`hook_update_10019`までを実装しているモジュールがあるとします
2. モジュールのメンテナーが閃きました
3. `hook_update_10020`で過去の更新分をまとめるようなUtilityスクリプトを実装したとします

そのような場合、DB更新時に `hook_update_10001` から `hook_update_10019` が実行されてしまったら困りますよね。

## 使用方法

```php
function hook_update_last_removed() {
    return 10019;
}
```

これだけです。

これで、過去のスクリプトをスキップして、`10020`のみを更新するように制御できます。

## 関連
https://qiita.com/umekikazuya/items/f065fa680ee0a807f119
Active Directory (AD)とは

## はじめに
Active Directory(AD)についての理解が曖昧なのでまとめようと思います。

## Active Directory (AD)とは
Active Directory (AD)とはwindows 2000から採用されているディレクトリサービスです。
windows Serverに搭載されており、ソフトのインストールが不要です。
主な機能は以下の通りです。
- ドメインでリソースを管理
組織内のユーザー、グループ、コンピュータなどのリソースをドメインで部署ごとに分けたりするというったことが可能

- ユーザー認証とアクセス制御
ユーザー認証を行い、データのアクセスをユーザー毎に制御を行う
シングルサインオンにより、同じドメイン内のリソースへのアクセスの認証をスキップすることができる

-  ソフトウェアの一括ダウンロード、アップデート
業務に必要なソフトウェアをリモートから管理端末に一括で自動インストールやアップデートを行える


## 参考
https://www.rworks.jp/system/system-column/sys-entry/21659/

https://www.infraexpert.com/info/server07.html
個人でやってきた学習方法を紹介

# 概要

今回は、私自身が業務以外でどのような勉強をして、自己研鑽していたのかを3つほどピックアップして紹介したいと思います。



# ① 1か月間ひたすらドットインストール

1か月だけドットインストールの有料プランを契約し、1か月間で40時間弱の勉強しました。

ほとんどプログラミングの知識もなかったため、興味のある技術について片っ端から勉強していき。気が付いたら、一か月で約40時間弱の勉強していました。

**「業務では使っていないが興味のある技術」** や **「業務では使っているが理解しきれていない部分」** といった基礎の部分の勉強ができました。

固定料金なので手が出しやすいのことメリットです。社会人であれば生活に困るなんてことは、ほぼ無いと思うので、むしろやらないと損かと思います。

↓ 私のドットインストールの学習履歴です

https://dotinstall.com/users/ishi720

# ② さくらインターネットでWEBサイトの構築と公開

ドットインストールの勉強をもとに、さくらインターネットのVPSを借りてWEBサービスを公開しました。

公開するといっても、プログラムでアプリを作って公開っていう簡単な話ではなく、サーバーの構築やセキュリティの知識とかが必要となり、契約してから公開するまで1か月くらいなにも進めることができませんでした。


具体的には、付加価値として以下のような知識が深まりました。

- ドメインやサーバー証明書の知識
- SEOに対する知識
- サーバーを運用するにあたってのメンテナンスに対する知識
- アナリティクスの知識

WEBページのアナリティクスはこんな感じで、最初はUU数が少ないですが、徐々に上がっていって楽しいです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/473097/891eded8-7da1-909d-c9de-95501849e028.png)


現在では、AWSやGCPなどのクラウドもありますが、従量課金制だったりするのではじめは、固定料金のさくらインターネットなどのレンタルサーバーでも良いかと思います。



# ③ GithubやQiitaに、知見をアウトプット

私は、勉強した内容をGitLabにプライベートでまとめていましたが、人に見せらせるようなものではなく、自分にしか理解できないようなメモ書き程度のものでした。

Githubには、**プログラミングしたコード** を Qiitaには、**今までためた知見を記事として投稿** するようにしました。

メリットとしては、**人に説明するためにより理解をしなければいけないこと**、後で同じことを調べるときに **カンペとして確認したり、他人に共有できること** です。

# おわりに

今回は、私自身が業務以外でどのような勉強をしてきたかを紹介させていただきました。

ネット上に転がっている情報である程度勉強はできますが、お金を掛けて試してみないと難しいことがあったり、近道で学習できるかと思いますので、この記事が後押しとなれば幸いです。



以上、ここまで読んでいただきありがとうございました。
vscode上でtypescriptをサクッと動かす


# はじめに

TypeScript のコードや型の確認を行うためにサクッと書いて実行したいときありますよね。
以前は TypeScript Playground を使っていたのですが、エディタから離れずにそのまま実行できると便利です。
そこで今回は、VSCode 上で TypeScript をサクッと動かす方法を紹介します。

# 要約

一連のワークフローを登録できる VSCode の [task](https://code.visualstudio.com/docs/editor/tasks) という機能を用います。
開いているファイルを Deno 上で実行するワークフローを task に登録しショートカットから実行できるようにすることで TypeScript をサクッと動かすことができます。

# 詳細

## 1. Deno のインストール

TypeScript をそのまま実行できる [Deno](https://deno.com/) をインストールします。
ちなみに [ts-node](https://www.npmjs.com/package/ts-node) でも良いです。

## 2. tasks.json の作成

⌘ + Shift + P でコマンドパレットを開き、`Tasks: Open User Tasks` を選択します。
tasks に関する設定ファイルが開かれるので、以下のように設定します。

```json
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Run Deno", // タスクのラベル
      "type": "shell", // シェルコマンドを実行
      "command": "deno", // 実行するコマンド
      "args": ["run", "${file}"], // コマンドの引数
      "group": {
        "kind": "build", // タスクの種類
        "isDefault": true // デフォルトのタスクに設定
      }
    }
  ]
}
```

isDefault を true にすることで、「⌘ + Shift + B」を押すだけで実行できるようになります。
（Windows や Linux の場合は、Ctrl + Shift + B）

# まとめ

VSCode 上で TypeScript をサクッと動かすためには、Deno をインストールし、tasks.json に適切な設定を追加するだけです。これにより、エディタから離れることなく TypeScript のコードをすぐに実行できるようになります。

# 参考文献

- [Integrate with External Tools via Tasks](https://code.visualstudio.com/docs/editor/tasks)
- [Task の設定オプション](https://code.visualstudio.com/docs/editor/tasks-appendix)
- [Deno](https://deno.com/)
- [ts-node](https://www.npmjs.com/package/ts-node)
【Mac】Docker runでエラーが発生してlocalhostが開けない時の解消法

## PHPファイルが開けない

DocKer起動後、PHPファイルを開こうとしたところ、Not Found(The requested URL was not found on this server)と表示された。

Dockerを確認すると、php-nginx-1が動いておらず、中身を見ると下記のエラーが表示された。

```
Error response from daemon: Ports are not available: exposing port TCP 0.0.0.0:80 -> 
0.0.0.0:0: listen tcp 0.0.0.0:80: bind: address already in use
```

## ポート80が使用済

検索するとApacheが自動で走っていて、nginxが使うポートを既に使っている可能性があるとの事。

```
sudo lsof -i -P | grep ":80"
```

実際にコマンド叩いて調べてみると見事に該当。
※httqdというのがApacheである証拠。
```
httpd 1269 root 4u ipv6 0x4a2fba95fe2c1c81 0t0 tcp *:80 (listen)
```

# 対処法
### <font color="DeepPink">Dockerを一度落としてから、</font>下記いずれかのコードをコマンド上で実行しApacheをキルする。※passwordの入力必要有
```
$ sudo apachectl stop
```
```
$ Sudo launchctl stop /System/Library/LaunchDaemons/org.apache.httpd.plist
```
```
$ sudo service httpd stop
```

### Dockerを再度起動する

```
$ docker-compose up -d
```

### コンソールに下記が表示されればOK
```
[+] Running 2/2
 ✔ Container php-php-1    Started                                          0.1s 
 ✔ Container php-nginx-1  Started                                          0.1s 
 ```
Alldocube iPlay 50をアンロック

# 注意
この記事に貼ってあるリンクはいつ死ぬかわからないし、ダウンロード先も煩わしいボタンが多い
正しいものであるかわからない場合はリンクを踏まず自分で探そう

# 目次
1. ドライバのインストール
1. タブレットのタウングレード
1. アンロック

# ドライバのインストール
今回は楽をするためにwindowsを利用するので、ドライバをインストールする必要がある
ドライバは以下のリンクからダウンロード可能
spd driver
https://androiddatahost.com/dsa6h

# タブレットのタウングレード
今回使うツールではタブレットのバージョンをiPlay50(T1030)_EN_20230801にする必要がある
以下のダウングレードツールを利用する
spd flash tool
https://spdflashtool.com/download/spd-flash-tool-r27-23-1902
ここからiPlay50(T1030)_EN_20230801.Tをダウンロード
https://www.alldocube.com/en/firmware/alldocube-iplay50t1030-firmware-download/

ツールを起動し、左上の歯車を押す。出てきたポップアップでダウンロードしたファームウェアの.pacを選択

タブレットの電源を切り、電源ボタンと音量マイナスボタンを７秒ほど押してダウンロードモードにして左から３つ目の矢印ボタンを押す

passedと出るまで待つ

# アンロック
以下のリンクから38691_ums512_alldocube_iplay_50_EN_20230801.zipをダウンロード
https://github.com/TomKing062/CVE-2022-38694_unlock_bootloader/releases/tag/1.7

展開して中にあるunlock.batを実行
電源ボタンと音量マイナスボタンを７秒ほど押してダウンロードモードにしてあとは画面の指示に従う
成功するまで繰り替えす
成功したらタブレットにアンロックされたぞ的なことが出てくる

# magisk
2024/11/10追記
ネットの海を彷徨っていたら中国語ですが、magiskのインストール方法を発見しました
https://www.51cube.com/forums/topic/28363/
1, 2にはアンロック方法が書いてありますが、この記事と全く同じ手順なので3以降を見ましょう。


以下は日本語訳です。
### boot.imgの抽出
spdflashtoolのフォルダ内からBinPack.iniを探し、`MaxDataLength = 50`となっているところを`MaxDataLength = 200`に変更します。
その後flashtoolを起動し直し、左上の歯車を押した後ファームウェアの.pacファイルを選択、imagesフォルダ内にboot.imgが出現します。
### パッチを当てる
こちらは一般的な方法です。抽出したboot.imgをタブレットに移しmagiskアプリからパッチを当てます。パッチを当てたimgファイルはダウンロードフォルダにあるのでパソコンに移して置きましょう。
### 焼く
`adb reboot fastboot`を実行してfastbootに入ったら`fastboot reboot fastboot`を実行します。
そして`fastboot flash boot {パッチを当てたimgファイル}`を実行して完成🎉
ABC359参加記録　by Python

# リアルタイムに解けた問題

## [A - Count Takahashi](https://atcoder.jp/contests/abc359/tasks/abc359_a)

### 問題文

文字列が$N$個与えられます。
$i$番目($1\leq i \leq N$)に与えられる文字列$S_{i}$は<font color="Red">`Takahashi`</font>か<font color="Red">`Aoki`</font>のどちらかと等しいです。
$S_{i}$が<font color="Red">`Takahashi`</font>と等しい$i$がいくつあるか求めてください。


### 制約
- $1\leq N \leq 100$
- $N$は整数
- $S_{i}$は<font color="Red">`Takahashi`</font>か<font color="Red">`Aoki`</font>のいづれか($1\leq i \leq N$)

### アルゴリズム
リストからfor文で一つづつ要素を文字列を取り出し、それが<font color="Red">`Takahashi`</font>と等しければ、カウンター変数countを１増やす。
最後にcountを出力。

### ソースコード
``` python
N = int(input())

S = [input() for _ in range(N)]

count = 0

for s in S:
  if s == 'Takahashi':
    count += 1

print(count)

```

## [B - Couples](https://atcoder.jp/contests/abc359/tasks/abc359_b)

### 問題文
$2N$人の人が横一列に並んでおり、左から$i$番目の人は色$A_{i}$の服を着ています。ここで、服の色は$1$から$N$の$N$色であり、それぞれの色についてちょうど$２$人の人がその色の服を着ています。

$i = 1,2,...,N$のうち、以下の条件を満たすものは何通りあるか求めてください。
- 色$i$の服を着た二人の人の間にはちょうど一人いる。

### 制約
- $2\leq N \leq 100$
- $1\leq A_{i} \leq N$
- $A$には$1$以上$N$以下の整数全てがそれぞれ$2$個づつ含まれる
- 入力される数値は全て整数

### アルゴリズム
同じ服の色を着た人の間にいる人数はちょうど１人であるのが何通りであるかを知りたいので、for文の処理で、$i$番目と$i+2$番目の要素が同じとき、カウンター変数countを１増やす。
最後にcountを出力。

### ソースコード
``` python
N = int(input())

A = list(map(int, input().split()))

count = 0

for i in range(2*N -2):
  if A[i] == A[i+2]:
    count += 1

print(count)
```
WindowsのJupyterLab Desktop App で任意のRを使う方法

## 初めに
実験結果を集計し、グラフを作成するためにRを扱う環境としてJupyter Labを用いれば、計算過程などを残しておけます。
今まで、Anacondaの環境上でJupyter Labを使っていたのですが、Anacondaを立ち上げて、Jupyter labを立ち上げて、と手順が煩雑でした。JupyterLab desktop appの方がデスクトップのショートカットを押せばすぐ使えますし、なにより環境構築が楽です！

JupyterLab desktopでRを使う方法として、CondaをつかってConda-forgeからインストールする方法もありますが、なぜかConda-forgeのWindows向けのRだけ古いバージョンのままになっています。ライブラリーをインストールする際にRのバージョンが古いと不具合がよく出るので、最新のバージョンを入れたいところです。

## JupyterLab Desktop Appのインストール

JupyterLabDesktop Appはgithubからインストーラーをダウンロードして、インストールします↓。

https://github.com/jupyterlab/jupyterlab-desktop

下の方にスクロールし、
Windows (10, 11)
x64 Installaer
からダウンロードします。

インストーラーを実行するとWindowsによってPCが保護されましたというウインドウが出ることがありますが、詳細情報＞実行します。

Jupyterlab desktopが立ち上がり、もしウインドウの下部にPython environment not found と出てきたら、すぐ右のusing bundle installerをクリックして数分待ちます。

New notebook...やNew session..がクリックできるようになったらOKです。
ウインドウを閉じます。

## Rのインストール
Rをインストールします。もしすでにライブラリーをたくさん入れたRのバージョンがあり、それを使いたい場合はこの手順はスキップします。Rは以下のサイトからWindows用のインストーラーをダウンロードすればよいです。

https://cloud.r-project.org/

最新のバージョンを入れたければ "install R for the first time."を押してください。
インストーラーをダウンロードしたら実行して、インストールしてください。

## RをJupyterLab desktopで使う方法

デスクトップに作成されたRのアイコンをクリックしてRを立ち上げます。
上の段落で、Python environment not foundと出て、using bundle installerをクリックした場合のみディレクトリの変更を行います。Python environment not foundと出なければ、jupyterのパスが通っていたということなので、ディレクトリの変更の必要はありません。②IRkernelのインストールから行います

### ①ディレクトリの変更
ウインドウ左上の　ファイル＞ディレクトリの変更をクリックします。
%APPDATA%/jupyterlab-desktop/jlab_server/Scripts
と上部のバーに入力します

![スクリーンショット 2024-06-23 234909.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3822329/66703591-e78c-0299-ae47-7978951e5327.png)

エンターを押して、その後

"フォルダーの選択"を押します。


### ②IRkernelのインストールと実行
```R
install.packages('IRkernel')
IRkernel::installspec()
```
をコピペして貼り付けします。エンターを押してください。
エラーが出なければ、ウインドウを閉じます。

デスクトップのJupyterLabのアイコンをクリックしてJupyterLab desktopを立ち上げます。
New sessionをクリックします。

![スクリーンショット 2024-06-24 001604.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3822329/3c92402e-003c-83e1-f9a0-7a7951b133f0.png)

このようにPython3の隣にRが出てきていればOKです。
もし全く違う画面なら、左上のFileからNew Launcherか左上の青地に白の＋を押してください、

Note bookのほうのRを押します。出てきた空欄に以下のコマンドをいれShift+Enterを押します。

```
sessionInfo()
```

Rのバージョンが目的のものになっていればOKです。
【SwiftUI】Conway's Game of Life

レジェンドな先人たちの

https://ja.wikipedia.org/wiki/%E3%82%B8%E3%83%A7%E3%83%B3%E3%83%BB%E3%83%9B%E3%83%BC%E3%83%88%E3%83%B3%E3%83%BB%E3%82%B3%E3%83%B3%E3%82%A6%E3%82%A7%E3%82%A4

考案した数理モデルを使って、

https://ja.wikipedia.org/wiki/%E3%83%A9%E3%82%A4%E3%83%95%E3%82%B2%E3%83%BC%E3%83%A0

配列処理の練習です。

# 🧑🏻‍💻 構成

ロジック部分は ```@Observable``` クラスに任せて、

そこから露出するのは、

```swift
var field: [[Int]] = []
```
です。

UI 側ではそれを利用したグリッドの表示だけを行います。

```swift
Grid(horizontalSpacing: 1, verticalSpacing: 1) {
  ForEach(lifeGame.field.indices, id: \.self) { y in
    GridRow {
      ForEach(lifeGame.field.first!.indices, id: \.self) { x in
        lifeGame.field[y][x] == 1 ? Color.alive : Color.dead
      }
    }
  }
}
```

構成が決まればあとはそれぞれ詰めていくだけ。


# 🧑🏻‍💻 参考
<center>
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">【SwiftUI】Conway&#39;s Game of Life<br>👉 <a href="https://t.co/xmNQbX09fr">https://t.co/xmNQbX09fr</a><a href="https://twitter.com/hashtag/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0?src=hash&amp;ref_src=twsrc%5Etfw">#プログラミング</a> <a href="https://twitter.com/hashtag/swift?src=hash&amp;ref_src=twsrc%5Etfw">#swift</a> <a href="https://t.co/XovL5G4F8L">pic.twitter.com/XovL5G4F8L</a></p>&mdash; chanzmao (@maochanz) <a href="https://twitter.com/maochanz/status/1757925188686192874?ref_src=twsrc%5Etfw">February 15, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</center>

https://android.benigumo.com/20240215/conways-game-of-life/
主成分分析の因子負荷量を可視化してみた

R言語では簡単に主成分分析を可視化しやすいのですが、主成分分析では段階を踏まないといけません。
# ライブラリのインポート
```Python3
from sklearn.decomposition import PCA
import matplotlib.pyplot as plt
import numpy as np
import pandas as pd
```
# データの読み込み
9科目の成績データを読み込みます。
このデータです

https://statistics.co.jp/reference/statistical_data/seiseki.csv

```Python3
df = pd.read_csv("seiseki.csv")
df.head()
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782889/498f572c-1735-d00e-c031-02084629fe69.png)

# 因子負荷量の計算
```Python3
pcacol = []
fac = []
for col in df.columns:
    df[col] = (df[col] - df[col].mean()) / df[col].std()
for i in range(len(df.columns)):
    pcacol.append("PC%d"%(i+1))
model = PCA()
model.fit(df)
df_pca = pd.DataFrame(model.transform(df))
df_pca.columns = pcacol
for i in range(len(pcacol)):
    print(pcacol[i], np.cumsum(model.explained_variance_ratio_)[i])
    fac.append(np.sqrt(model.explained_variance_ratio_)[i] * model.components_[i])
df_fac = pd.DataFrame(fac)
df_fac.columns = df.columns
df_fac.index = pcacol
df_fac
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782889/c59c9562-e2d4-afc2-804d-67de7afb0ffd.png)

# 因子負荷量のプロット
```Python3
for col in df_fac.columns:
    arrow = [df_fac.loc["PC1", col], [df_fac.loc["PC2", col]]]
    plt.plot([0, arrow[0]], [0, arrow[1][0]])
    plt.text(arrow[0], arrow[1][0], col)
plt.show()
```
参考元とは正負が逆になっていますが因子負荷量の解釈はこのようになります。
![Untitled.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782889/fafe0973-e250-f14d-cabb-7139dd916512.png)

# 両軸
```Python3
fit, ax1 = plt.subplots()
for col in df_fac.columns:
    arrow = [df_fac.loc["PC1", col], [df_fac.loc["PC2", col]]]
ax2 = ax1.twinx()
ax2.scatter(df_pca["PC1"], df_pca["PC2"])
ax1.set_ylim(-0.325, 0.325)
ax3 = ax1.twiny()
for col in df_fac.columns:
    arrow = [df_fac.loc["PC1", col], [df_fac.loc["PC2", col]]]
    ax3.plot([0, arrow[0]], [0, arrow[1][0]])
    ax3.text(arrow[0], arrow[1][0], col)
ax3.set_xlim(-0.325, 0.325)
plt.show()
```
![Untitled.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2782889/98e569d6-8702-b1cd-cd30-6820b20e691b.png)


第一主成分の値が高いほど体育以外が高く、第二主成分の値が高いほど体育が高い。
というのが直感的に分かるモノになったのではないかと思います。
また2軸だと左軸が因子負荷量で右軸が主成分分析変換後(PC2)で横軸が主成分分析変換後のPC1の値です。下軸が主成分分析変換後(PC1)で上軸が因子負荷量の第一主成分です。

# 参考文献
主成分分析 | 統計科学研究所
https://statistics.co.jp/reference/software_R/statR_9_principal.pdf
【TypeScript】型の共通部分だけ抽出する

# 型の共通部分の抽出方法

以下のような`User`と`Admin`の型の共通部分を取得する場合を考えます。
`User`はemailでログインするが`Admin`はloginIdでログインするような仕様を想定しています。

```typescript
type User = {
  id: number;
  name: string;
  email: string;
};

type Admin = {
  id: number;
  name: string;
  loginId: string;
};
```


以下のような記述で**共通部分だけ抽出した型**を作ることができます。

```typescript
type Common = Pick<User, keyof User & keyof Admin>;
```

上記の型は以下と同じ型になります。

```typescript
type Common = {
  id: number;
  name: string;
};
```

# 説明

ここから先は気になる方だけ。
ワンライナーで書いていた型を一つずつ紐解くと以下のようになります。
`Pick`や`&`（インターセクション型）の意味や使い方についてはサバイバルTypeScriptが参考になるかと思います。

```typescript
type User = {
  id: number;
  name: string;
  email: string;
};

type Admin = {
  id: number;
  name: string;
  loginId: string;
};

type KeyOfUser = keyof User;
// => "id" | "name" | "email";

type KeyOfAdmin = keyof Admin;
// => "id" | "name" | "loginId";

type CommonKey = KeyOfUser & KeyOfAdmin;
// => "id" | "name";

type Common = Pick<User, CommonKey>;
// => { id: number; name: string; }
```

https://typescriptbook.jp/reference/type-reuse/utility-types/pick

https://typescriptbook.jp/reference/values-types-variables/intersection
Sequence Makerをオンラインバージョンアップする

## はじめに
Sequence MakerはExcelから測定器を制御可能にするアドインです。この記事ではSequence Makerをオンラインバージョンアップする方法を解説します。Sequence Makerについての詳細は以下の記事を参照ください。

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

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

## 最新版の確認
Excelを起動し「SEQUENCE MAKER」のタブのヘルプグループにある「最新版のチェック」をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/8fd48f04-8769-4fb7-3303-df9b0a131bcf.png)

### 最新版のとき
現在使用しているSequence Makerが最新の場合は以下のメッセージが表示されます。
この場合、バージョンアップの必要はありません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/d018e523-7772-4d03-e196-af9f769ccd96.png)

### 古いとき
現在使用しているSequence Makerのバージョンが古く、バージョンアップ可能な場合は以下のメッセージが表示されます。
「OK」をクリックすると、最新版のインストーラーがダウンロードされた後、セットアップが開始されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/7045ce2f-ef81-8772-9d7c-2db481d65f7e.png)

:::note warn
注意
Excelが起動していると、Sequence Makerのインストールができません。
Excelを終了してからインストールしましょう。
:::

## バージョンの確認方法
Sequence Makerのバージョンはリボンでも確認できますが、より詳細なバージョンはオプション画面の右下に表示されています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3821782/c33522d9-abdc-8350-c034-4975de0dd578.png)

## まとめ
Sequence Makerは機能追加やバグ修正などでバージョンアップされることがあるので、時々最新版のチェックをしてみると良いです。
【VSCode】タイトルバーにファイルパスを表示する方法

`window.title` の設定を変更することでタイトルバーにファイルパスを表示できます。

```jsonc:settings.json
"window.title": "{activeEditorMedium}"
```
上記のように設定するとファイル名だけでなく、ファイルパスも表示されるようになります。

`window.title`には他にも以下のような値を使用できます。

![スクリーンショット 2024-06-23 23.58.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2342443/3c9bb3f6-7998-379b-6f48-9535eef7bc47.png)

また、`${separator}`は`window.titleSeparator`で任意の記号に変更できます。
HTML、CSSの実装検証

HTML要素とその固有property(tagに記述できる属性等)、CSSの実装状況をBrowserで確認する簡易的な方法を紹介。
## HTML
```js
let ks=a=>Object.keys(a).sort().map((a,b)=>b+" "+a);
let a=Object.getOwnPropertyNames(this).filter((a,b)=>/(HTML|SVG)\w+Element/.test(a));
let b=[],c=0;
for(a of a)b[c++]=c+" "+a+"</h2>"+ks(this[a].prototype).join("<br>");
document.write("<h2>",b.join("<h2>"))
```
ol形式
```js
let a=Object.getOwnPropertyNames(this).filter(a=>/(HTML|SVG)\w+Element/.test(a));
let b=[];
for(a of a)b.push("<h2>"+a+"</h2><ol><li>"+Object.keys(this[a].prototype).sort().join("<li>"))
document.write(b.join("</ol>"))
```
## CSS
`.replace`以降を加えるとCSSそのまんまという感じになる。しかし一部変えてはならないものもある(cssText、setProperty等)
```js
let a=document.lastChild.style,b=[],c=0;
for(a in a)b[c]=c+++" "+a//.replace(/[A-Z]/g,a=>"-"+a.toLowerCase())
document.write(b.join("<br>"))
```