文字数カウンター
CoddyのReactジャーニー「基本概念」セクションの一部 — レッスン 30/42。
テキストは状態であるため、毎回の `render` 処理においてそのテキストを使って計算を行う（`compute`）ことができます。ツイート形式の文字数カウンターは1行で書けます:
<p>{message.length} characters</p>追加の state は必要ありません。message.length は既存の state から派生し、キー入力ごとに自動的に再計算されます。経験則として、すでに持っている state から計算できる場合は、state に保存しないでください。
チャレンジ
簡単リアルタイムの文字数メーター付きのバイオ（プロフィール）ボックスを作成します。
id="bio"のinputをbioステート（初期値は空文字列）で制御（controlled）します。- 段落（
id="length"）にN charactersと表示させます。ここで N は bio の現在の文字数です（保存するのではなく計算して求めます）。
自分で試してみよう
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div id="root"></div>
<script type="module" src="main.jsx"></script>
</body>
</html>
腕試しこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。