ラベル 作業記録 の投稿を表示しています。 すべての投稿を表示
ラベル 作業記録 の投稿を表示しています。 すべての投稿を表示

2026年7月6日月曜日

Mailpit でメール送信機能の確認をする

Dify のメール送信機能のテストを使用と思ったのだけど、昨今メール機能の確認には Mailpit が使われているらしい。

久しぶりに SMTP サーバーと喋るか。

という事で Mailpit でメール送信を確認してみます。

前提

  • Docker インストール済み

Mailpit の起動

docker run --rm -p 1025:1025 -p 8025:8025 axllent/mailpit
  • -p 1025:1025 は SMTP サーバーのポート
  • -p 8025:8025 は Web UI のポート

組み合わせるツールによっては、以下環境変数の設定が必要。

  • MP_SMTP_AUTH_ACCEPT_ANY: true
  • MP_SMTP_AUTH_ALLOW_INSECURE: true

Mailpit の Web UI にアクセス

Web ブラウザで以下の URL にアクセスします。

http://localhost:8025

ここで、 Mailpit が送信依頼を受けたメールの内容を確認することができます。

メールを送信してみる

メール送信プログラムを書くのも面倒なので、 netcat コマンドで SMTP サーバーに接続してメールを送信してみます。

$ nc -C localhost 1025
220 a2baad3a9a5a Mailpit ESMTP Service ready
EHLO mikoto2000.example.com
250-a2baad3a9a5a greets mikoto2000.example.com
250-SIZE 52428800
250-ENHANCEDSTATUSCODES
250-8BITMIME
250 SMTPUTF8
MAIL FROM: <mikoto2000@mikoto2000.example.com>
250 2.1.0 Ok
RCPT TO: <mikoto2000@mikoto2000.example.com>
250 2.1.5 Ok
DATA
354 Start mail input; end with <CR><LF>.<CR><LF>
Subject: THIS IS A TEST MAIL

This is a test mail.
.
250 2.0.0 Ok: queued as 6LRwlqUzQIvOiY33VSVRu3
QUIT
221 2.0.0 a2baad3a9a5a Mailpit ESMTP Service closing transmission channel

これで、メール送信依頼が Mailpit に送信されました。

Web UI でメールの内容を確認し、依頼通りの内容となっていることを確認。良さそう。

良い感じなので使って入れればと思いました。

参考資料

変更履歴

日付 変更内容
2026/7/6 新規作成
2026/7/28 Mailpit の環境変数について追加

2025年12月28日日曜日

静的サイトジェネレーター Rspress の Quick start をやってみた

プロジェクト作成

node ➜ /workspaces/TIL/Rspress/firststep (rspress-firststep) $ npm create rspress@latest
Need to install the following packages:
create-rspress@1.47.0
Ok to proceed? (y) y


> npx
> create-rspress


  Create Rspress Project

  Project name or path
  rspress-firststep-project

  Select additional tools (Use <space> to select, <enter> to continue)
  Add Biome for code linting and formatting, Add ESLint for code linting, Add Prettier for code formatting

  Next steps ───────────────────╮

  cd rspress-firststep-project  │
  npm install                   │
  npm run dev                   │

├────────────────────────────────╯

  Done.

npm notice
npm notice New major version of npm available! 10.9.2 -> 11.7.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v11.7.0
npm notice To update run: npm install -g npm@11.7.0
npm notice

node ➜ /workspaces/TIL/Rspress/firststep (rspress-firststep) $ cd rspress-firststep-project/

以下の構成でファイルが生成される。

rspress-firststep-project
|-- README.md                       : Rspress プロジェクトの README
|-- biome.json                      : Biome 設定ファイル
|-- docs                            : ドキュメントルート
|   |-- _meta.json                  : ヘッダ情報が書いてある
|   |-- guide
|   |   |-- _meta.json
|   |   `-- index.md
|   |-- hello.md
|   |-- index.md
|   `-- public                      : 公開リソース置き場
|       |-- rspress-dark-logo.png
|       |-- rspress-icon.png
|       `-- rspress-light-logo.png
|-- eslint.config.mjs               : ESLint 設定ファイル
|-- package.json                    : npm 設定ファイル
|-- rspress.config.ts               : Rspress 設定ファイル
`-- tsconfig.json                   : TypeScript 設定ファイル

開発サーバーで実行

