Llama 3.3：デモプロジェクトのステップバイステップチュートリアル-AI-php.cn

このブログでは、Llama 3.3の機能、特に推論、指示、コーディング、多言語サポートの強みを紹介する多言語コード説明アプリを構築します。

このアプリは、ユーザーが

を許可します

プログラミング言語でコードスニペットを入力します

コードの初心者向けの説明を生成します
アプリは次のように構築されます：
処理のために顔を抱きしめてから

ユーザーインターフェイス用の

retramit。

Llama 3.3アプリの構築にまっすぐジャンプしますが、最初にモデルの概要を把握したい場合は、Llama 3.3のこのガイドをご覧ください。始めましょう！
llama 3.3

始めるために、これをいくつかのステップに分割します。まず、ハグを使用してLlama 3.3にアクセスする方法をカバーし、アカウントを設定し、必要なアクセス許可を取得します。次に、プロジェクト環境を作成し、必要な依存関係をインストールします。

hugging顔のllama 3.3へのアクセス

Llama 3.3にアクセスする1つの方法は、機械学習モデルをホストするための最も人気のあるプラットフォームの1つであるHugging Faceを介してです。 Faceの推論APIを抱き締める介してLlama 3.3を使用するには、次のことが必要です。

hugging hugging faceアカウント。

顔がまだない場合は、顔を抱きしめてアカウントにサインアップしてください。

正しい権限を備えたAPIトークン。

新しい読み取りトークンを生成します。

llama-3.3-70b-instructモデルへのアクセス

llama-3.3-70b-instructページに移動します。
ライセンス条件に同意し、アクセスを要求する必要があります。

プロジェクト環境を準備

保護されたモデルへのアクセスを使用して、アプリの環境をセットアップしましょう。まず、このプロジェクトのフォルダーを作成します。端末を開き、プロジェクトフォルダーを作成する場所に移動し、実行します。

次に、app.pyというファイルを作成してコードを保持します：app.pynowをタッチして、環境を作成し、アクティブ化します：

今では、

を持っている必要があります

APIトークンを備えたハグのフェイスアカウントとllama 3.3モデルへのアクセス。

コーディングの準備ができているクリーンプロジェクトフォルダー

：
を含むすべての必要なライブラリがインストールされています

インターフェイス用の
retrienlit。
API呼び出しを行うための
リクエスト。

トランスフォーマーとハグFaceハブのハグと顔モデルと対話する

セットアップが完了したので、アプリを構築する準備ができました！次のセクションでは、多言語コード説明アプリのコーディングを段階的に開始します。

バックエンドを書きます

バックエンドは、コードスニペットを送信して説明を受信するために、抱きしめているフェイスAPIと通信します。

必要なライブラリをインポート

最初に、リクエストライブラリをインポートする必要があります。このライブラリを使用すると、HTTPリクエストをAPIに送信できます。 app.pyファイルの上部で、書き込み：

APIアクセスを設定します

mkdir multilingual-code-explanation
cd multilingual-code-explanation

ログイン後にコピー

hugging hugging faceでホストされているllama 3.3 APIと対話するには、必要です：

APIエンドポイント（モデルがホストされている場合）。

上記のコード：

python3 -m venv venv
source venv/bin/activate’

ログイン後にコピー

以前に生成したトークンに「hf_your_api_key_hore」を置き換えます

ヘッダー辞書にはAPIキーが含まれているため、顔を抱き締めることは、エンドポイントを使用することが許可されていることを知っています。

をクエリするために関数を書き込みます

顔を抱き締めるためにリクエストを送信します。

応答を処理し、生成された説明を抽出します

プロンプトは、Llama 3.3に、目的の言語でコードスニペットを説明するように指示します。
免責事項：私はさまざまなプロンプトを実験して、最高の出力を生成したものを見つけるので、間違いなく迅速なエンジニアリングの要素が関係していました！
requests.post（）関数は、顔を抱きしめる顔にデータを送信します。応答が成功した場合（status_code == 200）、生成されたテキストが抽出されます。エラーがある場合、説明的なメッセージが返されます

