Gpt-3.5 on ashitaka blog

GPT-4のスクリプト実行したら記事全部消えた

Mon, 17 Apr 2023 15:25:19 +0900

昨日に引き続きなんかGPT-4で遊ぼうとしたのですが、Wordpressにおいてソースコードが綺麗に表示されていないのがとても気になっていました。

WordPressでPrism.jsを使ってシンタックスハイライトを行う方法

これでやっていたのですが、クラスをいちいち指定するのがめんどくさいのです。

そこで、いい感じのプラグインないか聞いてみました。これは普通にGoogleに聞きました。ノウハウではなくこういった拾いものを探す時はやっぱりネットサーフィン。以下のサイトで

https://re-inx.com/syntax-highlighter

こやつに出会いました。

https://ja.wordpress.org/plugins/code-block-pro/

シンプルできれい

楽。

こやつに決めた。

が、全ての記事1つ1つこいつを当てていくのは大変。そこでChatGPT。

それは誰でも思いつくねんな〜

ほう。

おー、なんかいけそ〜〜〜

ここでGPT-4ちゃん召喚。

このスクリプトを実行する前に、以下の手順に従ってください。

1. このスクリプトをテキストエディタに貼り付け、`convert_code_blocks.sh`のような名前で保存します。
2. ターミナルを開き、スクリプトの保存場所に移動します。
3. `chmod +x convert_code_blocks.sh`を実行して、スクリプトに実行権限を付与します。
4. スクリプトを実行する前に、WordPressサイトのバックアップを作成します。
5. `./convert_code_blocks.sh`を実行して、スクリプトを実行します。

よーわからんけどいけるっしょ! と思って実行したら全部記事消えました。そこからはもうGPT-4の言うことは何も信じれず…全部Googleで調べてバックアップを復元しました。。。

まとめ

生成したコードを実行するときは気をつけましょう!!!

## USER
ちなみにさっきのスクリプトで記事全部消えたからおこです

## ASSISTANT
大変申し訳ございません。指示されたスクリプトが問題を引き起こしたことをお詫び申し上げます。この状況を解決するために、以下のステップを試してみてください。

1. **バックアップから復元**: WordPressのバックアップがある場合は、バックアップから記事を復元することができます。これには、データベースのバックアップと、`wp-content`ディレクトリのバックアップが必要です。バックアップがある場合は、データベースとファイルを復元して、記事を回復することができます。

2. **リビジョンをチェック**: WordPressは、記事の各バージョンをリビジョンとして保存しています。記事が完全に削除されていない場合、以前のリビジョンを使用して記事を復元できることがあります。これには、WordPressの管理画面から、編集画面にアクセスし、「リビジョン」ボックスをチェックして、以前のバージョンを選択する必要があります。

3. **キャッシュやバックアッププラグインを確認**: キャッシュプラグインやバックアッププラグインを使用している場合は、これらのプラグインが保存しているデータを確認して、記事を復元できるかどうかを確認してください。

今後のトラブルを避けるために、以下の注意点をお勧めします。

- 実行する前に、スクリプトやコマンドの内容をよく理解しておくことが重要です。
- 開発環境やステージング環境でスクリプトやコマンドをテストしてから本番環境で実行することをお勧めします。
- 定期的にバックアップを取得し、適切な場所に保管しておくことが重要です。これにより、データが失われた場合でも復元できるようになります。

再度、問題が発生したことに対してお詫び申し上げます。今後のトラブルを避けるために、これらのアドバイスに従っていただければと思います。

だそうです😠

ChatGPTでテトリス作ってみた

Sun, 16 Apr 2023 02:42:37 +0900

お久しぶりです。前回投稿が2022-08-15なので、サボりすぎですね…

情報のインプットは好奇心から頑張れるというか知識を得るのが楽しいのでやるんですが、情報のアウトプットって既に知っている知識を使うことなので気が進まないものですよね…定着させるには大事なんですが、特に定着させるモチベーションもなく…

ただ、やっとそのアウトプットを勝手にやってくれる時代がやってきました。そうChatGPTです。こやつにコンテンツを作ってもらう取り組みがどれくらい続くかチャレンジをやってみようと思い、ChatGTP Plus課金しちゃいました!