npm install
npm run dev

ブラウザで http://localhost:3000 にアクセスすると、生成されたページが表示される。

その他コマンド

その他、チェック、フォーマット、リント、プレビュー等のコマンドも定義されているので必要に応じて適宜使える。

node ➜ .../TIL/Rspress/firststep/rspress-firststep-project (rspress-firststep) $ npm run
Scripts available in rspress-firststep-project@1.0.0 via `npm run-script`:
  build
    rspress build
  check
    biome check --write
  dev
    rspress dev
  format
    prettier --write .
  lint
    eslint .
  preview
    rspress preview

ビルド

npm run build

doc_build に静的サイトが生成される。

Nginx にデプロイしてみる

docker 上の nginx にデプロイしてみる。

docker run -p 8081:80 -v $(pwd)/doc_build:/usr/share/nginx/html:ro nginx

ブラウザで http://localhost:8081 にアクセスすると、デプロイされたページが表示される。

参考資料

2025年10月15日水曜日

いまさら helix_five_rows_jis をビルドしようとしているあなたへ

2025/10/15 時点のビルド方法

  1. QMK Toolbox インストール

  2. QMK MSYS インストール(以降、QMK MSYS 上で作業)

  3. QMK Firmware をクローン

    • コミット: 9315172190 にスイッチ
  4. keyboards/helix/rev2/keymaps/keyboards/helix/rev2/keymapshelix_five_rows_jis をフォルダごとコピー

  5. command.h の編集

    diff --git a/tmk_core/common/command.h b/tmk_core/common/command.h
    index d9d89ba0f1..f44b3f7bc3 100644
    --- a/tmk_core/common/command.h
    +++ b/tmk_core/common/command.h
    @@ -16,7 +16,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
     */
    
     #ifndef COMMAND_H
    -#define COMMAND
    +#define COMMAND_H
    
     /* FIXME: Add doxygen comments for the behavioral defines in here. */
  6. rules.mk の編集

    diff --git a/rules.mk b/rules.mk
    index 084b5db..3fb420c 100644
    --- a/rules.mk
    +++ b/rules.mk
    @@ -30,7 +30,7 @@ endef
     # you can edit follows 7 Variables
     #  jp: 以下の7つの変数を必要に応じて編集します。
     HELIX_ROWS = 5              # Helix Rows is 4 or 5
    -OLED_ENABLE = yes           # OLED_ENABLE
    +OLED_ENABLE = no           # OLED_ENABLE
     LOCAL_GLCDFONT = no         # use each keymaps "helixfont.h" insted of "common/glcdfont.c"
     LED_BACK_ENABLE = no        # LED backlight (Enable WS2812 RGB underlight.)
     LED_UNDERGLOW_ENABLE = no   # LED underglow (Enable WS2812 RGB underlight.)

残念ながら OLED はあきらめねばならない。

参考資料

2025年8月14日木曜日

Ubuntu20.04 に kubeadm で Kubernetes を構築する

コントロールプレーンに接続できたりできなかったりと、よくわからない状態になってしまったが、とりあえず作業記録として残す。

前提

  • OS: Ubuntu Server 20.04
  • 標準インストール直後からの開始

必須パッケージのインストール

環境構築中に必要になる雑多パッケージをインストール。

sudo apt-get update
sudo apt-get install -y apt-transport-https ca-certificates curl gpg

swap の無効化

sudo swapoff -a
sudo sed -i '/\sswap\s/s/^/#/' /etc/fstab

containerd のインストール

sudo apt-get update
sudo apt-get install -y containerd

kubeadm のインストール

Kubernetes パッケージリポジトリの公開鍵をダウンロード

curl -fsSL https://pkgs.k8s.io/core:/stable:/v1.33/deb/Release.key | sudo gpg --dearmor -o /etc/apt/keyrings/kubernetes-apt-keyring.gpg

Kubernetes パッケージのリポジトリを登録

echo 'deb [signed-by=/etc/apt/keyrings/kubernetes-apt-keyring.gpg] https://pkgs.k8s.io/core:/stable:/v1.33/deb/ /' | sudo tee /etc/apt/sources.list.d/kubernetes.list

インストール

kubelet, kubeadm, kubectl をインストールし、バージョンを固定する。

sudo apt-get update
sudo apt-get install -y kubelet kubeadm kubectl
sudo apt-mark hold kubelet kubeadm kubectl

