AI プログラミング: 初めての Chrome 拡張機能を開発しました – GPTBLOX

AI コーディングが、ChatGPT セーバーや Web 管理などの機能を提供する Chrome 拡張機能の立ち上げにどのようにつながったのかをご覧ください。 ChatGPT プログラミング アプローチを探索します。

導入

みなさん、こんにちは。私は Yi Tao です。コーディングの経験はありますが、改善の余地がある開発者です。 ChatGPT の助けを借りて、私は自分だけでは数か月かかっても完成できなかった Chrome 拡張機能を 2 週間以内に開発してリリースすることができました。 また、近々 5 つのアップデートをリリースしました。 この拡張機能には、あまりマーケティングを行わなくても、現在 1,000 人近くのユーザーがいます。

拡張リンク: GPTBLOX – ChatGPT セーブデータ/バード クロード セイバー

ChatGPT コーディングを使用して Chrome 拡張機能はどのように開発されましたか?

これは、ChatGPT によって純粋に作成された拡張機能です。 コードを 1 行も記述する必要はありませんでした。 ChatGPTと会話するだけで、現在のWebページのHTMLコンテンツを取得するところから始まり、コードをTXTファイルに保存し、取得したHTMLコンテンツを保存前に加工・最適化して、HTMLファイル、PDFファイル、PNG画像として保存するまでを行いました。 最終的には 18 か国語バージョンに修正しました。 最初のバージョンの開発中、私と ChatGPT の間で多くの困難や誤解がありましたが、最終的には私の指導と ChatGPT のたゆまぬ協力によってそれらを克服することができました。

GPTBLOX に AI プログラミングを選択する理由

私は自分自身と友人たちのニーズを解決したいと考えていました。ChatGPT アカウントが頻繁に禁止されていたため、ChatGPT チャット記録をより良い方法で保存したいと考えていました。 この拡張機能を使用すると、誰もがワンクリックで ChatGPT の会話を自分のコンピュータに保存できます。 アカウントには価値がありませんが、ChatGPT を使用したトレーニング記録と創造的なインスピレーションは貴重です。

AIコーディングによるバージョン履歴

バージョン1.0.0

ChatGPT の会話履歴を HTML、TXT、PNG、PDF などの複数のファイル形式でローカルのコンピューターに保存する機能を実装します。 会話をオンラインで共有したり保存したりする必要がないため、データ漏洩の懸念が軽減されます。 また、WordPress プラグイン API を ChatGPT と統合し、Chrome 拡張機能が指定された記事を読み込んだり、リモート WordPress サイトから通知をプッシュしたりできるようにします。

バージョン1.1.0

ChatGPT 会話リンクのグループ化、ドラッグ、編集、削除などの管理機能を導入します。 これらの会話リンクを拡張機能のページでさまざまな方法で管理できるようにし、グループの表示方法の設定や、グループ化されたリンクのインポート/エクスポート機能をサポートします。

バージョン1.2.0

Bard、Claude、HuggingChat からの会話を HTML、TXT、PNG、PDF などの複数のファイル形式で保存し、コンピューター上にローカルに保存する機能を追加します。

バージョン1.3.0

WordPress ベースの Web サイトからの記事を、HTML、TXT、PDF などの複数のファイル形式でローカルに保存できるようにします。 これにより、次のバージョンで Web ページと会話リンクを集約して管理するための道が開かれます。 HTML、TXT、PDF ファイルに保存するドメイン、タイトル、コンテンツを指定するカスタマイズ オプションは、他の Web サイトでも利用できる必要があります。

バージョン1.4.0

現在の Web ページ リンクの保存を許可するか、現在のブラウザ ウィンドウから Web ページ管理インターフェイスへのすべてのページ リンクを集約します。 柔軟なドラッグと移動、追加、編集、削除、ロック、再度開くなどの機能をサポートします。 Web ページ管理インターフェイスの表示スタイルをトップダウンまたはウォーターフォール フローとして設定するオプションも利用できます。 さらに、Web ページ グループを管理するための 1、2、3、または 4 列の設定をサポートし、Web ページ グループとリンクのインポート/エクスポート機能を実装します。

バージョン1.5.0

クロードの公式 Web サイトからの会話を HTML、TXT、PNG、PDF などの複数のファイル形式でローカルに保存する機能が含まれています。 さらに、ChatGPT の会話保存機能を改善して、保存された会話履歴にカスタム指示からの事前定義された指示を含めるようにしました。

GPTBLOX の今後の計画

• チャット記録と Web ページのコンテンツを Notion、Evernote、WordPress Web サイトに保存する機能を追加します。
• 特にユーザー エクスペリエンスの観点から、Web ページの収集と管理に関連する機能をさらに最適化するには、Onetab 拡張機能からさらに学ぶ必要があります。
• OpenAI のインターフェイスを介してコンテンツを要約して完成させるなど、保存された Web ページ コンテンツをさらに処理して最適化することを検討してください。

ChatGPT プログラミング戦略

ステップバイステップの出力

ChatGPT に手順に従ってファイルまたはモジュールにコードを記述させます。 たとえば、最初に必要なファイルを決定し、次に ChatGPT にファイルごとにコードを個別に出力させます。 これにより、文脈上のロジックの逸脱のリスクを軽減できます。

小さなエントリーポイント

プロジェクトのエントリ ポイントは、可能な限り小さく、ChatGPT が完全で有用な初期バージョンを出力できる程度に小さくする必要があります。 初期バージョンに問題がある場合、コードと機能範囲が制限されているため、ChatGPT または人間による修正が容易になります。

最小限のモジュール

変更または追加する必要があるコードを分離し、毎回可能な限り最小のコード チャンクのみを ChatGPT に提供します。 これにより、論理逸脱の可能性が最小限に抑えられます。

コードの確認

新しい機能やロジックを追加する前に、新しい会話ウィンドウを開始し、確認のためにプロジェクト要件と関連コードを ChatGPT に再入力します。 確認したら、新機能の開発を進めます。

コードを指定してください

ChatGPT がコンテキスト メモリの制限により不一致のあるコードを生成する場合は、関連するコードを再送信し、ChatGPT に最新のコードに基づいて変更を加えさせます。

深い指導

複数の会話で問題を解決できない場合は、特定の機能要件とコードを詳しく調べます。 あなた自身の経験に基づいて、ChatGPT に必要なガイダンスを提供します。

セルフチェックの問題

複数の会話を行っても問題が解決しない場合は、コード内でデバッグ用のコンソール ログを追加するように ChatGPT をガイドします。 プログラムの実行結果やエラー メッセージを直接 ChatGPT に提供して、チェックと修正を行います。

適時のロールバック

複数の会話を行っても問題が解決しない場合は、以前の安定したバージョンの会話にロールバックし、ChatGPT が再開発できるようにすることを検討してください。 再開発中は、以前のデバッグ セッション中に発生した問題や自分の経験に基づいて、ChatGPT に必要なガイダンスを提供します。

AI プログラミングに興味がある場合、または「chatgpt 内部サーバー エラー」について心配している場合は、お気軽に GPTBLOX を試して、経験を共有してください。 何か問題が発生した場合、または将来の開発についての提案がある場合は、私たちに耳を傾けてください。 ありがとう！