15
23

プログラミングアシスタントAI。チャットで質問しながら、楽しくプログラミング。画面の右半分はプログラミングエディタ、左半分はチャットというインターフェース。

Last updated at Posted at 2024-07-26

fc0bb942-be42-4527-970f-90246bcfa0dd.png

ショートストーリー: プログラミングアシスタントと冒険者たち

第一章: プログラミングアシスタントの登場
ある日、静かな田舎町にある小さな学校で、教師のアキラ先生は生徒たちにプログラミングの基礎を教えようとしていました。生徒たちはコンピュータの前に座り、キーボードを叩く準備をしていましたが、多くの生徒は初めてのプログラミングに不安を感じていました。

そこでアキラ先生は、最新のAI技術を駆使した「プログラミングアシスタント」を導入することを決めました。このアシスタントは、Gradioインターフェースを備え、入力テキストやサンプルプロンプトを使ってPythonコードを生成し、実行することができる優れたツールです。

第二章: 冒険の始まり
生徒たちは興奮と好奇心に満ちた目で画面を見つめました。画面の右半分はプログラミングエディタになっており、コードを書いて実行ボタンを押すことで、プログラムが動作します。画面の左半分はチャット用で、何か困ったことがあればすぐに質問できるようになっています。

まず、アキラ先生は最初のサンプルプロンプトを紹介しました。「1から10までの数字を出力するPythonプログラムを書いてください。」生徒たちはエディタにコードを書き込み、実行ボタンを押しました。


for i in range(1, 11):
    print(i)

画面には1から10までの数字が順番に表示され、生徒たちは初めての成功に歓声を上げました。

第三章: チャットでの助け
次に、少し難しい問題が出されました。「指定された数が偶数か奇数かを判定するPythonコードを書いてください。」生徒のリサは、コードを書いている途中でつまずいてしまいました。そこで彼女は、チャットウィンドウに質問を書き込みました。

「与えられた数が偶数か奇数かをどうやって判定すればいいですか?」

すぐに、プログラミングアシスタントからの応答がありました。「数が2で割り切れる場合、それは偶数です。そうでなければ奇数です。以下のコードを試してみてください。」


number = int(input("数を入力してください: "))
if number % 2 == 0:
    print("偶数です")
else:
    print("奇数です")

リサはアシスタントの助けを借りてコードを書き終え、実行しました。プログラムは見事に動作し、リサは喜びの声を上げました。

第四章: 冒険の続き
生徒たちは次々とサンプルプロンプトに取り組み、チャットで質問しながらプログラミングの楽しさを学んでいきました。フィボナッチ数列を生成したり、リストの要素をソートしたり、文字列を逆にするプログラムを書いたりと、多くの課題に挑戦しました。

第五章: プログラミングの達人へ
時間が経つにつれて、生徒たちは自信を持ち、ますます難しい課題にも取り組むようになりました。彼らはプログラミングアシスタントと共に成長し、新しいスキルを身につけていきました。

こうして、静かな田舎町の小さな学校で始まったプログラミングの冒険は、生徒たちにとって忘れられない貴重な経験となりました。そして、彼らの心には未来のエンジニアとしての夢が大きく広がっていったのです。

終わりに
このストーリーは、プログラミングアシスタントを使って学びと成長を遂げる生徒たちの冒険を描いています。画面の右半分はプログラミングエディタ、左半分はチャット用というインターフェースを通じて、彼らはコードを生成し、実行し、質問しながら学びました。こうして、彼らは未来のエンジニアとしての第一歩を踏み出したのです。

スクリーンショット 2024-07-26 225004.png

スクリーンショット 2024-07-26 223201.png

このコードでは、10個の学習に適した簡単なサンプルプロンプトを用意しました。また、Gradioのインターフェースにユーザーが入力テキストまたはサンプルプロンプトを使用してコード生成と実行ができるようになっています。

画面の右半分はプログラミングEditerになってます。コードを書いて実行ボタンで実行することもできます。

画面左はチャット用になってます。

つまりコードを書いて何かあったらチャットで質問できるということです。
雑談風のチャットも可能です。

実行結果。

プロンプト
文字列を逆にするPythonコードを書いてください。

言語モデルの応答
もちろんです!以下に逆順のPythonコードを示します:

string = "あなたのメッセージ"
reverse_string = string[::-1]
print(reverse_string)

