fumi hata hatappo

Chrome Extension 開発の初期セットアップ手順メモ

このメモは、WXT + Svelte を使った Chrome Extension 開発の初期ベースラインを作るための手順を、日本語でまとめたものです。特定プロジェクト固有の実装内容ではなく、開発を始める前段の共通セットアップに絞っています。

このベースラインで整うもの

WXT + Svelte の Chrome Extension 雛形
Node バージョンの固定
pnpm ベースの依存管理

[ PostgreSQL Instance ] (サーバー / クラスター)
       │
       ├── [ Database A ] (独立したデータ空間)
       │      │
       │      ├── < Schema: public > (デフォルト)
       │      │      ├── Table: users
       │      │      └── Table: orders
       │      │
 │ └── &lt; Schema: inventory &gt; (論理的なグループ)

 $ pnpm dlx shadcn-svelte@latest init
┌   shadcn-svelte  v1.1.0 
│
◇  Which base color would you like to use?
│ Slate

【1】Daily Lesson Builder（デイリーレッスンビルダー）

英語の家庭教師として行動してください。
語彙・文法・練習問題を含む20分間の毎日の英語レッスンを作成してください。

【2】Conversation Partner（会話パートナー）

Please arrange an English conversation practice session.

どのように動作しているのか

TestCafe が登場する前は、実際のブラウザで動作するエンドツーエンドの Web テストツールは、これらのブラウザを外部から駆動してユーザーアクションをエミュレートすることに依存していました。ただし、このアプローチには重大な欠点がありました。

サードパーティツールへの依存。そのため、すべてのテスト環境で追加のドライバー、SDK、ライブラリをインストール、構成、保守する必要がありました。
ブラウザのサポートが制限されています。使用可能なブラウザとプラットフォームの範囲は、ドライバでサポートされているものに制限されていました。
ボイラープレートコード。これらのテストツールは、テスト実行全体を通じて同じブラウザインスタンスで機能したため、テストされた Web アプリの状態 (Cookie、ストレージなど) はテストから終了まで持続しました。テスト。その結果、エンドツーエンドテストには、テスト間の干渉を避けるために状態をクリアする大量の定型コードが含まれます。
自動化が低い。従来のツールは、テストされたページと直接対話できませんでした。ユーザーのテストコードがアプリコードに介入しないという事実は利点でしたが、テストツール自体はページ内で動作することで恩恵を受ける可能性があります。これにより、ツールで多くの日常的なタスクを自動化できるようになります。

	javascript:(function(){const instagram=location.pathname.replaceAll('/','');const name=document.querySelectorAll('header section > div > div > span')[0].innerText;const gender='female';const text='---\ninstagram: '+instagram+'\nname: '+name+'\ngender: '+gender+'\nheight: null\nwingspan: null\nregion: null\ngym: null\ntag:\n---\n';navigator.clipboard.writeText(text);alert(text);})();


	/*
	Example: https://www.instagram.com/hachi_08/

	---
	instagram: hachi_08
	name: 米津玄師 kenshi yonezu
	gender: female

	claude_dir=~/.claude
	gemini_dir=~/.gemini

	mkdir -p $gemini_dir/commands

	for c in $(ls $claude_dir/commands); do
	cat $claude_dir/commands/$c \
	\| awk '/^---$/ && !f++ {next} 1' \
	\| awk '/^---$/ {print "prompt = \"\"\""; next} 1' \
	\| sed 's/!\`\([^`]*\)\`/!{\1}/g' \

	volta list \| cat \| grep "^package " \| awk '{print $2}' \| while read package_with_version; do
	# Delete the @ version part (delete after the last @)
	package=$(echo "$package_with_version" \| sed 's/@[^@]*$//')
	echo " \e[34mupdate package:\e[0m $package_with_version"
	volta install "$package@latest"
	done





	<html>




	<!-- -->

fumi hata hatappo

Chrome Extension 開発の初期セットアップ手順メモ

このベースラインで整うもの

どのように動作しているのか

テストカフェは違う