こばやしたかはるblog

2025年4月16日水曜日

生成AIでインベーダーゲーム作成

生成AIでシューティングものを作成するのはすんなりいかず、何度か修正プロンプトを指示してそれらしい感じにしました。

修正を続けると、以前の修正が含まれてなく、デグレートされる状態になったりするので、修正プロンプトは冗長になるが、細かい指示は重複して何度も行なった方が良さそうです。

以下のリンクでやり取りが見れます。

生成AIでインベーダー作成したプロンプト

このゲームもGitHub Pageで公開しています。

GitHub Pagesで公開したインベーダーゲーム

2025年4月9日水曜日

生成AIでTetrisのゲーム作成

ChatGPTを壁打ちにTetrisを作成してみた。前回のブロック崩しと同様に言語は単一のhtmlファイル内のVanillaなJavaScriptです。

これも割と短時間でできる。有名なゲームは生成AIで割と簡単にできそうな気がする。ちなみに、シューティングゲームの作成とかを試みたのだが、それはうまくいかずだった。敵機とか自機の辺り判定、被弾後の動作とか細かく指示しないとダメだし。修正案を指示すると、以前に指示した内容が反映されなくデグレートが発生したりする。なので一旦諦めた。

生成したTetrisはGitHub Pagesに公開しているので、興味あれば遊んでみてください。

（PCのキーボードの矢印キーの左、右、下で移動、Q or Wで回転、PでPauseします。）

Tetrisのゲームのページ

2025年4月6日日曜日

生成AIでブロック崩しゲーム作成

ChatGPTを壁打ちにブロック崩しゲームを作成してみた。言語は単一のhtmlファイル内のVanillaなJavaScriptです。

割と短時間でできる。詳細な情報を伝えてあげればもっと精度の良いものが出来そう。

生成したブロック崩しはGitHub Pagesに公開しているので、興味あれば遊んでみてください。

（PCのキーボードの矢印キーの左、右で操作します。ちなみに、私はStage4以降進めない。。）

ブロック崩しのページ

2025年3月30日日曜日

MacのChromeでファイルのダウンロードができない時の対処方法

MacでChromeを使用していて、ファイルのダウンロードができない状態になった。キャッシュをクリアしたり、プラグインを削除したりしたけど、解消せず。

DeepSeekに聞いたら、設定ファイルを削除するコマンドを実行。とのことだったので、これを行うと解消した。原因は不明のままだけど。

rm -rf ~/Library/Application\ Support/Google/Chrome/Default

2025年3月2日日曜日

午後の眠気を和らげる方法

結論、お昼ご飯は玄米が良かった。

お昼ご飯後、午後眠くなる。昔からずっと。

で、今更ながらだけど、実体験でこれは効果があっとという内容。

前提として、睡眠は特段不足していない状態でのこと。

というのも、睡眠不足はまた別の話だから。

本内容に移る。

睡眠は不足していないけど、お昼ご飯後に、睡魔が襲ってくるのは大体の人はあるのではないかと思う。

私の場合、お昼ご飯を正午に食べた場合、15:00ぐらいから17:00が眠いことがある。

特に会議とかで人の話を長く聞かないといけない時とか辛い。

そして、よく聞く話だと、食べ過ぎはよくない。辛いもの(カプサイシン)は体温が上がって下がるから、眠気を誘発するとかきくので、それらは避けていた。けど、余り効果は感じなかった。

なので、ずっと悩みが続いていたけど、解決できない問題だな。これは仕方ない。と諦めていた。

ところが、このお昼ご飯云々と関係なく、健康のために白米から玄米の食生活に変えてみて3年ぐらい経過して気づいたら、お昼ご飯の後にあまり眠たくならんようになったなと。

本当に玄米に効果があったかと思い、平日、休日ともに、お昼ご飯を玄米の代わりに、白米だったり、パスタだったりを食べてみて試してみた。

その結果、やっぱり、眠気が強くなる。それと併せて倦怠感が襲ってくる。

白米、小麦とか白い洗練された炭水化物は、血糖値スパイクと言って、血糖値の上げ下げが急になるみたいだけど、玄米に慣れているせいか、睡魔、倦怠感が強く感じられた。

おそらく、白米、小麦とか白い洗練された炭水化物をずっと食べていた時は、そんなもんだと思っていて気づかなかったけど。

ということで、白米、小麦とか白い洗練された炭水化物より、玄米を食べるようにした方が、いいと思いますよ。と。

2025年2月11日火曜日

GitHub PagesにReactの静的なアプリをデプロイ

いつも忘れるので、GitHub PagesにReactの静的なアプリをデプロイする方法を備忘録として残しておく。

package.jsonが次の内容の場合に、npm run rebuildを実行して、docs以下にビルドしたファイルをコピーして、それをGitHub Pagesで公開させている。

{
  "name": "developertool-react",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build && cp -r dist docs",
    "rebuild": "tsc && vite build && rm -R docs && cp -r dist docs",
    "git": "git add . && git commit -m 'update' && git push origin main",
    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview",
    "deploy": "npm run build && gh-pages -d dist"
  },
  "dependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "styled-components": "^6.1.11"
  },
  "devDependencies": {
    "@types/node": "^20.14.10",
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.0",
    "@typescript-eslint/eslint-plugin": "^7.13.1",
    "@typescript-eslint/parser": "^7.13.1",
    "@vitejs/plugin-react-swc": "^3.5.0",
    "eslint": "^8.57.0",
    "eslint-plugin-react-hooks": "^4.6.2",
    "eslint-plugin-react-refresh": "^0.4.7",
    "typescript": "^5.2.2",
    "vite": "^5.3.1"
  }
}

実行するnpmとgitコマンドは次のとおり。

$ npm run rebuild

> developertool-react@0.0.0 rebuild
> tsc && vite build && rm -R docs && cp -r dist docs

vite v5.3.3 building for production...
✓ 44 modules transformed.
dist/index.html                  0.39 kB │ gzip:  0.28 kB
dist/assets/index-C3sMy72Z.js  169.27 kB │ gzip: 55.94 kB
✓ built in 954ms

$ git add .
$ git commit -m "Add that text copies to clipboard."
[main 423acf6] Add that text copies to clipboard.
 3 files changed, 24 insertions(+), 13 deletions(-)
 rename docs/assets/{index-3gzwRWFv.js => index-C3sMy72Z.js} (75%)
$ git push -u origin main
Enumerating objects: 16, done.
Counting objects: 100% (16/16), done.
Delta compression using up to 4 threads
Compressing objects: 100% (7/7), done.
Writing objects: 100% (9/9), 55.43 KiB | 5.54 MiB/s, done.
Total 9 (delta 4), reused 0 (delta 0), pack-reused 0
remote: Resolving deltas: 100% (4/4), completed with 4 local objects.
To https://github.com/takaharu-kobayashi/developertool-react.git
   eef57a2..423acf6  main -> main
branch 'main' set up to track 'origin/main'.

実際に公開しているGitHun PagesのURLは次のとおり。

https://takaharu-kobayashi.github.io/developertool-react/