このコードでは、string[::-1]を使って、文字列を反転させます。これにより、"あなたのメッセージ"という文字列が、"smsgnupnv"という文字列になります。

コードの実行結果
ジーセッメのたなあ

プログラミングエディタとしての実行結果。

入力コード。

print(" is prime: ")

コードの実行結果。
is prime:

画面の右半分はプログラミングエディタ、左半分はチャット用というインターフェースのコード。


# 必要なライブラリのインストール
!pip install accelerate gradio transformers

from transformers import AutoModelForCausalLM, AutoTokenizer
import torch
import gradio as gr
import subprocess
import re

# GPUが利用可能かどうかをチェック
device = "cuda" if torch.cuda.is_available() else "cpu"

# 言語モデルとトークナイザーの読み込み
language_model_name = "Qwen/Qwen2-1.5B-Instruct"
language_model = AutoModelForCausalLM.from_pretrained(
    language_model_name,
    torch_dtype="auto",
    device_map="auto"
)
tokenizer = AutoTokenizer.from_pretrained(language_model_name)

def generate_code(prompt):
    try:
        # プロンプトに基づいてコードを生成
        messages = [
            {"role": "system", "content": "あなたは優れたプログラミングアシスタントです。"},
            {"role": "user", "content": prompt}
        ]
        text = tokenizer.apply_chat_template(
            messages,
            tokenize=False,
            add_generation_prompt=True
        )
        model_inputs = tokenizer([text], return_tensors="pt").to(device)

        generated_ids = language_model.generate(
            model_inputs.input_ids,
            max_new_tokens=512
        )
        generated_ids = [
            output_ids[len(input_ids):] for input_ids, output_ids in zip(model_inputs.input_ids, generated_ids)
        ]

        response = tokenizer.batch_decode(generated_ids, skip_special_tokens=True)[0]
        return response
    except Exception as e:
        return f"コード生成エラー: {str(e)}"

def extract_python_code(response):
    code_match = re.search(r'```python(.*?)```', response, re.DOTALL)
    if code_match:
        code = code_match.group(1).strip()
        return code
    else:
        return "Pythonコードが見つかりませんでした。"

def execute_code(code):
    try:
        # 生成されたコードをファイルに保存して実行
        with open("generated_code.py", "w") as file:
            file.write(code)

        result = subprocess.run(["python", "generated_code.py"], capture_output=True, text=True)
        return result.stdout if result.returncode == 0 else result.stderr
    except Exception as e:
        return f"コード実行エラー: {str(e)}"

def handle_interaction(input_text, sample_prompt):
    prompt = input_text or sample_prompt
    response = generate_code(prompt)
    code = extract_python_code(response)
    return response, code

def handle_code_execution(code):
    result = execute_code(code)
    return result

# サンプルプロンプト
sample_prompts = [
    "1から10までの数字を出力するPythonプログラムを書いてください。",
    "文字列を逆にするPythonコードを書いてください。",
    "リストの要素を一つずつ出力するPythonプログラムを作成してください。",
    "指定された数が偶数か奇数かを判定するPythonコードを書いてください。",
    "ユーザーから名前を入力させて挨拶をするPythonプログラムを書いてください。",
    "足し算をするPythonコードを書いてください。",
    "二つの数を掛け算するPythonプログラムを作成してください。",
    "リストの長さを取得するPythonコードを書いてください。",
    "与えられた文字列が何文字あるかを数えるPythonプログラムを書いてください。",
    "0から5までの数を繰り返し出力するPythonコードを書いてください。"
]

with gr.Blocks() as iface:
    gr.Markdown("# 日本語プログラミングアシスタント")
    with gr.Row():
        with gr.Column():
            input_text = gr.Textbox(label="入力テキスト")
            sample_prompt = gr.Dropdown(sample_prompts, label="サンプルプロンプト")
            generate_button = gr.Button("チャットの応答を生成")
            response_output = gr.Textbox(label="言語モデルの応答")

        with gr.Column():
            code_editor = gr.Textbox(label="プログラミングエディタ", lines=15)
            execute_button = gr.Button("コードを実行")
            execution_result_output = gr.Textbox(label="実行結果", lines=10)

    generate_button.click(handle_interaction, inputs=[input_text, sample_prompt], outputs=[response_output, code_editor])
    execute_button.click(handle_code_execution, inputs=[code_editor], outputs=execution_result_output)

if __name__ == "__main__":
    iface.launch(debug=True)

15
23
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
23