soumame / kids-code-tutorial

Kids Code Tutorial(仮称)

Kids Code Tutorial は、小中学生を対象とした、Web 上で使用できる、LLM によって提供されるセルフホスト型プログラミング学習プラットフォームです。教育コンテンツを制作する人と、そのコンテンツから学ぶ人たちのために設計されています。

このプロジェクトは 2024 年度の未踏ジュニアに採択され、最終報告会（11 月）までにすべての機能が使用できるようになる予定です。

設計

現在このアプリの大部分はまだ開発中です。開発に参加していただける方はぜひDiscord コミュニティでお会いしましょう。

• コンテンツ提供者
  • 教育を提供したことのある方は、このアプリを使用することで、より多くの人に質の高いプログラミングの授業を提供することができます。人間がアプリ内に提供したコンテンツをもとに、AI がユーザーへチュートリアルを提供します。
  • 学校やプログラミング教室、フリースクールなどの教育施設内での小規模な利用を想定しています。
    • そのため、１つの node.js サーバー上にほとんどの機能を構築し、簡単にアプリを子供達に提供できるようにすることを目指しています。
• 学習者
  • ブラウザからアプリにアクセスするだけで、すぐにチュートリアルを開始することができます。AI がリアルタイムな対話を提供することにより、一方的な動画やスライドのチュートリアルと比べて、わからないところをすぐに質問したり、フィードバックを得ることができるようになるため、効率よく学習することができます。

アプリを使ってみる

開発サーバーの起動

サーバーはフロントエンドもバックエンドも単一の node.js でホストされています。また、以下の主要な技術を使用しています。（詳しくは package.json をご覧ください）

• Vite-Expressフロントエンドとバックエンドに使用。
• Express.jsフロントエンドとバックエンドのルーティング。
  • express-wsセッションごとの websocket 通信に使用。
• Vite開発サーバーとビルドに使用。
• Tailwind CSSスタイリングに使用。
• Levelユーザーのセッションデータの保存に使用。
• better-sqlite-3ユーザーの認証に使用。チュートリアルの保存にも使用する予定。
• lucia-authユーザーの認証に使用。
• Jotaiフロントエンドの状態管理。
• react-i18next多言語対応に使用。バックエンドは通常の i18n を使用。

リポジトリを複製し、以下のコマンドを使用します。

npm i
npm run dev

アプリを稼働させる

以下のコマンドでアプリをビルドし、起動させます。

npm run build
npm run start

認証情報は以下の方法でリセットできます。

npm run reset-user

アプリの設定をする

• アプリを稼働させた状態で、/adminへアクセスします。
• 初期ユーザー名はadmin、パスワードはadminです。

追加で使用できる機能

• 言語: リポジトリ内のすべてのプログラムで多言語対応をしています。現在は４つの言語に対応していますが、いくつかの言語は機械翻訳によって生成されています。

  • 英語
  • 日本語
  • マレー語
  • **語簡体字

• 拡張機能: 拡張機能を追加することで、新しいブロック、ツールボックスカテゴリ、VM を実行する際に使用できる追加の関数を設定することができます。

  • Example(開発中): 拡張機能の使用例です。作成方法は今後ドキュメントとして提供する予定です。
  • Minecraft-Core(開発中): Minecraft と本アプリを接続することができる拡張機能です。