rietirlitrit frontend

pip install streamlit requests transformers huggingface-hub

ログイン後にコピー

を構築します

フロントエンドは、ユーザーがアプリと対話する場所です。 Streamlitは、Pythonコードのみを備えたインタラクティブなWebアプリを作成し、このプロセスをシンプルで直感的にするライブラリです。これは、アプリのフロントエンドを構築するために使用するものです。私はDemosとPOCを構築するためにRiremlitが本当に好きです！

ImpontRietLiT

app.pyファイルの上部で、add：

mkdir multilingual-code-explanation
cd multilingual-code-explanation

ログイン後にコピー

ページ構成を設定します

サイドバーの指示を作成

python3 -m venv venv
source venv/bin/activate’

ログイン後にコピー

ユーザーがアプリの使用方法を理解できるようにするために、サイドバーに手順を追加します。

St.SideBar.Title（）：SideBarのタイトルを作成します

St.SideBar.MarkDown（）：簡単な指示でテキストを追加します

pip install streamlit requests transformers huggingface-hub

ログイン後にコピー

さて、ユーザーにコードを貼り付けて好ましい言語を選択できるようにするには、入力フィールドが必要です。コードテキストは言語の名前よりも長くなる可能性が高いため、コードのテキスト領域と言語のテキスト入力を選択しています。

text_area（）：貼り付けコード用の大きなボックスを作成します

text_input（）：ユーザーが言語を入力できるようにします。

import requests

ログイン後にコピー

コードスニペットと言語が提供されているかどうかを確認します APIをクエリしながらスピナーを表示します。

HUGGINGFACE_API_KEY = "hf_your_api_key_here"  # Replace with your actual API key
API_URL = "https://api-inference.huggingface.co/models/meta-llama/Llama-3.3-70B-Instruct"
HEADERS = {"Authorization": f"Bearer {HUGGINGFACE_API_KEY}"}

ログイン後にコピー

入力が欠落している場合の生成された説明または警告を示します。

def query_llama3(input_text, language):
   # Create the prompt
   prompt = (
       f"Provide a simple explanation of this code in {language}:\n\n{input_text}\n"
       f"Only output the explanation and nothing else. Make sure that the output is written in {language} and only in {language}"
   )
   # Payload for the API
   payload = {
       "inputs": prompt,
       "parameters": {"max_new_tokens": 500, "temperature": 0.3},
   }
  
   # Make the API request
   response = requests.post(API_URL, headers=HEADERS, json=payload)
   if response.status_code == 200:
       result = response.json()
      
       # Extract the response text
       full_response = result[0]["generated_text"] if isinstance(result, list) else result.get("generated_text", "")
      
       # Clean up: Remove the prompt itself from the response
       clean_response = full_response.replace(prompt, "").strip()
       # Further clean any leading colons or formatting
       if ":" in clean_response:
           clean_response = clean_response.split(":", 1)[-1].strip()
      
       return clean_response or "No explanation available."
   else:
       return f"Error: {response.status_code} - {response.text}"

ログイン後にコピー

フッターを追加

まとめるには、フッターを追加しましょう：

アプリはブラウザで開きます。

llama 3.3のテスト

import streamlit as st

ログイン後にコピー

多言語コード説明アプリを構築したので、モデルがどれだけうまく機能するかをテストする時が来ました。このセクションでは、アプリを使用していくつかのコードスニペットを処理し、異なる言語で生成された説明を評価します。

テスト1：python

の要因関数

最初のテストでは、再帰を使用して数値の要因を計算するPythonスクリプトから始めましょう。使用するコードは次のとおりです

st.set_page_config(page_title="Multilingual Code Explanation Assistant", layout="wide")

ログイン後にコピー

このスクリプトは、特定の数の因子を計算する再帰関数係数（n）を定義します。 num = 5の場合、関数は5×4×3×2×1を計算し、120になります。結果は、print（）ステートメントを使用して画面に印刷されます。スペイン語で説明を生成するときの出力は次のとおりです。

Llama 3.3：デモプロジェクトのステップバイステップチュートリアル