こやつを使って今日はテトリス作っちゃいます!

完成形

テトリスって、どんなブロックがあってどういうふうに回転してどこで壁にぶつかってとか、まじめに実装すると考えることいっぱいあるのですが、そんなことを考えずに一瞬で作ってくれました。天才です。

が、それを作ってから手直ししていく過程が大変だったので、会話の過程をご覧いただけたらと思います。

会話highlight

一瞬でコード書けるスーパーエンジニア

## USER
# 命令書:
あなたはフロントエンドエンジニアです。
以下の制約条件と入力文をもとにゲームのソースコードを出力してください。

# 制約条件:
* HTML、CSS、Javascriptのみで動く

# 入力文：
テトリス

# 出力文：

深津式プロンプト(https://chatgpt-lab.com/n/ne1643b7f10e6)を使ってみようとしたのですが、大して制約条件を書くことなく出力しちゃいました。

index.html を作って動かしたらこれ

もうエンジニアいらんやん…

すぐ解決策に走る初心者エンジニア

なんか右の画面いっぱいまでブロックが動かせなくて質問するのですが…

これやっても直りませんでした。どこが問題かを分析せず解決策に走る初心者エンジニアみたいです。でも、根気よく質問すると…

ちゃんとうごきました!

「コード見せて」といってくるベテランエンジニア

「次のブロックを表示」という機能追加もちょっとバグっていて、いろいろ質問して直そうとしたのですが

なかなか直らないとみたやコード全体を要求してきました。今度はこっちがなかなかバグを治せない初心者エンジニアみたいです…

かわいい

最後にお礼にコードレビューしてみると…?

GPT-4の使用上限にひっかかって、GPT-3.5になりました。。。コンテキストをちゃんと解釈してくれてない回答感ありますよね…KY…

ChatGPTと喋った内容

Takaaki

# 命令書:
あなたはフロントエンドエンジニアです。
以下の制約条件と入力文をもとにゲームのソースコードを出力してください。

# 制約条件:
* HTML、CSS、Javascriptのみで動く

# 入力文：
テトリス

# 出力文：

ChatGPT

以下は、HTML、CSS、Javascriptを使用してテトリスゲームを実装するための簡単なソースコードです。このコードをhtmlファイルにコピーして実行することができます。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>テトリス</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }

        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="game" width="320" height="640"></canvas>
    <script>
        const canvas = document.getElementById("game");
        const context = canvas.getContext("2d");
        const scale = 20;

        context.scale(scale, scale);

        const arenaSweep = () => {
            outer: for (let y = arena.length - 1; y > 0; y--) {
                for (let x = 0; x < arena[y].length; x++) {
                    if (!arena[y][x]) {
                        continue outer;
                    }
                }
                const row = arena.splice(y, 1)[0].fill(0);
                arena.unshift(row);
                ++y;
            }
        };

        const collide = (arena, player) => {
            const [m, o] = [player.matrix, player.pos];
            for (let y = 0; y < m.length; ++y) {
                for (let x = 0; x < m[y].length; ++x) {
                    if (m[y][x] && (arena[y + o.y] && arena[y + o.y][x + o.x]) !== 0) {
                        return true;
                    }
                }
            }
            return false;
        };

        const createMatrix = (w, h) => {
            const matrix = [];
            while (h--) {
                matrix.push(new Array(w).fill(0));
            }
            return matrix;
        };

        const draw = () => {
            context.fillStyle = "#000";
            context.fillRect(0, 0, canvas.width, canvas.height);

            drawMatrix(arena, { x: 0, y: 0 });
            drawMatrix(player.matrix, player.pos);
        };

        const drawMatrix = (matrix, offset) => {
            matrix.forEach((row, y) => {
                row.forEach((value, x) => {
                    if (value) {
                        context.fillStyle = "red";
                        context.fillRect(x + offset.x, y + offset.y, 1, 1);
                    }
                });
            });
        };

        const merge = (arena, player) => {
            player.matrix.forEach((row, y) => {
                row.forEach((value, x) => {
                    if (value) {
                        arena[y + player.pos.y][x + player.pos.x] = value;
                    }
                });
            });
        };

        const playerDrop = () => {
            player.pos.y++;
            if (collide(arena, player)) {
                player.pos.y--;
                merge(arena, player);
                playerReset();
                arenaSweep();
            }
            dropCounter = 0;
        };

        const playerMove = (offset) => {
            player.pos.x += offset;
            if (collide(

#### Takaaki
続けてください

#### ChatGPT
arena, player)) {
                player.pos.x -= offset;
            }
        };

        const playerReset = () => {
            const pieces = "TJLOSZI";
            player.matrix = createPiece(pieces[(pieces.length * Math.random()) | 0]);
            player.pos.y = 0;
            player.pos.x = ((arena[0].length / 2) | 0) - ((player.matrix[0].length / 2) | 0);

            if (collide(arena, player)) {
                arena.forEach(row => row.fill(0));
                alert("ゲームオーバー");
            }
        };

        const playerRotate = (dir) => {
            const pos = player.pos.x;
            let offset = 1;
            rotate(player.matrix, dir);

            while (collide(arena, player)) {
                player.pos.x += offset;
                offset = -(offset + (offset > 0 ? 1 : -1));

                if (offset > player.matrix[0].length) {
                    rotate(player.matrix, -dir);
                    player.pos.x = pos;
                    return;
                }
            }
        };

        const rotate = (matrix, dir) => {
            for (let y = 0; y < matrix.length; ++y) {
                for (let x = 0; x < y; ++x) {
                    [matrix[x][y], matrix[y][x]] = [matrix[y][x], matrix[x][y]];
                }
            }

            if (dir > 0) {
                matrix.forEach(row => row.reverse());
            } else {
                matrix.reverse();
            }
        };

        const createPiece = (type) => {
            if (type === "T") {
                return [
                    [1, 1, 1],
                    [0, 1, 0],
                    [0, 0, 0]
                ];
            } else if (type === "J") {
                return [
                    [0, 1, 0],
                    [0, 1, 0],
                    [1, 1, 0]
                ];
            } else if (type === "L") {
                return [
                    [0, 1, 0],
                    [0, 1, 0],
                    [0, 1, 1]
                ];
            } else if (type === "O") {
                return [
                    [1, 1],
                    [1, 1]
                ];
            } else if (type === "S") {
                return [
                    [0, 1, 1],
                    [1, 1, 0],
                    [0, 0, 0]
                ];
            } else if (type === "Z") {
                return [
                    [1, 1, 0],
                    [0, 1, 1],
                    [0, 0, 0]
                ];
            } else if (type === "I") {
                return [
                    [0, 1, 0, 0],
                    [0, 1, 0, 0],
                    [0, 1, 0, 0],
                    [0, 1, 0, 0]
                ];
            }
        };

        let dropCounter = 0;
        let dropInterval = 1000;
        let lastTime = 0;

        const update = (time = 0) => {
            const deltaTime = time - lastTime;
            lastTime = time;

            dropCounter += deltaTime;
            if (dropCounter > dropInterval) {
                playerDrop();
            }

            draw();
            requestAnimationFrame(update);
        };

#### Takaaki
続けてください

#### ChatGPT
const arena = createMatrix(10, 20);

        const player = {
            pos: { x: 0, y: 0 },
            matrix: null
        };

        document.addEventListener("keydown", event => {
            if (event.keyCode === 37) {
                playerMove(-1);
            } else if (event.keyCode === 39) {
                playerMove(1);
            } else if (event.keyCode === 40) {
                playerDrop();
            } else if (event.keyCode === 81) {
                playerRotate(-1);
            } else if (event.keyCode === 87 || event.keyCode === 38) {
                playerRotate(1);
            }
        });

        playerReset();
        update();
    </script>
</body>
</html>

このコードは、テトリスゲームの基本的な機能を実装しています。プレイヤーは矢印キーを使ってピースを操作し、Qキーで反時計回りに回転、Wキーまたは上矢印キーで時計回りに回転させることができます。行が埋まると消え、ゲームが続行します。ピースがスタックして画面上部に達すると、ゲームオーバーになります。このコードを自由にカスタマイズして、さらに機能を追加したり、見た目を改善したりすることができます。