練習問題追加 5章まで

Author: na-trium-144

app/[docs_id]/markdown.tsx

@@ -57,7 +57,7 @@ const components: Components = {
             <ExecFile
               language={match[1]}
               filename={match[3]}
-              content={String(props.children).replace(/\n$/, "")}
+              content={String(props.children || "").replace(/\n$/, "")}
             />
           </div>
         );
@@ -72,7 +72,7 @@ const components: Components = {
                   language={match[1]}
                   tabSize={4}
                   filename={match[3]}
-                  initContent={String(props.children).replace(/\n$/, "")}
+                  initContent={String(props.children || "").replace(/\n$/, "")}
                 />
               </div>
             );
@@ -88,7 +88,7 @@ const components: Components = {
             return (
               <div className="bg-base-300 border border-primary m-2 p-4 pr-1 rounded-lg">
                 <PythonEmbeddedTerminal
-                  content={String(props.children).replace(/\n$/, "")}
+                  content={String(props.children || "").replace(/\n$/, "")}
                 />
               </div>
             );
@@ -105,7 +105,7 @@ const components: Components = {
           // style={todo dark theme?}
           {...props}
         >
-          {String(props.children).replace(/\n$/, "")}
+          {String(props.children || "").replace(/\n$/, "")}
         </SyntaxHighlighter>
       );
     } else if (String(props.children).includes("\n")) {
@@ -117,7 +117,7 @@ const components: Components = {
           // style={todo dark theme?}
           {...props}
         >
-          {String(props.children).replace(/\n$/, "")}
+          {String(props.children || "").replace(/\n$/, "")}
         </SyntaxHighlighter>
       );
     } else {

app/terminal/exec.tsx

@@ -12,7 +12,7 @@ interface ExecProps {
 }
 export function ExecFile(props: ExecProps) {
   const { terminalRef, terminalInstanceRef, termReady } = useTerminal({
-    getRows: (cols: number) => getRows(props.content, cols),
+    getRows: (cols: number) => getRows(props.content, cols) + 1,
     onReady: () => {
       // カーソル非表示
       terminalInstanceRef.current!.write("\x1b[?25l");

public/docs/python-1.md

@@ -99,6 +99,8 @@ print("Hello from a Python script!")
 Hello from a Python script!
 ```
 
+REPLでは式を入力するだけでも結果が表示されていましたが、スクリプトで結果を表示するには `print()` 関数を使う必要があります。
+
 ### __main__ について
 
 前述の hello.py のようにファイルの1行目から処理を書いても問題なく動作しますが、一般的には以下のようなお決まりの書き方が用いられます。
@@ -126,15 +128,15 @@ Pythonでは、ファイルは他のファイルから `import` 文で読み込
 
 ```python:my_utils.py
 def say_hello(name):
-  """挨拶を返す関数"""
-  return f"Hello, {name}!"
+    """挨拶を返す関数"""
+    return f"Hello, {name}!"
 
 # このファイルが直接実行された時だけ、以下のテストコードを実行する
 if __name__ == "__main__":
-  print("--- Running Test ---")
-  message = say_hello("Alice")
-  print(message)
-  print("--- Test Finished ---")
+    print("--- Running Test ---")
+    message = say_hello("Alice")
+    print(message)
+    print("--- Test Finished ---")
 ```
 
 このファイルを2通りの方法で使ってみます。

public/docs/python-2.md

@@ -1,182 +1,169 @@
 # 第2章: Pythonの基本構文とデータ型
 
-他の言語での経験を活かし、Pythonの基本的な文法と組み込み型を素早くキャッチアップしましょう。特に、多くの静的型付け言語と異なる**インデントによるブロック表現**と**動的型付け**は、Pythonを理解する上で最初の重要なポイントです。
+他の言語でのプログラミング経験がある方を対象に、Pythonの基本的な文法と組み込みデータ型を解説します。多くの静的型付け言語（Java, C++, C\#など）との違いを意識しながら、Pythonの特徴を素早く掴んでいきましょう。特に、**動的型付け**は重要なコンセプトです。
 
-この章のコード例は、Pythonの対話モード（REPL）で `>>>` に続くコードを直接入力し、その直後に表示される結果を確認することを想定しています。
-
-<!-- ## インデントが持つ意味: 波括弧 `{}` からの解放
-
-多くのプログラミング言語では、`if`文や`for`ループなどのコードブロックを波括弧 `{}` で囲みます。しかし、**Pythonではインデント（字下げ）そのものがコードブロックを定義します**。これはPythonの構文における最大の特徴の一つです。
-
-一般的に、インデントには**スペース4つ**を使用することが強く推奨されています（PEP 8スタイルガイド）。
+## 変数宣言と動的型付け
 
-**Java/C++でのブロック表現:**
+Pythonの最も大きな特徴の一つは、変数の型を宣言する必要がないことです。変数への代入が、変数の作成と型の決定を同時に行います。
 
-```java
-if (score > 80) {
-    System.out.println("合格です。");
-    System.out.println("おめでとうございます！");
-}
+```python-repl
+>>> # 変数 message を作成し、文字列を代入
+>>> message = "Hello, Python!"
+>>> print(message)
+Hello, Python!
+>>> # 変数 number を作成し、整数を代入
+>>> number = 100
+>>> print(number)
+100
 ```
 
-**Pythonでの対話モード実行例:**
-対話モードで複数行のブロックを入力すると、継続行プロンプト `...` が表示されます。
+さらに、Pythonは**動的型付け**言語です。これは、一度作成した変数に、異なる型のデータを再代入できることを意味します。`type()`関数を使うと、変数が現在どの型を参照しているかを確認できます。
 
 ```python-repl
->>> score = 85
->>> if score > 80:
-...     # このブロックはインデントによって定義される
-...     print("合格です。")
-...     print("おめでとうございます！")
-...
-合格です。
-おめでとうございます！
+>>> x = 10
+>>> type(x)
+<class 'int'>
+>>> # 同じ変数 x に文字列を再代入
+>>> x = "Hello"
+>>> type(x)
+<class 'str'>
 ```
 
-インデントを間違えると `IndentationError` という文法エラーが発生します。これにより、誰が書いてもコードの見た目が統一され、可読性が高まるというメリットがあります。
- -->
+この柔軟性は、静的型付け言語に慣れていると少し奇妙に感じるかもしれませんが、Pythonの簡潔さと書きやすさの源泉となっています。
 
-## 変数宣言と動的型付け
+## 基本的なデータ型
 
-静的型付け言語（Java, C++, C\#など）に慣れている方にとって、Pythonの変数宣言は非常にシンプルに感じられるでしょう。
+Pythonには多くの組み込みデータ型がありますが、ここでは最も基本的なものを紹介します。
 
-**Pythonでは、変数の型を事前に宣言する必要はありません**。変数への代入が初めて行われたときに、変数が作成され、代入された値の型が自動的にその変数の型となります。これを**動的型付け**と呼びます。
+### 数値（int, float）
 
-変数名だけを入力してEnterキーを押すと、その時点での変数の値を確認できます。
+Pythonは整数 (`int`) と浮動小数点数 (`float`) を区別します。
 
 ```python-repl
->>> # 変数 `count` は整数(int)型として自動的に解釈される
->>> count = 100
->>> count
-100
->>> type(count) # type()関数で現在の型を確認
+>>> # 整数 (int)
+>>> a = 10
+>>> type(a)
 <class 'int'>
-
->>> # 同じ変数に別の型（文字列）を再代入できる
->>> count = "百"
->>> count
-'百'
->>> type(count)
-<class 'str'>
+>>> # 浮動小数点数 (float)
+>>> b = 3.14
+>>> type(b)
+<class 'float'>
 ```
 
-## 基本的なデータ型
-
-ここでは、プログラミングで頻繁に使用される基本的なデータ型を紹介します。対話モードでは、式を評価した結果が直接表示されます。
-
-### 数値 (`int`, `float`)
-
-Pythonには整数 (`int`) と浮動小数点数 (`float`) があります。型の区別は自動的に行われます。
+四則演算は直感的に行えます。注意点として、除算 (`/`) は常に `float` を返します。整数除算を行いたい場合は (`//`) を使います。
 
 ```python-repl
->>> x = 10
->>> y = 3.14
-
->>> # 演算結果がそのまま表示される
->>> x + y
-13.14
->>> x * 2
-20
->>> x / 3   # 通常の除算
+>>> 10 / 3
 3.3333333333333335
->>> x // 3  # 整数の除算（切り捨て）
+>>> 10 // 3
 3
->>> x % 3   # 剰余
+>>> # べき乗
+>>> 2 ** 4
+16
+>>> # 剰余
+>>> 10 % 3
 1
->>> x ** 3  # べき乗
-1000
 ```
 
-### 文字列 (`str`)
+### 文字列（str）
 
-文字列はシングルクォート `'` またはダブルクォート `"` で囲みます。どちらを使っても機能的な違いはありません。
+文字列はシングルクォート (`'`) またはダブルクォート (`"`) で囲んで作成します。
 
 ```python-repl
->>> message1 = "こんにちは、世界"
->>> message2 = 'Hello, World!'
-
->>> # 文字列の連結
->>> greeting = message1 + " & " + message2
->>> greeting
-'こんにちは、世界 & Hello, World!'
-
->>> # 文字列の繰り返し
->>> "-" * 10
-'----------'
+>>> name = "Guido"
+>>> greeting = 'Hello'
 ```
 
-#### f-stringによるフォーマット
-他の言語での文字列フォーマット（`printf` や `String.format`）に相当するものとして、Python 3.6以降では**f-string**が推奨されます。非常に直感的で強力です。
-
-文字列の前に `f` を置き、波括弧 `{}` の中に変数名や式を直接記述できます。
+文字列の連結は `+` 演算子、繰り返しは `*` 演算子を使います。
 
 ```python-repl
->>> name = "佐藤"
->>> age = 28
-
->>> # 従来の方法（少し面倒）
->>> "名前: " + name + ", 年齢: " + str(age)
-'名前: 佐藤, 年齢: 28'
+>>> full_greeting = greeting + ", " + name + "!"
+>>> print(full_greeting)
+Hello, Guido!
+>>> print("-" * 10)
+----------
+```
 
->>> # f-stringを使って文字列を生成する
->>> profile = f"名前: {name}, 年齢: {age}"
->>> profile
-'名前: 佐藤, 年齢: 28'
+変数の値を文字列に埋め込む際には、**f-string (フォーマット済み文字列リテラル)** が非常に便利で推奨されています。文字列の前に `f` を付け、埋め込みたい変数を `{}` で囲みます。
 
->>> # f-string内では計算も可能
->>> f"{name}さんは10年後、{age + 10}歳です。"
-'佐藤さんは10年後、38歳です。'
+```python-repl
+>>> name = "Ada"
+>>> age = 36
+>>> message = f"My name is {name} and I am {age} years old."
+>>> print(message)
+My name is Ada and I am 36 years old.
 ```
 
-### 真偽値 (`bool`)
+### 真偽値（bool）
 
-真偽値は `True` または `False` の2つの値を持ちます。**先頭が大文字であることに注意してください**。
+真偽値は `True` と `False` の2つの値を持ちます（先頭が大文字であることに注意してください）。論理演算子には `and`, `or`, `not` を使います。
 
 ```python-repl
 >>> is_active = True
->>> is_admin = False
-
->>> # 論理演算子 (and, or, not)
->>> is_active and is_admin
+>>> has_permission = False
+>>> type(is_active)
+<class 'bool'>
+>>> # 論理積 (AND)
+>>> is_active and has_permission
 False
->>> is_active or is_admin
+>>> # 論理和 (OR)
+>>> is_active or has_permission
 True
+>>> # 否定 (NOT)
 >>> not is_active
 False
 ```
 
-## 型ヒント (Type Hints) の紹介
+## 型ヒント（Type Hints）の紹介
 
-動的型付けはコードを素早く書ける一方で、大規模なプロジェクトでは、関数がどのような型の引数を期待し、何を返すのかが分かりにくくなることがあります。
+動的型付けは柔軟ですが、コードが大規模になると変数がどの型を期待しているのかが分かりにくくなることがあります。そこで導入されたのが**型ヒント**です。これは、変数や関数の引数、返り値に「期待される型」を注釈として付与する機能です。
 
-そこでPython 3.5から導入されたのが**型ヒント**です。これは、変数や関数の引数、戻り値に「期待される型」を注釈として付与する機能です。
+`変数名: 型` のように記述します。
 
-**重要**: 型ヒントはあくまで「ヒント」であり、Pythonのインタプリタはこれを**実行時に強制しません**。しかし、エディタや静的解析ツールがこのヒントを解釈し、型の不一致を開発段階で警告してくれるため、コードの可読性と堅牢性が大幅に向上します。
+```python-repl
+>>> # 型ヒントを付けた変数宣言
+>>> user_name: str = "Alice"
+>>> user_id: int = 123
+```
+
+**重要な注意点:** 型ヒントはあくまで「ヒント」であり、**Pythonの実行エンジンはこれを強制しません**。つまり、型ヒントと異なる型の値を代入してもエラーにはなりません。
 
 ```python-repl
->>> # nameはstr型、ageはint型を期待し、戻り値はstr型であることを示す
->>> def create_user_profile(name: str, age: int) -> str:
-...     return f"ユーザー名: {name}, 年齢: {age}"
-...
->>> # 正しい使い方
->>> user1 = create_user_profile("田中", 35)
->>> user1
-'ユーザー名: 田中, 年齢: 35'
-
->>> # 変数にも型ヒントを付けられる
->>> user_id: int = 101
-
->>> # --- 型ヒントに反する使い方 ---
->>> # 静的解析ツールは警告を出す可能性があるが、実行はできてしまう
->>> user2 = create_user_profile("鈴木", "25歳") # ageに文字列を渡している
->>> user2
-'ユーザー名: 鈴木, 年齢: 25歳'
+>>> user_id: int = 123
+>>> type(user_id)
+<class 'int'>
+>>> # int型とヒントを付けたが、文字列を代入できてしまう
+>>> user_id = "abc-789"
+>>> type(user_id)
+<class 'str'>
 ```
 
-静的型付け言語の経験者にとって、型ヒントは馴染みやすく、動的言語の柔軟性と静的解析の安全性を両立させるための強力なツールとなるでしょう。
+型ヒントは、コードの可読性を高めたり、MyPyのような静的解析ツールや統合開発環境（IDE）がコードのバグを事前に発見したりするために利用されます。
+
+## この章のまとめ
 
------
+  * Pythonでは変数の型宣言は不要で、値の代入によって型が自動的に決まる（**動的型付け**）。
+  * 基本的なデータ型として**数値** (`int`, `float`)、**文字列** (`str`)、**真偽値** (`bool`) がある。
+  * 文字列に変数を埋め込むには、簡潔で強力な **f-string** を使うのが一般的。
+  * **型ヒント** (`変数名: 型`) は、コードの可読性を向上させるための注釈であり、実行時に型の強制力はない。
 
-この章では、Pythonの構文の基礎となるインデントルール、柔軟な動的型付け、そして基本的なデータ型について対話モードで確認しながら学びました。特にf-stringと型ヒントは、モダンなPython開発における必須知識です。
+### 練習問題1
 
-次の章では、複数の要素をまとめて扱うための強力なデータ構造である**リスト**と**タプル**について詳しく見ていきます。
+`item_name` という変数に商品名（文字列）、`price` という変数に価格（整数）、`stock` という変数に在庫数（整数）をそれぞれ代入してください。その後、f-stringを使って「商品: [商品名], 価格: [価格]円, 在庫: [在庫数]個」という形式の文字列にし、 `print()` で出力するコードを書いてみましょう。
+
+```python:practice2-1.py
+```
+
+```python-exec:practice2-1.py
+(出力例) 商品: 高性能マウス, 価格: 4500円, 在庫: 2個
+```
+
+### 練習問題2
+
+`is_adult` という変数に `bool` 型の型ヒントを付けて `True` を代入し、`type()` で型を確認してください。その後、同じ変数に数値の `20` を代入し、再度 `type()` で型を確認してください。この結果から、型ヒントが実行時の動作にどのような影響を与える（あるいは与えない）か考察してみましょう。
+
+```python:practice2-2.py
+```
+
+```python-exec:practice2-2.py
+```