シングルノードクラスターの作成

sudo kubeadm init

root ユーザーでない自分んが kubectl を実行できるように設定

mkdir -p $HOME/.kube
sudo cp -i /etc/kubernetes/admin.conf $HOME/.kube/config
sudo chown $(id -u):$(id -g) $HOME/.kube/config

コントロールプレーンに Pod を配置できるように設定

シングルノード設定なので、コントロールプレーンに相乗りする。

デフォルトではセキュリティ上相乗りできないので、相乗りできるように設定する。

kubectl taint nodes --all node-role.kubernetes.io/control-plane-

動作確認

hello-world のイメージをデプロイしてみる。

mikoto@kubernetes:~$ sudo docker run -it --rm hello-world

Hello from Docker!
This message shows that your installation appears to be working correctly.

To generate this message, Docker took the following steps:
 1. The Docker client contacted the Docker daemon.
 2. The Docker daemon pulled the "hello-world" image from the Docker Hub.
    (amd64)
 3. The Docker daemon created a new container from that image which runs the
    executable that produces the output you are currently reading.
 4. The Docker daemon streamed that output to the Docker client, which sent it
    to your terminal.

To try something more ambitious, you can run an Ubuntu container with:
 $ docker run -it ubuntu bash

Share images, automate workflows, and more with a free Docker ID:
 https://hub.docker.com/

For more examples and ideas, visit:
 https://docs.docker.com/get-started/

良さそう。以上。

参考資料

2025年7月22日火曜日

Supabase に入門した

Use Supabase with React | Supabase Docs をベースに、 VanillaJS で DB に接続しに行ってみた。

前提

  • Supabase プロジェクト作成済み

プロジェクト情報のの確認

  1. プロジェクトページを開く
  2. 右下の情報をメモ
    • Project URL
    • API Key

テーブルの作成

プロジェクトページ -> SQL editor を選択。 表示された SQL エディターで SQL を実行していく。

テーブル作成

-- テーブル作成
create table instruments (
  id bigint primary key generated always as identity,
  name text not null
);
-- テストデータ挿入
insert into instruments (name)
values
  ('violin'),
  ('viola'),
  ('cello');

-- row level security 有効化
alter table instruments enable row level security;

RLS ポリシーの作成

テーブル内のデータを、アノニマスユーザーが読み取り可能に設定。

create policy "public can read instruments"
on public.instruments
for select to anon
using (true);
  • anon: アノニマスユーザー

Vite プロジェクトの作成

プロジェクト作成

node ➜ /workspaces/TIL/supabase (supabase-firststep) $ npm create vite@latest firststep
Need to install the following packages:
create-vite@7.0.3
Ok to proceed? (y) y


> npx
> create-vite firststep


  Select a framework:
  Vanilla

  Select a variant:
  TypeScript

  Scaffolding project in /workspaces/TIL/supabase/firststep...

  Done. Now run:

  cd firststep
  npm install
  npm run dev

Supabase パッケージのインストール

cd firststep && npm install @supabase/supabase-js

環境変数の設定

.env.local を作成し、そこにメモしたプロジェクト情報を指定。

VITE_SUPABASE_URL=<Project URL>
VITE_SUPABASE_ACCESS_TOKEN=<API Key>

実装

src/main.ts:

import { createClient } from "@supabase/supabase-js";

const supabase = createClient(import.meta.env.VITE_SUPABASE_URL, import.meta.env.VITE_SUPABASE_ANON_KEY);

const { data } = await supabase.from("instruments").select();

console.log(data);

const app = document.getElementById('app');

if (app) {
  // ルート要素作成
  const root = document.createElement('div');

  // タイトル追加
  const h1 = document.createElement('h1');
  h1.textContent = "Supabase Instruments";
  root.appendChild(h1);

  // リスト作成
  const ul = document.createElement('ul');
  data?.forEach(instrument => {
    const li = document.createElement('li');
    li.textContent = `id: ${instrument.id}, name: ${instrument.name}`;
    ul.appendChild(li);
  });
  root.appendChild(ul);

  // ルート要素をアプリケーションに追加
  app.appendChild(root);

}

動作確認

npm run dev して http://localhost:5173 にアクセスすると、挿入したデータが表示される。 OK.

参考資料

2025年7月12日土曜日

