こんにちは、うたかたです。
この記事は私のプログラミングの勉強の記録のようなものです。どういった勉強をしているのか、どういったものを作ったのかを紹介しているので、これからプログラミングを勉強しようと思っている人はぜひ参考にしてみてください。
目次
今回作ったものについて紹介
作ったもの→Web単語帳
web単語帳ってどんなものかかんたんに言うと単語帳の機能をwebページで実現したものです。問題文と答えをランダムな順番で1ページに表示します。こうすることで、わざわざ単語帳を持ち歩かなくてもどこでも勉強できるし、順番がランダムだから答えを順番で覚えてしまうこともなくなります。
目的→テスト勉強のために勉強を効率化する（一問一答形式）
一問一答形式の問題と答えをあらかじめ用意しておき、あとはwebページ上で勉強がすべて完結するようにする。
仕様
本プログラムはiPhoneを横向きにして使用することを想定している。
プログラムの挙動について
問題文と答えを同一ページに表示させる
（答えは最初からは見えず、下にスクロールすると見れる）
↓
答えの下にある「NEXT」ボタンを押すとページが再読み込みされて、次の問題と答えが表示される
Web単語帳へのリンク
実際に作ったもの→簡易版WEB単語帳
上のリンクから私が作ったWebアプリに飛べます。ぜひ試してみてください。
今回のサンプルプログラムで設定されている問題は統計と在庫管理の主要単語について英語で設定されています。
このプログラムの問題点と改善策
問題点1：出題がかたよる可能性がある
設定されている問題からどれが表示されるかがランダムなので、出題に偏りが出る可能性がある。
この問題を改善するには、一度出題した問題を記録しておき、設定されている全ての問題を表示し切ったら2周目に行くようにすれば良い。
問題点2：端末によって画面表示が崩れる
現時点では、画面の大きさによって表示がうまくいかない場合がある。
例えば、私が使っているiPhone7では画面を横にすることで、最初は問題文だけが表示され、スクロールすると答えが表示されるようになっていますが、縦画面にしたりもっと大きな画面のiPhoneXなどを使うと答えが最初から見えるようになっていたりする。
この問題点を改善するためには、最初は問題文だけのページを表示させ、ボタンを押すと答えだけの画面を表示するようにすれば良い。
つまり、現在問題と答えを1ページに表示しているのを問題で1ページ、答えで1ページにすればOKということだ。
次回作成するプログラムの方針
基本的には、今回のプログラムのレベルアップを図る。
上で挙げた問題点とその改善策に則ってアップデートさせていきたい。
それと、現在は最低限のcssとhtmlしか使っていないためデザインがひどく貧弱である。次回のプログラムでは文字のフォントやサイズ、色、背景などの見た目にもこだわっていきたい。