スペイン語話者として、説明がコードが再帰を使用して数値の要因を計算することを正しく識別していることを確認できます。再帰がどのように段階的に機能するかを説明し、簡単な用語に分解します。

モデルは再帰プロセスを説明し、0に達するまでnの値を減少させて関数がどのように呼び出すかを示します。

説明は、要求されているように完全にスペイン語で、Llama 3.3の多言語機能を示しています。

単純なフレーズを使用すると、プログラミングに不慣れな読者にとっても、再帰の概念が簡単に従うことができます。

3などの他の入力や、プログラミングにおける効率的な問題解決概念としての再帰の重要性に対して再帰がどのように機能するかをまとめて言及しています。

この最初のテストでは、llama 3.3：

の力を強調しています

段階的な方法でコードを正確に説明します。

説明は要求された言語に適応します（この場合はスペイン語）。

指示に従って、結果は詳細で明確で、初心者に優しいです。

テスト2：JavaScriptの要因関数
次のJavaScriptコードスニペットを使用して、モデルがこれをどの程度処理しているかを確認するために意図的に曖昧な変数を選択しました。

注：応答が突然トリミングされているように見えることがわかりますが、出力が500トークンに制限されているためです！

これを翻訳した後、私は説明が関数x（a）が再帰的であることを正しく識別していると結論付けました。再帰の仕組みを分解し、基本ケース（a === 1）と再帰ケース（a * x（a -1））を説明します。説明は、関数が6の因子を計算する方法を明示的に示し、y（入力値）とz（結果）の役割に言及しています。また、結果を表示するためにconsole.logを使用する方法も注目しています。

要求されているように、説明は完全にフランス語です。「履歴書」（再帰）、「ファクターエル」（要因）、「プロダイ」（製品）などの技術用語が正しく使用されます。そして、それだけでなく、このコードが再帰的な方法で数値の要因を計算することを識別します。

この説明は、過度に技術的な専門用語を避け、再帰を簡素化し、プログラミングに新しい読者がアクセスできるようにします。

このテストは、llama 3.3：

であることを示しています

再帰を含むJavaScriptコードを正確に説明します

その説明を適応させて、さまざまな役割とコード動作を含む。
PythonとJavaScriptを使用してアプリをテストしたので、SQLクエリでテストして、その多言語と推論機能をさらに評価しましょう。
この最後のテストでは、多言語コード説明アプリがSQLクエリを処理し、ドイツ語で説明を生成する方法を評価します。これが使用されているSQLスニペットです：

このクエリは、ID列を選択し、各IDの合計値（sum（b.value））を計算します。 2つのテーブルのデータを読み取ります：table_x（asとしてエイリアス）とtable_y（bとしてエイリアス）。次に、結合条件を使用して、a.ref_id = b.refで行を接続します。 b.flag = 1で行をフィルタリングし、A.idによってデータをグループ化します。 Have Clauseは、B.Valueの合計が1000を超える場合のみをグループにフィルタリングします。最後に、Total_Amountで結果を下降順序で注文します。

説明ボタンを押した後、これが私たちが得るものです：

生成された説明は簡潔で正確で、十分に構造化されています。各キーSQL句（Select、From、Join、Where、Group、Have、and Order）を明確に説明します。また、この説明はSQLの実行順序と一致します。これは、読者がクエリロジックを段階的にフォローするのに役立ちます。

mkdir multilingual-code-explanation
cd multilingual-code-explanation

ログイン後にコピー

説明は、要求されているように完全にドイツ語です。

キーSQL用語（例： "filtert"、 "gruppiert"、 "sortiert"）は、コンテキストで正確に使用されます。この説明は、グループ化された結果をフィルタリングするために使用されていることを特定しています。これは初心者にとって一般的な混乱の原因です。また、明確にするためにテーブルと列の名前を変更するためのエイリアスの使用（AS）も説明しています。

説明は、過度に複雑な用語を回避し、各句の機能に焦点を当てています。これにより、初心者がクエリの仕組みを簡単に理解できるようになります。

このテストは、llama 3.3：

であることを示しています