はるですブログ
HARU's blog

素人がプログラミングを使って
こどもの成績を向上させるブログ
プログラミング

【データベースにチャレンジしてみた(その1)】これまでの中1英単語の問題のデータベース化

今回はデータベースについて、チャレンジしてみます。

最終的には、これまでアップしてきた単語テストの結果をデータベース化して、実施状況や成績を可視化することですが、スタートとして、テスト問題自体をデータベース化するところから始めたいと思います。

もくじ
  • これまでの単語テストについて
  • サーバのデータベース使用から一覧表示まで
  • まとめ

これまでの単語テストについて

これまで計6回の英単語テストを掲載しましたが、テスト問題は以下のように直接コードに書き込んでいました。

'use strict';

{
    
    const myQA = [            // 問題テーブル
        "りんご"          , "apple",
        "かばん、袋"        , "bag",
        "ケーキ"          , "cake",
        "猫"              , "cat",
        "市、都市"        , "city",
        "犬"              , "dog",
        "たまご"          , "egg",
        "晩、夕方"        , "evening",
        "さかな"          , "fish",
        "巨人"            , "giant",
        "少女"            , "girl",
        "家"            , "house",
        "インターネット"            , "Internet",
        "アイスクリーム"            , "ice cream",
        "ジュース"            , "juice",
        "かぎ"            , "key",
        "ライオン"            , "lion",
        "牛乳"            , "milk",
        "名前"            , "name",
        "鼻"            , "nose",
        "オレンジ"            , "orange",
        "ペン"            , "pen",
        "クイズ"            , "quiz",
        "部屋"            , "room",
        "6"            , "six",
        "太陽"            , "sun",
        "テニス"            , "tenis",
        "おじ"            , "uncle",
        "制服"            , "uniform",
        "バレーボール"            , "volleyball",
        "腕時計"            , "watch",
        "黄色"            , "yellow",
        "動物園"            , "zoo",
    ];

    let myScore = 0;
    let myNowCnt  = 0;                     // 問題を出すテーブルカウンタ
    const myLastCnt = 10;       // 問題の数
    let myHit = 0;	// 正解数のカウンタ
    let myQAno    = new Array(myQA.length / 2);   // 問題の順番テーブル
    

    function myQuesInit(){             // 問題テーブルのシャッフル
        for (let i=0; i< myQA.length / 2; i++) myQAno[i] = i; // 0~myLastCnt-1を順次セット
        for (let i=0; i<500; i++){             // 500回 myQAno の内容をシャッフルする
            let my1 = Math.floor( Math.random() * (myQA.length / 2) ); // 0~myLastCnt-1 を決める
            let my2 = Math.floor( Math.random() * (myQA.length / 2) ); // 0~myLastCnt-1 を決める
            let myBackup = myQAno[my1];     // myQAnoのmy1番目とmy2番目の内容を入れ替える
            myQAno[my1] = myQAno[my2];
            myQAno[my2] = myBackup;
        }
    }
    
    function myQues(){
        if ( myNowCnt==0 ) myQuesInit();                 // 問題をシャッフル
        let myA = prompt("\n問題 : "+myQA[myQAno[myNowCnt]*2],"");
        if ( myA != null ){                              // キャンセルボタンでない?
            if ( myA == myQA[myQAno[myNowCnt]*2+1] ){     // スペル正解?
                myHit++;
            }else{                                        // スペル間違った?
                alert("はずれ! 答えは "+myQA[myQAno[myNowCnt]*2+1]+" です!");

            }
            
            if (myNowCnt==myLastCnt-1){                // 問題終わった?
                myNowCnt=0;
                let myScore = Math.floor(myHit*100/myLastCnt);	
                alert("問題終了です\n"	
                +myLastCnt+"問中"+myHit+"問正解。点数は"+myScore+"点です。");	
                myNowCnt=0;	
                myHit=0;	
            }else{                                     // 次の問題へ
                myNowCnt++;
                myQues(); 
            }
        }else{                                   // キャンセルボタン押した
            myNowCnt=0;
            myHit = 0;
            alert("勉強中断 お疲れ様でした!");
        }
    }
    
    document.querySelector('button').addEventListener('click', () => {
        myQues();
    });
 
    jQuery(document).ready(function () {
 
        jQuery('#buttonClickID').click(function () {
            alert('ボタンクリック!');
        });
    });

  
}

前半がテスト問題、後半がテスト問題を表示したり、集計したりする部分です。

テスト問題部分を直接コードに書いてもいいのですが、今後間違った問題だけをやりたいだとか、中間テスト範囲の25ページから36ページだけをやりたいとかいう要望が出てくると思います。

それを実現するには、問題自体をデータベース化しておく必要がありそうです。

サーバのデータベース使用から一覧表示まで

ここでも素人のわたしは、まずは検索です。

わたしが使用しているレンタルサーバー環境のデータベース使用から一覧表示まで、最も参考になったのは、以下のサイトです。

【侍エンジニア塾】((PHP)エックスサーバーでDB作成・DB接続)

上のサイトに詳しく書いてありますので、手順だけ記載します。

  1. MySQL設定、ユーザー追加
  2. phpMyAdminでテーブルを作成
  3. エクセルで問題テーブルを作成
  4. 上で作ったものをCSV保存
  5. phpMyAdmin上で、上のCSVファイルデータのみを読み込み
  6. DBに接続し、表作成するPHPファイルを作成
  7. FTPをつかって、上のファイルをWEBサーバーに保存

で、出来上がったページが以下です。

英単語問題のDB化

まとめ

きょうはここまでです。

DB化について、ぐぐった通りにやってみましたが、すんなりできちゃいました。

DBを扱うにあたって、重要な言語の一つがSQL言語です。

今回は作ったテーブルをすべて抜き出して、表を作りましたが、

作ったテーブルから、ある頭文字の単語を抜き出すとか、あるページのものを抜き出すとか、一瞬で抽出できます。

できるかどうかわかりませんが、次回はこのSQLを使って、問題の抽出をしてみたいと思います。

それではまた次回へ!

ABOUT ME
はる
はる
45歳。3児の父。ごく普通のサラリーマン。 趣味は広く浅く。 プログラムもかじった程度。

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA