英単語を覚えるwebアプリ

　英単語を覚えるためのwebアプリを作りました。とりあえず今のところは自分専用ですが、使ってみたいという人がいたら複数人で使えるような形にしようかなと思います。

出来たもの

http://goodpreparations.co.cc/wordmemorizer/main.php

※動作確認環境　Google Chrome (ver 17.0.963.79)

英単語を覚えることについて

　英語初級レベル（TOEIC700未満くらい）だと英単語を覚えるという作業は不要だと思います。英単語を覚える暇があったら、たくさん文章を読んだ方がいいと思います。文章を読んで前後の文脈から知らない単語の意味を推測する力を付けるのです。また、このレベルだと知らない単語といっても頻出単語が多いと思います。知らない単語に出会う、意味を推測する、それがあってるか確かめる、これを繰り返していれば自然と語彙は増えていきます。

　中級レベル（TOEIC900超えたくらい）になると、語彙が大切になってくると思います。まず知らない単語に出会ったとして次にその単語に出会う頻度が確実に低くなります。なので、初級レベルで行うような方法では知ってる単語数を効率的に増やすことは難しいです。そもそもそんな滅多に出会わないような単語覚えなくてもいいんじゃない？という考え方もありますが、上級レベルに達したい場合は難しい単語も積極的に覚えていきたいわけです。

　また、TOEICで基本的なリーディング、リスニングができるようになると、次はスピーキング、ライティング力を鍛えるようになります。特にスピーキングは語彙が重要です。例えば、「中指を突き指した。」「頭にたんこぶができた。」「足がつった。」など日常よく使いそうな言葉でもなかなか表現がぱっとでて来ません。もちろん、「中指が痛い」とか「頭をぶつけて痛い」とか伝わるレベルの表現ならできますが、より詳細に伝えたい場合は豊富な語彙が必要になります。

工夫した点

　英才教育を受ける園児が紙に書いた何かを高速で見せられているのをテレビでみました。最初はスピードが遅くて、徐々に速くしていくというものです。単純にこれをjavascriptで実装しました。

　また、新しいことを覚える場合には

1. 新しいことを覚える
2. 次の日に覚えたことを確認する
3. １週間後にもう一度確認する
4. １カ月後に確認する（忘れていたものがあったら、重点的に見る）
5. 半年後に確認する （忘れていたものがあったら、重点的に見る）

ということをするとよいと脳科学的に推奨されていました。（期間はうろ覚えです。。）これを参考に、

1. 直近で登録された100単語のみをランダムで出す
2. 覚えていなかったものから100単語をランダムに出す
3. すべての単語から100単語をランダムに出す

をできるようにしました。今のところ、効率的に覚えられていると思います。（まだ、100単語しか登録してないですが。。）

技術的な話

　今回jsonを利用した非同期通信に初めてチャレンジしました。1つ目は、非同期通信によるデータベース更新です。

1. チェックボックスの変化をjavascriptのイベントハンドラでキャッチする。
2. 更新したいデータをGETパラメータに入れてjQuery.get()でCGI（php）にアクセスする。
3. CGI側で、GETで受け取ったパラメータに応じてDBを更新。更新結果をjson形式で出力する。
4. 3.の出力内容に応じてコールバック処理を実行する。

　2つ目は、テキストエリア内に表示する単語リストの更新です。

1. ラジオボタンの変化をjavascriptのイベントハンドラでキャッチする。
2. 選択されたボタンタイプをGETパラメータに入れてjQuery.get()でCGI（php）にアクセスする。
3. CGI側で、GETで受け取ったパラメータに応じてSQLを発行し結果をjson形式で出力する。
4. 3.の内容をコールバック関数内でローカルな変数（DOMで読みとるデータ）にコピーする。

　簡単なことですが、感動しました。「これが、ajaxか！！」と。だいぶ時代遅れですいません。あとは、今回からgitを使ってきちんとソースコードを管理するようにしました。エクセル方眼系エンジニアな私ですが、web系エンジニアさん達との技術の差をちょっとでも埋められるように地道にがんばります。