Java の勉強を始めたいけど環境構築が面倒な人、インストールとか設定とか、絶対にうまくいかない気がする人、挫折する必要はありません。
環境はとりあえずあと回し、ブラウザからプログラムをすぐに実行できるサイトがあるので試してみましょう。
どんなサイト？
ブラウザ上でコーディングした内容を、そのまま実行できるサイトのことで、JDK や eclipse のインストールは一切不要です。
たとえばですが、名前をよく聞く 3 つのサイト
- Progate
- Paiza
- Codecademy
というのががあります。
実際に試してみました。
Progate
まずユーザー登録から始まります。ごく簡単な手続きなので 30 秒もかかりません。ログインすると学習コースが表示され Ruby や PHP、Java など、全部で 9コース準備されています。
学習方法
言語に関するチュートリアルが用意されているので
- ① チュートリアルのスライドを 2、3 ページ見る
- ② チュートリアルに沿ったコーディングを数ステップ行い、実行する
①、②を繰り返しながら学習を進めていきます。コーディングに間違いがあると日本語のメッセージで判りやすく教えてくれます。
向いている人
Java を一から勉強したい人。
スライドが判りやすいのでプログラム初心者でもついていけます。
Paiza
Paiza でまず嬉しいのが、ユーザー登録なしでも「コーディング～実行」を一通り試せる点です。登録したほうがもちろん便利な機能を使えるのですが、とりあえず触ってみたい人はすぐにコーディングを始められます。
学習方法
Paiza にはチュートリアルといったものは存在しません。手取り足取り教えてくれるサイトではないのですが、その代わり、自由にコーディングして実行することができます。
向いている人
Java 自体の勉強は済んでいる、あるいは書籍を購入しており、とにかく実行する環境が欲しい人。
Codecademy
英語のサイトです。すべて英語なので誰でも手軽にとはいきませんが、オンライン学習サイトとしてかなり有名らしいです。
学習方法
Progate と同じくチュートリアルに沿って学習を少しづつ進めていきます。
向いている人
とにかく英語 OK な人
ざっくりした比較
Progate と Codecademy(英語)
コツコツ勉強スタイル
Paiza
- エポック時間を日時に変換－Java
- Java のラムダ式と StreamAPI。入門レベルを図解で
- 再帰呼び出し 再入門。ビジュアルで動作を理解する
- プログラム入門。ソースコードってなに？ 初心者にも判る基本から
・・・・・・ says:
すごっっっ
匿名 says:
// HTML要素を取得
const question = document.getElementById("question"); // 問題文
const input = document.getElementById("input"); // 入力ボックス
const result = document.getElementById("result"); // 結果
const score = document.getElementById("score"); // スコア
const timer = document.getElementById("timer"); // タイマー
// 問題文の配列
const questions = [
"Hello",
"World",
"JavaScript",
"Bing",
"Typing",
"Game",
];
// 変数の初期化
let currentNum = 0; // 現在の問題番号
let correctCount = 0; // 正解数
let missCount = 0; // ミス数
let timeLimit = 30; // 制限時間（秒）
let timerId; // タイマーのID
// 問題文を表示する関数
function showQuestion() {
// 最後の問題に到達したら終了
if (currentNum === questions.length) {
finish();
return;
}
// 問題文を表示
question.textContent = questions[currentNum];
// 入力ボックスを空にする
input.value = "";
}
// 結果を表示する関数
function showResult() {
// 正答率を計算
let accuracy = correctCount / (correctCount + missCount) * 100;
// 結果を表示
result.textContent = <code>正解数：${correctCount} ミス数：${missCount} 正答率：${accuracy.toFixed(2)}%</code>;
}
// 終了処理をする関数
function finish() {
// タイマーを停止
clearInterval(timerId);
// 入力ボックスを無効にする
input.disabled = true;
// 結果を表示
result.textContent += " ゲーム終了！";
}
// タイマーを更新する関数
function updateTimer() {
// 残り時間を計算
let remaining = timeLimit – Date.now() / 1000;
// タイマーを表示
timer.textContent = <code>残り時間：${remaining.toFixed(2)}秒</code>;
// 残り時間が0になったら終了
if (remaining {
// 入力値と問題文が一致したら
if (input.value === question.textContent) {
// 正解数を増やす
correctCount++;
// 次の問題に進む
currentNum++;
// 問題文を表示する
showQuestion();
}
});
// キーボードが押されたときの処理
document.addEventListener("keydown", (e) => {
// 入力ボックスにフォーカスがあるときは無視する
if (document.activeElement === input) {
return;
}
// 入力値と問題文の最初の文字が一致しなかったら
if (e.key !== question.textContent[0]) {
// ミス数を増やす
missCount++;
}
// 結果を表示する
showResult();
});