Deepseek Artifacts：公開フロントエンドコードのオープンデータセットを構築することを目標に、最高のオープンソースモデルを使用してReactコードを生成する。

はじめに

ディープシーク Artifactsは、世界最高のオープンソースモデルを使用してReactアプリケーションを作成するためのウェブサイトです。ユーザーが夢のReactアプリケーションを記述すると、サイトがDeepseek V3（オリジナルモデル：Meta-Llama）モデルを使用して適切なコードを生成します。生成されたレスポンスは公開データセットに保存され、他のユーザーが参照して使用できる。このサイトはまた、ユーザーが生成されたコードをテストしたり微調整したりできるオープンなサンドボックス環境も提供している。

あなたが生成したコードは、将来オープンデータセットで共有されることになるので、機密情報を入力しないように注意してください。

機能一覧

• Reactアプリの作成: ユーザーが欲しいReactアプリを記述すると、サイトが適切なコードを生成します。
• オープン・サンドボックス：生成されたコードをテストし、チューニングするための環境を提供する。
• コードの保存：生成されたコードは、他のユーザーが参照できるように公開データセットに保存されます。
• 複数のテーマをサポート：例えば、ストライプテーマのヒーロー部分、ダークモード＋弁当グリッドなど。

ヘルプの使用

ディープシーク・アーティファクトの使い方

1. ディープシーク・アーティファクトのウェブサイトをご覧ください。
2. 夢のReactアプリの説明をDescriptionボックスに入力します。例えば、「ストライプのテーマのヒーロー部分」など。
3. 生成」ボタンをクリックすると、Deepseek V3 モデルを使用して適切なコードが生成されます。
4. 生成されたコードはオープンなサンドボックス環境に表示され、そこでテストや微調整を行うことができる。
5. 生成されたコードに満足すれば、他のユーザーのために公開データセットに保存することができる。

詳細な機能操作の流れ

1. Reactアプリの作成::
   • Description（説明）ボックスに、必要なReactアプリケーションの詳細な説明を入力します。
   • Generate "ボタンをクリックし、モデルがコードを生成するのを待つ。
   • 生成されたコードはサンドボックス環境に表示され、テストや微調整ができる。
2. オープンサンド::
   • 生成されたコードは自動的にサンドボックス環境にロードされる。
   • サンドボックスでコードをテストし、微調整することができる。
   • 問題が発生した場合は、サンドボックスでエラーメッセージを確認し、それに従って修正してください。
3. コード・セービング::
   • 生成されたコードは自動的に公開データセットに保存される。
   • データセット内の他のユーザーが作成したコードを参照し、学習することができます。

DeepSeek Artifactsプロジェクトの詳細

公開フロントエンド・コード・データセットを構築する新しい無料AIエンコーダー（ボルト、V0クラス）

ディープシークV3は最近AIコミュニティで波紋を呼んでおり、LMSチャートのトップに躍り出ることに成功した。これは、オープン・ウェイト・モデルとしては驚くべき成果である。さらに特筆すべきは、非常に安価に使えることだ。本日は、これをベースにしたツール、DeepSeek Artifactsをご紹介します。

DeepSeek ArtifactsはHugging Faceが提供する完全無料のツールで、直接使用するためにログインや登録は必要ない。ReactとTailwind用のコードを生成することができ、かなりうまく動作する。

このツールの重要な目標は、将来的に誰にでも公開される新しいパブリック・フロントエンド・コード・データセットの構築を支援することである。ユーザーが作成したコンテンツもこのデータセットに含まれ、オープンソースのモデルのため、誰でも自分のモデルをトレーニングするために使用することができる。

データセットアドレス：https://huggingface.co/datasets/cfahlgren1/react-code-instructions

このツールのインターフェイスは、あまり複雑な機能はなく、とてもシンプルなデザインになっている。インターフェイス上でデータセットのリンクを見ることができ、生成されたコンテンツはこのデータセットで終わる。

試しに、先に書いた記事「コードを一行も書かずに、AIでAIサービスサイトを0から1まで作ってみた」を使い、その冒頭のプロンプトワード3連発を彼に投げかけて、Saasサイトのプロトタイプを作ってもらった。それから、このプロンプトワードはかなり長いので、上記の記事から入手できる。

インターフェイスは、プロンプトワードを入力した後に生成される：

そして、"サンドボックスを開く "をクリックすれば、ツールはサンドボックス環境でプロジェクトを生成する。

これと 愛すべき もしかしたら ボルト.newは非常によく似ている。 クロード アーティファクトだが、違いは完全に無料であることと、ほぼ毎回使えることだ。

サンドボックス内で直接コードを編集することができ、例えばVercelのツールを使って携帯電話で直接アプリやSaaSツールの作成を始めることができる。プロジェクトをダウンロードしたい場合は、ローカルに保存するか、GitHubリポジトリを作成することができ、非常に便利です。注意しなければならないのは、生成されたコードに直接コマンドを与えて内容を変更することはできないということだ。しかし、コードを修正したい場合は、サンドボックス内で手動で編集することができる。あるいは、組み込みのエディターで直接コードを編集することもでき、とても便利です。AI自身を使ってコンテンツを修正したい場合は、コードをコピーし、希望する修正のリクエストを書き、そのコードをリクエストに貼り付けてリクエストを送信します。AIは文脈に基づいて新しいコンテンツを生成する。このツールは、プロジェクトをローカルで実行したい人にも大きなサポートを提供する。コード・サンドボックスを開き、ダウンロード・ボタンをクリックするだけで、package.jsonファイルを含む完全なプロジェクトZIPを入手できる。

プロジェクトを解凍し、npm runコマンドを実行してプロジェクトを開始します。この機能は、コンポーネントやシンプルなアプリケーションシナリオを生成する必要がある場合に特に適しており、生成されたコンテンツは単独で使用できるだけでなく、他のプロジェクトに統合することもできる。このツールのもう一つの利点は、生成のスピードだ。例えば、SEO最適化ツールを含むページを作成するために使用する場合、ツールは最初の段落の後にコンテンツを埋め込み、FAQを生成し、ポップアップ広告を追加し、完全に準拠します。プロジェクトファイルは、Netlifyのようなプラットフォームに簡単にデプロイすることができます。キーワードリサーチツールを作成する際、素晴らしいカスタマイズ能力を発揮します。プロンプトワードを入力した後、ツールは関連するコードを生成し、APIキーの入力とドメインセグメンテーションをサポートし、キーワードを自動的に生成してグループ化することができます。

全体的に、このツールは完全に無料で非常にシンプルに使えるため、多くの可能性を秘めている。あなたが生成したコンテンツは、彼らが取り組んでいるデータセットに含まれるかもしれないが、誰もがこれを気にするわけでもない。