Pull Request 作成ガイドのひな形を作った

毎プロジェクトで作っていて毎回面倒だと思っている気がするのでひな形を作った。

# 開発者向け Pull Request 作成ガイド

以下の手順で開発環境を整え、プルリクエストを送ってください。

## 1. リポジトリをクローンする

まずは GitHub 上のリポジトリをローカルにクローンします。

```sh
git clone https://github.com/YourOrganization/YourRepository.git
cd YourRepository
```

**既に clone 済みの場合**

すでにリポジトリを clone している場合は、main ブランチに移動し、最新のソースコードを取得します。

```sh
git switch main
git pull origin main
```

## 2. 新しいブランチを作成する

開発作業は必ず新しいブランチで行ってください。
ブランチ名は以下のように issue 番号を含め、分かりやすい名前をつけるようにしてください。


例:

```sh
git switch -c 123_add-test
```

## 3. コードを修正する

### 3-1. 修正後、変更内容を確認する

修正を行った後、以下のコマンドで修正ファイルの一覧を確認します。

```sh
git status
```

さらに、修正内容の差分を確認する場合は次のコマンドを使います。

```sh
git diff
```

### 3-2. 修正をステージングする

修正内容をステージング(インデックスに追加)します。

```sh
git add .
```

### 3-3. ステージング後の確認

再度、ステージング済みファイルを確認します。

```sh
git status
```

ステージング済みの差分を確認したい場合は以下を使います。

```sh
git diff --cached
```

### 3-4. コミットする

コミットメッセージは簡潔かつ内容が分かるように記載してください。

例:

```sh
git commit -m "テストを追加"
```


## 4. プルリクエスト作成前に main ブランチへ rebase する

プルリクエストを作成する前に、最新の main ブランチを取り込み、自分のブランチを rebase します。

### 4-1. main ブランチを最新にする

```sh
git switch main
git pull origin main
```

### 4-2 作業ブランチに戻る

```sh
git switch feature/add-login-page
```

### 4-3. main ブランチの最新履歴を取り込む

```sh
git rebase main
```

もしコンフリクトが発生した場合は、表示される指示に従って解決し、以下で rebase を続行します。

```sh
git add .
git rebase --continue
```

## 5. リモートリポジトリへプッシュする

```sh
git push -u origin 123_add-test
```

## 6. プルリクエストを作成する

GitHub 上で以下の手順でプルリクエスト(PR)を作成してください。

