サイトについて
「AI先生のWebブック」は、「知りたい！」が見つかるをコンセプトに、 テクノロジー関連の幅広い学習コンテンツを提供する教育Webブックです。 HTML・CSS・JavaScriptなどのWeb技術から、AI活用、フリーランス、その他様々な分野まで、 実生活に役立つ知識とスキルを対話形式でわかりやすく解説します。
コンテンツ制作の方針：
現場で役立つ知識とスキルの習得
対話形式と図解による段階的な学習
親しみやすい対話と理解する喜び
実際に動かせるコード例とクイズ
丁寧な検証と継続的な内容更新
中学生でも理解できる言葉で説明し、図解やイラストを豊富に使用することで、 「難しそう」「わからない」という壁を取り除き、誰もが楽しく学べる環境を提供しています。
AIとの共同制作について
このサイトは、人間とAI（GitHub Copilot、Claude等）が共同で制作しています。 AIの力を活用することで、より効率的で質の高いコンテンツ制作を実現し、 最新の技術トレンドを反映した学習教材を提供しています。
サイトの特徴
対話形式の学習
AI先生と生徒の自然な会話を通じて学習を進めます。まるで物語を読むように、 楽しみながら知識を身につけることができます。
豊富な図解・イラスト
文字だけでは理解しにくい概念も、図解やイラストで視覚的に説明。 直感的に理解できるよう工夫しています。
実践的なコード例
実際に動作するコード例を豊富に掲載。インタラクティブなエディターで、 その場で試しながら学習できます。
段階的カリキュラム
基礎から応用まで、学習者のレベルに応じて段階的に進められる 体系的なカリキュラムを提供しています。
学習コンテンツ
HTML
Webページの構造を作る基礎言語
公開中CSS
Webページを美しくスタイリング
準備中JavaScript
Webページに動きと機能を追加
準備中VS Code
開発効率を上げるエディタ活用術
準備中ChatGPT
AIを活用した開発とコーディング
準備中フリーランス
独立して稼ぐためのノウハウ
準備中使い方ガイド
学習したいトピックを選択
トップページから興味のあるカテゴリ（HTML、CSS、JavaScriptなど）を選んで始めましょう。
対話を交えて理解を深める
AI先生と生徒の会話を織り交ぜながら、中学生でも理解できる解説で自然に知識を身につけていきます。
実際にコードを試す
インタラクティブなコードエディターで、学んだ内容を実際に動かして確認できます。
自分のペースで進める
いつでもどこでも、自分のペースで学習を続けることができます。
開発について
技術スタック
スタイリング: Tailwind CSS
言語: TypeScript
図表: HTML、CSS
アイコン: FontAwesome
制作体制
プロジェクト設計、品質管理、最終的な内容確認
コンテンツ作成支援、コード生成、UI/UX改善提案
人間とAIの協働により、教育的価値の高いコンテンツと最新の技術的実装を両立させています。 サイトの改善提案やフィードバックがございましたら、 @hakuto00 までお気軽にご連絡ください。