開発　原田航希です

http://www.may-kh.site/
※0928 wordmodeで3タイプ目以降のキーボードヘルパーが反応しないバグを修正しました

開発部門の先輩方はこの社内ブログを通じ、マークアップ言語やプログラム言語を使用して
様々なチャレンジをされてきました！

いつかやろう、いずれやろう、そのうちやろう
どれだけクレドで話そうが、聞こうが、夜メールに書こう読もうが
やらないと意味なし!

もう、やるやる詐欺師はやめにして

得意のとりあえずやってみよう精神で
先輩方の歩まれた轍を、今回、僕も歩いてみることを決めてみました

自己満タイピングゲーム作成した

教本やサイトを見たわけではなく、完全オリジナルです。
正直、簡単な記述の組み合わせでしかないので、
普通にjQueryが分かる人なら全然できると思いました。

自己満なので、見やすさとか使いやすさはほとんど考慮されていません。

自分がやりたいことを思うようにやっているだけなので、楽しくないはずがない

urlはこの辺に貼ってます

目的

ブラインドタッチの練習をしたかったから。
→ホームポジションなど覚えていなく独習だったので、指の動きが汚いのが嫌だった

動機

・なんか簡単に作れそうだな～と思った
・シンプルで使いやすいタイピングゲームを公開しているサイトが見つからなかった

制作時間

3週間(2h/d)くらい

使用言語

・javascript(jQuery)
・html
・css

ポイント

・テーマ変更の実装(normal-thema or dark-thema)
・モード変更の実装(keycode-mode or word-mode or fileup-mode(for your only) )
・カウント方法変更の実装(countUp-mode or countDown-mode)
※つまり、2*3*2=12通りのパターンで遊べます
・keycode-mode 文字数変更機能
・レコード機能の実装

良かった点

・とりあえず毎日家帰って作り込む時間が楽しすぎた
・jQueryにそこそこ詳しくなった、記述がかなり早くなった
・jQueryのライブラリに頼らずできた(さすがにcookie取得～分割格納はめんどくさすぎて使いました。)
・javascriptをもっと学びたいと思った
・cookieすげぇってなった
・自分で考えて、学んで、やってみて、自信がついた
・自分の雑魚さを改めて痛感した

反省点

・phpで設計できなかった
・GET、POSTなど送受信プロトコルの基本的なことの理解不足
・初期設計をほとんどしなかったので、行き当たりばったりのゴリゴリコードになった
・ajaxを使った簡易スクレイピングモードが実装できなかった(pythonじゃないので難易度高め?)
・カプセル化、コンポーネント化の思想を学ぶ必要性を感じた(情報保護も)
・もっとスマートにコードが書けるようになりたいと思った

とまぁいろいろ書きましたが、実際の作品がこちらです。
http://www.may-kh.site/

使い方解説

ディスプレイ小さいとうまく表示されないかもです。
できるだけ大きい画面で遊んでみてください。
スマホでの動作は未確認です

・入力文字を1文字ずつ判定してくれます

・テキストエリアにフォーカスで、キーボードとタイマーがオープンします

・darkmode：暗い自己満テーマになります

・keycodemode：キーボード上の文字がランダムで出てきます。問題の文字の上の数字を変えれば
出題文字数も変更可能

・wordmode：事前に僕が設定した単語が1文字ずつ分割されて出てきます。

・ファイルを選択：メモ帳やcsvファイルをアップして自分で好きな問題で練習できます。
※単語は、メモ帳なら改行で、csvならセル行で区切ってください。漢字でも判定できますが、動作は保証できません。エンコードなど不具合で文字化けするかもです。文字数は少なめがおすすめ。

・countup：endボタンを押すまでゲームが続きます

・countdown：制限時間でゲームが強制終了するモードです(初期値30s)

・下のキーボードはヘルパーです。次に打つべきキーを、ホームポジション規定で色付けします。(darkmodeではホームポジション設定はなし)
　グレー：小指
　オレンジ：薬指
　紫：中指
　水色：人差し指

・キーボードの横の丸いやつ：キーボードがうっとうしいときはこれでオープンクローズができます。

所感

入社してからプライベートの部分含めかなり忙しい1年間だったので、やっと落ち着いてなんかできたな～って感じです！

友人のC++とかJAVAで仕事してる人を見ると、化け物に見えます。フィールドが違いすぎますが、自分の雑魚さ加減が身に沁みます。。。彼らとはストーリーが全然違うので比較しているわけではないですが、webのこと、プログラムのこと、PCのこと、ネットワークのこと、アリンコレベルの自分を早く脱したいというかもっと知りたいなぁと思う日々です。

ゲームまたやってみてください。バグだらけだと思うのであったら教えてください。

ちょっとゴリゴリコードすぎて自己嫌悪ですが、記述が多すぎて途中から何が何が分からくなったので諦めました。
気になる人はコード見てみてください(無茶苦茶なので意味わからないと思います)

楽しかったです！