1. GitHub のリポジトリページを開く
2. 「Compare & pull request」ボタンをクリック
3. タイトルと説明を入力
    - どのような変更か
    - 関連する Issue があれば番号を記載(例: closes #123)
4. レビューアを指定(必要であれば)
5. 「Create Pull Request」をクリックして作成


## 7. プルリクエストマージ後、main ブランチへ戻る

プルリクエストのマージが完了したら、作業ブランチから main ブランチへ戻します。

```sh
git switch main
git pull origin main
```

## 注意事項

- main ブランチには直接 push しないでください
- 大きな変更の場合は事前に Issue を立てて相談してください
- レビューコメントが付いたら対応をお願いします

変更履歴

日付 内容
2025/7/12 01 新規作成
2025/7/12 02 pull 操作について追加
リベースの説明追加
マージ後 main に戻る手順を追加

2025年5月3日土曜日

Keycloak の Admin UI の開発環境を整える

やりたいこと

Keycloak の Admin Console に上手く動かない箇所があった ので、自分で直すために環境づくりをする。

前提

  • Docker インストール済み
  • docker exec コマンドが使えること

開発環境の起動

今回はすべての作業をコンテナ上で行う。

必要に応じてバインドマウントするなり、ベアメタルで環境構築するなりしてください。

docker run -it --rm -p "8080:8080" -p "5174:5174" ubuntu:24.04

必要なパッケージのインストール

Keycloak のビルド・実行には Node.js と Java が必要なのでインストール。

その他、開発に必要なものとして curl, git, vim をインストールする。

いろいろ

apt update
DEBIAN_FRONTEND=noninteractive apt install -y --no-install-recommends curl git vim

OpenJDK

apt install -y openjdk-17-jdk-headless

NodeJS & pnpm

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.2/install.sh | bash
\. "$HOME/.nvm/nvm.sh"
nvm install 22
npm install -g pnpm

Keycloak のクローン

cd ~/
git clone --depth 1 https://github.com/keycloak/keycloak.git

開発用サーバーを起動

フロントエンドの開発用サーバーを起動

別ターミナルで開発用サーバーを実行。

docker exec -it 72cc1a87a306 bash
cd ~/keycloak/js/apps/admin-ui/
pnpm install
pnpm dev

これだけでは動作確認ができないので、後述の「バックエンドの開発用サーバー」と連携させる必要がある。

バックエンドの開発用サーバーを起動

別ターミナルで開発用サーバーを実行。

docker exec -it 72cc1a87a306 bash
cd ~/keycloak/js/apps/keycloak-server/
pnpm start --admin-dev

これで、先ほど起動した admin-ui の開発サーバーといい感じに連携して、 admin-ui のソース更新を反映してくれるようになる。

ここまでの動作確認

ブラウザで http://localhost:8080 にアクセスすると、 Keycloak のログイン画面になる admin/admin でログインできる。

フロントエンドの修正

試しに Welcome to keycloak の文字列を変更してみる。

vim ~/keycloak/js/apps/admin-ui/src/dashboard/Dashboard.tsx

ファイルを開いたら、 t("welcomeTo", { realmDisplayInfo }) となっている箇所を "Customized!!!!!" に変更する。

変更が反映され、 Welcome to Keycloak と書かれていた場所が Customized!!!!! になっているのがわかる。

以上。

参考資料

2025年4月29日火曜日

Keycloak で SAML のクライアント証明書を設定する

やりたいこと

こんなことをしたときに、

こんなことがありました。

Bug: SAML Client Signing Certificate Not Stored via Admin Console (26.1.3) · keycloak/keycloak · Discussion #39232 にワークアラウンドが記載されていたので試す。

前提

Spring Boot で SAML 認証をする(署名無しバージョン) - mikoto2000 の日記 を実施済み。

やったこと

  1. myrealm の適切なユーザーにロール admin を割り当てる(今回は mikoto ユーザーに admin ロールを割り当てた)

  2. keycloak が起動しているコンテナに接続

    docker exec -it f29b1a6f3f70 bash
  3. kcadm.sh にパスを通す

    export PATH=$PATH:/opt/keycloak/bin/
  4. mikotomyrealm にログイン

    kcadm.sh config credentials --server http://localhost:8080 --realm master --user mikoto --password <PASSWORD>
  5. クライアント saml-sp の id を確認

    • JSON から頑張って探す
    • 今回は dafe91db-651f-4728-90f0-0faf2228fa38 だった
    kcadm.sh get clients --server http://localhost:8080 --realm myrealm
  6. saml-sp にクライアント証明書を設定

    • MIID...(略) の部分をクライアント証明書の文字列に置き換える
    kcadm.sh update clients/dafe91db-651f-4728-90f0-0faf2228fa38 --server http://localhost:8080 --realm myrealm -s 'attributes={"saml.signing.certificate": "MIID...(略)"}'
  7. 適用されたかの確認

    • saml.signing.certificate が更新されていれば OK.
    kcadm.sh get clients/dafe91db-651f-4728-90f0-0faf2228fa38 --server http://localhost:8080 --realm myrealm

動作確認

Keycloak の myrealm -> Clients -> saml-sp -> Keys -> Signing keys config -> Client signeture requiredOn にしても、 Spring Boot の SAML 認証が通るようになった。 OK.

2025年4月7日月曜日

devcontainer.vim で Claude Code を使う

AI コーディングというやつをやってみたかったのです。

前提

  • OS: Windows 11 Pro 23H2 ビルド 22631.5039
  • Docker Desktop: Version 4.37.1 (178610)
  • WSL2 の Ubuntu 24.04 から WSL Integration で Docker Desktop を利用
  • Java プロジェクトを作って、 Hello,World! するのが目標
  • Claude Code のアカウントを作って $5 入金済み

devcontainer 用のファイル作成

.devcontainer/devcontainer.json

  • Maven の Java プロジェクトを作りたいので、 devcontainer の features を利用してインストール
  • Claude Code に Node が必要なので、 devcontainer の features を利用してインストール
{
  "name": "app",
  "image": "mcr.microsoft.com/devcontainers/base",
  "features": {
    "ghcr.io/devcontainers/features/node:1": {},
    "ghcr.io/devcontainers/features/java:1": {
      "version": "21",
      "installGradle": "false",
      "installMaven": "true"
    }
  }
}

.devcontainer/devcontainer.vim.json

  • devcontainer.vim config -g > .devcontainer/devcontainer.vim.json で生成したものそのまま使う
{
  "remoteEnv": {
    "EDITOR": "~/squashfs-root/AppRun",
    "PAGER": "sed -r 's/\\x1B\\[[0-9;]*[mGKH]//g' | ~/squashfs-root/AppRun -R -",
    "LESSCHARSET": "utf-8",
    "SHELL": "bash",
    "TERM": "xterm-256color",
    "HISTCONTROL": "erasedups",
    // If use WSLG
    // "DISPLAY": "${localEnv:DISPLAY}",
    // "WAYLAND_DISPLAY": "${localEnv:WAYLAND_DISPLAY}",
    // "XDG_RUNTIME_DIR": "${localEnv:XDG_RUNTIME_DIR}",
    // "PULSE_SERVER": "${localEnv:PULSE_SERVER}",
  },
  // devcontainer/cli はまだ forwardPorts に対応していないため、
  // 必要に応じて forwardPorts の定義を appPort に転記する。
  // ※ コンテナ側で Listen する際は、 `127.0.0.1` **ではなく** `0.0.0.0` で Listen すること。
  // "appPort": [
  // ],
  // Linux で実行する場合には、 runArgs をコメントアウトし、コンテナからホストへの接続ができるようにしてください
  //"runArgs": [
  //  "--add-host=host.docker.internal:host-gateway"
  //],
  "mounts": [
    {
      "type": "bind",
      "source": "${localEnv:HOME}/.vim",
      "target": "/home/vscode/.vim"
    },
    {
      "type": "bind",
      "source": "${localEnv:HOME}/.gitconfig",
      "target": "/home/vscode/.gitconfig"
    },
    {
      "type": "bind",
      "source": "${localEnv:HOME}/.ssh",
      "target": "/home/vscode/.ssh"
    },
    // If use host's bashrc
    //{
    //  "type": "bind",
    //  "source": "${localEnv:HOME}/.bashrc",
    //  "target": "/home/vscode/.bashrc"
    //},
    // If use WSLG
    //{
    //  "type": "bind",
    //  "source": "/tmp/.X11-unix",
    //  "target": "/tmp/.X11-unix"
    //},
    //{
    //  "type": "bind",
    //  "source": "/mnt/wslg",
    //  "target": "/mnt/wslg"
    //},
  ],
  // denops など、別の実行環境が必要な場合や、
  // 後乗せで追加したいツールがある場合には以下の対象行をコメントアウトするか
  // https://containers.dev/features から必要な feature を探して追加してください。
  //"features": {
  //  "ghcr.io/devcontainers-community/features/deno:1": {}
  //  "ghcr.io/devcontainers/features/node:1": {}
  //  "ghcr.io/devcontainers/features/python:1": {}
  //  "ghcr.io/devcontainers/features/ruby:1": {}
  //  "ghcr.io/devcontainers-extra/features/fzf:1": {}
  //  "ghcr.io/jungaretti/features/ripgrep:1": {}
  //  "ghcr.io/devcontainers/features/docker-outside-of-docker:1": {},
  //  "ghcr.io/devcontainers/features/docker-in-docker:2": {}
  //}
}

開発環境の起動

devcontainer.vim start .

Claude Code のインストール・初期設定

インストール

Vim でターミナルを開き、以下コマンドを実行。

npm install -g @anthropic-ai/claude-code

初期設定

Vim でターミナルを開き、以下コマンドを実行。

cloude
  1. 表示のカラースタイルを聞かれるので答える(僕は Light text にした)
  2. ログイン処理 2.1 Enter 押下で表示される URL にアクセスし、ログインを行う 2.2 ログイン完了後に表示されるコードをターミナルにペーストし、 Enter
  3. Yes, proceed まで Enter を押し続ける
  4. プロンプト入力画面が表示される

あとはここにやって欲しいことを入力していくだけ。

実装

プロジェクトの作成

claude へ次の命令を入力する。

Maven の Java プロジェクトを作り、 Hello, World! を表示したい。 Java のバージョンは 21 とすること。

今回は、以下のような処理を行ってくれた。

  1. mkdir -p src/main/java/com/example

  2. pom.xml の作成

    <?xml version="1.0" encoding="UTF-8"?>
    <project xmlns="http://maven.apache.org/POM/4.0.0"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
    
        <groupId>com.example</groupId>
        <artifactId>hello-world</artifactId>
        <version>1.0-SNAPSHOT</version>
    
        <properties>
            <maven.compiler.source>21</maven.compiler.source>
            <maven.compiler.target>21</maven.compiler.target>
            <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        </properties>
    
        <build>
            <plugins>
                <plugin>
                    <groupId>org.apache.maven.plugins</groupId>
                    <artifactId>maven-jar-plugin</artifactId>
                    <version>3.3.0</version>
                    <configuration>
                        <archive>
                            <manifest>
                                <mainClass>com.example.App</mainClass>
                            </manifest>
                        </archive>
                    </configuration>
                </plugin>
            </plugins>
        </build>
    </project>
  3. App.java の作成

    package com.example;
    
    public class App {
        public static void main(String[] args) {
            System.out.println("Hello, World!");
        }
    }
  4. コンパイル(mvn compile)

  5. 実行(mvn exec:java -Dexec.mainClass="com.example.App")

  6. 完了報告(Maven プロジェクトが正常に作成され、「Hello, World!」が表示されました。Java 21 を使用する Maven プロジェクトの基本構造を作成しました。)

良い感じ。

devcontainer.vim 特有のことが無かった気がするけれど、 Claude Code が使えたのでヨシ!

以上。

参考資料

2025年3月26日水曜日

Windows で Gitea を試す

オンプレに Git サーバーを立てる機運だったので、 なるだけ簡単、かつ、Windows サーバーで動くやつとして Gitea を試す。

前提

  • OS: Windows 11 Pro 23H2 ビルド 22631.5039
  • Gitea: 1.23.5

ダウンロード

Gitea Official Website から Windows 版のバイナリをダウンロード。

名前を gitea.exe に変更し、 C:\gitea\gitea.exe に配置する。

初期設定

サーバーを起動し、アクセスする

以下コマンドで gitea サーバーを立ち上げ http://localhost:3000 へアクセスする。 初回アクセス時に初期設定を行うための画面が表示される。

.\gitea.exe web

初期設定入力

今回は以下の通り入力した。下記項目以外はデフォルト。

入力したら Giteaをインストール ボタンを押下。

必須設定

項目
データベースのタイプ SQLite3
パス C:\gitea\data\gitea.db
サイトタイトル Mikoto’s Gitea
リポジトリのルートパス C:\gitea\data\gitea-repositories
Git LFS ルートパス C:\g itea\data\lfs
実行ユーザー名 mikoto
サーバードメイン mnmain
SSHサーバーのポート 8022
Gitea HTTPポート 3000
GiteaのベースURL http://mnmain:3000/
ログの保存先パス C:\gitea\log

オプション設定 - サーバーと外部サービスの設定

項目
OpenIDを使ったサインインを有効にする チェックを外す
ページ閲覧にサインインが必要 チェックを入れる

オプション設定 - 管理者アカウントの設定

項目
管理者ユーザー名 mikoto
メールアドレス mikoto2000@gmail.com
パスワード ひみつ
パスワード確認 ひみつ

しばらくすると、管理者でログインした画面が表示されるが、ベース URL が違うため、改めて http://mnmain:3000 にアクセスしなおす。

HTTPS 設定

証明書の生成

なんと、自己証明書も作れちゃうらしい。

cd c:\gitea
.\gitea.exe cert --host mnmain --ca

設定ファイルの編集

C:\gitea\custom\conf\app.ini に設定ファイルがあるので、これを編集する。

今回編集するのは server セクション。

  • ROOT_URLhttphttps に変更
  • 以下 3 行を追加
    • PROTOCOL = https
    • CERT_FILE = C:\gitea\cert.pem
    • KEY_FILE = C:\gitea\key.pem

設定が完了したらもう一度 .\gitea.exe web を起動して https://mnmain:3000 にアクセス。

警告が出るが無視して進むと https で接続できる。

SSH サーバーの設定

Windows で実行する場合は、 Gitea 組み込みの SSH サーバーを使用するのが無難そうなので、その設定を行う。

組み込み SSH サーバーの有効化

C:\gitea\custom\conf\app.ini を編集する。

編集するのは SERVER セクション。 以下項目を追加する。

  • START_SSH_SERVER = true
    • 組み込み SSH サーバーを起動する

新規登録の禁止化

C:\gitea\custom\conf\app.ini を編集する。

DISABLE_REGISTRATIONtrue にする。

Windows サービス化

サービス化用に設定変更

C:\gitea\custom\conf\app.ini を編集する。

今回は RUN_USERmnmain$ (<コンピューター名>$) に修正。

サービスへの登録

コマンドプロンプト を管理者で開き、以下コマンドを実行。

sc.exe create gitea start= auto binPath= "\"c:\gitea\gitea.exe\" web --config \"c:\gitea\custom\conf\app.ini\""

後は Windows のサービスから 開始 を選択すれば OK.

公開鍵の登録

GitHub と同じで、 SSH 経由の操作は、公開鍵を用いて行われる。

公開鍵の登録方法は以下の通り。

  1. 右上の自分のアイコンをクリック -> 設定 -> SSH / GPG キー を選択
  2. SSHキーの管理キーを追加 ボタンを押下
  3. SSH の公開鍵を入力する

以上。

参考資料

変更履歴

日付 内容
2025/3/26 新規作成
2025/4/20 管理者ユーザーを明示的に追加する手順を追加
組み込み SSH サーバーによる接続について追加

2025年1月28日火曜日

Nuxt のアプリを nexe でシングルバイナリにする

Nuxt のアプリを nexe でシングルバイナリにしたいという方が居たので、 試しにやってみた。

Nuxt アプリケーションの作成

プロジェクトの初期化

vscode ➜ .../TIL/js/nuxtjs/firststep (master) $ npx nuxi@latest init firststep
Need to install the following packages:
nuxi@3.20.0
Ok to proceed? (y) y


 Which package manager would you like to use?
npm
 Installing dependencies...
npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported

> postinstall
> nuxt prepare

 Types generated in .nuxt

added 671 packages, and audited 673 packages in 1m

130 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
 Installation completed.
 Initialize git repository?
No
 Nuxt project has been created with the v3 template. Next steps:
  cd firststep
  Start development server with npm run dev
npm notice
npm notice New major version of npm available! 10.9.2 -> 11.0.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v11.0.0
npm notice To update run: npm install -g npm@11.0.0
npm notice

開発サーバー起動

cd firststep
npm run dev -- -o

動作確認

ブラウザで、 http://localhost:3000 へアクセスする。

ウェルカムページが見える。 OK.

Next プロジェクトのビルド

npm run build

.output/server/index.mjs にビルド結果のエントリーポイントが出力される。

シングルバイナリ化

esbuild を使ってバンドル・ミニファイ

npx esbuild .output/server/index.mjs --bundle --minify --platform=node --target=node14.17.0 --outdir=dist

Node のバージョンは、ビルド時間短縮のため、 nexe が提供している最新のプレビルドバイナリのバージョンで動くものを指定

これで、 ./dist/index.js にバンドル・ミニファイされたソースコードが出力される。

nexe を使ってシングルバイナリ化

npx nexe -i dist/index.js -o firststep --target windows-x64-14.15.3

windows-x64-14.15.3 が「nexe が提供している最新のプレビルドバイナリのバージョン」。

これで、 ./firststep.exe に実行バイナリが出力される。

動作確認

firststep.exe を Windows へ持っていき、ダブルクリック。

http://localhost:3000 へアクセス。OK.

もっと複雑なアプリケーションの場合は分からないが、 Get Started レベルのアプリならこれで OK なようだ。

最新の Node.js でビルドする

-b オプションを追加すると、指定した Node.js のソースをダウンロードし、 Node.js のビルドから開始する。

そのため、より新しい Node.js を使用したい場合には -b オプションを追加したうえで、 Node のバージョンに所望のバージョンを指定する。

npx esbuild .output/server/index.mjs --bundle --minify --platform=node --target=node22.13.1 --outdir=dist
npx nexe -i dist/index.js -o firststep -b --target windows-x64-22.13.1

Node.js のビルドが走るので、最悪数時間のビルド時間がかかる。

ただ、ビルド後の Node.js は ~/.nexe にキャッシュされるので、 2 回目以降のビルドは早くなる。

以上。

参考資料